/* 
Theme Name: BS-Spa
Description: A child theme of Twenty Twelve
Author: Nilzon Designs
Author URI: http://nilzondesigns.com
Template: twentytwelve
Version: 1.0
*/

@import url(../twentytwelve/style.css);



/* ------------------------------ fonts ------------------------------ */
body.custom-font-enabled {
/*font-family: 'Lato', Arial, sans-serif;*/
font-family: 'Raleway', sans-serif;
color:#4f1a0c;
font-size:16px;
font-size:1.142857142rem;}

h1 {
font-family: 'Playball', cursive;
font-size:36px;
color:#9b145b;
font-weight:normal;
margin-bottom:15px;}

h2 {
font-family: 'Playball', cursive;
font-size:34px;
color:#4f1a0c;
font-weight:normal;
margin-bottom:15px;
line-height:150%;}

h3 {
font-family: 'Playball', cursive;
font-size:28px;
color:#9b145b;
font-weight:normal;
line-height:150%;}

h4 {
/*font-family: 'Lato', Arial, sans-serif;*/
font-family: 'Raleway', sans-serif;
font-size:24px;
color:#9b145b;
font-weight:normal;
margin-bottom:15px;
line-height:150%;}

h5 {
/*font-family: 'Lato', Arial, sans-serif;*/
font-family: 'Raleway', sans-serif;
font-size:20px;
color:#4f1a0c;
font-weight:normal;
margin-bottom:15px;
line-height:150%;}

h6 {
/*font-family: 'Lato', Arial, sans-serif;*/
font-family: 'Raleway', sans-serif;
font-size:20px;
color:#9b145b;
font-weight:normal;
line-height:150%;}

.main-navigation li a {
font-size:14px;
line-height:130%;
text-align:center;
text-transform:none;
color:#4f1a0c;
font-weight:normal;}

.main-navigation .current-menu-item > a, 
.main-navigation .current-menu-ancestor > a, 
.main-navigation .current_page_item > a, 
.main-navigation .current_page_ancestor > a,
.main-navigation li a:hover,
.main-navigation li.current-menu-item a {
color:#9b145b;
font-weight:normal;}

#subnav ul.menu li {
background:url(images/icon-lotus.png) left center no-repeat;
padding-left:35px;
line-height:200%;}

#subnav ul.menu li a {
font-size:18px;
color:#4f1a0c;
font-weight:bold;}

ul.sub-menu li a {
text-align:left;}

ul.sub-menu li a:hover {
color:#9b145b;}

.main-navigation li ul li a {
font-size:14px;}

span.green {
color:#1f3f1e;}

p {
margin-bottom:20px;
line-height:150%;}

ul {
margin-bottom:15px;}

#main a {
color:#9b145b;
font-weight:bold;
text-decoration:none;}

#main a:hover {
color:#9b145b;
font-weight:bold;
text-decoration:underline;}

span.price {
margin-left:20px;
font-weight:bold;}

#right_column ul {
margin-bottom:20px;}

#right_column li {
background:none;
list-style-type: none;
list-style-position: inside;
text-indent: -.9em;
margin-left:15px;
line-height:140%;
margin-bottom:5px;}

.home #right_column li {
background:url(../twentytwelve/images/bullet-lotus-2.png) left top no-repeat;
padding-left:35px;
font-size:16px;
min-height:20px;
color:#4f1a0c;
font-weight:bold;
margin-bottom:7px;
text-indent:0;
margin-left:0;}

.home #right_column ul.home-spa li {
background:url(../twentytwelve/images/bullet-lotus-2.png) left top no-repeat;}

.home #right_column ul.cafe li {
padding-left:35px;}

.home #right_column a {
color:#4f1a0c;}

.home #right_column h4 a {
color:#9b145b;}

.site-info .widget .textwidget p {
margin-bottom:0;}

.site-info a.home_btn {
/*font-family: 'Lato', Arial, sans-serif;*/
font-family: 'Raleway', sans-serif;
color:#ffffff !important;
font-size:22px;
line-height: 1.428571429;
font-weight:bold;
text-transform:uppercase;
text-align:center;
display:block;
width:314px;
padding:3px 0;
padding: 0.214285714rem 0;
background-color:#A76A1B;
border-color:#ffffff;
border-width:4px 0;
border-style:solid;}


/* cafe pages */
#subnav ul#menu-cafe-subnav.menu li {
background:url(../twentytwelve/images/bullet-cafe.png) left center no-repeat;
padding-left:40px;
line-height:185%;}

.site-info #subnav ul#menu-cafe-subnav.menu li {
line-height:200%;}

.page-id-86 #right_column h3 {
line-height:100%;
margin-bottom:20px;
font-weight:300 !important;
color:#02593e;}
	
.page-id-86 ul.cafe {
margin:0 0 5% 20%;}


/* spa pages */
#subnav ul#menu-services-subnav.menu li {
background:url(../twentytwelve/images/bullet-lotus-2.png) left center no-repeat;
padding-left:40px;
line-height:220%;}

/* ------------------------------ layout ------------------------------ */
body .site {
/*background-color:#e9d3b5;*/
background-color:#cecbba;
margin-top:0;
padding:0 30px;
max-width:900px;
max-width:64.285714285rem;
box-shadow:0 0 0 0;}


.site-header {
padding:0;
/*background:url(images/bg-header.png) top left repeat-x;*/}

.site-header a.logo {
display:block;
line-height:100%;
height:199px;
float:left;}

#main {
clear:both;}

.main-navigation {
margin:0;
width:50%;
float:left;
text-align:right;
margin-top:80px;}

.main-navigation li {
text-align:center;
margin-bottom:20px;
margin-right:0;}

.main-navigation li#menu-item-138,
.main-navigation li#menu-item-220,
.main-navigation li#menu-item-210 {
width:30%;}

.main-navigation li#menu-item-551,
.main-navigation li#menu-item-552 {
width:39%;}

.main-navigation ul.nav-menu, 
.main-navigation div.nav-menu > ul {
border:none;
text-align:right;}

.main-navigation li .sub-menu li {
margin-bottom:0;
text-align:left;
display:block;}

.main-navigation li ul li a {
width:190px;
width:13.571428571rem;}

img.size-full, 
img.size-large, 
img.header-image, 
img.wp-post-image {
border-radius:0 !important;
box-shadow:none!important;}

img.header-image {
height:192px !important;
margin:0 !important;}

#left_column {
width:314px;
float:left;
clear:left;}

#left_column img {
margin-bottom:30px;}

#right_column {
max-width:470px;
padding-right:30px;
float:right;}

.page-id-68 #right_column {
width:470px;}

.home #right_column ul {
margin-bottom:30px;}

blockquote {
background-color:#f7ebd3;
padding:15px 15px 1px 15px;
margin-bottom:20px;
box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);}

.ngg-gallery-thumbnail-box {
margin-right:1px !important;}

.ngg-gallery-thumbnail img {
margin-left:0 !important;
padding:2px !important;}

footer[role="contentinfo"] {
border:none;
max-width:314px;
float:left;
clear:left;
margin-top:0;
padding-top:0;}

#lotus_phone {
background:url(images/lotus-top.png) top center no-repeat;
width:314px;
padding-top:190px;}

a.ph-local {
 display:block;
 height:65px;
 background:url(images/phone-local.png) top center no-repeat;}
 
a.ph-int {
 display:block;
 height:61px;
 background:url(images/phone-int.png) top center no-repeat;}
 
/* cafe pages */
#right_column ul.cafe li {
	background:url(../twentytwelve/images/bullet-cafe.png) left center no-repeat !important;
	margin-left:0;
	padding-left:50px;}
	
#right_column ul.cafe li a {
	color:#4f1a0c;}
	


/*a.phone_link {
display:block;
width:314px;
height:13px;
background:url(images/lotus-area-code.png) top center no-repeat;
text-align:center;
padding-top:231px;
color:#ffffff !important;
line-height:125%;
font-size:13px;
letter-spacing:1px;}

a.phone_link:hover {
text-decoration:none !important;}*/




/* mobile nav tab */
.menu-toggle {
font-family: 'Lato', Arial, sans-serif;
width:314px;
padding:3px 0;
padding: 0.214285714rem 0;
text-align:center;
font-size: 22px;
line-height: 1.428571429;
font-weight: normal;
color: #ffffff;
background-color: #a76a1b;
text-transform:uppercase;
background-repeat:no-repeat;
background-image:none;
border-color:#ffffff;
border-width:4px 0;
border-style:solid;
border-radius:0 0 0 0;
box-shadow: 0 0 0 0;}



.menu-toggle:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
article.post-password-required input[type=submit]:hover {
	color: #ffffff;
	background-color: #8D5A16;
	background-repeat: none;
	background-image: none;
	background-image: none;
	background-image: none);
	background-image: none;
	background-image: none;
	box-shadow: 0 0 0 0;
	border-radius:0 0 0 0;
}

.menu-toggle:active,
.menu-toggle.toggled-on,
button:active,
input[type="submit"]:active,
input[type="button"]:active,
input[type="reset"]:active {
	color: #ffffff;
	background-color: #8D5A16;
	background-repeat: none;
	background-image: none;
	background-image: none;
	background-image: none);
	background-image: none;
	background-image: none;
	box-shadow: 0 0 0 0;
	border-color: #ffffff;
	border-width:4px 0;
	border-radius:0 0 0 0;
}

/* --------------------------------------------
  iPad
-------------------------------------------- */

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)  {
	body .site {
		padding:0 20px;}
	
	
	#right_column {
		max-width:380px;
		padding-right:0;}
	
	 }

/* --------------------------------------------
  iPhone 6s
-------------------------------------------- */

@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) {
.main-navigation {
width:314px;}
	
.main-navigation ul.nav-menu, 
.main-navigation div.nav-menu > ul {
text-align:left !important;}

.main-navigation li {
width:100% !important;
text-align:left;}

.main-navigation li .sub-menu li {
width:100% !important;
margin-left:15px;}
}

/* --------------------------------------------
  Mobile landscape 480px;
-------------------------------------------- */

@media (max-width: 480px) {
.main-navigation {
margin-top:0;}

.main-navigation ul.nav-menu, 
.main-navigation div.nav-menu > ul {
text-align:left;}

.main-navigation li {
width:100% !important;
text-align:left;}

.main-navigation li .sub-menu li {
width:100% !important;
margin-left:15px;}

.page-id-68 #right_column {
width:auto;
max-width:470px;}

.page-id-321 #right_column h3 {
	padding-right:0 !important;}
	
.page-id-408 img {
	float:none;
	display:block;
	margin-left:0;}
	
.page-id-86 ul.cafe {
margin:0 0 5% 0;}

}

/* --------------------------------------------
  Mobile portrait 320px
-------------------------------------------- */

@media (max-width: 320px) {
.main-navigation {
margin-top:0;}

.main-navigation ul.nav-menu, 
.main-navigation div.nav-menu > ul {
text-align:left;}

.main-navigation li {
width:100% !important;
text-align:left;}

.main-navigation li .sub-menu li {
width:100% !important;
margin-left:15px;}

body .site {
padding:0 3px 0 9px;}

#main img {
max-width:95%;}

.site-header a.logo img {
max-width:298px;}

.site-header a.logo {
height:auto;
margin-bottom:0;}

.main-navigation {
margin-top:0;}

.menu-toggle {
max-width:298px;
margin-top:0;}

.page-id-68 #right_column {
width:auto;
max-width:470px;}


}