/*GLOBAL RULES for DINER*/

Html {
    background-color:#ffffff;
}

Body {
    width:80%;
    margin:0 auto;
    background-color:#ffffff;
    padding:0 1em;
}
a:link { text-decoration: none; color:black;}
a:visited { text-decoration: none; color:black;}
a:hover { text-decoration: none; color:red;}
a:active {text-decoration: none; color:black; }

h1, h2, h3 {
    font-family: 'Oleo Script', cursive;
}

p {
    font-family: 'arial', sans-serif;
}

p.small {
    line-height: 1.5;
}

h2.main {
    display:none;
}

h3 {
    font-size: 3em;
}

div.input {
    margin:1em;
}

div.mainimage {
    height:inherit;
    width:inherit;
}

table.menu {
    border:1px dashed #000;
    width:80%;
    margin:auto;
}

figure {
    
    display:inline-block;
    width:32%;
    margin:0;
}

/*responsive code for iframe*/

div.embed-container { 
	position: relative; 
	padding-bottom: 56.25%; 
	height: 0; 
	overflow: hidden; 
	max-width: 100%; 
	} 

div.embed-container iframe { 
	position: absolute; 
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%;
    border:0;
	}

figure img {
    
    width:100%;
}

footer {
        clear:both;
    }


/*DEsktop*/
@media all and (min-width:1280px){
    
    section {
        float:left;
        width:75%;
        background-color:#ffffff;
        padding-top: 3em;
        
    }  
    aside {
        float:right;
        width:23%;
        background-color:#ffffff;  
        padding-top: 8em;
    }
    aside.contact {
        float:right;
        background-color:#ffffff;
        padding-top:2em;
    }
    footer {
        clear:both;
    }
}

/*Tablet*/
@media all and (min-width:481px) and (max-width:1279px){
    Body {
        width:90%;
    }
    section {
        float:left;
        width:66%;
        background-color:#ffffff;
        padding-top: 3em;
    
    }
    aside {
        float:right;
        width:31%;
        background-color:#ffffff;
        padding-top:8em;
}
    aside.contact {
        float:right;
        background-color:#ffffff;
        padding-top:2em;
    }
}

/*Phone*/
@media all and (max-width:480px){
    body {
        width:100%;
        padding:1em;
        margin:0px;
    }
    aside {
        float:bottom;
        width:100%;
        background-color:#ffffff;
        padding-top:8em;
}
}
