* {
  box-sizing: border-box;
}

[class*="col-"] {
  float: left;
  padding: 25px;
}


.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}

@viewport {
  width: device-width ;
  zoom: 1.0 ;
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-width : 320px)
and (max-width : 480px) {
  
  .back{width:200px;}
  .back2{width: 200px;}

.col-1 {width: 100%;}
.col-2 {width: 100%;}
.col-3 {width: 100%;}
.col-4 {width: 100%;}
.col-5 {width: 100%;}
.col-6 {width: 100%;}
.col-7 {width: 100%;}
.col-8 {width: 100%;}
.col-9 {width: 100%;}
.col-10 {width: 100%;}
.col-11 {width: 100%;}
.col-12 {width: 100%;}

}



/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {

container{
  width:80%;
  }


/* Styles */
}



/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
  
.back{width: 200px;}
.back2{width:200px;}
  
  
.col-1 {width: 100%;}
.col-2 {width: 100%;}
.col-3 {width: 100%;}
.col-4 {width: 100%;}
.col-5 {width: 100%;}
.col-6 {width: 100%;}
.col-7 {width: 100%;}
.col-8 {width: 100%;}
.col-9 {width: 100%;}
.col-10 {width: 100%;}
.col-11 {width: 100%;}
.col-12 {width: 100%;}
}


.list{

  padding: 15px 15px 0 5px;
font-size: 18px;
}

.list2{
    padding:15px 15px 0 15px;
    font-size:18px;
  }
  
  .logo{
width:90px;
height:92px;
margin:10px 150px 0 5px;
   }





}
/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px) {
/* Styles */
}
/* iPads (landscape) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen
and (min-width : 768px)
and (max-width : 1024px)
and (orientation : portrait) {
  
  body{
width:80%;
}
}


/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1224px) {
/* Styles */
}



/* Large screens ----------- */
@media only screen
and (min-width : 1824px) {
/* Styles */
}




/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {

div
{
  width:50%;
  
  }/* Styles */
} 





.back{
	
	background-color: #cc5500; 
	background-image:url('../images/background4.jpg');
	background-repeat: no-repeat;background-position: 0% 0%;
	width:100%;
	
	
}

.back2{
  background-color:#DBB667;
  width:100%;
  
  }



.list{
	list-style-type:none;
	float:left;
	font-size:16px;
	font-family:Tahoma;
	color:white;
}

.list2{
	display:inline;
	list-style-type:none;
	float:left;
	font-size:16px;
	padding:30px 30px 0px 180px;
	font-family:Tahoma;
	color:white;
} 



.top{
	clear:both;
	text-align:center;
	padding-top:275px;
	font-size:80px;
	font-family:Palatino Linotype;
	color:white;
	text-shadow:3px 3px #91532C;
}

.charcuterie{
	clear:both;
	text-align:center;
/*	margin:0px 50px 0px 365px;
	padding-left:330px; */
	font-size:43px;
	font-family:Palatino Linotype;
	color:white;
	text-shadow:2px 2px black;
}
	
.statement{
	margin:0px 50px 0px 50px;
	text-align:center;
	font-size:18px;
	font-family:Palatino Linotype;
	color:white;
	padding-top:-30px;
	padding-left:40px;
	padding-right:70px;
	position: relative;
}


.kitty{
	clear:both;
	margin:0px 50px 0px 0px;
	padding-left:150px;
	font-size:60px;
	text-align:center;
	font-family:Palatino Linotype;
	color:white;
	text-shadow:2px 2px black;
}

.tab{
	
	margin:10px auto;
	
	
}


.biography{
  clear: both;
	text-align:center;
	padding-top:10px;
	font-size:18px;
	font-family:Palatino Linotype;
	color:white;
}

/*

.logo{
width:90px;
height:92px;
float:left;
margin:0 30px 0 50px;
}

*/


.logo2{
  
  height:50%;
  width:21%;
  
}

.th{ 

border: 5px solid black;
}

.popular{
	clear:both;
	margin:0px 50px 0px 20px;
	padding-left:80px;
	font-size:60px;
	text-align:center;
	font-family:Palatino Linotype;
	color:white;
	text-shadow:2px 2px black;
}

.center {
 
  display:block;
  margin-left: auto;
  margin-right: auto;
  width:300px;
  height:300px;

}


.popular2{
	clear:both;
	margin:0px 50px 0px 20px;
	padding-left:35px;
	font-size:30px;
	text-align:center;
	font-family:Palatino Linotype;
	color:white;
	text-shadow:2px 2px black;}