/*
Theme Name:   CC by Biote (modifying Quark)
Theme URI:    http://biote.net
Description:  CC Theme
Template:     quark
Version:      1.0.0
License:      GNU General Public License v2 or later
License URI:  http://www.gnu.org/licenses/gpl-2.0.html
*/

/*  NOTE  - no need to import or enqueue Quark parent - Quark does it itself  */

/* STU added 17-1-2016  */
html {
    margin: 1px !important;   
}

body {
	background-color: #efefef;
	font-size: 18px;
	font-size: 1.13rem;
}

body, h1, h2, h3, h4, h5, h6, h1.page-title, .entry-header .entry-title, b, strong, em, .entry-header time, .entry-header address   {
	font-family: 'PT Sans',Helvetica,sans-serif;
}


#headercontainer, .banner-home, #spacecontainer, .site-header, .site-content, .site-content-home, .site-footer, .smallprint, .site-navigation, #FPB-container {
	max-width: 1040px;  	/*### reduced from 1200  */
}

.site-header, .banner-home {
    width: 100%;		/* reset to 100%  (from 90% in template default) */
}

.banner-home, #spacecontainer, .site-navigation, #headercontainer, #FPB-container {
	margin: 0 auto;
}

/* small bar at page-top  */
#topSpace {
	background:#666;
	height: 25px;
}

#banner-logo {
	vertical-align: middle;
}

h1.page-title {
    font-size: 1.5rem;
    line-height: 1.2;
	margin-left: 2rem;
}

h2 {
    font-size: 22px;
    font-size: 1.38rem;
	font-weight: bold;
    line-height: 26px;
    margin-bottom: 0.5rem;
	margin-top: 1.5rem;
}

h3 {
    font-size: 1.25rem;
    line-height: 1.3;		/*  */
}

h5 {
    font-size: 1.0rem;
    line-height: 1.3;		/* subheading for Our Team qualifications */
	color: #333;
	margin-bottom: 0.8rem;
}

.site-content, .site-content-home {
	background-color: #fff;
}

/* left margn of an article content item */
.site-content article, .site-content-home article {
	margin-left: 2.00rem;
}

/* increase sidebar left margin  */
.widget-area { 
	margin-top: 75px;
	margin-left: 30px;    	/* 24 + 16 = 40px gap between content and sidebar */
	margin-left: 1.9rem;	/* this value works in better with a .col margin of 0  */
	background-color: #efefef;	
}


/* bottom margin for each widget */
.widget-area .widget {
    margin-bottom: 0.65rem;
}

/* NAV  */
/* banner holds navigation menus  */
.banner-home {
	/*background-color: rgba(255,255,255,0.8);		 MENU background colour */
    min-height: 35px;
    padding: 0.1375rem 0;
	height: 95px;
}
.banner {
	background-color: rgba(255,255,255,1);		/* MENU background colour */
    min-height: 30px;
    padding: 0.1375rem 0;
	float:right;
	margin-top: 0px;
}
#nav-spacer {
	height: 1px;
	background-color: #efefef;
}
.logo {
	float: left;
	padding-top: 10px;
	padding-left: 15px;
	}
	
#navcon-home {
	z-index: 100;
	position: absolute;
	top: 0px;					/* move it down over pic */
	width:100%;					/* stretch it the full width of the main container */
	max-width:1040px;
	background-color: rgba(255,255,255,0.8);		/* MENU background colour */
}
#navcon {
	background-color: rgba(255,255,255);		/* MENU background colour for inner pages */
}
#navcontainer {
	width:100%;					/* stretch it the full width of the main container */
	max-width:1040px;
	background: #fff;
	height: 108px;
	background-color: rgba(255,255,255, 0.1);		/* MENU background colour */
}

#site-navigation {
	max-width: 1040px;
	float: right;
	padding-right: 2.5rem;
	margin-top: 11px;
}

/* reset the main nav div to left handed and not as hugely high  */
.main-navigation {
    clear: right;
    float: left;
    margin: 0 0 0;
    text-align: left;
}


.main-navigation li {
    float: left;
    margin: 0 0 0 0.9rem;
    position: relative;
}

.nav-menu-home {
    padding-top: 1.4rem;
	float: right;
}	

.nav-menu {
    padding-top: 1rem;
	float: right;
}	

.nav-menu, .nav-menu-home {
    font-family: 'PT Sans',Helvetica,sans-serif;
	font-weight: bold;
	font-size: 20px;
	font-size: 1.2rem;
}	
/* http://stackoverflow.com/questions/1734618/how-to-increase-the-gap-between-text-and-underlining-in-css
a {
    text-decoration: none;
    position: relative;
}
a:after {
    content: '';

    width: 100%;
    position: absolute;
    left: 0;
    bottom: 1px;

    border-width: 0 0 1px;
    border-style: solid;
}
*/

.main-small-navigation a, .main-navigation a {
    color: #000;
	text-transform: none;
}

 .main-navigation li:hover > a:after {

    content: '';
	color: #000;
    width: 100%;
    position: absolute;
    left: 0;
    bottom: -2px;
    border-width: 0 0 3px;
    border-style: solid;
}
.main-navigation li.current_page_item a:after, .main-navigation li.current-menu-item a {

    content: '';
	color: #000;
    width: 100%;
    left: 0;
    bottom: -2px;
    border-width: 0 0 3px;
    border-style: solid;
}

 .main-navigation li:hover > a {
	color: #000;
}

.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 .current_page_parent > a {
    color: #000;
	text-transform: none;
}

/* to stop text transform on submenu items when on current page */
.main-navigation ul ul .current-page-item > a {
    color: #000;
    text-transform: none;
	
}

/*
.main-navigation li:hover > a {
    text-decoration: underline;
	color: #000;
}
*/

/* submenu  */
.main-navigation ul ul {
    padding-bottom: 0.6rem;
	background-color: #666;
    line-height: 1.0rem;
	padding-left: 0.4rem;
    box-shadow: none;		/*  remove box shadow */
	width: 15rem;			/*  width of submenu box */
}

.main-navigation ul ul a {
    color: #fff;
	background-color: #666;
	text-decoration: none;
	text-transform: none;
    padding-top: 0.4rem;
    width: 14.5em;
}

.main-navigation ul ul a:hover{
    color: #fff;
	background-color: #666;
	text-decoration: none;
	text-transform: none;
}
.main-navigation ul ul a:visited{
	text-transform: none;
}

/* this affects sub sub menu items eg in About/item/subitem, but may not be necessary */
.sub-menu .menu-item li a {
    color: #fff;
    text-transform: none;
}

.main-navigation ul ul a, .main-small-navigation a {
    color: #fff;
	background-color: #666;
	text-transform: none;
	/*padding-top: 6px;
	padding-bottom: 6px;  */
}
/* END submenu  */
/* END NAV  */


/* Nav - Remote workshops  */
#workshops-link {
	float: right;
	margin-right: 40px;
}

.remote-link {
	color:#0074c8;
}

.innerpages {
	padding-top: 0px;
}


/* woo commerce - move add-to-cart button away from pice, on shortcode add_to_cart_id */

.woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #content input.button.alt, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt, .woocommerce-page #content input.button.alt, .woocommerce-page #respond input#submit.alt, .woocommerce-page a.button.alt, .woocommerce-page button.button.alt, .woocommerce-page input.button.alt {
	margin-left: 20px;
}

/* woocommerce page - indent as per other site pages  - woo does not use 'article' as a wrapper */
.woocommerce-products-header .page-description  {
	margin-left: 2.00rem;
}

 .woocommerce td.product-name {
	font-size: 18px;
	font-weight: 500;
}


/* woo commerce - hide product images div */
/*.woocommerce-product-gallery--without-images .product .images { display: none; }  hide images div by default */
.woocommerce .product.has-post-thumbnail .images { display: block; } /* show images div when thumbnail is present */
/*hide images div by default */
.woocommerce div.product div.images .woocommerce-product-gallery__image--placeholder, img.woocommerce-placeholder {
    display: none;
}

./* woo commerce - checkout - order received page table spacing  */
.woocommerce ul.order_details li {
    line-height: 2;
}

/* woocommerce title in cart etc  */
 div.product .summary .product_title{
font-size:1.3rem;
} 



/* Home page special text */
#home-blurb {
	background-color: #d9d6cd;
	color: #000;
	line-height: 25px;
	padding: 20px;
	padding-right: 20px;
	padding-bottom: 5px;
}


#home-blurb p {
	font-size: 1.2rem;
}


/* WP 'more' link */
.more-link {
    float: right;
	padding-bottom: 15px;
	line-height: 1px;	/* to lift it off bottom of box */
}

.spacer {
	height: 18px;
}

/*  container for the front page boxes  */
#FPB-container {
	max-width: 1040px;

}

.boxDiv {
	max-width: 307px;
	float: left;
}

.boxSpacer {
	width: 30px;
	float: left;
}

.boxTitle {
	font-size: 18px;
	font-weight: bold;
	color: #333;
	text-align: center;
	padding-bottom:14px;
	padding-top: 8px;
}

.boxContent {
	font-size: 16px;
	font-size: 1rem;
}

.boxReadMore {
	color: #0074c8;
	text-align: center;
	font-weight: bold;
	padding-bottom:10px;
	padding-top: 18px;	
}

.site-content-home .boxReadMore a {
	color: #0074c8;
}

/* ==========================================================================
   Twelve Column Grid
   ==========================================================================

   NOTE 	- each column plus margin  is 8.464%; each column is 6.866%, so each margin is 1.594%
   			at 1200 px this is 101.52 px each
			at 1040 px this is 87.984px  (ie 88px) (margin 16px col 71px))
   
 CHANGES to grid8 and grid4 to take in diff widths of content and sidebar  
   
.grid_12_of_12 { width: 100%; }
.grid_11_of_12 { width: 91.53%; }
.grid_10_of_12 { width: 83.06%; }
.grid_9_of_12  { width: 74.6%; }*/
.grid_8_of_12  { width: 65.0%; }		/* (644+30)/1040  */
/*.grid_7_of_12  { width: 57.66%; }
.grid_6_of_12  { width: 49.2%; }
.grid_5_of_12  { width: 40.73%; } */
.grid_4_of_12  { width: 32.47%; }		/* (337 + 30 + 29) /1040 - 1.6% (1.6% is col right margin I think) */
										/* OLD (280 + 30 + 40) /1040 - 1.6% (1.6% is col right margin I think) */
/*.grid_3_of_12  { width: 23.8%; }
.grid_2_of_12  { width: 15.33%; }
.grid_1_of_12  { width: 6.866%; } */

.col {
    margin: 0 0 0 0;		/* adjust right margin because it collapses messily with the default of 1.6%  */
}

/*  Banner logo and text */
.site-title h1 {
    margin-top: 2.8rem;
}

#headercontainer h1 {
	font-size: 2.9rem;
	color: #666;
}
#headercontainer h1 #logo-text {
	font-size: 2.3rem;
	color: #999;
	line-height: 1.05;
}
/*  END Banner logo and text */

/* front page statement */
.statement {
	background: #fff;
	padding-bottom: 20px;
}

#cc-statement {
   font-size: 26px;
   font-size: 1.6rem;   /*  */
   font-style: italic;
   text-align: center;
   color: #666;
   width: 85%;
   align: center;
   margin: 0 auto;
   padding-bottom: 2px;
}


/* front page statement */
.ad {
	background: #aaa;
	padding-bottom: 20px;
}

#cc-ad p {
   font-size: 26px;
   font-size: 1.6rem;   /*  */
   font-style: italic;
   text-align: center;
   color: #666;
   width: 85%;
   align: center;
   margin: 0 auto;
   padding-bottom: 2px;
}

p, ol, ul, dl, address {
	font-size: 18px;
	font-size: 1.13rem;
   line-height: 1.6;
}

/* stop indents on lists  */

.entry-content li, .comment-content li {
    margin: 0 0 0 0;
}

.entry-header .entry-title {
	font-size: 30px;
	font-size: 1.88rem;
	line-height: 1.1;
	font-weight: bold;
	padding-bottom: 14px;
}

.entry-header {
    margin-bottom: 1.0rem;
    margin-top: 1rem;
}

.site-content-home {
	color: #333;
	padding-top: 2px;		/*  to reduce top space on home page between statement and start of boxes  */
	padding-bottom: 4px;
}
.site-content {
	color: #333;
	line-height: 1.5rem;
	padding-top: 12px;		
}

.site-content-home img {
	padding-bottom: 20px;		/*  to reduce top space on home page between statement and start of boxes  */
}

.site-content a, .site-content-home a {
	color: #0074c8;
	text-decoration: none;
	font-size:
}

.site-content a:hover, .site-content a:active  {
	text-decoration: underline;
}

.entry-content p {

    margin-bottom: 1.15rem;
}
.entry-meta {
    padding-bottom: 0.8rem;
}

.site-content article {
    margin-bottom: 1.5rem;	/* for margin below text prior to map */
}

blockquote {
    border-left: 0;
}

blockquote p {
    font-size: 1.13em;
    margin-bottom: 0px;
}

.entry-content ol {
	padding: 12px;
	padding-left: 24px;
	padding-top: 2px;
}

.entry-content ul.nobullet {
    list-style: outside none none;
	padding: 12px;
	padding-left: 24px;
	padding-top: 2px;
}

.entry-content ul, .comment-content ul {
    list-style: outside none disc;
	padding: 12px;
	padding-left: 24px;
	padding-top: 2px;
}


/*  form */
/* radios and checkboxes vertically */
span.wpcf7-list-item { display: block; }


.hideActivity {
color: red;
	display: none;
}

/* hide the form lat and lng fields */
#i_lat, #i_lng {
	display:none;
	line-height:2px;
}

/* form styling */
.wpcf7 strong {
	font-size: 22px;
	font-size: 1.375rem;
}

/* form support text */
.formSupport {
	color: #909090;
}

#formInfo, #formPermission {
	background-color: #eceae6;
	padding: 12px;
	margin-bottom: 12px;
}

/* indent radios and checkboxes */
.wpcf7-list-item input[type="radio"], .wpcf7-list-item input[type="checkbox"], #mc4wp-checkbox input[type="checkbox"] {
	margin-left: 20px;
}

.wpcf7-textarea {
	max-width: 432px;
	max-width: 28.125rem;
}

div.wpcf7-mail-sent-ok {
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #468847;
}

/* Captcha  */

#captcha-container {
	width: 340px;
	height: 90px;
	border: 2px solid pink;
	padding: 10px;
	line-height: 28px;
	margin-bottom: 12px;
}
#captcha-input {
	float: right;
	margin-right: 33px;
}

#mc4wp-checkbox label {
	font-weight: normal;
}
/* END Captcha  */

/*  END form */

/* WIDGETS  */
.widget-area a {
	font-weight: bold;
}

.widget-area .WP_Editor_Widget h5 {
    font-size: 1.1rem;
    margin-bottom: 0.6125rem;
	margin-left: 8px;
	margin-right: 8px;
}

.widget-area .WP_Editor_Widget p {
	margin-left: 8px;
	margin-right: 8px;
}

aside .widget .WP_Editor_Widget {
	padding-bottom: 28px;
	margin-bottom: 28px;
}




/* END WIDGETS  */




/*  footer */

/*  need the !important because there are inline styles coming from the theme */

.site-footer, .site-footer a {
    background-color: #666 !important;
	color: #d0d0d0;
}

#footercontainer {
	height: 150px;
}

.footer-logo {
	margin-top: 30px;
	margin-left: 30px;
	margin-bottom: 30px;
}

.footer-left {
	float: left;
	margin-left: 30px;
	margin-bottom: 30px;
}

.footer-right {
	float: right;
	margin-rightt: 30px;
}

.row .smallprint {
	text-align: left;
}

.contact-text {
	width: 45%;
	color: #d0d0d0;
}
.contact-text a, .smallprint .contact-text a {
	color: #d0d0d0;
	text-decoration: none;
}

.contact-text a:hover, .contact-text a:active {
	text-decoration: underline;
}

.site-footer a {
    color: #d0d0d0;
	text-decoration: none;
}

.site-footer a:hover {
    color: #d0d0d0;
	text-decoration: underline;
}

#antipode-credit {
	color: #ddd;
	float: right;
	text-align: right;
	margin-right: 40px;
}
#antipode-credit a {
	color: #ddd;
	text-decoration: none;
}

#antipode-credit a:hover, #antipode-credit a:active {
	text-decoration: underline;
	color: #ddd;
}

/*  END  footer */


/*  Adjust the menu at less than 800px */
@media only screen and (max-width: 800px) {
/* 	.main-small-navigation ul li, .main-navigation ul li {
    	background-color: #ee3f61;		keep background colour 
	}*/
	
	.nav-menu {
		font-size: 14px;		/* at medium size reduce nav font  */
	}
	.main-navigation {
    	margin: 0 0 0 12px;		/* at medium size indent nav text  */
	}
	
	/* set menu button colour */
	.banner h1, .banner h2, .banner h3, .banner h4, .banner h5, .banner h6 {
    	color: #121212;
	}
	

}

/*  Adjust the menu at less than 520px */
@media only screen and (max-width: 520px) {
	/*.main-small-navigation ul li, .main-navigation ul li {
    	background-color: #ee3f61;		 keep background colour
	} */
	
	
	.col {
	    display: block;
	    float: none;
	    margin: 0 0 0 1.6%;
	}
	
	.boxSpacer {
		clear: left;		/* acts as a left hand margin on the 2nd and 3rd boxes  */
	}
	
	/* max the width so logo width is maximised  */
	.grid_8_of_12 {
    	width: 99%;
	}

	.site-content article, .home-latest {
    	margin-left: 1rem;			/* smaller margins on text */
		margin-right: 1rem;
	}

	/* max the width so search/follow width is maximised  */	
	.grid_4_of_12 {
    	width: 98%;
	}

	/*  slip the credit down to the left  */
	#antipode-credit {
	    margin-left: 40px;
		float: left;
	}

	/* lessen the left margin on widgets */
	.widget-area {
    	margin-left: 1rem;
	}

	/* set these fields so that they scale responsively */
	input[type="text"], input[type="email"], textarea {
    	width: 100%; 
	}
	
	/* make search box in sidebar shorter   */
	input[type="text"]#s {
    	width: 54%;
	}

	/* set menu button colour */
	.banner h1, .banner h2, .banner h3, .banner h4, .banner h5, .banner h6 {
    	color: #121212;
	}
	
	.main-navigation ul ul a, .main-small-navigation a {
    /*	background-color: #ee3f61; */
    	color: #fff;
    	text-transform: none;
		width: 100px;

	}
	.footer-left {
    	margin-left: 10px;  	/* decreased to stop link overflowing  */
	}
	.site-footer {
	    overflow: hidden; 	/* decreased to stop link overflowing  */
	}	
	
}


}