﻿@media screen and (max-width:1000px)
{
.banner{ width:94%; clear:both;}
.banner img{ width:99%; height:auto;}
.banner-text{ width:93%;}
.left-banner{ margin:25px 2% 0 2%; width:96%;}
.right-text{ width:100%; float:left;}
.right-text p{ width:100%;}
.left-text{ float:left; width:100%; margin:0; background:none;}
.left-text ul li img{ width:auto;}
.left-text ul{ float:left; padding:0;}
#midle-wrapper{ width:94%;}
.middle{ width:100%; height:auto; padding:0px; margin-top:10px;}
.middle h2{font-size: 26px;}
.auto-footer{ width:94%;}
.footer-last-text{ width:94%;}
.header-auto{ width:94%; height:auto;}
.header{ width:94%; height:auto;}
.logo{ width:auto; text-align:center;}

.left-footer{ width:auto;}
.right-footer{ width:21%;}
.middle-left{ width:100%;}
.middle-right{ width:100%;}
.ourstory{width:48%; padding-top:0px;}
.ourstory img{ width:100%;}
.need-advice{ width:48%;}
.need-advice img{ width:100%;}
.our-clint-box{ width:48%;}
.right-menu{ width:auto;}
.Gellery-box{ width:48%;}
#vertical-ticker{ height:170px!important;}
}


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

.head-right{ width:100%; background:none; text-align:right !important;}
.right-menu{ display:none; width:auto;}

.auto2{ width:94%; height:auto; margin:0px; padding:3% 3% 12% 3% ;}
.auto2 img{ width:100%;}
.auto{width:94%; margin:0px; padding:3%;}
.auto img{ width:100%; height:auto;}
.auto span img{ width:auto !important;}

#vertical-ticker{ height:233px !important;}
.kitchen-sec li{ width:46%; height:200px; margin:0 2% 10px 0; !important}
.kitchen-sec li:first-child{ margin:0 2% 10px 0!important;}
.footer-nav{ width:360px}


}

@media screen and (max-width:600px)
{
.logo{ width:auto; text-align:center;}
.middle-left{ width:100%;}
.Gellery-box{ margin:10px 0 0 0; width:93%; padding:3%;}
.auto2{width:100%; margin:0px; padding:0px;}
.middle-right{ width:100%; margin-top:20px;}
.our-clint-box{ width:93%; padding:3%;}
.auto{width:100%; margin:0px; padding:0px;}
.left-footer{ width:100%;}
.right-footer{ width:100%; text-align:center;}
.ourstory{ width:100%;}
.need-advice{ width:100%;}
.footer-nav{ width:100%; text-align:center;}
.footer-nav ul li{float:none; display:inline;}
.footer-nav ul li a{padding: 0 5px; line-height:normal; font-size:10px;}
.copyright{ width:100%; text-align:center;}
.website{ width:100%; float:left; text-align:center;}
.website a{ text-align:center !important; float:inherit; width:100%;}
.copyright{ width:100%; line-height:17px; padding:10px 0;}
.right-footer{ margin-top:10px; text-align:center;}
.need-advice{ margin-top:20px;}
.kitchen-sec li{ width:100%; height:240px; margin:0 0 10px 0 !important;}
.kitchen-sec li:first-child{ margin:0 0 10px 0 !important;}
.head-right span{ color:#ede9e6;}
.head-right a{ color:#ede9e6;}
.auto span img{margin-left:44%;}
#vertical-ticker{ height:186px !important;}
.banner-text{ display:none;}
.middle-left li{ margin:0 0 0 3%;}
.text{ width:91%;}
.icon{ width:6%;} 
}

@media screen and (max-width:480px)
{
.logo{width:56%; text-align:center;}
.logo img{width:100%; text-align:center;}
.head-right span{ font-size:18px;}
.head-right span{ color:#fff;}
.head-right a{ color:#fff;}
.middle-left li{ margin:0 0 0 5%;}
.middle h2, .middle-left p, .auto h6, .need-advice span, .middle h3, .middle-right p{ font-family:'brandon_grotesque_regularRg';}

.text{ width:86%;}
.icon{ width:9%;} 
}


@media screen and (max-width:320px)
{
.head-right span{ font-size:18px;}
.head-right span{ color:#fff;}
.head-right a{ color:#fff;}
.middle-left li{ margin:0 0 0 7%;}
.text{ width:%;}
.icon{ width:10%;} 

}
