@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700,700i,800,800i');

body { font: 400 16px/1.6 'Open Sans', sans-serif; color: #000000; -webkit-font-smoothing: antialiased; padding-right: 0 !important; }

h1, .h2, h2, h3, h4 { margin-top: 1.3rem; margin-bottom: 1rem; }
h1 { font-size: 38px; font-weight: 900; }
h2 { font-size: 38px; font-weight: 900; color: #184a93 }
h3 { font-size: 24px; font-weight: 700;}
h4 { font-size: 18px; font-weight: 600; }

.container {max-width: 1270px; width: 100%;}

a:hover, a { text-decoration: none !important; color: inherit;}
a:focus, a:hover{outline:none;}

.padding-tb20{padding: 20px 0;}
.padding-tb30{padding: 30px 0;}
.padding-tb50{padding: 50px 0;}
.padding-t50 { padding-top: 50px;}
.padding-t30{padding-top: 30px;}
.padding-b10{ padding-bottom: 10px; }
.padding-b30{ padding-bottom: 30px; }
.padding-lf0{padding: 0 0;}

.yellow-bg{background: #f4d249;}
.black-bg{background-color: #000000;}
.dark-green-bg{background: #088838;}
.light-green-bg{background: #eef7f0;}
.border-top-yellow{border-top: 3px solid #fff200;}

/*----header----*/

.header-logo { display: inline-block; }
.header-logo img{ margin: 15px 0; }
.sub-header-info { float: right; background: #fff200; border-radius: 0 0 10px 10px;padding: 0; font-weight: 600;display: none;}
.sub-header-info li{display: inline-block; padding: 6px 10px 7px; }
.sub-header-info li a:hover{color: #000;}
.sub-header-info li img{ display: inline-block; }
.sub-header-info li:first-child{padding-right: 0;}
/*.navs{display: none;}*/

.mobile-contact {border-top: 1px solid #333333;border-bottom: 1px solid #333333;padding: 0; font-weight: 600;display: block;}
.mobile-contact li{display: inline-block; }
.mobile-contact li img{ display: inline-block; }

.navs{ right: 0;
    position: fixed;
    overflow-y: auto;
	overflow-x: hidden;
    right: -250px;
    width: 250px;
    top: 0px;
    bottom: 0;
    z-index: 1000;
    background: #eef7f0;}
.navs ul{padding: 0; margin: 0;}
.navs li{display: block; color: #000000;}
.navs li a{padding: 10px 15px; display: block; font-weight: 600; color:#000;}
.navs li a:hover{background: #04ac52; color: #ffffff;}

.main-header{display: block;}
.glyphicon-remove{margin: -10px 0 !important;}
.controlar { float: right; right: 5px; top: 23px; padding: 5px 15px; display: block;}
.controlar span {
	width: 25px;
	height: 3px;
	background-color: #ffffff;
	display: block;
	margin: 4px 0;
	border-radius: 10px;
}
.mobile-name{ color: #ffffff; font-weight: bold; display: inline-block; margin: 0; padding: 6px 0;}
.company-name{ color: #000; font-weight: bold; display: inline-block; margin: 0; padding: 10px 13px;}
.sticky {position: fixed;top: 0;width: 100%; z-index: 2;
	-webkit-transition: all 0.9s;
	-moz-transition: all 0.9s;
	transition: all 0.9s;}
.sticky + .content {padding-top: 102px;-webkit-transition: all 0.9s;
	-moz-transition: all 0.9s;
	transition: all 0.9s;}
	
/*-----mega-dropdown-----*/

/*.navigation div{display: inline;}
.menu-mobile{display: none;}
.menu > ul{display: block;}
.menu > ul > li > ul{left: 0%; width: 880px;background: rgba(255, 255, 255, 0.96); padding: 0px;}
.menu > ul > li a{padding: 10px 15px !important; color: #000;}
.menu > ul > li > ul > li > ul > li{ padding: 0;}
.menu > ul > li > ul > li{ width: 100%; margin-top: 0}
.menu > ul > li > ul > li > ul{margin:0;}
.menu > ul > li > ul > li a:hover {background: transparent; color: #ed1d24;}
.menu-dropdown-icon:before{content: ""; padding: 0; background: transparent; color: #fff; font-weight: bold;border-left: 8px solid transparent; border-right: 8px solid transparent; border-top: 8px solid #000; margin: 18px 0px 0; float:right; display:inline-block;}*/

/*-----second-dropdown and-----*/

.navbar { border-bottom: 4px solid #888; }
.mega-menu {padding: 10px !important;width: 1000px;margin-top: 0px;}
.mega-menu li {	display: inline-block;float: none;padding: 3px 0px;}
.mega-menu li a{color: #373737 !important; font-weight: normal; padding: 5px 0; line-height: normal;}
.mega-menu li a:hover{ background: transparent; color:#ed1d24 !important; }

.mega-menu li.mega-menu-column {margin-right: 20px;	width: 220px; display: block;}
.dropdown-menu{ background: transparent; position: relative; box-shadow:none; border: none; left: 0px; }

.mega-menu .nav-header {font-size: 16px; padding-bottom: 7px !important;display: inline-block;width: 100%;border-bottom: 1px solid #ddd;}
.nav-header a{font-weight: 600 !important; color: #088838 !important;}
.mega-menu img { padding-bottom: 10px;}

.navbar .nav li.dropdown.open > .dropdown-toggle,
.navbar .nav li.dropdown.active > .dropdown-toggle,
.navbar .nav li.dropdown.open.active > .dropdown-toggle {background: inherit; color: inherit;}

.navbar .nav li.dropdown.open.active > .dropdown-toggle,
.navbar .nav > li.dropdown > a:focus {background: inherit;color: inherit;}

.navbar .nav li.dropdown > .dropdown-toggle:hover,
.navbar .nav li.dropdown.open > .dropdown-toggle:hover { background-color: #DDDDDD; }
.navbar .nav li.dropdown > .dropdown-toggle .caret { border-bottom-color:;border-top-color:;}

.navbar .nav li.dropdown > a:hover .caret,
.navbar .nav li.dropdown > a:focus .caret { border-bottom-color: #333;border-top-color: #333;}

.navbar .nav li.dropdown.open > .dropdown-toggle .caret,
.navbar .nav li.dropdown.active > .dropdown-toggle .caret,
.navbar .nav li.dropdown.open.active > .dropdown-toggle .caret {border-bottom-color: #333;border-top-color: #333;}

.navbar .nav > li > a,
.mega-menu a {	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
	/* -webkit-transform: translate3d(0, 0, 0); Webkit Hardware Acceleration*/ 
	-webkit-backface-visibility: hidden; /* Safari Flicker Fix #2 */
	-webkit-transform: translateZ(0);
}
.list-unstyled li{ display: block !important; width: 100%; }

.green-color{color: #ffffff;}

/*-----mega-dropdown and-----*/

/*-----Slider------*/
.main-contain {width: 100%; max-width: 1430px; margin: 0 auto; padding: 0 15px;}
.banner-bg{background:url(../images/banner-bg.jpg) no-repeat scroll center top;}
.slick-next{right: 0;}
.slick-prev{left: 0;}
.slick-arrow{ background-color: #ed1c24; padding: 10px; width: 35px; height: 35px; border-radius: 4px; display: none !important; z-index: 1;}
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus{background-color: #ed1c24;}
.slick-next:before{border: solid #ffffff; content: ""; border-width: 0 3px 3px 0; display: inline-block; padding: 5px;transform: rotate(-38deg);}
.slick-prev::before {border: solid #ffffff; content: ""; border-width: 0 3px 3px 0; display: inline-block; padding: 5px;transform: rotate(132deg);}
.slick-slide{position: relative; }
.slide-text{ position: relative; top: 12%; width:auto;}
.banner-yellow-text{background: rgba(255, 242, 0, 0.83); padding: 2px 15px 4px;font-size: 17px; font-weight: 600; margin-bottom: 1px;}
.banner-red-text{background: rgba(237, 28, 36, 0.76); color: #ffffff; padding:7px 10px 12px 15px;}
.banner-red-text p{font-size: 17px; font-weight: 600; margin-bottom: 1px;}
.banner-red-text span{font-size: 14px; font-weight: normal; display: block; line-height: normal; margin-bottom: 12px;}
.slick-slider{-webkit-user-select: inherit; 
	-moz-user-select: inherit;
	-ms-user-select: inherit;
	user-select: inherit;
	-webkit-touch-callout: inherit;
	-khtml-user-select: inherit;
	-ms-touch-action: pan-y;
	touch-action: pan-y;
	-webkit-tap-highlight-color: transparent; 
}

/*-----Slider and------*/

/*.yellow-icon-bg{background:url(../images/yellow-icon-bg.jpg) no-repeat scroll center top;}*/
.yellow-icon-bg{background: #fff200 url(../images/food-icon.png) no-repeat scroll center center; background-size: cover;}
.green-icon-bg{background:url(../images/green-flower-bg.jpg) no-repeat scroll center top;}
/*.yellow-icon-bg{background: #fff200 url(../images/flower-bg.jpg) no-repeat scroll center top;}*/
.slogans-img{ margin: 0 auto; }

/*------Our Product------*/

.section-heading{ text-align: center;}
.section-heading p{font-size: 18px; color: #333;}

.product-section{ text-align: center; }
.product-list{box-shadow: 0px 4px 25px 0px #ebebeb; background: #ffffff; padding: 0; margin: 0 10px 20px 10px; overflow: hidden;}
.product-list h3{ color: #ed1c24; font-size: 22px;animation-duration: 4s;    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease; }
.product-list h3 a:hover, a:focus{
	-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;}
.product-list img{ border-bottom: 2px solid #ed1c24; width: 100%;
	-webkit-transition-duration: 500ms;
    transition-duration: 500ms;
    -webkit-transition-property: transform;
    transition-property: transform;}
.product-list p{ color: #333333; padding: 0 10px; display: inline-block;}

.product-list a{width: 100%; overflow: hidden; height: auto; display:inline-block;line-height: normal;}
.product-list a img:hover{ 
	-webkit-transform: scale(1.2);
	transform: scale(-1, 1); -moz-transform: scale(1.2);}

.red-button{background: #ed1c24; display: inline-block; font-weight: bold; color: #fff; padding: 9px 22px 9px 20px; border:3px solid #fff; position: relative;transition: 0.5s; }
.red-button:after { content: '\203A'; position: absolute; opacity: 0; top: -5px; right: -20px; transition: 0.5s;font-size: 30px;}
.red-button:hover { padding-right: 25px; color: #fff;}
.red-button:hover:after { opacity: 1; right: 8px;}

.overview-button{ text-align: center; font-weight: bold !important; font-size: 16px; border: 3px solid #ee1d25; color: #ffffff !important;}
.overview-button:after { content: '\203A'; position: absolute; opacity: 0; top: -6px; right: -20px; transition: 0.5s;font-size: 30px;}
.overview-button:hover { padding-right: 15px; color: #fff;}
.overview-button:hover:after { opacity: 1; right: 6px;}

/*------Our Product and------*/

/*----Why Tipsy-Topsy-----*/
.feature-col{margin-bottom: 20px;}
.feature-col img{ float: left; }
.feature-col h3{ margin: 6px 20px;display: inline-block; }
.feature-col p{ margin-top: 15px; }

.solution-slogan{ text-align: center; color: #ffffff; font-size: 34px; font-style: italic; margin-bottom: 0; line-height: 45px;}
.parallax-img{ background: url(../images/parallax-image.jpg) no-repeat scroll center; background-size: cover; position: relative; background-attachment: fixed;}
.parallax-img:before{ content: ""; position: absolute; background: url(../images/wavy-lines.png) center no-repeat;bottom: 0; width: 100%; height: 7px;}

.about-name{ text-align: left;}
.about-name h1{ font-size: 42px; line-height: normal; margin: 0;}
blockquote{ font-size: 24px; border-left: 3px solid #ed1c24; line-height: normal; font-weight: 600;padding: 3px 20px; }
.about-content{ font-size: 18px; }

.slick-initialized .slick-slide{outline: none;}
.slick-slide img{ margin: 0 auto; }

.contact-details{ text-align: left; }
.yellow-belt{position: relative;}
.yellow-bg:before{ content: ""; position: absolute; background: url(../images/wavy-lines.png) center no-repeat;top: 0; width: 100%; height: 7px;-ms-transform: rotate(180deg);
-webkit-transform: rotate(180deg); transform: rotate(180deg);}
.wavy-lines{position: relative;}
.wavy-lines:before{ content: ""; position: absolute; background: url(../images/wavy-lines-grey.png) center no-repeat;top: 0; width: 100%; height: 7px; -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg);transform: rotate(180deg);}

/*------footer-----*/
.footer-section{color: #cbcbcb;}
.footer-logo{margin-bottom: 30px; display: inline-block;}
.footer-manu{ padding: 0; }
.footer-manu li{ display:block; }
.footer-manu li a{ transition: 0.5s; }
.footer-manu li a:hover{ color: #f4d249; padding-left: 5px;transition: 0.5s; }
.footer-manu li a:hover:before{ content: '\203A'; font-size: 21px;transition: 0.5s; cursor: pointer; line-height: 20px;color: #aaa;margin-right: 5px;}
.border-left{ border-left: none; padding-left: 0px; }
.footer-add{font-size: 18px;font-weight: 700;}

.copyright{background: #414242; padding: 10px 0;}
.copyright-text{margin-bottom: 0; float: left;}
.creat-link{ float: left; margin-bottom: 0;}
.creat-link a{ color: #cbcbcb; }
.creat-link a:hover{ color: #fff; }

/*------footer-and-----*/

/*-----product-page-----*/

.sub-banner img{position: relative; width: 100%;}
.sub-banner-text{position: relative; top: -27px;}
.sub-banner-text p{position: absolute;text-align: center; width: 100%; color: #ffffff; font-size: 13px; line-height: 12px; font-weight: 700; text-transform: none;}

.sub-heading{ border: 8px solid #d0cfcd; display: inline-block; padding: 12px 34px; }
.sub-heading h2{font-size:26px;}
.sub-product{ background: #ffffff; padding: 10px; text-align: center; border: 1px solid #e8e8e8; box-shadow: none; margin: 0 0 20px;}
.blue-text{color: #304e8f;}

/*-----product-page-and-----*/

/*----spices-page----*/

.inner-slogans h3{float: right;}
.navbar-nav { padding: 0; margin: 0px; margin-top:8px; float: left; }
.navbar-nav li{display: inline-block; line-height: normal; font-weight: 600; margin-bottom: 6px;}
.navbar-nav li:first-child{padding-left: 0;}
.navbar-nav li a{display: inline-block; padding: 4px 15px;}
.navbar-nav li a:hover{ color: #000; }
.navbar-active{border: 2px solid #cc2329;margin-left: 13px;}
.cloud-background{ background: #fff22e; position: relative;padding: 20px 0 50px; }
.cloud-background:after{ background: url(../images/cloud-image.png); content: ""; position: absolute; height: 40px; width: 100%; bottom: 0%; background-position: 0px; background-repeat: repeat-x; background-size: cover; }
.global-supplier-bg, .cloud-background:after{ -webkit-animation: animation 15s infinite linear;
	-moz-animation: animation 15s infinite linear;
	-o-animation: animation 15s infinite linear;
	animation: animation 15s infinite linear;}
.slick-dots li{ margin: 0; }
.slick-dots li button:before{ content: ""; background: #ed1c24; border-radius: 50px; width: 10px; height: 10px; top: 8px;}
.silde-images img{ padding: 10px; }
.thumbnail-img-text{ text-align: center; color: #ed1c24; font-weight: bold; }
.thumbnail-img-text a:hover{ color: #ed1c24; outline: none;}

/*----spices-page-and----*/

.point-list{ margin: 0; padding-left: 0px;}
.point-list li{ display: block; position: relative; margin-left: 25px; }
.glyphicon-ok{ top: 23px; display: block; }

.required{ font-weight: 600; }
.contact-list{ color: #000; }
.contact-list a:hover{ color: #000000; }


@media (min-width: 425px){
	.sub-heading h2{font-size:38px;}
	.sub-banner-text{top: -40px;}
	.sub-banner-text p{ font-size: 15px; line-height: 18px; font-weight: 700; text-transform: none;}
}

@media (min-width: 768px){
	.slide-text{ position: absolute;top: 15%; left: 5%;width:65%;}
	.slick-arrow{display: block !important;}
	.banner-yellow-text{font-size: 36px; font-weight: 900;padding: 5px 15px;display:block;}
	.banner-red-text{padding: 5px 10px 15px;}
	.banner-red-text p{font-size: 35px; font-weight: 900;}
	.banner-red-text span{font-size: 20px; font-weight: 600; display: block; margin-bottom: 12px;}
	.sub-banner-text{top: -53px;}
	.sub-banner-text p{ font-size: 23px; line-height: 24px; font-weight: 900; text-transform: uppercase;}
	.solution-slogan{ font-size: 44px; }
	.contact-details{ text-align: right; }
	.creat-link{ float: right; }
	.border-left{ border-left: 1px solid #717272; padding-left: 22px; }
	.cloud-background:after{ bottom:0;}
}

@media (min-width: 991px){
	.slide-text{ top: 30%; width:48%;}
	.sub-header-info{display: block;}
	.controlar{display: none;}
	.navs li{display: inline-block; color: #ffffff;}
	.navs li a{ color: #ffffff; }
	.menu > ul > li a{ color: #ffffff; display:inline-block; }
	.menu > ul > li > ul{left: -80px; width: 1000px; padding: 0px;}
	.menu > ul > li > ul > li{ width: 20%;}
	.navigation div{display: inline-block;}
	.mega-menu li{ float: left; }
	.mega-menu li.mega-menu-column {width: 175px; }
	.dropdown-menu{ background: rgba(255, 255, 255, 0.97); position: absolute; border: 1px solid #ccc; border: 1px solid rgba(0,0,0,.15); border-radius: 10px; -webkit-box-shadow: 0 6px 12px rgba(0,0,0,.175); box-shadow: 0 6px 12px rgba(0,0,0,.175); left: -80px;}
	.mobile-name{display: none;}
	.navs{position: relative; background: transparent; right: 0 !important; width: auto; overflow:inherit;}
	.company-name{display: none;}
	.mobile-contact{display: none;}
	.sub-banner-text{top: -68px;}
	.sub-banner-text p{ font-size: 30px; line-height: 30px; font-weight: 900;}
}

@media (min-width: 1024px){
	.about-name{ text-align: right;}
	.sub-banner-text{top: -65px;}
	.sub-banner-text p{ font-size: 30px; line-height: 28px; font-weight: 900;}
}

@media (min-width: 1200px){
	.slide-text{ width:37%;}
	.sub-banner-text{top: -81px;}
	.sub-banner-text p{ font-size: 34px; line-height: 34px; font-weight: 900; }
}

@media (min-width: 1400px){
	.sub-banner-text{top: -89px;}
	.sub-banner-text p{ font-size: 40px; line-height: 38px; font-weight: 900; }
}