@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/* GENERAL ------------------------------------------------------------*/

*{ margin:0px; padding:0px; outline:0px;}
body{
	font-family: ubuntulight;
	line-height: 22px;
	color: #888b82;
}
.left{ float:left}
.right{ float:right}
.clear{ clear:both}
a{ text-decoration:none;} 
/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/* ---------------------------------------------------------------- */

/* Mobile Layout: 480px and below. */  

@media only screen and (max-width: 479px) {
#--------------------Mobile Layout{}
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	padding-left: 0%;
	padding-right: 0%;	
}
.wrapper {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
.container {
	width: 98%;
	margin-right: 1%;
	margin-left: 1%;
}


.header {
	width: 100%;
	height: 80px;
	background-color: #f2f4ea;
}

.logo {
	
	width: 19%;
	margin-right: auto;
	margin-left: auto;
}
.logo img{ width: 100%; height:25%;}
.nav {
	width: 100%;
}


.heade-bottom {
	background-image: url(../images/header.png);
	background-repeat: repeat-x;
	height: 20px;
	width: 100%;
}
.slider {
	width: 100%;
	margin-bottom: 35px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #dedede;
	height: 160px;
}

h2 {
	color: #41352A;
	font-family: "roboto_slabbold";
	font-size: 17pt;
	font-weight: normal;
	text-transform: uppercase;
	text-align: center;
}
.mixtr {
	width: 100%;
	padding-top: 12px;
	padding-bottom: 15px;
}
.product {
	width: 48%;
	height: 60%;
	display: block;
	padding-bottom: 12px;
	margin-right: auto;
	margin-left: auto;
}

.product img {
	width: 100%;
	height: 33%;
}

.welcm-img {
	width: 100%;
	height: 60%;
}
.welcm-img img {
	width: 100%;
	height: 30%;
}
.wel-content p {
	
}
.big {
	font-size: 14pt;
	color: #66922a;
	font-family: ubuntumedium;
	padding-bottom: 8px;
}

.wel-content {
	width: 100%;
	
}
p {
	font-size: 10pt;
	text-align: center;
}

.welcome {
	width: 100%;
	padding-top: 10px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #dedede;
	padding-bottom: 12px;
	margin-bottom: 13px;
}
.footer {
	background-image: url(../images/overley.png);
	background-repeat: repeat;
	width: 100%;
	padding-top: 15px;
	padding-bottom: 10px;
}
.social-link {
	width: 47%;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 8px;
}
.icon {
    width: 17%;
    float: left;
    text-align: center;
    font-size: 23px;

}



.footer-line {
	background-color: #52544d;
	height: 1px;
	width: 100%;
	margin-bottom: 10px;
}
.footer .container p {
	text-align: center;
	font-size: 8pt;
	color: #52544d;
	text-transform: uppercase;
}
.content {
	width: 97%;
	margin-right: 1%;
	margin-left: 1%;
}
.v-space {
	height: 5px;
	width: 100%;
}
.contact {
	width: 100%;
	padding-bottom: 12px;
}
}


/* ============================================================================ */

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
#--------------------tablet Layout{}
@media only screen and (min-width: 481px) {
.gridContainer {
	width: 100%;
}
.wrapper {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
.container {
	width: 87%;
	margin-right: auto;
	margin-left: auto;
}


.header {
	width: 100%;
	height: 122px;
	background-color: #f2f4ea;
}

.logo {
	width: 17%;
	float: left;
	padding-top: 10px;
	padding-bottom: 10px;
}
.logo img{ width: 100%; height:10%;}
.nav {
	width: 70%;
	padding-top: 60px;
	float: left;
}


.heade-bottom {
	background-image: url(../images/header.png);
	background-repeat: repeat-x;
	height: 20px;
	width: 100%;
}
.slider {
	width: 100%;
	margin-bottom: 35px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #dedede;
	height: 300px;
}

h2 {
	color: #41352A;
	font-family: "roboto_slabbold";
	font-size: 22pt;
	font-weight: normal;
	text-transform: uppercase;
	text-align: left;
}
.mixtr {
	width: 100%;
	padding-top: 24px;
	margin-bottom: 25px;
}
.taste-content {
	float: left;
	width: 100%;
}

.product {
	width: 31.15%;
	height: 45%;
	display: block;
	float: left;
}

.product img {
	width: 100%;
	height: 24%;
}
.space {
	width: 20px;
	height: 50px;
}


.welcm-img {
	width: 48.5%;
	height: 50%;
}
.welcm-img img {
	width: 100%;
	height: 20%;
}
.wel-content p {
	height: 90px;
	overflow: hidden;
}

.big {
	font-size: 11pt;
	color: #66922a;
	font-family: ubuntumedium;
	padding-bottom: 8px;
	display: block;
}

.wel-content {
	width: 48.5%;
	padding-left: 20px;
}
p {
	font-size: 10pt;
	text-align: left;
}

.welcome {
	width: 100%;
	padding-top: 25px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #dedede;
	margin-bottom: 30px;
	padding-bottom: 20px;
}
.footer {
	background-image: url(../images/overley.png);
	background-repeat: repeat;
	width: 100%;
	padding-top: 20px;
	padding-bottom: 20px;
}

.social-link {
	width: 41%;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 15px;
}
.icon {
	width: 20%;
	float: left;
	font-size: 30px;
}
.footer-line {
	background-color: #52544d;
	height: 1px;
	width: 100%;
	margin-bottom: 15px;
}
.footer .container p {
	text-align: center;
	font-size: 11pt;
	color: #52544d;
	text-transform: uppercase;
}
.content {
	width: 100%;
	margin: 0px;
}
.v-space {
	height: 10px;
	width: 100%;
}
.contact {
	width: 50%;
	float: left;
}
}





/* ============================================================================ */

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
#-------------------- DESKTOP Layout{}

@media only screen and (min-width: 769px) {
.gridContainer {
	width: 100%;
	float: left;	
}
.wrapper {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}
.container {
	width: 100%;
	max-width:1000px;
	margin-right: auto;
	margin-left: auto;
}


.header {
	width: 100%;
	height: 123px;
	background-color: #f2f4ea;
}

.logo {
	width: 14%;
	height:12%;
	float: left;
	padding-top: 5px;
	padding-bottom: 5px;
}
.logo img{ width: 100%; height:10%;}

.heade-bottom {
	background-image: url(../images/header.png);
	background-repeat: repeat-x;
	height: 20px;
	width: 100%;
}
.slider {
	width: 100%;
	margin-bottom: 35px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #dedede;
	height: 497px;
}

h2 {
	color: #41352A;
	font-family: "roboto_slabbold";
	font-size: 30pt;
	font-weight: normal;
	text-transform: uppercase;
	text-align: left;
}
.mixtr {
	width: 100%;
	padding-top: 24px;
}
.product {
	width: 20%;
	height: 50%;
	display: block;
	float: left;
}

.product img {
	width: 100%;
	height: 35%;
}
.space {
	width: 20px;
	height: 50px;
}


.welcm-img {
	width: 60.3%;
	height: 271px;
}
.welcm-img img {
	width: 100%;
	height: 271px;
}
.wel-content p {
	height: 215px;	
}
.big {
	font-size: 13pt;
	color: #66922a;
	font-family: ubuntumedium;
	padding-bottom: 15px;
	display: block;
}

.wel-content {
	width: 37.5%;
	padding-left: 20px;
}
p {
	font-size: 10pt;
	text-align: left;
}

.welcome {
	width: 100%;
	padding-top: 25px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #dedede;
	margin-bottom: 40px;
	padding-bottom: 40px;
}
.taste-content {
	float: left;
	padding-left: 20px;
	width: 33%;
}
.footer {
	background-image: url(../images/overley.png);
	background-repeat: repeat;
	width: 100%;
	padding-top: 40px;
	padding-bottom: 25px;
	
}

.social-link {
	width: 43%;
	margin-right: auto;
	margin-left: auto;
	padding-bottom: 30px;
}
.footer-line {
	background-color: #52544d;
	height: 1px;
	width: 100%;
	margin-bottom: 25px;
}
.footer .container p {
	text-align: center;
	font-size: 12pt;
	color: #52544d;
	text-transform: uppercase;
}


.icon {
	width: 23%;
	float: left;
	text-align: center;
	font-size: 35pt;
	margin:10px -8px;
}
.contact {
	width: 50%;
	padding-bottom: 20px;
  }
}







      .fot-img1{
          margin-top:-2px;
          width:52%; 
          /*height:55px;*/
          
      }
      
     .fot-img2{
         margin-top:-2px;
         width:52%;
         /*height:55px; */
          
      } 
      
      
      
@media only screen and (min-width: 768px) {
    
.lb-album {
    width: auto!important;
  

}
 
 .albums{
    
 }
    
.res{
    width: 100%;
    margin-left: auto;
    margin-right: auto;  
}
    
 .lb-album {
     width: auto;
 }
 
 
}
      
      
      
      
@media screen and (max-width: 990px) {
    
    
    .fot-img1{
          margin-top:-1px;
          width:85%; 
          
      }
      
     .fot-img2{
         margin-top:-1px;
         width:85%;
         
          
      } 
 
    
}



@media only screen and (max-width:622px) and (min-width: 450px){

 
 
 .fot-img1{
          margin-top:-2px;
          width:93%; 
          
      }
      
     .fot-img2{
         margin-top:-2px;
         width:93%;
         
          
      } 
}
 
 
 
 
 
 @media only screen and (max-width:480px) and (min-width: 500px){

 
 
      
     .social-link {

    width: 41%;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 15px;

} 
      
      
      
      
      
      
}







 
  @media only screen and (max-width:992px) and (min-width: 800px){

 
 
 .fot-img1 {

    margin-top: -1px;
    width: 64%;
 
 
 }
 
 
  .fot-img2 {

    margin-top: -1px;
    width: 64%;
 
 
 }
 
 
 
  }
 
 
 
 


 
  @media only screen and (max-width:800px) and (min-width: 700px){

 
 
 .fot-img1 {

    margin-top: -1px;
    width: 78%!important;
 
 
 }
 
 
  .fot-img2 {

    margin-top: -1px;
    width: 78%!important;
 
 
 }
 
 
 
  }
 
 
  
  


 
  @media only screen and (max-width:700px) and (min-width: 600px){

 
 
 .fot-img1 {

    margin-top: -2px;
    width: 78%!important;
 
 
 }
 
 
  .fot-img2 {

    margin-top: -2px;
    width: 78%!important;
 
 
 }
 
 
 
}
 
 
   @media only screen and (max-width:479px) and (min-width: 420px){

 
 
 .fot-img1 {

    margin-top: -2px;
    width: 78%!important;
 
 
 }
 
 
  .fot-img2 {

    margin-top: -2px;
    width: 78%!important;
 
 
 }
 
 
 .social-link {

    width: 53%;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 8px;

}
 
 
 
  }
 
 
 
 
  @media only screen and (max-width:420px) and (min-width: 315px){

 
 
 .fot-img1 {

    margin-top: -1px;
    width: 78%!important;
 
 
 }
 
 
  .fot-img2 {

    margin-top: -1px;
    width: 78%!important;
 
 
 }
 
 
 .social-link {

    width: 60%;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 8px;

}
 
 
 
  }