/*

    .___   
  __| _/____    ____ _____   
 / __ |\__  \  /    \\__  \  
/ /_/ | / __ \|   |  \/ __ \_
\____ |(____  /___|  (____  /
     \/     \/     \/     \/   Design Meets Art.
 
 */


/*M E D I A    C A L L S*/

/*SMARTPHONE*/

@media screen and (max-width: 569px){

  @font-face {
  font-family:"sarge";
  src: url("../img/srgt6pack.ttf") format("truetype");
}
	
	.canvas{
		width:96vw;
		height:100vw;
		margin-left: .3vw;
		margin-top: 2.2vw;
		background-color: #fff8ee;

	}
	.call{
		height: 8.5%;
	}

	p#action {
		font-size: 450%;
		margin-top: 2%;
	}


     .ltbox {
 		float: left;
 		background-color: #4ab6cc;
 		width: 30%;
 		height: 8.5%;
 		
 	}


			 	figure#box1 {
			 		float: left;
			 		width: 20%;
			 		height: 60%;
			 		margin-top: 6.5%;
			 		
			 		background-color: #245f6a; 		
			 	}
			 	figure#box2 {
			 		float: left;
			 		width: 20%;
			 		height: 60%;
			 		margin-top: 6.5%;
			 		background-color: #fbda95;
			 	}
			 	figure#box3 {
			 		float: left;
			 		width: 20%;
			 		height: 60%;
			 		margin-top: 6.5%;
			 		background-color: #6FCADC;
			 	}
			 	figure#box4 {
			 		float: left;
			 		width: 20%;
			 		height: 60%;
			 		margin-top: 6.5%;
			 		background-color: #afd275;
			 	}
			 	figure#box5 {
			 		float: left;
			 		width: 20%;
			 		height: 60%;
			 		margin-top: 6.5%;
			 		background-color: #e7717d;
			 	}

 	.logobox {	  
	  float:left;
	  width: 60%;
	  height: 15.6%; 
	 }

	 img.logo {
		  float: left;
		  margin-top: 0;
		  margin-left: 1%;
		  width: 48%;
		  height: 10.2%;
		}

	img.logo-b {
		  float: left;
		  margin-left: -10%;
		  margin-top: 16%;
		  width: 41%;
		  height: 37%;
		 }

	.icon {
		display: inline-block;
		float:right;
		margin-right: 10%;
		margin-top: 6%;
		width: 16%;
	}

 	.navbar {
 		display: inline-block;
		float: left;
 		height: 15.6%;
 		width: 40%;
 		background-color: #fff8ee;	
 	}

 	.navbar a {
 		display: none;
 	}

 	.dropdown .dropbtn {
	  display: none;
	}

	.lines { 
		float: left;
		margin-top: -.5%;
		width: 100%;
		height: 1.5%;
	}


/*MAIN SECTION*/

section#back {
		float: left;
	    width: 100%;
	    height: 148%;  		/* tablet 141px* Mobile 151px*/
	    background-color: #fff8ee;
	}

	.graphic-one {
		float: left;
	    width: 30%;
	    height: 148%;   
		
	    }
		
			figure#toss {
				width: 300%;
		        font-size: 160%;
		        margin-top: 140%;
		        margin-left: -97%;
		        transform: rotate(270deg);
		        	-moz-transform: rotate(270deg);
					-ms-transform: rotate(270deg);
					-o-transform: rotate(270deg);
					-webkit-transform: rotate(270deg); 															
		        font-family: sarge;
		        color: #39828f;
		        text-align: center;
		     }


.case {
		float: left;
	    width: 50%;
	    height: 140%;
	    margin-top: 4%;

}

		article {
				width: 120%;
				height: 50%;
				text-align: center;
				color: #ffffff;
			}

		label {
			color: #ffffff;
			font-size: 80%;
		}

		input {
			font-size: 80%;
		}

		.blue {
		 background-image: url("../img/dining.jpg");
		 background-size: cover;
		 background-position: 0 -9vw;
		}

		.shorty {
			width: 120%;
			height: 20.5%;
			font-size: 100%;			
		}


		span {
			color: #245f6a;
			font-weight: bold;			
		}

		.reserve {
		font-size: 110%;
	}

	p#address {
	    text-align: center;
	    font-family: inherit;
	    font-size: 115%;
	    color: #ffffff;
	    }


	   img#tef {
	    	width: 29vw;
	    	height: 25vw;
	    }
   


	   
}