/*JKB Store Font Theme in Wordpress*/
/*-------------------------------*/

/* Gobal */
html{box-sizing: border-box;}
*, *:before, *:after {box-sizing: inherit;}


h1, h2, h3, h4, h5, h6{display:inline-block;margin-top: 10px;margin-bottom: 20px;line-height: 1;padding-bottom: 5px;}
body{background-color: #fff;color: #333;font-size: 18px;line-height: 28px;}

/*h1, h2, h3, h4, h5, h6{display:inline-block;font-family: 'Graduate', cursive;margin-top: 10px;margin-bottom: 20px;line-height: 1;padding-bottom: 5px;}
body{background-color: #fff;color: #333; font-family: 'Lato', sans-serif;font-size: 18px;line-height: 28px;}*/

h1, h2, h3, h4, h5, h6{display:inline-block;font-family: 'Cormorant SC', serif;font-weight: 900;margin-top: 10px;margin-bottom: 20px;line-height: 1.5;padding-bottom: 5px;}
body{background-color: #fff;color: #333; font-family: 'Cormorant Infant', serif;font-size: 23px;font-weight: 500;line-height: 36px;}
/*body{background-color: #fff;color: #333; font-family: 'Cormorant Upright', serif;font-size: 23px;font-weight: 500;line-height: 36px;}*/

/*body{background-color: #fff;color: #333; font-family: 'ZCOOL XiaoWei', serif;font-size: 20px;line-height: 32px;}*/

/*h1, h2, h3, h4, h5, h6{display:inline-block;font-family: 'Marcellus SC', serif;margin-top: 10px;margin-bottom: 20px;line-height: 1;padding-bottom: 5px;}
body{background-color: #fff;color: #333; font-family: 'Roboto', sans-serif;font-size: 18px;line-height: 28px;}*/

/*h1, h2, h3, h4, h5, h6{display:inline-block;font-family: 'Cinzel', sans-serif;margin-top: 10px;margin-bottom: 20px;line-height: 1;padding-bottom: 5px;}
body{background-color: #fff;color: #333; font-family: 'Montserrat', sans-serif;font-size: 18px;line-height: 28px;}*/



h1{font-size: 42px;}
h2{font-size: 36px;}
h3{font-size: 30px;}


button:focus{outline: none;}
p{text-align: center;}
p small{line-height: 20px;}
small{line-height: 20px;}
a{color: #c2962d;}
a:hover{color: #111;text-decoration: none;cursor: pointer;}
a:focus{outline: none;}
a.sfa,.sfa{color: #c2962d;}
input[type=submit],.button{font-weight:400;font-size: 20px;background-color: #c2962d;color:#fff;margin-bottom: 10px;cursor: pointer;padding: 5px 10px 7px;}
input[type=submit]:hover,.button:hover{background-color: #111;color: #fff;}

.buttonDark{background-color: #111;color:#fff;display: inline-block;font-size: 90%;margin-top: 10px;margin-bottom: 10px;cursor: pointer;padding: 5px 10px 7px;}
.buttonDark:hover{background-color: #c2962d;color: #fff;}

img{border-radius: 0px;max-width: 100%;}
.imgBorder{border: #999 1px solid;}
.bgCover{background-size: cover;background-repeat: no-repeat;background-position: center;}
.overlay{background-color: rgba(0,0,0,.1);}
.overlayRed{background-color: rgba(150,22,26,.9);}
.posRel{position: relative;}
.posAbs{position: absolute; margin: auto;top: 40px; left: 0; bottom: 0; right: 0;}

.container {max-width: 1280px;padding: 0px;}
.row{margin-left: 0px;margin-right: 0px;}

.bgFix{background-attachment: fixed;}
.bgPad{padding: 15% 0;}
.table{display: table;width: 100%;}
.clear{clear: both;}
.lite{color: #ffb423;}	
.dark{color: #811f28;}
.white{color: #fff;}

.left{text-align: left;}
.center{text-align: center;}
.right{text-align: right;}
.taJust{text-align: justify;}
.floatLeft{float: left;}
.floatRight{float: right;}

.block{display: block;}
.inBlock{display: inline-block;}
.flexCenter{display: flex;align-items: center;}

.marTop{margin-top: 20px;}
.marBot{margin-bottom: 20px;}
.marBot2x{margin-bottom: 40px;}
.padAll{padding: 40px 0px 60px;}
.padTop{padding: 40px 0px 0;}
.padBot{padding: 0px 0px 60px;}
.padLow{padding-bottom: 15px}
.padBoth{padding-right: 15px;padding-left: 15px;}
.padLeft{padding-left: 15px;}
.padRite{padding-right: 15px;}
.padZero{padding: 0;}
.padSqr{padding: 15px;}
.padLtZero{padding-left: 0;}
.padRtZero{padding-right: 0;}

.padSide{padding: 0 15px;}

.padBan{padding: 90px 15px;}

.banSFA{background-color: #c3962e;color:#fff;}
.banGray{background-color: #f1f1f1;color:#000;}
.banUni{background-color: #ced4da;color:#000;}
.banBlue{background-color: #cfd0e5;color:#000;}
.banSky{background-color: #EEF3F6;color:#000;}


.thinner{font-weight:100;}
.thin{font-weight:200;}
.light{font-weight:400;}
.bold, strong{font-weight:600;}
.extrabold{font-weight:800;}
.ultrabold{font-weight:900;}
.underlineBk{border-bottom: #111 1px solid;}
.underlineWt{border-bottom: #fff 1px solid;}
.upper{text-transform: uppercase;}

.italic{font-style: italic;}

.txtSdw{text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);}

/* Header */
header{background-color: rgba(255,255,255,1.0);border-top: #444 5px solid;padding: 0;width: 100%;}
.headBg{background-color: rgba(255,255,255,1.0);transition: 0.5s;position: fixed;z-index: 5;border-bottom: #ccc 1px dotted;}

.logo{max-width: 450px;}

/* Main Menu */
.navbar-brand{width: 48%;}
.mainMenu{}
.navbar{}
.navbar-light .navbar-nav li.nav-item{color: #111;}
.navbar-light .navbar-nav a.nav-link{color: #111;padding: 7px 10px;font-size: 18px;}
.navbar-light .navbar-nav .active .nav-link{border-top:#111 2px solid;padding: 5px 10px;}
.navbar-light .navbar-nav .nav-link:hover{border-top:#111 2px solid;padding: 5px 10px;}


/* New Menu */

.toggle,[id^=drop] {display: none;}

/* Giving a background-color to the nav container. */
nav { margin:0;padding: 0;background-color: transparent;}

#logo {display: block;padding: 5px;float: left;font-size:20px;line-height: 60px;}
.bread{display: none;}
/* Since we'll have the "ul li" "float:left"
 * we need to add a clear after the container. */

nav:after {content:"";display:table;clear:both;}

/* Removing padding, margin and "list-style" from the "ul",
 * and adding "position:reltive" */
nav ul {float: right;padding:0;margin:0;list-style: none;position: relative;padding-top: 15px;z-index: 1;}
	
/* Positioning the navigation items inline */
nav ul li {margin: 0px;display:inline-block;float: left;background-color: transparent;}

nav ul li.active{border-top: #000 2px solid;}

/* Styling the links */
nav a {display:block;color:#000;font-size:20px;text-decoration:none;}
nav li a{padding:15px;}

nav ul li ul li:hover {background: transparent;}

/* Background color change on Hover */
nav a:hover {background-color: transparent;}
nav li a:hover{padding: 13px 15px 15px 15px;border-top: #000 2px solid;}

/* Hide Dropdowns by Default
 * and giving it a position of absolute */
nav ul ul {background-color: #fff;box-shadow: 0px 15px 40px 0px rgba(0, 0, 0, 0.5); display: none;position: absolute; 
	/* has to be the same number as the "line-height" of "nav a" */
	top: 70px;padding-top: 0;}
	
/* Display Dropdowns on Hover */
nav ul li:hover > ul {display:inherit;}
	
/* Fisrt Tier Dropdown */
nav ul ul li {width:200px;float:none;display:list-item;position: relative;}

nav ul ul li a:hover{background-color: #fbd76d;}

/* Second, Third and more Tiers	
 * We move the 2nd and 3rd etc tier dropdowns to the left
 * by the amount of the width of the first tier.
*/
nav ul ul ul li {position: relative;top:-60px;
	/* has to be the same number as the "width" of "nav ul ul li" */ 
	left:170px; }

	
/* Change ' +' in order to change the Dropdown symbol */
li > a:after { content:  ' +'; }
li > a:only-child:after { content: ''; }


/* Media Queries
--------------------------------------------- */

@media all and (max-width : 1024px) 
{

	#logo {display: block;padding: 0;width: 100%;text-align: center;float: none;}
	
	nav {margin: 0;position: absolute;top: 10px;right: 5px;max-width: 260px;z-index: 1111;}

	/* Hide the navigation menu by default */
	/* Also hide the  */
	.bread{background-color: #222;display: block;padding: 0px 10px;color:#FFF;font-size:22px;position: fixed;right: 5px;top: 17px;}
	.menu{background-color: #f1f1f1;margin-top: 56px;z-index: 111;}
	.toggle + a,.menu{display: none;}

	/* Stylinf the toggle lable */
	.toggle {display: block;padding:14px 20px;color:#111;font-size:20px;text-decoration:none;border:none;margin-bottom: 0;}

	.toggle:hover {background-color: #fbd76d;}

	/* Display Dropdown when clicked on Parent Lable */
	[id^=drop]:checked + ul {display: block;}

	/* Change menu item's width to 100% */
	nav ul{padding-top: 0;}

	nav ul li {display: block;width: 100%;}

	nav ul ul .toggle,nav ul ul a {padding: 0 40px;}

	nav ul ul ul a {padding: 0 80px;}

	nav a:hover,nav ul ul ul a {background-color: #fbd76d;}
  
	nav ul li ul li .toggle, nav ul ul a, nav ul ul ul a{padding:14px 20px;	color:#111;}
  
	nav ul li ul li .toggle,nav ul ul a {background-color: #f1f1f1; }

	/* Hide Dropdowns by Default */
	nav ul ul {float: none;position:static;color: #ffffff;
		/* has to be the same number as the "line-height" of "nav a" */}
		
	/* Hide menus on hover */
	nav ul ul li:hover > ul, nav ul li:hover > ul {display: none;}
		
	/* Fisrt Tier Dropdown */
	nav ul ul li {display: block;width: 100%;}

	nav ul ul ul li {position: static;
		/* has to be the same number as the "width" of "nav ul ul li" */ }

}

@media all and (max-width : 330px) 
{
	nav ul li {display:block;width: 94%;}
}

/* BreadCrumb */



/* Full Width Page */
.fullWidth{max-width: 2560px;width: 100%;}

/* General ContentArea */


/* General  SideBar */


/* Home Banner */


.carousel-caption{color:#000;top:3%;}
.carousel-control-next, .carousel-control-prev{z-index: 2;}

.pos1{}
.pos1 h4{margin-bottom:10px;line-height: 30px; }
.pos2{text-align: right;position: relative;top: 0%;right: 10%;}

.homeBanner{position: relative; overflow: hidden; z-index: 0;}
.homeBanner:after1{content:'';position:absolute;left:-600%;width:1300%;padding-bottom:1300%;bottom:1%;background:none;border-radius:50%;box-shadow: 0px 0px 0px 9999px #f1f1f1;z-index:1;}

/* Home Content */
.ourHistory{position: relative; overflow: hidden; z-index: 0;}

.techSection{background-color: #111;color: #fff;position: relative; overflow: hidden; z-index: 2;}
/*.techSection:after{content:'';position:absolute;left:-600%;width:1300%;padding-bottom:1300%;bottom:1%;background:none;border-radius:50%;box-shadow: 0px 0px 0px 9999px #444;z-index:1;}*/

.whatWeDo:before1{content:'';position:absolute;left:-600%;width:1300%;padding-bottom:1300%;top:1%;background:none;border-radius:50%;box-shadow: 0px 0px 0px 9999px #f1f1f1;z-index:1;}
.whatWeDo:after1{content:'';position:absolute;left:-600%;width:1300%;padding-bottom:1300%;bottom:1%;background:none;border-radius:50%;box-shadow: 0px 0px 0px 9999px #111;z-index:1;}

.ourClients{position: relative; overflow: hidden; z-index: 0;}
.ourClients:after1{content:'';position:absolute;left:-600%;width:1300%;padding-bottom:1300%;top:1%;background:none;border-radius:50%;box-shadow: 0px 0px 0px 9999px #111;z-index:1;}

.ourBrandSection{position: relative; overflow: hidden; z-index: 0;}
.ourBrandSection:before1{content:'';position:absolute;left:-600%;width:1300%;padding-bottom:1300%;top:1%;background:none;border-radius:50%;box-shadow: 0px 0px 0px 9999px #f1f1f1;z-index:1;}
.ourBrandSection:after1{content:'';position:absolute;left:-600%;width:1300%;padding-bottom:1300%;bottom:1%;background:none;border-radius:50%;box-shadow: 0px 0px 0px 9999px #111;z-index:1;}


.factSection{}
.facts{background-color: #c2962d;color: #fff;padding: 30px 0;}
.factsBox{background-color: #111;color: #fff;padding: 30px 0;}
.factsBox h3{margin-bottom: 0;}
.plainBox{background-color: #111;color: #fff;}
.factsBox small{color: #fff;display: block;}
.uniFit{min-height: 130px;}



.customizeOption{position: relative; overflow: hidden; z-index: 0;padding: 50px 0;}
.blueText{color: #02accb;}

.customizeOption img{border: #111 1px solid;}
.customizeOption h2{color: #848484;}

.blue{background-color: #02accb;}
.fadGreen{background-color: #9ddd7e;}
.yellow{background-color: #ffdc54;}
.orange{background-color: #ee624d;}

.mad{background-color: #c2962d;color: #fff;}
.ash{background-color: #eee;color: #333;}
.gray{background-color: #444;color: #fff;}
.black{background-color: #111;color: #fff;}

/* Home About*/

.innerBanner{}
.whatWeDo{position: relative;overflow: hidden;}
/*.whatWeDo img:hover{transform: rotate(360deg);-ms-transform: rotate(360deg);transition-duration: 1s;}*/



.ourWorks{background-color: #fff;margin-bottom: 0;position: relative;overflow: hidden;}
.ourWorks .nav{padding:20px;}
.ourWorks .nav li a{margin:5px;padding: 10px 20px; font-size:14px; color: #999; background: #fff;transition-duration: 0.4s;}
.ourWorks .nav a:hover{background:#333;}
.ourWorks .nav .active{background-color:#444!important;color:#fff;}

.Portfolio {border: 1px solid #666;border-radius: 0px;position:relative;margin: 5px;float: left;width: 240px;transition-duration: 0.4s;animation: winanim 0.5s ;
-webkit-backface-visibility:visible;backface-visibility:visible;box-shadow:0 3px 5px -1px rgba(0,0,0,.2),0 5px 8px 0 rgba(0,0,0,.14),0 1px 14px 0 rgba(0,0,0,.12);}
.Portfolio:hover{box-shadow: 0 12px 16px 0 rgba(0,0,0,.24),0 17px 50px 0 rgba(0,0,0,.19);}
.Portfolio img {width: 100%;height: auto;border-radius: 0px;}
.desc{padding: 5px;text-align: center;font-size: 90%;background:#fff;color:#666;}

@keyframes winanim 
{
    0%{opacity:0;transform:scale3d(.3,.3,.3)}
    50%{opacity:1}   
}


/* Home Testimonal */
.testimonialAwards{position: relative; overflow: hidden; z-index: 0;}
.testimonialAwards:after{content:'';position:absolute;left:-600%;width:1300%;padding-bottom:1300%;bottom:3%;background:none;border-radius:50%;box-shadow: 0px 0px 0px 9999px #111;z-index:1;}
.testimonialBox{background-color: #eee;}
#testimonialCarousel{background-color: #f1f1f1;position: relative;min-height: 300px;padding: 40px;}
#testimonialCarousel:before{content: "\f10d";left: 40px;top: 40px;color: #ccc;font-family: "FontAwesome";font-size: 36px;position: absolute;}
#testimonialCarousel:after{content: "\f10e";right: 40px;bottom: 40px;color: #ccc;font-family: "FontAwesome";font-size: 36px;position: absolute;}
.testimonial{float: right;width: 50%;}
.testimonial h1{color: #111;}
.testimonial p{color: #111;margin: auto;width: 80%;}
.awardBox{background-color: #848484;}
.awards{float: left;width: 50%;}
.awards h1{color: #fff;}

/* Login */


/* My Account */




/* About Us*/
.aboutBanner{background-color: #f1f1f1;}
.corporateVideo{}
.aboutHead{}
.paperProductSection{border: #f5f5f5 1px solid;border-width: 1px 0;padding: 10% 0;}
.paperProduct{padding: 0 15px;margin:auto;width: 40%;}
.ecoSection{background-color: #e4e4e4; padding:4% 0;}
.ecoSection img{border:#111 1px solid;}

.ecoRow{padding-top: 30px;}
.ecoBot{position: relative;bottom: -33px;}
.greenSection{}
.greenText{color: #4d9721;}
.greenField{background-position: center;padding: 15% 0;}

.qualityControlSection{background-color: #f1f1f1;position: relative;padding-bottom: 40px;}
.qualityPolicySection ul li{list-style: square;}
.qcImg{position: relative;bottom: 30px;left: 30px;}


.qualityCertiSection{background-color: #f1f1f1;}
.qualityCertiSection img{margin-top: 20px;}
.qcRow{padding-top: 15px;}

.saferSection{background-color: #e2e5e3; padding-bottom: 25%;}
.saferImgSection{margin-top: -20%;margin-bottom: 0;}
.saferImgSection img{border: #111 1px solid;}
.saferImgSection .topImg{border: #fff 17px solid;border-width: 17px 17px 0;}
.safeRow{margin-top: 7px;}
.safeCol{margin:20px 0;}
.col70{width: 70%}
.col30{width: 30%;}
.safeCol img{}


.awardSection{}
.awardsRow{background-color: #F5F5F5;border: #ccc 1px solid; display: flex;align-items: center;}
.awards{}
.awardsImage{background-repeat: no-repeat;background-position: center;background-size: cover;padding: 40% 0;}
.awardsText{vertical-align: middle;}


/* Solutions */
.clientsLogo{background-color: #ced4da;}
.clientsLogo .col-2{}
.clientsLogo img{margin: 20px 0;}

.stactistics{background-color: #F5F5F5;}



/* Book Tech */
.bookTechSection{background-color: #f9f9f9; padding-bottom: 20%;}
.serviceVideo{margin-top: -30%;}

.hardCover{}

.graySection{background-color: #f1f1f1;}
.smokeSection{background-color: #fbfbfb;}
.whiteSection{background-color: #ffffff;}


.rigidCol{background-color: #F4F4F4;margin-left: 20px;margin-bottom: 30px;max-width: 48%;padding: 15px 30px}

/* Packing Solutions */

.packaginBanner{border: #999 1px solid;}
#carouselExampleIndicators .carousel-control-next,#carouselExampleIndicators .carousel-control-prev{color: #222;font-size: 24px;}

/* Logo Scroller */

.slick-slide{margin: 0px 20px;}
.slick-slide img{width: 100%;}
.slick-slider{position: relative;display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.slick-list{position: relative;display: block;overflow: hidden;margin: 0;padding: 0;}
.slick-list:focus{outline: none;}
.slick-list.dragging{cursor: pointer;cursor: hand;}
.slick-slider .slick-track,.slick-slider .slick-list{
	-webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);}
.slick-track{position: relative;top: 0;left: 0;display: block;}
.slick-track:before,.slick-track:after{display: table;content: '';}
.slick-track:after{clear: both;}
.slick-loading .slick-track{visibility: hidden;}
.slick-slide{display: none;float: left;height: 100%;min-height: 1px;}
[dir='rtl'] .slick-slide{float: right;}
.slick-slide img{display: block;}
.slick-slide.slick-loading img{display: none;}
.slick-slide.dragging img{pointer-events: none;}
.slick-initialized .slick-slide{display: block;}
.slick-loading .slick-slide{visibility: hidden;}
.slick-vertical .slick-slide{display: block;height: auto;border: 1px solid transparent;}
.slick-arrow.slick-hidden{display: none;}



/* Brands C3962E */
.niteStand{background-color: #e4e4e4;}

/* Careers */
.currentOpening{}
.currentOpening .row{border-bottom:#ccc 1px solid;padding: 15px;}
.currentOpening .row.top{border-top:#ccc 1px solid;}

.tabJob nav > .nav.nav-tabs{border: none;color:#fff;background:#fff;border-radius:0;}
.tabJob nav > div a.nav-item.nav-link,.tabJob nav > div a.nav-item.nav-link.active{border: none;padding: 18px 25px;color:#fff;background:#fff;border-radius:0;}
.tabJob nav > div a.nav-item.nav-link.active:after{content: "";position: relative;bottom: -132px;left: -25%;border: 15px solid transparent;border-top-color: #666;}
.tabJob .tab-content{background: #fdfdfd;line-height: 25px;border-top:5px solid #666;padding:30px 25px;}
.tabJob nav > div a.nav-item.nav-link:hover,.tabJob nav > div a.nav-item.nav-link:focus{border: none;background: #EEECEF;color:#fff;border-radius:0;transition:background 0.20s linear;}
.tabJob img:hover{}

.discover{padding: 5% 15px;background-position: center;}

/* Contact Us */
.contactUsBanner{}
input[type=text],input[type=email],input[type=tel], select, textarea{width: 100%;padding: 12px;border: 1px solid #ccc;border-radius: 4px;box-sizing: border-box;margin-top: 6px;margin-bottom: 16px;resize: vertical;}
input[type=file]{width: 100%;margin-top: 6px;margin-bottom: 16px;}


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

/* Footer */
/*.footerCurve{position: relative; overflow: hidden; z-index: ;margin-top: -0px;}
.footerCurve:after{content:'';position:absolute;left:-600%;width:1300%;padding-bottom:1300%;bottom:3%;background:none;border-radius:50%;box-shadow: 0px 0px 0px 9999px #111;z-index:1;}
*/

.site-footer{background-color: #111;color: #fff;}
.site-footer .row{}
.sfaText{margin-top: 10px;}
.site-footer a{color:#fff;}
.site-footer a:hover{color: #c3962e;}
.copyRights{background-color: #111;color: #fff;font-size: 18px;padding: 20px;text-align: center;}
.footerLink{padding-left: 0;text-align: center;}
.footerLink li{list-style: none;}
.seperator{border-left: #fff 1px solid;}
.brandBox{padding-left: 5px;}

.listIcons{padding-top: 20px;padding-left: 0;}
.listIcons li{display: inline-block;}
.listIcons li a{font-size: 24px;padding: 10px 8px;}

/* Terms Privarcy*/

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

/* Admin Panel */






