/*

Theme Name: Good Life

Theme URI: http://www.goodlifebikes.ca

Description: Good Life Wordpress Theme

Version: 1

Author: Maia Johnson

Author URI: http://www.maiajohnson.ca

License: GNU General Public License v2.0

License URI: http://www.gnu.org/licenses/gpl-2.0.html


1. document style

2. main content

3. header

4. navigation

5. title

6. sidebar

7. blocks

8. footer

9. contact

10. blog

11. WYSIWYG Editor Styles

-	Brad's Additions

-	Media Queries
					

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


@font-face {

    font-family: 'franchise';

    src: url('fonts/franchise/franchise.eot');

    src: url('fonts/franchise/franchise.eot?#iefix') format('embedded-opentype'),

         url('fonts/franchise/franchise.woff') format('woff'),

         url('fonts/franchise/franchise.ttf') format('truetype'),

         url('fonts/franchise/franchise.svg#franchise') format('svg');

    font-weight: normal;

    font-style: normal;

}

@font-face {

    font-family: 'geared_thin';

    src: url('fonts/gearedslab/gearedslab-light.eot');

    src: url('fonts/gearedslab/gearedslab-light.eot?#iefix') format('embedded-opentype'),

         url('fonts/gearedslab/gearedslab-light.woff') format('woff'),

         url('fonts/gearedslab/gearedslab-light.ttf') format('truetype'),

         url('fonts/gearedslab/gearedslab-light.svg#geared_thin') format('svg');

    font-weight: normal;

    font-style: normal;

}

@font-face {

    font-family: 'geared_extrabold';

    src: url('fonts/gearedslab/gearedslab-extrabold.eot');

    src: url('fonts/gearedslab/gearedslab-extrabold.eot?#iefix') format('embedded-opentype'),

         url('fonts/gearedslab/gearedslab-extrabold.woff') format('woff'),

         url('fonts/gearedslab/gearedslab-extrabold.ttf') format('truetype'),

         url('fonts/gearedslab/gearedslab-extrabold.svg#geared_extrabold') format('svg');

    font-weight: normal;

    font-style: normal;

}

@font-face {

    font-family: 'geared_regular';

    src: url('fonts/gearedslab/gearedslab.eot');

    src: url('fonts/gearedslab/gearedslab.eot?#iefix') format('embedded-opentype'),

         url('fonts/gearedslab/gearedslab.woff') format('woff'),

         url('fonts/gearedslab/gearedslab.ttf') format('truetype'),

         url('fonts/gearedslab/gearedslab.svg#geared_regular') format('svg');

    font-weight: normal;

    font-style: normal;

}

@font-face {

    font-family: 'ostrich-black';

    src: url('fonts/ostrich/Ostrich-Black.ttf');

    font-weight: normal;

    font-style: normal;

}

@font-face {

    font-family: 'ostrich-stripe';

    src: url('fonts/ostrich/Ostrich-Bold.ttf');

    font-weight: normal;

    font-style: normal;

}

@font-face {

    font-family: 'ostrich-light';

    src: url('fonts/ostrich/Ostrich-Light.ttf');

    font-weight: normal;

    font-style: normal;

}

@font-face {

    font-family: 'ostrich-regular';

    src: url('fonts/ostrich/Ostrich-Regular.ttf');

    font-weight: normal;

    font-style: normal;

}

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

								document style

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



html, body {

	height: 100%;

	width: 100%;

	margin:-5px 0 0 0;

}



body {

	display: block;

 	//background-image: url('../images/background.png');

	font-family: Helvetica, Arial, sans-serif;

font-size: 100%;
line-height: 1.4;

	color: #000;

	border-top: 7px solid #f5f5f5;

}

p{

	font-family: "Helvetica"

}

h1,h2,h3,h4,h5,h6 {

	margin-bottom: 15px;

	font-weight: normal;

	clear:both;

}

h1{

	font-size:60px;

	line-height: 44px;

	font-family: 'geared_regular'

}

h1.h2{

	font-size:32px;

	line-height: 44px;

	font-family: 'ostrich-regular';

	color: #000;

}

h2{

	font-size: 32px;

	line-height: 42px;

}

h1.title, h2.title {

	font-size:32px;

	line-height: 20px;

	font-weight: 300;

	font-family: "ostrich-regular"

}



a { 

	-webkit-transition:all 0.14s ease 0s; 

	-moz-transition:all 0.14s ease 0s; 

	-o-transition:all 0.14s ease 0s; 

	outline:none;

	text-decoration: underline;

	color: #000;

}

img {

	max-width:100%;

}

.align-center{

	text-align: center;

}

.divider{

	border-top: 2px solid #eee;

	float: left;

	width: 100%;

	margin: 40px 0;

}



@media screen and (min-width: 1px) and (max-width: 480px)

{

          .blocks{display: none;}

          #logo{margin: 0 auto; text-align:center}

	  /*.post{display:none}*/

	  .page-numbers{display:none}

	  .sidebar{min-width:100%}

	  .primary-menu ul {clear:both;}

}

.sticky{}

.gallery-caption{}

.bypostauthor{}



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

								main content

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



#wrapper{

	width: 100%;

}

#content {

	box-shadow: none;

	border-top: 2px solid #eee;

	padding: 0 0;

	background-color: transparent;

	margin: 0 10% 0 10%;

}

#main{

	float:left; 

	position:relative; 

	margin-right:4%;

	width: 100%; 

	margin-right: 0;

}	

.entry-content{

	width: 72%;

	float: left;

}





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

								header

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



#header-wrapper{

 width: 100%;

}

#header{

	width: 80%;

	padding: 0;

	margin: 0 auto;

	position:relative;

	border-bottom: none;

}

#logo {

	float: left;

	margin-left: 20px;

	height: 175px;

	width: 175px;

}



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

								navigation

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



.primary-menu {

	float: right;

	margin-top: 20px;

	padding: 0;

	font-family: 'ostrich-regular';

	font-size: 150px;

}

.primary-menu select {

	display:none;

}

.primary-menu select {

	background: none repeat scroll 0 0 #FFFFFF;

	border: 1px solid #eee;

    cursor: pointer;

    width: 100%;

	padding: 7px;

	margin: 38px 0;

	box-shadow:0 0 0 rgba();

	-moz-box-shadow:0 0 0 rgba();

	-webkit-box-shadow:0 0 0 rgba();

	color: #676767;

}

.primary-menu ul {

	margin: 0;

	padding: 30px 0;

	list-style-type: none;

	float: right;

}

.primary-menu ul li:hover { 

	visibility: inherit;

}

.primary-menu ul li {

	position: relative;

	display: inline;

	float: left;

	margin: 0 0 0 -1px;

}

.primary-menu ul li:last-child {

    background: none;

}

.primary-menu ul li a {

	text-decoration: none;

	text-transform: uppercase;

	font-size: 26px;

	color: #000;

	padding: 25px 15px;

	display: block;

	float: left;

}

.primary-menu ul li a:hover, #primary-menu ul li.sfHover a {

	color: #999;

}



.primary-menu ul li a.logo {

	display: none;

	margin: 0;

}

.primary-menu ul ul {

	position: absolute;

	top: -9999em;

	width: 125px;

    background: #FFF; 

	z-index: 9999;

}

.primary-menu ul ul li { 

	width: 100%; 

}

.primary-menu ul li:hover ul {

	left: 0;

	top: 51px;

}

.primary-menu ul li:hover li ul { 

	top: -9999em; 

}

.primary-menu ul li li:hover ul {

	left: 125px;

	top: 0;

}

.primary-menu ul ul {

	padding: 0;

	margin: 0;

}

.primary-menu ul ul li {

	margin: 0;

	background: none;

}

.primary-menu ul ul li:last-child {

	border-bottom: none;

}

.primary-menu ul ul li a {

	font-size: 20px;

	padding: 12px 15px;

}

.primary-menu ul li:hover ul li a { 

    color: #000;    

}

.primary-menu ul li:hover ul li a:hover { 

    color: #999; 

}





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

								title

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



#title-section{

	overflow: hidden;

	margin: 0 0 30px 0;

	padding:15px 0;

	border-bottom: 1px dashed #999;

	border-top: 2px solid #999;

	clear:both;

}

#title-section h1.title {

	font-family: 'geared_thin';

	font-size:20px;

	line-height: 28px;

	font-weight: 700;

	text-transform: uppercase;

	display: block;

	margin: 0;

}

#title-section p {

	font-weight: 300;

	font-size: 22px;

	line-height: 0px;

	text-transform: uppercase;

}







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

								sidebar

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



.sidebar {

width: 20%;

float: left;

padding: 0;

border: 1px dashed #999;

background-color: rgba(255, 255, 255, 0.5);

list-style: none;

margin: 5px;

text-align:center;

}



.sidebar p{

	text-align: center;

}



.sidebar ul {

margin: 0;

padding: 0;

list-style: none;

}



.sidebar ul li {

margin: 0;

padding: 0;

list-style: none;

text-align: center;

}



.sidebar ul li h2 {

     list-style-type: none;

}



.widgettitle {

	font-family: 'ostrich-regular';

	font-size:32px;

	text-align:center

}



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

								blocks

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



.blocks {

	list-style: none;

	margin: 0 0 20px 0;

	padding: 0px;

	float: left;

	max-height:150px;

	overflow:hidden;

}

.blocks li {

    float: left;

	border-bottom: 1px dashed #999;

	border-right: 1px dashed #999;

}

.blocks.four li {

    width: 24%;

}

.blocks li.last {

	border-right: none;

}

.blocks li.last-row {

	border-bottom: none;

}

.blocks img {

	display: block;

	margin: 0 auto;

}

.blocks div {

	padding: 15px 10px;

	text-align: center;

}

.blocks div a {

	color: #676767;

	text-decoration: none;

}

.blocks div:hover, .blocks div:hover a {

	color: #FFFFFF;

	background-color: rgba(20, 97, 31, 0.5);

}

.blocks div:hover a {

	background-color:#444; 

}

.blocks img, .blocks h2 {

	display: block;

	margin-bottom: 20px;

}

.blocks h2 {

	font-size:15px;

	line-height: 20px;

	font-weight: 700;

	text-transform: uppercase;

}

.filler{

	visibility:hidden;

	}



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

								footer

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



.footer {

	width: 100%;

	float: left;

	color: #999;

	background-color: #444;

	font-size: 11px;

	border-bottom: 7px solid #333;

}

.footer a {

	color: #ccc;

	font-weight: bold;

}

.footer a:hover {

}

.footer h3 {

	text-transform: uppercase;

	font-size: 11px;

	font-weight: 400;

	color: #fff;

	display: block;

}

.footer ul {

	list-style-type: none;

	padding: 0;

	margin: 0;

}

.footer ul li {

	margin-bottom:15px;

}

.footer ul li .date {

	font: normal 11px/20px Helvetica,Arial,sans-serif;

    display: block;

}

.footer-content {

	width: 80%;

	margin: 0 auto;

}

.footer-bottom, .footer-top {

	padding: 35px 0;

	overflow: hidden;

	position: relative;

}

.footer-bottom {

	background-color: #333;

	font-size: 11px;

	/*border-top: 1px dotted #777;*/

	padding: 25px 25px 18px 25px;

}

.footer-bottom p {

	margin-bottom: 0;

}



#footer1, #footer2, #footer3{

	float: left;

	width:20%;

}



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

								contact

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









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

								blog

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



#blog-content {

	width: 700px;

	float: left;

}

#sidebar {

	width: 220px;

	float: right;

    font: normal 12px/17px Helvetica, Arial, sans-serif;

}



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

								posts

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

.post {

	border-bottom: 1px solid #eee;

	margin: 0 0 40px 0;

	padding: 0 0 40px 0;

	overflow: hidden;

}

.post:last-child {

	border-bottom: none;

	margin: 0;

	padding: 0;

}





.post-info {

	float: left;

	width: 100px;

}

.post-info div {

	width: 65px;

	z-index: 9;

	text-align: center;

	text-transform: uppercase;

	font-weight: bold;



}

.post-info div.date {

	color: #fff;

	padding: 8px 0;

	background-color: green;



}

.post-info div.date span {

    display: block;

}

.post-info div.date span.day {

	font-size: 27px;

	letter-spacing: 0px;

	margin-top: 2px;

	line-height: 33px;

}

.post-info div.date span.month {

    font-size: 13px;

    line-height: 11px;

}

.post-info div.comments {

	height: 30px;

	width: 65px;

}

.post-info div.comments a{

	text-decoration: none;

	color: #bbb;

	display: block;

	cursor:pointer;

	background-color: #444;

	font-size: 9px;

	padding: 6px;

}

.post-info div.comments a:hover {

	color: #fff;

}

.post-info div.comments a span {

	font-size: 22px;

	letter-spacing: 0px;

	margin-top: 2px;

	line-height: 27px;

}





.post-content {

	max-width: 600px;

	float: left;

}

.post-media, .post-title, .post-meta {

	display: block;

}

.post-title h2.title{

	margin: 0;

}

.post-title h2.title, .post-title h2.title a {

	color: #676767;

	font-size:22px;

	line-height: 28px;

	font-weight: 700;

	text-transform: uppercase;

	word-spacing: 5px;

}

.post h3.title{

	margin-bottom: 0;

	line-height: 27px;

}

.post-media {

    margin-bottom: 20px;

}

.post-meta ul {

	margin: 5px 0 15px 0;

	padding: 0;

	list-style: none;

	font-size: 11px;

	text-transform: uppercase;

}

.post-meta li {

	margin: 0;

	display: inline;

}

.post-meta span {

	color: #aaa;

}

.post-meta a {

    color: #fff;

    display: inline-block;

    font-weight: bold;

}

.post-meta a:hover {

}

.more{

	text-decoration: none;

	color: green;



}

.arrow{

	font-size: 16px;

}





.widget {

	margin-bottom: 0px;

	float: left;

	width: 100%;

	text-align: left;

}

.widget h3.title {

	font-size:15px;

	line-height: 20px;

	font-weight: 700;

	text-transform: uppercase;

	display: block;

	padding: 0 0 5px 0;

	margin: 0 0 5px 0;

}

.widget ul {

	padding: 0;

	margin: 0;

	list-style-type:none;

    color: #aaa;

}

.widget ul li {

	padding: 0;

	margin: 0 0 15px 0;

	float: left;

	width: 100%;

}

.widget ul li a {

	color: #676767;

	font-weight: bold;

	text-decoration: none;

}

.widget a:hover {

	color: #444;

}

.widget ul li span.date {

	color: #aaa;

	display: block;

	font-size: 11px;

	text-transform: uppercase;

}

.widget.widget_archive li {

	float: left;

	margin-bottom: 5px;

}



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

				WordPress WYSIWYG Editor Styles

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



.entry-content img {

	margin: 0 0 1.5em 0;

	}

.alignleft, img.alignleft {

	margin-right: 1.5em;

	display: inline;

	float: left;

	}

.alignright, img.alignright {

	margin-left: 1.5em;

	display: inline;

	float: right;

	}

.aligncenter, img.aligncenter {

	margin-right: auto;

	margin-left: auto;

	display: block;

	clear: both;

	}

.alignnone, img.alignnone {

	/* not sure about this one */

	}

.wp-caption {

	margin-bottom: 1.5em;

	text-align: center;

	padding-top: 5px;

	}

.wp-caption img {

	border: 0 none;

	padding: 0;

	margin: 0;

	}

.wp-caption p.wp-caption-text {

	line-height: 1.5;

	font-size: 10px;

	margin: 0;

	}

.wp-smiley {

	margin: 0 !important;

	max-height: 1em;

	}

blockquote.left {

	margin-right: 20px;

	text-align: right;

	margin-left: 0;

	width: 33%;

	float: left;

	}

blockquote.right {

	margin-left: 20px;

	text-align: left;

	margin-right: 0;

	width: 33%;

	float: right;

	}

.page-numbers{

	list-style:none;

	display:inline;

	position:relative;

	float:left;

}

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

				Brad's additions

---------------------------------------------------------------------*/
body{
	background-color: #79d1b3;
}

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

/* Bike Gallery Page */
.sb-gallery section{
	overflow: hidden;
	padding-bottom: 1em;
	border-bottom: 1px dashed #555;
	margin-bottom: 1em;
}

.sb-left-col{
	float: left;
	width: 50%;
}

.sb-left-col img{
	max-width: 95%;
	display: block;
	margin: 0 auto;
	padding-right: 1em;
}

.sb-right-col{
	float: right;
	width: 50%;
}

.sb-gallery-head{
	margin: 2em 0;
	border-bottom: 2px solid #999;
}

.sb-gallery-head h1{
	text-align: center;
	margin: 0 0 .75em 0;
}

.salebike h4{
	margin: 0;
	font-size: 2em;
}

.salebike a h4:hover{
	color: #555;
}

/* joints_page_navi styles */
.page-navigation{
	text-align: center;
	margin-top: 2em;
}

ul.pagination{
	list-style: none;
}

ul.pagination li{
	font-size: 1.5em;
	display: inline;
	margin-right: 1%;
}

ul.pagination li.current{
	color: #555;
}

ul.pagination li a{
	text-decoration: none;
}

ul.pagination li a:hover {
	color: #555;
}

/* Single bike post page */
.sb-main{
	width: 75%;
	float: left;
	margin-bottom: 2rem;
}

.sb-main section{
	padding-right: 2%;
}

.sb-main .gallery{
	margin-top: 2em;
}


/* Sidebar styles */
.sb-sidebar{
	width: 25%;
	float: right;
	margin-bottom: 2em;
}

#sidebar-salebike{
	border: 1px solid black;
	padding: 2%;
}

.sb-tax{

}

#searchform{
	margin-bottom: 2em;
}

.screen-reader-text{
	width: 100%;
	display: block;
}

#s{
	width: 90%;
	margin-bottom: .5em;
}

.sb-sidebar ul{
	padding-left: 0;
	padding: 1%;
}

.sb-sidebar li{
	list-style: none;
	margin-bottom: 1em;
	border-bottom: 1px solid #333;
}

.sb-sidebar a{
	text-decoration: none;
}

.sb-sidebar a:hover{
	color: #555;
}

.sb-sidebar li a img{
	margin: 1em auto;
	display: block;
	border-radius: 50%;
}

a.sb-link{
	text-align: center;
	border: 2px solid black;
	margin: 1rem;
	display: block;
	padding: .5em;
}

a.sb-link:hover{
	border: 2px solid #555;
}

/* Galleries */
.gallery-item {
    display: inline-block;
    text-align: left;
    vertical-align: top;
    margin: 0 0 1.5em;
}

.gallery-icon{
    padding: 0 1em 0 0;
}

.gallery-columns-3 .gallery-item {
    max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
    max-width: 25%;
}

.gallery-columns-5 .gallery-item {
    max-width: 20%;
}

.gallery-columns-6 .gallery-item {
    max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
    max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
    max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
    max-width: 11.11%;
}

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

				Media Queries

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

@media screen and (min-width: 501px) and (max-width: 800px){
	.sb-main{
		width: 60%;
	}

	.sb-sidebar{
		width: 33%;
	}
}

@media screen and (min-width: 1px) and (max-width: 500px){
	.sb-main{
		width: 100%;
	}

	.sb-sidebar{
		width: 100%;
	}

	.sb-left-col, .sb-right-col{
		float: none;
		width: 100%;
	}

	.gallery-item {
	    display: block;
	    text-align: center;
	    vertical-align: top;
	    margin: 0 0 1.5em;
	    max-width: 100% !important;
	}

	.gallery-icon{
	    padding: 0;
	}
}