/*
Theme Name: TCI 2016
Theme URI: 
Author: Astir Agency
Author URI: http://weareastir.com/
Description: Custom Wordpress Theme for TCI
Version: 1.1.2
License: GNU General Public License


*/

/* Import the necessary TK Bootstrap WP CSS additions */
@import url( includes/css/bootstrap-wp.css );
@import url( includes/css/twentysixteenmenu.css );
@import url( genericons/genericons.css );




/* My Minimal WordPress Styling comes here */

/* This is a small security for too long strings titles */
body {
    word-wrap: break-word;
	background-color: #eee;
	color: #777;
}
a {color: #23527c}
/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}
.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto;
}

h1 {font-size: 20px}

/* Images and wp-captions should always fit and be responsive */
img {
	display: inline-block;
	height: auto;
	max-width: 100%;
}
img[class*="wp-image-"] {
	margin-top: 10px;
	margin-bottom: 10px;
}
.wp-caption {
	border: 1px solid #ccc;
	margin-bottom: 10px;
	max-width: 100%;
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 0 10px;
}
.wp-caption.aligncenter {
	margin-bottom: 10px;
}
.wp-caption img[class*="wp-image-"] {
	display: block;
}
.wp-caption .wp-caption-text {
	text-align: center;
	margin-top: 10px;
}

/* WP Gallery */
.gallery {
	margin-bottom: 1.5em;
}
.gallery a img {
	border: none;
	height: auto;
	max-width: 90%;
}
.gallery dd {
	margin: 0;
}


/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
	max-width: 100%;
}


/* Text meant only for screen readers */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
}
.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar */
}


/* Content */
.main-content .container {background-color: #fff; padding-bottom:0}
.home .main-content .container {background-color: transparent;}
.main-content-inner {
	padding: 3em 1em;
	line-height:1.6;
	min-height: 500px;
}

.hentry {
	margin: 0 0 1.5em;
}

.home #content h2 {font-style: italic; color: #c57202; font-size: 24px; }

/* Clearing */
.clear {
	clear: both;
}


/* Here some needed widget styles 
 * Most widgets are adapted in the file bootstrap-wp.js - and REALLY easy to modify! ;) */
.widget { margin-bottom: 2em; }
.widget_nav_menu ul.sub-menu li, .widget_pages ul.children li { padding-left: 15px; }

/* Hiding the search widget's button in widgets. thats just too old-skool. :) but if you want it back, just delete the next line. 
 * Note: you can change the whole appearance of the search_form() function in our searchform.php */
.widget_search .search-form input[type="submit"] { display: none; }

/* Make sure select elements fit in widgets */
.widget select {
	max-width: 100%;
}

/* Nested comments? They are threaded and nested already, you just need to add your own styling to finalize!  
 * For example with some margin, like the line below ;) Delete, modify, change classes in HTML if you desire another style */
 .comment .children { margin-left: 1.5em; } 

.white {color:#fff;}
a.white {color:#fff !important;}
a.white:hover {color:rgba(255,255,255,.8) !important;}
a.grey {color: #777;}
a.grey:hover {color : #999;}

.whitebg {background-color: #fff;}
.translucent {background-color: rgba(255,255,255,.7);}
.border {border: 3px solid #fff;}
.bordertop {border-top: 3px solid #fff;}
.borderleft {border-left: 3px solid #fff;}
.borderbottom {border-bottom: 3px solid #fff;}
.borderright {border-right: 3px solid #fff;}
.blue {color: #5F688F}
.bluebg {background-color: #5F688F}
.greybg {background-color: #999;}
.orange {color: #c57202 !important}
.spaced {letter-spacing: .15em;}

.bordergrey2 {border: 2px solid #999;}
.bordergrey {border: 1px solid #999;}
.borderdkgreytop, hr {border-top: 1px solid #777;}
.borderdkgreybottom {border-bottom: 1px solid #777;}


.onepoint1 {font-size: 1.1em}
.onepoint2 {font-size: 1.2em}
.onepoint3 {font-size: 1.3em}



.uppercase {text-transform:uppercase;}
.centered {text-align: center; margin:auto}
.textright {text-align: right;}
.textleft {text-align: left;}
.opensans {font-family:'open sans';}

.light {font-weight: 300;}
.normal {font-weight: 400;}
.semibold, .bold {font-weight: 600;}

.line1point1 {line-height: 1.1}


.noborder {border-width: 0 !important}

.borderbottomwhite {border-bottom: 1px solid #fff;}
.clinicinfo .borderbottomwhite {margin-bottom: 5px; padding-bottom:5px;}
.clinicinfo span {vertical-align: middle;}

.noshadow {-webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0)  !important;
box-shadow: 0 0px 0px rgba(0, 0, 0, 0) !important;}

.margintop0 {margin-top: 0 !important;}
.margintop {margin-top: 20px !important;}
.margintop2x {margin-top: 40px !important;}
.margin2x {margin: 40px !important;}
.marginbottom2x {margin-bottom: 40px !important;}
.marginbottom {margin-bottom: 20px;}
.marginleft {margin-left: 20px;}
.marginright {margin-right: 20px;}
.margintophalf {margin-top: 10px !important;}
.margintopnegativehalf {margin-top: -10px;}
.marginbottomhalf {margin-bottom: 10px;}
.marginlefthalf {margin-left: 10px;}
.marginrighthalf {margin-right: 10px;}
.nomargin {margin: 0;}
.padding {padding: 20px;}
.paddinghalf {padding: 10px}

.nopadding {padding: 0;} 
.nopaddingbottom {padding-bottom: 0 !important;}
.paddingtop {padding-top: 20px;}
.padding2x {padding: 40px;}
.paddingtop2x {padding-top: 40px;}
.paddingbottom {padding-bottom: 20px;}
.paddingbottom2x {padding-bottom: 40px;}
.paddingleft {padding-left: 20px;}
.paddingright {padding-right: 20px;}
.paddingleft2x {padding-left: 40px;}
.paddingright2x {padding-right: 40px;}
.paddingright0 {padding-right: 0;}
.paddingleft0 {padding-left: 0 !important;}
.paddingtophalf {padding-top: 10px;}
.paddingtopquarter {padding-top: 5px;}
.paddingquarter {padding: 5px;}

.paddingbottomhalf {padding-bottom: 10px;}
.paddinglefthalf {padding-left: 10px;}
.paddingrighthalf {padding-right: 10px;}
  
.fullheight {height: 100%; top: 0; bottom: 0;}
.fullwidth   {width: 100%; left: 0; right: 0;}

.grey-box {background-color: #ddd;}

.left {float: left;}
.right {float:right;}

.clear {clear: both;}

 .flex {
	  		display: -webkit-box;   /* OLD: Safari,  iOS, Android browser, older WebKit browsers.  */
	   display: -moz-box;      /* OLD: Firefox (buggy) */ 
	   display: -ms-flexbox;   /* MID: IE 10 */
	   display: -webkit-flex;  /* NEW, Chrome 21+ */
	   display: flex;          /* NEW: Opera 12.1, Firefox 22+ */
	   -webkit-box-align: center; -moz-box-align: center; /* OLD… */
	   -ms-flex-align: center; /* You know the drill now… */
	   -webkit-align-items: center;
	   align-items: center;
 }



/* SITE HEADER */
.site-header {background-size: cover; background-position:center;}

/* NAVIGATION */
.navbar {min-height: 20px; margin-bottom: 0px; }
.navbar a{text-transform: uppercase; color: #fff; font-family: 'Didact Gothic', sans-serif; font-weight:bold}
.navbar a:hover, .navbar .active a, .navbar .current-menu-parent a {color: #ffbb00}
.navbar-toggle .icon-bar {background-color: #fff;}


#callout #explorenow {text-transform:uppercase; font-style:normal; text-align:center; margin:0  auto; letter-spacing:5px; color: #fff; text-indent:0}
#callout, #callout h2,  #callout h2 a  {color: #999; text-align:center;}
#callout {font-size: 18px;}

/*content */
.page-header {padding-bottom: 4px;}
.page-title {text-transform: uppercase; padding-bottom: 2px}
.entry-content {line-height: 1.6}
.entry-content ul{padding-left: 1.25em;}
#eventslist {clear: both;}

p.product.woocommerce.add_to_cart_inline {
    border: 0 !important; padding: 0 !important;
}


/*contact */
 .page-id-89 .entry-content ul {list-style: none; padding: 0}
   .page-id-89 .entry-content ul li {display: inline-block; padding-bottom: 1.5em; line-height:1.5; width: 100%}
  @media (min-width: 668px) { 
  h1{font-size: 30px}
 .home h2 span {display: block; margin-left: 2em; }
 .main-content-inner {
	padding: 3em 4em;
	
}
 
 .page-id-89 .entry-content ul {
	-webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count:2;
    -webkit-column-gap: 30px; /* Chrome, Safari, Opera */
    -moz-column-gap: 30px; /* Firefox */
    column-gap: 30px;
	-webkit-column-rule: 1px outset #777; /* Chrome, Safari, Opera */
    -moz-column-rule: 1px outset #777; /* Firefox */
    column-rule: 1px outset #777;}
}

  @media (min-width: 992px) { 
    
 .page-id-89 .entry-content ul {
	-webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
    -webkit-column-gap: 30px; /* Chrome, Safari, Opera */
    -moz-column-gap: 30px; /* Firefox */
    column-gap: 30px;
	
}
}

 @media (min-width: 1200px) { 
 h1 {font-size: 36px}
.home #content h2 {font-size: 30px }
 }

/* Woo */
body.woocommerce .woocommerce div.product .woocommerce-tabs ul.tabs.wc-tabs {display: none !important; height: 0 !important;}
.cartbutton {-moz-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
transform: scale(-1, 1);
margin: 1.2em 1em;}

.woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover {

background:#fb0 !important;

background-color:#fb0 !important;

color:white !important;

text-shadow: transparent !important;

box-shadow: none;

border-color:#ca0606 !important;

}

.woocommerce #content input.button:hover, .woocommerce #respond input#submit:hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover, .woocommerce-page #content input.button:hover, .woocommerce-page #respond input#submit:hover, .woocommerce-page a.button:hover, .woocommerce-page button.button:hover, .woocommerce-page input.button:hover {

background:#fb0 !important;

background-color:#fb0 !important;

color:white !important;

text-shadow: transparent !important;

box-shadow: none;

border-color:#ca0606 !important;

}

.woocommerce #content input.button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce-page #content input.button, .woocommerce-page #respond input#submit, .woocommerce-page a.button, .woocommerce-page button.button, .woocommerce-page input.button {

background: #fb0 !important;

color:white !important;

text-shadow: transparent !important;

border-color:#ca0606 !important;

}

.woocommerce #content input.button.alt:hover, .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover, .woocommerce-page #content input.button.alt:hover, .woocommerce-page #respond input#submit.alt:hover, .woocommerce-page a.button.alt:hover, .woocommerce-page button.button.alt:hover, .woocommerce-page input.button.alt:hover {

background: #fb0 !important;

box-shadow: none;

text-shadow: transparent !important;

color:white !important;

border-color:#ca0606 !important;

}

.woocommerce #content div.product .woocommerce-tabs .wc-tabs { display:none;}
div.summary.entry-summary p {margin-bottom: 2em;}

.woocommerce div.product p.price, .woocommerce div.product span.price,.woocommerce ul.products li.product .price {color: #5F688F}

.mouseovertext {color: #fff;}
.detailsinner {width: 100%; z-index:99}

/* email signup */
.site-footer-email {text-align: right; padding-top:.5em;}
div.formbox-editor-649617 {padding: 0 !important; background-color: transparent !important; width: 100% !important;}
.formbox-editor-649617 fieldset {float: left !important;}
div.formbox-title-649617 { float:left !important;  font-family: 'ff-basic-gothic-web-pro', helvetica !important; padding-top: .25em}
#colophon div.formbox-title-649617 {color: #fff !important; }
input.formbox-field-649617 {margin: 10px 1em !important; padding: .05em !important;  height: 26px !important}
button.formbox-button-649617 {padding: .15em 1em !important; height: 26px !important; background-color: #777 !important}


 /* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 
.translucent-sm {background-color: rgba(255,255,255,.7);}
.border-sm {border: 3px solid #fff;}
.bordertop-sm {border-top: 3px solid #fff;}
.borderleft-sm {border-left: 3px solid #fff;}
.borderbottom-sm {border-bottom: 3px solid #fff;}
.borderright-sm {border-right: 3px solid #fff;}
.cartbutton {margin: .4em 1em;}


#colophon .formbox-editor-649617 form {float: right;}
}


@media (min-width: 1200px) { 
.paddingtop2x-lg {padding-top: 40px;}
.paddingbottom2x-lg {padding-bottom: 40px;}
}

@media (min-width: 1500px) { 
.paddingtop3x-xlg {padding-top: 60px;}
.paddingbottom3x-xlg {padding-bottom: 60px;}
}

/*The code below will simply setup the price-title area to be hidden and have a background. Please note that uou will have to change the background and height to match your website color scheme and product height  but first load it as and then adjust                                                                                      
*/

.products .product .product-details {
    	position: absolute;
    	background: rgba(95, 104, 143, 0.95);
    	top: 0px;
    	left: 0px;
    	right: 0px;
    	bottom: 0px;
    	color: #fff !important;
    	padding: 1.618em;
    	text-align: center;
		border: 1px solid #fff;
   	opacity: 0;
   	filter: alpha(opacity=@opacity * 100);	
	-webkit-transition: all ease 0.4s;
	-moz-transition: all ease 0.4s;
   	-ms-transition: all ease 0.4s;
    	-o-transition: all ease 0.4s;
    	transition: all ease 0.4s;
  }

  
  
.woocommerce ul.products li.product .product-details h3,.woocommerce ul.products li.product .product-details .price {color: #fff;}
/* Show the that was setup above when the user hovers*/

  ul.products li.product:hover .product-details {
	filter: alpha(opacity=@opacity * 100);
	opacity: 1;
  }

  ul.products li.product:hover .product-details:before {
  content: '';
  position: absolute;
  top: 10px;
  left: 10px;
  right: 10px;
  bottom: 10px;
  background: rgba(95, 104, 143, 0.95);
  z-index: 2;
  border: 1px solid #fff;
}
.woocommerce ul.products li.product .product-details > a:first-child {z-index: 15;
left: 10%; 
right: 10%;
/* top: 5%; */
bottom: 52%;
position: absolute;}
.woocommerce ul.products li.product .product-details > a:last-child {z-index: 15;
left: 50%;
width: 130px;
margin-left:-65px;
top: 52%; 
position: absolute;}

  ul.products li.product a img:hover {
	opacity: 0.9;
  }
  
  
.woocommerce .menu-item-862 > a {color: #fb0 !important;}