/*my css*/
@import url('https://fonts.googleapis.com/css?family=Lato:400,700,900');
@font-face {
	font-family: 'MyriadPro-Bold';
	src: url('../fonts/MyriadPro-Bold/MyriadPro-Bold.eot?#iefix') format('embedded-opentype'),  url('../fonts/MyriadPro-Bold/MyriadPro-Bold.otf')  format('opentype'),
		   url('../fonts/MyriadPro-Bold/MyriadPro-Bold.woff') format('woff'), url('../fonts/MyriadPro-Bold/MyriadPro-Bold.ttf')  format('truetype'), url('../fonts/MyriadPro-Bold/MyriadPro-Bold.svg#MyriadPro-Bold') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
font-family: 'MyriadPro-Light';
src: url('../fonts/MyriadPro-Light/MyriadPro-Light.eot?#iefix') format('embedded-opentype'),  url('../fonts/MyriadPro-Light/MyriadPro-Light.otf')  format('opentype'),
		url('../fonts/MyriadPro-Light/MyriadPro-Light.woff') format('woff'), url('../fonts/MyriadPro-Light/MyriadPro-Light.ttf')  format('truetype'), url('../fonts/MyriadPro-Light/MyriadPro-Light.svg#MyriadPro-Light') format('svg');
font-weight: normal;
font-style: normal;
}
	
html, body{font-family: 'Lato', sans-serif;}
a:hover, a:active, a:focus{ text-decoration: none !important; outline: none;  box-shadow: none;}
button:active, button:focus, input:active, input:focus{ outline: none; box-shadow: none;}
p{font-family: 'Lato', sans-serif;}

/*header*/
.custom-header:after {content: ''; height: 20px; width: 100%; background: #333; position: absolute; top: 0; z-index: -1;}
.custom-header {position: relative;}
.lower-header .container {background: #05756a;}
#toggle span {font-size: 34px;padding: 0;display: block;margin: 0;width: 100%;height: 100%;line-height: 40px;}
#toggle {height: 40px;width: 40px;padding: 0;border: 0;background: transparent;color: #fff; display: none;}
.search-icon button span {font-size: 34px;height: 100%;width: 100%;color: #fff; line-height: 42px;}
.search-icon button {padding: 0;background: transparent;border: 0;}
.logo-area h1 { margin: 0; line-height: 36px; font-size: 36px;}
.logo-area h1 a { color: #000; font-family: 'MyriadPro-Bold';}
.logo-area h2 a {color: #000;}
.logo-area h2 { font-size: 14px; margin: 0; font-family: 'MyriadPro-Light'; text-shadow: 0 0 0 #000; line-height: 14px;}
.upper-header:before {background: #fcce0b; content: ''; height: 100%; width: 40px; -webkit-clip-path: polygon(100% 0, 0% 100%, 100% 100%); clip-path: polygon(100% 0, 0% 100%, 100% 100%); position: absolute; right: calc(100%/2 - 1px); top: 0;}
.upper-header:after {content: '';height: 100%;width: 50%;background: #fcce0b;position: absolute;top: 0;right: 0;z-index: -1; box-shadow: 0 4px 10px rgba(0,0,0,0.25);;}
.upper-header {position: relative;z-index: 0; padding: 5px 0;}
.contact-filed ul li {display: inline-block; vertical-align: text-top; padding: 0 5px 0 0; text-align: left;}
.contact-filed {text-align: right;}
.contact-filed ul li h4 {margin: 0; font-size: 18px; color: #05756a; line-height: 18px;}
.contact-filed {text-align: right;}
.contact-filed ul li a {color: #676767; display: block;}
.contact-filed ul, .contact-filed ul li p { margin: 0;}
.middle-header {padding: 15px 0;}
.middle-header .row {align-items: center;}
.lower-header {margin-bottom: -32px;position: relative;z-index: 1;}
.middle-header .container, .lower-header .container{ max-width:950px;}

/*menu area*/
.menu-area {padding: 10px 0;}
.menu ul li a {color: #fff; font-family: 'Lato', sans-serif; font-size: 16px; display: block; transition: 0.3s ease; position: relative; text-transform: uppercase;}
.menu ul li a:after {content: ''; height: 1px; width: 0; background: #fff; position: absolute; bottom: -2px; left: 0; right: 0; margin: auto; transition: 0.3s ease;}
.menu ul { margin: 0;}
.menu ul li {display: inline-block; padding: 10px 35px;}
li.current_page_item a:after, .menu ul li:hover a:after{ width: 100% !important;}  
.search-icon {text-align: right;}
/*end*/

/*search model*/
.search-form-area input[type="submit"] {width: 80px;font-size: 14px;background: #05756a;border: 0;color: #fff;position: absolute;bottom: 15px;right: 15px;}
.search-form-area input {width: 100%;height: 40px;border-radius: 0;border: 1px solid #05756a;}
.search-form-area {padding: 15px; position: relative;}
.search-form-area label {display: block;}
/*end*/

/*banner area*/
.banner-area {max-height: 630px; overflow: hidden;}
/*inner banner*/
.inner-banner h1 {position: absolute; margin: 0; font-weight: 600; text-transform: uppercase; top: 50%; transform: translate(0, -50%); color: #fff; text-align: left; left: 8%; font-family: 'Lato', sans-serif; max-width: 35%; font-size: 24px;line-height: 30px;}
.inner-banner { position: relative; max-height: 400px;  overflow: hidden;}
/*end*/


/*product area*/
.heading h2:before { left: 0;}
.heading h2:after {right: 0; transform: rotate(180deg);}
.heading h2:after, .heading h2:before {content: ''; height: 100%; width: 30px;  border-style: solid; border-color: #fcce0b; border-width: 3px 0px 3px 3px; position: absolute;}
.heading h2 {color: #05756a; text-transform: uppercase;font-weight: bold;margin: 0;position: relative;width: 200px;line-height: 50px;text-align: center; margin: 0 auto; font-family: 'Lato', sans-serif;}
.heading {padding: 35px 0;}
.product-area {padding-bottom: 35px;}
.product-detail h4, h2.woocommerce-loop-product__title {margin: 0 !important; padding: 10px 0 0 !important; color: #05756a; font-size: 18px !important;}
.product-img {border: 1px solid #e5e5e5; padding: 20px; box-shadow: 0 0px 10px rgba(0,0,0,0.2); position: relative;}
.product-img img {position: absolute;max-height: 85%;margin: 0 auto;left: 0;right: 0;width: auto; display: block; box-shadow: none !important; top:0; bottom:0;}
.product-img:after {content: ''; display: block; padding-bottom: 100%;}
.product-img a {display: block;}
.product-detail a {color: #333; margin: 5px 0; display: inline-block}
a.button.product_type_simple:after {content: '⟶';padding-left: 5px;}
a.button.product_type_simple, a.button.product_type_simple:hover {background: transparent;padding: 0;font-weight: normal;}
.woocommerce ul.products li.product a img {width: inherit; height: auto; display: block; margin: auto; box-shadow: none;}
h2.woocommerce-loop-category__title mark {display: none;}
h2.woocommerce-loop-category__title {text-align: center;color: #53756a;font-size: 20px !important;}
/*end*/

/*about us*/
.inner-page-area {padding: 30px 0;}
.about-images {position: relative; z-index: 0;}
.first-img {position: absolute; right: 0; z-index: 1; box-shadow: 0 5px 5px rgba(0,0,0,0.3);}
.second-img {transform: scale(0.9); box-shadow: 0 5px 5px rgba(0,0,0,0.3);}
.about-page-area .heading h2 {margin: 0;}
.about-page-area .heading{ padding: 15px 0}
.about-content p {margin: 0; line-height: 24px;}
.about-content a.btn {background: #fcce0b; color: #000; width: 100%; margin: 10px 0; max-width: 140px; height: 40px; line-height: 40px; padding: 0; box-shadow: 0 3px 5px rgba(0,0,0,0.3); display: block; transition: 0.3s ease}
.about-content a.btn:hover {background: #05756a; color: #fff;}
.about-page-area {padding: 50px 0;}
/*end*/

/*why choose us area*/
.why-choose-area .heading h2 {width: 310px;}
.why-choose-area {position: relative; background: url(../images/bg.jpg); padding:30px 0; z-index: 0; background-size: cover;}
.why-choose-area:after {content: ''; height: 100%; width: 100%; position: absolute; background: rgba(255,255,255,0.3); top: 0;    z-index: -1;}
.why-choose-item {position: relative; text-align: center; margin: 0 -15px;}
.why-choose-item h4 {margin: 10px 0;background: #fcce0b;color: #05756a;display: inline-block;padding: 5px 10px; box-shadow: 0 3px 5px rgba(0,0,0,.3);}
.why-choos-img {position: relative; margin-bottom: 60px}
.why-choos-img:before {content: ''; height: 40%; width: 5px; background: #f9cc0a; position: absolute; bottom: -65px; left: 0; right: 0; margin: auto;}
.why-choos-img:after {content: '';height: 5px;width: 55%;background: #fcce0b;position: absolute;top: 0;bottom: 0;margin: auto;}
.why-choose-area .col-md-4:last-child .why-choos-img:after { display: none;}
/*why choose us area end*/

/*footer*/
.quick-links h3, .addres-area h3, .follow-us h3 {font-size: 24px; font-family: 'Lato', sans-serif; color: #fcce0b; text-transform: uppercase; font-weight: normal; margin: 0 0 15px; line-height: normal}
.follow-us .social-media-button-container {text-align: left !important}
.quick-links ul li:before {content: "\f345";font-family: dashicons;color: #fff;margin-right: 5px;}
.quick-links ul li {padding: 7px 0;position: relative;border-bottom: 1px solid #fff;}
.custom-footer {background: #05756a;padding: 40px 0 0; clear: both;}
.copy-rights {border-top: 2px solid #fcce3d;padding: 10px 0;margin-top: 40px;}
.copy-rights p a {color: #fcce25;}
.copy-rights p {margin: 0;text-align: center;color: #fff;}
.quick-links ul li a {color: #fff; font-family: 'Lato', sans-serif; font-size: 16px;}
.quick-links ul li:last-child{ border: 0;}
.about-area .logo-area h2 a {color: #fcce0b;}
.about-area .logo-area h2 {font-size: 18px; line-height: 24px;}
.about-area .logo-area h1 a {color: #fff;}
.about-area .logo-area h1 {font-size: 46px;}
.addres-area ul li span {color: #fcce0b;}
.addres-area ul li {padding: 5px 0; color: #fff;}
.addres-area ul li a {color: #fff; font-family: 'Lato', sans-serif;}
.about-area p, .addres-area p {color: #fff; font-family: 'Lato', sans-serif; font-size: 16px;}
/*end*/

/*catelog-area*/
.yellow-area p img {padding-right: 20px; opacity: 0.8;}
.yellow-area p {margin: 0; font-size: 24px; color: #05756a;}
.yellow-area:after {content: ''; height: 100%; width: 50px; z-index: 1; border-left: 50px solid #fcce0b; position: absolute; top: 0; right: -50px; border-top: 70px solid transparent; border-bottom: 70px solid transparent;}
.yellow-area {text-align: right; padding: 30px 10px; position: relative; background: #fcce0b; margin:0 -15px;}
.catelog-link-area a {background: #05756a; color: #fff !important; padding: 10px 20px; display: inline-block; top: 50%;position: relative;transform: translate(0, -50%);}
.catelog-link-area {text-align: center; height: 100%; margin: 0 -15px; background: url(../images/flasks.png); background-position: center;}

/*end*/

/*our insights area*/
.our-insights-area .heading h2 {width: 240px;}
.our-insights-area h3 {font-size: 24px; text-transform: capitalize; color: #05756a; font-weight: normal; line-height: normal}
.our-insights-area{ padding: 30px 0;}
.our-insights-area .widget img {box-shadow: none !important;}
.our-insights-area h4 a { color: #05756a;}
/*end*/

/*contact us area*/
.contact-content .heading { padding: 10px 0;}
.contact-content .heading h2 { margin: 0; width: 230px;}
.contact-content p {font-size: 16px; line-height: 28px; color: #000;}
.contact-us-area {padding: 40px 0;}
.contact-form-area {background: #05756a; padding: 20px; color: #fff;}
.form-field lable {margin: 5px 0; display: block; color: #fcce0b; font-size: 16px; font-family: 'Lato', sans-serif;}
.form-field {padding: 5px 0; overflow: hidden; width: 100%;}
.form-field input[type="submit"] { background: #fcce0b; color: #000; font-size: 16px; height: 40px; max-width: 150px;margin: 0 auto; box-shadow: 0 3px 5px rgba(0,0,0,.3);}
.form-field textarea {width: 100%; height: 110px; border-radius: 0; border: 0; padding: 10px;}
.form-field input { width: 100%;  height: 35px; border-radius: 0; border: 0; display: block;}
/*end*/

/*single product area*/
.single-product-page {padding: 60px 0;}
.woocommerce-product-gallery.woocommerce-product-gallery--with-images.woocommerce-product-gallery--columns-4.images {opacity: 1 !important;}
.related.products > h2 {font-size: 20px; padding: 10px 0; color: #05756a; font-family: 'Lato', sans-serif; font-weight: 600;  text-transform: uppercase;}
.related.products {clear: both; padding: 10px 0;}
h1.product_title.entry-title { font-family: 'Lato', sans-serif; color: black;}
.product_meta a {color: #05756a;}
.woocommerce div.product div.images img{ max-width:100% !important; width:inherit !important; margin:0 auto;}
/*end*/

/*category page*/

/*end*/

/*404 & search*/
.custom404page h3 small {display: block; line-height: normal; font-size: 54px;  text-transform: uppercase; text-shadow: none;}
.custom404page h3 {font-size: 150px !important; font-weight: 900 !important; font-family: 'Lato', sans-serif; line-height: 130px !important; color: #05756a; text-shadow: 0 3px 0 #055d54;}
.custom404page {text-align: center; padding: 20px 0;}
.search-form-area{ max-width: 750px; margin: 0 auto; width: 100%}
.customsearchpage {padding: 30px 0;}
.not-found{ text-align:center;}
/*end*/

/*media*/
@media(max-width:1199px){
    .why-choos-img:after {width: 47%;}
}


@media(max-width:991px){
	.middle-header .container, .lower-header .container{ max-width:750px;}
    .follow-us {margin-bottom: 20px;}
    .why-choos-img:after {width: 30%;}
    .yellow-area p img {padding-right: 10px;max-width: 80px;}
    .yellow-area p{ font-size: 20px;}
    .yellow-area:after {border-left: 30px solid #fcce0b;border-top: 55px solid transparent;border-bottom: 55px solid transparent;}
    .product {margin: 15px 0;}
    .our-insights-area h3 {font-size: 20px;padding: 5px 0; line-height: normal}
    .our-insights-area .panel-grid.panel-no-style {display: flex;flex-direction: row !important; flex-wrap: wrap;}
    .our-insights-area .panel-grid-cell {width: calc(100%/2 - 5px) !important;}
	.menu ul li {padding: 10px 20px;}
}

@media (max-width:767px) {
    .logo-area {text-align: center;padding-bottom: 15px;}
    .menu ul li {display: block;}
    #toggle {display: block;position: absolute;top: -40px;}
    .menu {display: none;}
    .menu-area {padding: 0;}
    .middle-header {padding: 10px 0;}
    .social-media-area a {padding: 5px !important;}
    .upper-header {padding: 2px 0;}
    .logo-area {padding-bottom: 10px;}
    .about-area .logo-area {text-align: left;}
    .map-area {margin-bottom: 20px;}
    .why-choos-img:after{ display: none;}
    .yellow-area:after{ display: none;}
    .yellow-area {text-align: center;}
    .catelog-link-area {padding: 40px 0;}
	.middle-header .container, .lower-header .container{ max-width:550px;}
}

@media(max-width:574px){
    .contact-filed {text-align: left;margin: 5px auto; max-width: 260px;}
    .why-choose-area .heading h2 {width: 280px; font-size: 24px;}
	.middle-header .container, .lower-header .container{ max-width:100%;}
    
}

@media(max-width:460px){
    .our-insights-area .panel-grid-cell {width: 100% !important;}
    
}

@media(max-width:400px){
    .contact-filed ul li a{ font-size: 12px;}
    .contact-filed ul li h4{ font-size: 16px;}
    .contact-filed {margin: 0 -12px;}
    .contact-filed ul li{ padding: 0;}
    .yellow-area p img {padding-right: 0;display: block;margin: 0 auto 10px;}
    ul.products.columns-4 li {width: 100% !important;}
}
/*end*/