@import url('fonts.css');

/* ==================================================
   Basic Styles
================================================== */

html, body {
	height: 100%;
}

html, hmtl a{
	width:100%;
	font-size: 100%; 
	-webkit-text-size-adjust: 100%; 
	-ms-text-size-adjust: 100%;
}

body{
	margin:0px;
	padding:0px;
	color:#666666;
	font-size:14px;
	font-family: 'open_sansregular', Arial, Helvetica, sans-serif;
	line-height:18px;
}

a{
	color:#b10708;
	text-decoration: none;
	cursor: pointer;
	
	-webkit-transition: all 0.2s linear 0s;	
	   -moz-transition: all 0.2s linear 0s;
		 -o-transition: all 0.2s linear 0s;
		    transition: all 0.2s linear 0s;
}

a:hover,
a:active{
	outline: 0;
	color:#2e3943;
	text-decoration:none;
}

a img {
	border: none;
}

a > img {
	vertical-align: middle;	
}

img {
	max-width: 100%;
	height:auto;	
}

strong {
  	font-weight: normal;
	font-family: 'open_sansbold';
}

ul, p, figure {
	margin:0px;
	padding:0px;
}

p {
	margin:0px 0px 15px 0px;
}

hr {
	border-style: dashed;
	border-color: #3C3F45;
	border-bottom: none;
	border-left: none;
	border-right: none;
	margin: 50px 0;	
}

.clear{
	clear:both;
}

.pull-left{
	float:left;
}

.pull-right{
	float:right;
}

.text_align_left {
	text-align: left;
}

.text_align_center {
	text-align: center;
}

.text_align_right {
	text-align: right;	
}

.color-text {
    color: #DE5E60;
}

.through{
	text-decoration:line-through;
}

.border-radius{
	-moz-border-radius:6px 6px 6px 6px;
	-webkit-border-radius:6px 6px 6px 6px;
	border-radius:6px 6px 6px 6px;
	behavior: url(PIE.htc); /* For IE8 */
}

input, button, select, textarea {
	background-color:#FFFFFF;
	border:solid 1px #D5D5D5;
	font-weight: 300;
	outline: 0;
	font-family: 'open_sansregular', Arial, Helvetica, sans-serif;
	-webkit-transition: all 0.2s ease-out 0s;	
	   -moz-transition: all 0.2s ease-out 0s;
		 -o-transition: all 0.2s ease-out 0s;
		    transition: all 0.2s ease-out 0s;
			-webkit-border-radius: 0;			
}

input[type="button"], input[type="submit"]{
	cursor:pointer;
	-webkit-appearance: none;
	-webkit-border-radius: 0;
}

input:focus, 
textarea:focus,
input[type="text"]:focus {
	outline: 0;
}

input:-moz-placeholder,
textarea:-moz-placeholder {
  color: #7F8289;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #7F8289;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #7F8289;
}

/* ==================================================
   Code and Pre
================================================== */

code,
pre {
  	padding: 0 3px 2px;
  	-webkit-border-radius: 3px;
       -moz-border-radius: 3px;
            border-radius: 3px;
  	color: #232527;
  	font-size: 12px;
  	font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
}

code {
  	padding: 2px 4px;
  	border: 1px solid #dde4e9;
  	background-color: #F6F6F6;
  	color: #232527;
  	white-space: nowrap;
}

pre {
  	display: block;
  	margin: 70px 50px;
  	padding: 30px;
  	border: 1px solid #dde4e9;
  	-webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
  	background-color: #FCFCFC;
  	white-space: pre;
  	white-space: pre-wrap;
  	word-wrap: break-word;
  	word-break: break-all;
  	font-size: 12px;
  	line-height: 20px;
}

pre code {
  	padding: 0;
  	border: 0;
  	background-color: transparent;
  	color: inherit;
  	white-space: pre;
  	white-space: pre-wrap;
}

.pre-scrollable {
  	overflow-y: scroll;
  	max-height: 340px;
}


*{
    box-sizing:border-box;
}
*::before, *::after {
    box-sizing:border-box;
}


/* ==================================================
   Typography
================================================== */

h1,
h2,
h3,
h4,
h5,
h6{
	font-family: 'open_sansbold';
	padding:0px;
	margin:0px;
	color:#3f3f3f;
	font-weight:normal;
	line-height:60px;
}

h1{
	font-size:24px;
	color:#000000;
	line-height:35px;
}

h2{
	font-size:20px;
	color:#000000;
	line-height:30px;
}

h3{
	font-size:18px;
	color:#000000;
	line-height:26px;
}

h4{
	font-size:20px;
	line-height:24px;
}

h5{
	font-size:18px;
	line-height:20px;
}

h6{
	font-size:16px;
	line-height:20px;
}


/* ==================================================
   Main Container
================================================== */

.mainDiv{width:100%;float:left;}
.container{position:relative;width:1170px;margin:auto;}

/* ==================================================
   Header
================================================== */

.mainHeader{background:#39b54a;padding:12px 0px;}
.yogakingLogo{float:left;}
.headerRight{float:right;}
.headerRight .topSocial{float:right;margin-top:10px;}
.headerRight .topSocial a{background:url(../images/social-logo.jpg) no-repeat;width:18px;height:18px;display:inline-block;vertical-align:middle;margin-left:10px;}
.headerRight .topSocial a.ebIcon{background-position:0px 0px;}
.headerRight .topSocial a:hover.ebIcon{background-position:0px -29px;}
.headerRight .topSocial a.fbIcon{background-position:-31px 0px;}
.headerRight .topSocial a:hover.fbIcon{background-position:-31px -29px;}
.headerRight .topSocial a.twIcon{background-position:-61px 0px;}
.headerRight .topSocial a:hover.twIcon{background-position:-61px -29px;}
.headerRight .topSocial a.gpIcon{background-position:-91px 0px;}
.headerRight .topSocial a:hover.gpIcon{background-position:-91px -29px;}
.headerRight .topSocial a.inIcon{background-position:-121px 0px;}
.headerRight .topSocial a:hover.inIcon{background-position:-121px -29px;}
.headerRight .topSocial a.pinIcon{background-position:-151px 0px;}
.headerRight .topSocial a:hover.pinIcon{background-position:-151px -29px;}
.headerRight .topSocial a.liIcon{background-position:-181px 0px;}
.headerRight .topSocial a:hover.liIcon{background-position:-181px -29px;}

.headerRight .orderBtn{clear:both;float:right;margin-top:12px;}
.headerRight .orderBtn a{display:inline-block; font-family: 'open_sanssemibold';font-size:16px;color:#ffffff;text-transform:uppercase;background:#231e20;padding:8px 30px;border:solid 2px #ffffff; border-radius:5px;}
.headerRight .orderBtn a:hover{background:#ffffff;color:#39b54a;}

.navigation{float:left;width:100%;background:#231e20;}
.navigation nav a.mobileMenu{float:right;background:#231e20 url(../images/menu-icon.png) no-repeat center center;width:40px;height:40px;display:none;}
.navigation nav ul li{list-style:none;display:inline-block;vertical-align:top;}
.navigation nav ul li a{display:block;padding:15px 30px;font-family: 'open_sansbold';font-size:15px;color:#ffffff;text-transform:uppercase;}
.navigation nav ul li a:hover, .navigation nav ul li.current a{background:#000000;color:#39b54a;}


/* ==================================================
   Middle
================================================== */

.middle{padding:20px 0px;}
.middle h1.pageTitle{margin-bottom:20px;}

.topBanner{background:url(../images/topbanner-bg.jpg) no-repeat center center;height:450px;}
.topBanner .bannerTxt{float:left;width:40%;margin-top:80px;}
.topBanner .bannerTxt h2{font-size:36px;line-height:40px;color:#ffffff;text-transform:uppercase;margin-bottom:25px;}
.topBanner .bannerTxt h2 span{font-size:60px;line-height:65px;color:#ffffff;display:block;}
.topBanner .bannerTxt h3{font-family: 'open_sansregular';font-size:18px;line-height:28px;color:#ffffff;text-transform:uppercase;margin-bottom:50px;}
.topBanner .bannerTxt p.operatedBtn{float:left;width:100%;}
.topBanner .bannerTxt p.operatedBtn a{display:inline-block; font-family: 'open_sanssemibold';font-size:16px;color:#39b54a;text-transform:uppercase;background:#231e20;padding:15px 30px;border:solid 2px #ffffff; border-radius:5px;}
.topBanner .bannerTxt p.operatedBtn a:hover{background:#ffffff;color:#39b54a;}


.aboutTxt{padding:50px 0px;text-align:center;}
.aboutTxt h2{font-size:36px;line-height:40px;color:#231e20;text-transform:uppercase;margin-bottom:55px;position:relative;}
.aboutTxt h2 span{color:#39b54a;}
.aboutTxt h2:after{content:"";position:absolute;left:50%;bottom:-25px;margin-left:-112px;background:url(../images/title-subline.png) no-repeat;width:225px;height:11px;}
.aboutTxt h6{font-family: 'open_sansregular';font-size:24px;line-height:30px;color:#222222;margin-bottom:30px;}
.aboutTxt article{font-size:16px;line-height:24px;color:#222222;float:left;width:100%;padding:0px 10%;}

.callEmailUs{background:url(../images/call-email-bg.jpg) no-repeat center center;background-size:cover;padding:50px 0px;text-align:center;}
.callEmailUs h2{font-size:32px;line-height:40px;color:#ffffff;text-transform:uppercase;margin-bottom:25px;}
.callEmailUs h6{font-family: 'open_sansregular';font-size:24px;line-height:30px;color:#ffffff;text-transform:uppercase;margin-bottom:35px;}
.callEmailUs .callUsBlackBg{display:inline-block;width:90%;padding:20px 50px;font-family: 'open_sansregular';font-size:24px;line-height:30px;color:#ffffff;text-transform:uppercase;background:rgba(0,0,0,0.5);}
.callEmailUs .callUsBlackBg span{font-family: 'open_sansbold';font-size:30px;line-height:36px;display:block;}

.advertiseBanner{margin:20px 0px;text-align:center;}
.advertiseBanner img{display:inline-block;vertical-align:middle;margin:0px 4px;}


/* ==================================================
   Footer Content
================================================== */

.mainFooter{background:#39b54a;font-size:13px;color:#8bd995;text-align:center;}
.mainFooter .footerLinks{float:left;width:100%;margin:25px 0px;}
.mainFooter .footerLinks a{font-size:14px;color:#ffffff;line-height:20px;text-transform:uppercase;display:inline-block;vertical-align:middle;}
.mainFooter .footerLinks a:hover{color:#07440f;}
.mainFooter .footerLinks span{font-size:14px;color:#75cf81;line-height:20px;display:inline-block;vertical-align:middle;margin:0px 10px;}
.mainFooter .copyright{background:#2b8837;float:left;width:100%;padding:18px 0px;font-size:13px;color:#ffffff;}