/*
	Theme Name: Focalpoint BMX Magazine
	Theme URI: http://www.focalpointbmx.com
	Description: Focalpoint BMX Magazine 2010.
	Version: 1.0
	Author: Paul Jaques
	Author URI: http://www.pauljaques.net/
*/

@charset "UTF-8";
/** GLOBAL **/
body{
	color: #888;
    font-size: 12px;
    font-family: Arial,Helvetica,sans-serif;
    
    background-color: #111;
    background-image: url(/wordpress/wp-content/themes/fp/img/bg.png);
    background-repeat: repeat;
}

/** MAIN **/
#bodywrap{
	margin: 0 auto 30px;
	
	clear: both;
	width: 1060px;
}

#header{
	margin: 0 auto;
	padding: 15px;
	
	width: 1030px;
	height: 120px;
	
	background-color: #f1f2f1;
}
	#logo{
		float: left;
		height: 120px;
	}
	#logo:active{
		position: relative;
		top: 1px;
	}
	#social{
		position: relative;
		float: right;
	}
	#social li{
		margin-right: 10px;
		float: left;
	}
	#social li:last-child, #social li.last{
		margin-right: 0;
	}
	#social li span{
		display: none;
	}
	#social li:hover>span{
		position: absolute;
		bottom: -18px;
		right: 0px;
		
		display: block;
		
		color: #999;
		font-size: 10px;
		text-transform: uppercase;
		
		white-space: nowrap;
	}
	#social li a{
		margin: 0;
		float: left;
		width: 32px;
		height: 32px;
		
		background-image: url(/wordpress/wp-content/themes/fp/img/icons/social.png);
		background-repeat: no-repeat;
	}
	
	#social li a.facebook{background-position: 0px 0px;}
	#social li a.twitter{background-position: -32px 0px;}
	#social li a.myspace{background-position: -64px 0px;}
	#social li a.rss{background-position: -96px 0px;}
	
	#social li a.facebook:hover{background-position: 0px -32px;}
	#social li a.twitter:hover{background-position: -32px -32px;}
	#social li a.myspace:hover{background-position: -64px -32px;}
	#social li a.rss:hover{background-position: -96px -32px;}
	
	
#navwrap{
	margin: 0 auto;
	
	clear: both;
    width: 1060px;
}
#nav{	
	clear: both;
	float: left;
    width: 1060px;
    
    border-top: 1px solid #eee;
    
    background-color: #f1f2f1;
}
    #nav li{
    	display: inline;
    }
	#nav, #nav ul, #nav li{
		list-style: none;
	}	
	#nav li{	
		position: relative;
			
		float: left;
		display: inline;
	}	
	#nav li:last-child{
		border: none;
	}
	#nav>li span{
		margin: 0 10px 0 0;
		float: right;
	}	
	#nav ul{
		padding: 5px;
		
		position: absolute;
		left: -1px;
		top: 27px;
		
		width: 180px;	
		display: none;
		z-index: 1000 !important;
	}
	#nav ul>li{
		width: 180px;
		height: 25px;
		display: block;
		
		line-height: 25px;
	}
		#nav ul>li.last{border-bottom: none;}
	
	#nav ul li>ul{
		position: absolute;
		top: -5px;
		left: 180px;
	}

#nav a, #nav a:visited{
	padding: 15px;
	
	float: left;
	display: block;
	
	color: #999;
	font-size: 11px;
	font-weight: 900;
	
	text-transform: uppercase;
	text-shadow: 1px 1px 1px #fff;
	
	border-left: 1px solid #f9f9f9;
	border-right: 1px solid #eee;
}
#nav a:hover{
	color: #444;
}
#nav li:first-child a{
	border-left: none;
}
#nav li:last-child a{
	border-right: none;
}
#nav li.shop{
	float: right;
}
#nav li.shop a{
    color: #222;
    border-left: none;
}

#promo{
	margin: 15px 0;
	
	clear: both;
	float: left;
	width: 1060px;
	min-height: 300px;
	
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	
	background-color: #222;
}
#promo img{
	width: 1060px;
}
#feature{
	margin: 15px 0;
	padding: 30px 0;
	
	clear: both;
	float: left;
	width: 1060px;
}
	#feature h2{
		margin: 0;
	
		color: #555;
		font-size: 60px;
		font-weight: normal;
		font-family: 'Yanone Kaffeesatz';
		
		text-shadow: 1px 1px 1px #000;
		letter-spacing: -1px;
	}
	#feature a{
		margin: 30px 0 0;
	
		clear: left;
		float: left;
		
		color: #f1f2f1!important;
		font-size: 14px;
		font-weight: normal;
		font-family: Georgia;
		font-style: oblique;
	}
	#feature a:hover{
		color: #999!important;
	}

#container{
	padding: 15px;
	
	position: relative;
	
	float: left;
	width: 1030px;
	
	background-color: #f1f2f1;
}

#maincolumn{
	padding-right: 30px;
	
	float: left;
	width: 640px;
}
	#maincolumn.feature{
		padding: 0;
		width: 1030px;
	}
	#maincolumn.feature #sidecolumn{
		margin-top: 30px;
	}

#sidecolumn{
	float: right;
	width: 360px;
}
	
.aside{
	margin-bottom: 15px;
	
	clear: both;
	float: left;
	width: 360px;
}
.aside.featuresupporter{
	padding: 15px;
	
	width: 330px;
	
	text-align: center;
	
	background-color: #eee;
}
	.aside.featuresupporter img{
		margin: 0 auto 15px;
		
		width: 150px;
		display: block;
		
		border: 1px solid #fff;
	}
	.aside.featuresupporter p{
		font-size: 11px;
	}
.aside.contribute{}
    .aside.contribute p{
        padding: 10px;
        
        border: 1px dashed #ccc;
        
        background-color: #fff;
    }
    .aside.contribute a{
        text-decoration: underline;
    }
.aside span{
	width: 100%;
	height: 150px;
	
	display: block;
	
	color: #999;
	font-size: 10px;
	
	line-height: 150px;
	
	text-align: center;
	text-transform: uppercase;
	text-shadow: 1px 1px 1px #fff;
	
	background-color: #ddd;
}
.aside.tags a:link, .aside.tags a:visited{
	color: #CCC;
}
.aside.tags a:hover{
	color: #999;
}
.search form{}
	.search input[name="s"]{
		padding: 10px;
		
		width: 340px;
		
		color: #f1f2f1;
		font-weight: 900;
		
		border: none;
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff;
		
		background-color: #444;
		background-image: url(/wordpress/wp-content/themes/fp/img/icons/search.png);
		background-repeat: no-repeat;
		background-position: 330px 5px;
	}
	.search form input:focus{
		outline: none;
	}
	.search input[name="s"]:focus{
		background-image: none!important;
	}
.supporters a{
	margin-bottom: 5px;
	
	float: left;
}
	.supporters a:last-child{
		margin-bottom: 0;
	}

#thefamily, #contents, #themagazine{
    float: left;
    width: 260px;
}
    #thefamily li, #contents li, #themagazine li{
        border-top: 1px solid #ddd;
        border-bottom: 1px solid #fff;
    }
    #thefamily li:first-child, #contents li:first-child, #themagazine li:first-child{
        border: none;
    }
    #thefamily li:last-child, #contents li:last-child, #themagazine li:last-child{
        border-bottom: none;
    }
    #thefamily li a, #contents li a, #themagazine li a{
        padding: 10px;
        
        display: block;
        
        font-weight: normal;
        
        border-right: 1px solid #ddd;
        
        background-color: #eee;
    }
    #thefamily li.current a, #contents li.current a, #themagazine li.current a{
        font-weight: 900;
        
        border-right: none;
        
        background-image: url(/wordpress/wp-content/themes/fp/img/icons/right.png);
        background-position: right;
        background-repeat: no-repeat;
    }
    .familylink{
        margin: -25px 0 30px 15px;
        
        display: block;
    }
    
#profile, #articles{
    padding: 15px;
    
    float: right;
    width: 740px;
}
    #profile .tab, #articles .tab{
        display: none;
        
        clear: both;
        width: 740px;
    }
    #profile .tab.current, #articles .tab.current{
        display: block;
    }

#footer{
	padding: 15px 0;
	
	clear: both;
	float: left;
	width: 100%;
}
	#footer li{
		margin-right: 15px;
		
		float: left;
		
		color: #444;
		font-size: 9px;
		font-family: Verdana;
		text-transform: uppercase;
		
		white-space: nowrap;
	}

/** LINKS **/
a{
	-o-transition-duration: .3s;
	-o-transition-property: color, background-color, border, text-indent;
	
	-webkit-transition-duration: .3s;
	-webkit-transition-property: color, background-color, border, text-indent;	
}

a:link, a:visited{
	color: #444;
	font-weight: 900;
	text-decoration: none;
}
a:hover{
	color: #999;
}

/** TYPOG **/
#maincolumn p, #profile p, #articles p{
	margin-bottom: 20px;
	
	line-height: 20px;
	text-shadow: 1px 1px 1px #fff;
}
.aside p{
    margin-bottom: 20px;
    
    text-align: center;
    line-height: 20px;
}
.title{
	margin-bottom: 5px!important;
	
	color: #222;
	font-weight: 900;
}
.entry strong{
	color: #222;
}

/** HEADINGS **/
h1{
}
h2{
	margin: 0 0 30px;
	
	font-size: 20px;
	line-height: 28px;
	text-shadow: 1px 1px 1px #fff;
}
h2 a{
	font-weight: normal!important;
}
h3{
	margin-bottom: 5px;
	padding: 10px 5px;
	
	color: #444;
	font-weight: 900;
	font-size: 12px;
	
	text-transform: uppercase;	
	text-shadow: 1px 1px 1px #fff;
	
	background-position: 335px 8px;
	background-repeat: no-repeat;
	background-color: #eee;
}
h4{
	margin-bottom: 10px;
	
	color: #444;
	font-size: 12px;
	font-weight: 900;
}

/** POST **/
.post{
	margin-bottom: 45px;
	
	float: left;
	
	border-bottom: 1px solid #ddd;
}
	.feature .post{
		margin-top: 30px;
	}
.info{
	padding-top: 5px;
	
	float: left;
	width: 99px;
}
#article .info{
	margin-bottom: 15px;
}
	.info span{
		padding: 15px;
	
		display: block;
		
		color: #999;
		font-size: 10px;
		
		text-align: center;		
		text-transform: uppercase;
		text-shadow: 1px 1px 1px #fff;
		
		line-height: 18px;
		
		border-top: 1px solid #fff;
		border-bottom: 1px solid #ddd;
	}
	.info span:first-child{
		padding-top: 0px;
		border-top: none;
	}
	.info span:last-child{
		padding-top: 15px;
		border-top: 1px solid #fff;
	}
	.info span:hover{
		background-color: #eee;
	}
	.info span strong{
		color: #222;
	}
	.info iframe{
		margin-top: 15px;
	}
	
.entry{
	padding-left: 15px;
	
	float: right;
	width: 525px;
	
	border-left: 1px solid #ddd;
}
.entry img{
	max-width: 100%;
}
.entry object, .entry embed{
	margin-bottom: 15px;
	
	float: left;
	width: 100%;
}

.post-categories{
	padding: 15px 0;
	
	float: left;
	width: 100%;
}
	.post-categories li a{
		margin: 0 0 5px 0;
		padding: 2px 8px;
		
		clear: both;
		float: left;
		display: block;
		
		color: #656565;
		font-size: 9px;
		font-weight: normal;
		
		text-transform: uppercase;
		text-shadow: 1px 1px 1px #fff;
		
		border-radius: 10px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		
		background-color: #ddd;
	}
	
	.post-categories li a:hover{
		background-color: #ccc;
	}
	.post-categories li a:active{
		position: relative;
		top: 1px;
	}
	
/** VIDEOS **/
#videothumbs{
    float: left;
    width: 280px;
    height: 435px;
    
    overflow: auto;
}

    #videothumbs li{
        margin-bottom: 15px;
        padding-bottom: 5px;
        
        float: left;
        width: 250px;
        
        border-bottom: 1px dotted #ccc;
    }
    #videothumbs img{
        float: left;
        width: 250px;
    }
    #videothumbs p{
        margin-top: 5px;
        
        float: left;
        
        font-size: 10px;
        font-weight: normal;
        text-transform: uppercase;
        
        line-height: 14px;
    }
#embed{
    padding: 15px;
    
    float: right;   
    width: 700px;
    height: 400px;
    
    background-color: #CCC;
}

/** DEFERO **/
.defero #sidecolumn div{
	margin-top: 240px;
	padding-bottom: 15px;
}
.defero #sidecolumn div p{
	margin-bottom: 20px;
	
	color: #666;
	font-size: 9px;
	font-family: Verdana;
	
	text-align: center;
	text-transform: uppercase;
	
	line-height: 20px;
}

/** ARCHIVES/CATEGORIES/POPULAR **/
#archives, #categories{
	margin-right: 5px;
	
	float: left;
	width: 175px;
}
	#archives li, #categories li, #random li{
		margin-bottom: 6px;
	}
	#archives li:first-child, #categories li:first-child{
		margin-bottom: 5px;
		padding: 10px 5px;
		
		color: #444;
		font-weight: 900;
		font-size: 12px;
		
		text-transform: uppercase;	
		text-shadow: 1px 1px 1px #fff;
		
		background-position: 335px 8px;
		background-repeat: no-repeat;
		background-color: #eee;
	}
	#archives li a, #categories li a{
		margin-left: 5px;
		
		display: block;
	
		font-size: 10px;
		font-weight: normal;
		
		text-transform: uppercase;
	}
	#archives li a:hover, #categories li a:hover, #random li a:hover{
		text-indent: 5px;
	}
#random{
	float: left;
	width: 100%;
}
	#random li a{
		padding: 6px;
		
		float: left;
		width: 350px;
		
		font-size: 10px;
		font-weight: normal;
		
		text-transform: uppercase;
		text-shadow: 1px 1px 1px #fff;
		
		border-bottom: 1px dashed #ccc;
	}
	
/** SUPPORTERS **/
#supporters li{
	margin-right: 5px;
	
	float: left;
	width: 200px;
}
#supporters li.adrotate_widget{
	list-style: none!important;
}
	#supporters li a{
		padding: 5px;
		
		float: left;
		width: 190px;
		
		font-size: 10px;
		font-weight: normal;
		
		text-transform: uppercase;
		
		border-bottom: 1px dotted #f1f2f1;
	}
	#supporters li a:hover{
		color: #999;
	}

.suppliers{
    margin-bottom: 30px;
    
    float: left;
    width: 740px;
}
    .suppliers li{
        padding: 5px;
        
        float: left;
        width: 360px;
        
        font-size: 10px;
        font-weight: normal;
        
        text-transform: uppercase;
        
        border-bottom: 1px dotted #f1f2f1;
    }

.articlegrid li{
	margin: 0 5px 30px 0;
		
	float: left;
	width: 210px;
	display: block;
}
.articlegrid li:last-child, .articlegrid li.last{
	margin-right: 0!important;
}
	.articlegrid li img{
		float: left;
		width: 210px;
		height: 150px;
	}
	.articlegrid li span{
		padding: 5px;
		
		float: left;	
		width: 200px;
		
		color: #f1f2f1;
		font-weight: 900;
		
		border-top: 1px solid #000;
		
		background-color: #222;
	}
	.articlegrid li p{
		margin-bottom: 0!important;
	
		font-size: 10px;
		font-weight: 900;
	
		text-transform: uppercase;
		text-align: center;
		text-shadow: none!important;
		
		line-height: 16px;
	}
.articlegrid_subnav ul{
	margin-top: 12px;
	padding: 15px 15px 7px;
	
	clear: both;
	float: left;
	width: 608px!important;
	display: block;
	
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	
	background-color: #ccc;
}
.articlegrid_subnav li{
	margin-bottom: 8px;
	
	float: left;
	width: 200px;
	display: block;
}
.articlegrid_subnav li a{
	text-shadow: 1px 1px 1px #fff;
}
.articlegrid_subnav{
	margin-top: -15px;
	margin-bottom: 60px;

	clear: both;
	float: left;
	width: 100%;
	
	background-image: url(/wordpress/wp-content/themes/fp/img/arrow_up.png);
	background-repeat: no-repeat;
}
#featured{background-position: 90px 0;}
#bikechecks{background-position: 325px 0;}
#underground{background-position: 520px 0;}

#top5s{background-position: 90px 0;}
#reviews{background-position: 325px 0;}
#interviews{background-position: 520px 0;}

#local{background-position: 90px 0;}
#jamscomps{background-position: 325px 0;}
#phototech{background-position: 520px 0;}

.coin-slider { overflow: hidden; zoom: 1; position: relative; }
.cs-coin-slider{
	background-repeat: no-repeat;
}
#cs-coin-slider11{
	
}

.coin-slider a{ text-decoration: none; outline: none; border: none; }

.cs-buttons { font-size: 0px; padding: 10px; float: left; }
.cs-buttons a { margin-left: 5px; height: 10px; width: 10px; float: left; border: 1px solid #B8C4CF; color: #B8C4CF; text-indent: -1000px; }
.cs-active { background-color: #444; color: #FFFFFF; }

.cs-title { width: 545px; padding: 10px; background-color: #000000; color: #FFFFFF; }

.cs-prev, 
.cs-next { background-color: #000000; color: #FFFFFF; padding: 0px 10px; display:none!important;}

#listed a{
	padding: 10px;

	display: block;

	font-size: 14px;
	font-weight: normal;
	
	border-bottom: 1px solid #fff;
}
#listed a:hover{
	border-bottom: 1px solid #ccc;
}

/** PAGE NAVI **/
.wp-pagenavi{
	margin: 15px 0;
	clear: both;
}
.wp-pagenavi a, .wp-pagenavi span {
	margin: 2px;
	padding: 5px 10px;
		
	font-weight: 900;
	font-size: 13px;	
	text-decoration: none;
		
	background-color: #F1F2F1;
}
	.wp-pagenavi a:hover{
		color: #222;
		background-color: #CCC;
	}

.wp-pagenavi a:hover, .wp-pagenavi span.current {
	border-color: #000;
}

.wp-pagenavi span.current {
	font-weight: bold;
}

/** DESKTOPS **/
#desktops{
	font-size: 12px;
}
	#desktops li{
		margin: 0 5px 30px 0;
		float: left;
	}
	#desktops li.end{
		margin-right: 0;
	}
		#desktops li img{
			margin-bottom: 10px;
		}
		#desktops li a{
			margin-bottom: 8px;
			
			display: block;
			
			font-weight: normal;
		}