/* IMPORT RESET */
@import url("/assets/css/reset.css");

/* IMPORT 12 COLUMN RESPONSIVE GS */
@import url("/assets/css/responsive.gs.12col.css");


/*	PAGE STYLES */
body {
	background: url('/assets/images/SFCOM_WEBSITE_EARTH_BACKGROUND_v3.jpg') no-repeat fixed center top #333;
	font : 100%/1.5 Roboto, 'lucida sans unicode', 'lucida grande', 'Trebuchet MS', verdana, arial, helvetica, helve, sans-serif; 	
	color: #555;
}



img {
	border : 0;
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

/* HEADER */
header {
	font-size: 0.8125em; /* 13 / 16 */
	padding: 10px 0px 0px 0px;
	color: #ccc;
}
.headline.first {
	margin:18px 0 0 0;
}

.headline {
    background: rgb(255, 255, 255);
	background: rgba(255, 255, 255, 0.75);

	padding:12px 12px 0 12px;
}

.descBlock {
    
    font-size:14px;
    line-height:1.4em;
}

.section {
    display: block;
    clear: both;
    padding: 10px 0px 2px;
    font-weight: bold;
    color: #E51937;
}

.headline h1 {
	padding:0 0 6px 0;
	border-bottom: #e51937 2px solid;
	font-size: 24px;
	font-weight: bold;
	color: black;
}

.header {
	background: rgb(0, 0, 0);
	background: rgba(0, 0, 0, 0.9);
}f


.sflogo {
	text-align: left;
}

a.logo-img {
	display:block;
    float:left;
}

#SponsorCarousel {
    height:100px;
    background: #fff;

}

.sponsor-item {
    display:block;
    float:left;
    text-align:center;
    padding-top:10px;
}

.sponsor-item img {
    width:120px;
}

.header-sponsors {
	float: right;
	text-align: right;
	background: transparent;
}

.social-links {
	float: none;
	text-align: right;
    margin:0 0 6px 0;
}

.social-links a {
    display:block;
    float:right;
	margin: 0 0 0 9px;
}

a.radio-league {
    display:block;
    float:right;
    margin:0 0 9px 9px;
}


.sf-section {
    background: rgb(255, 255, 255);
    background: rgba(255, 255, 255, 0.9);
	/*background: transparent url(/assets/images/fff-trans-90.png);*/
}

.sf-section-title {
    margin:12px 0 0 0;
    padding:0 12px;
    background: transparent;
}

.sf-section-title h3 {
    background: rgb(255, 255, 255);
    background: rgba(255, 255, 255, 0.9);
    background: transparent;
    border-bottom: #e51937 2px solid;
    font-weight: bold;
    font-size: 2.0em;
    color: #000;
    padding: 12px 0 3px 0;
    font-family: Roboto, Arial, 'DejaVu Sans', 'Liberation Sans', Freesans, sans-serif;
}

.sf-section-body {
    margin:12px 0 0 0;
    padding:0 12px;
    background: transparent;
}

.img-top-right {
    float: right;
    padding: 0 0 12px 12px;
    display: block;
}

.max-40-percent {
    width:40%;
}


/* MEDIA QUERIES FOR HEADER*/
@media screen and (max-width: 610px){
	.sflogo {
		margin:0 auto;
		text-align: center;
	}

	.header-sponsors {
        padding: 9px 0 0 0;
		float: none;
		text-align: center;
        max-width:300px;
	}

    .social-links {
        float:left;
    }
}



/* MAIN CONTENT */
article {
}

aside {
}

.left-article-inner {
    background: rgb(255,255,255);
	background: rgba(255,255,255,0.9);
	margin:18px 0 0 0;/* 
	line-height: 20em; remove this for production */
	/*padding: 0 0 30em 0;  remove this for production */
	/*text-align: center;  remove this for production */
}

.right-aside-inner {
    background: rgb(255,255,255);
	background: rgba(255,255,255,0.9);
	margin:18px 0 0 0;
    padding: 12px 12px 12px 12px;
}

/*
.right-aside-inner {
	background: rgba(255,255,255,0.86);
	margin:18px 0 0 0;
        

	line-height: 20em;  remove this for production 
	text-align: center;  remove this for production 
}
*/

.ad-buckets {
    background: rgb(255,255,255);
	background: rgba(255,255,255,0.9);
	margin: 18px 0 0 0;
    padding: 0px 16px 12px 16px;
    overflow: hidden;
}

.ad-buckets > div {
    width: 32%;
    margin: 17px 0 0;
}

.ad-buckets > div:first-child {
    margin-left: 0;
}

.ad-buckets > div:last-child {
    margin-right: 0;
}

@media ( max-width : 990px ) {
    .ad-buckets { margin: 17px 10px 0; }
    .ad-buckets > div.col {
        width: 32%;
        margin: 17px 0 0;
        margin-left: 1% !important;
    }

    .ad-buckets > div:first-child {
        margin-left: 0;
    }

    .ad-buckets > div:last-child {
        margin-right: 0;
    }
}

@media ( max-width : 420px ) {
    .ad-buckets { margin: 17px 10px 0; }
    .ad-buckets > div.col {
        width: 100%;
        margin: 17px 0;
        margin-left: 0 !important;
    }

    .ad-buckets img {
        width: 100%;
        height: auto !important;
    }
}

.ad-buckets>div img {
    -webkit-box-shadow: 0 0 5px #CCCCCC;
    -mox-box-shadow: 0 0 5px #CCCCCC;
    box-shadow: 0 0 5px #CCCCCC;
}

.home.row {
    padding: 0px;
}

.home.row .right-aside-inner {
    width: 49%;
    float: left;
    margin: 18px 1% 0;
    overflow: hidden;
}

.home.row .right-aside-inner.first {
    margin-left: 0px;
}

.home.row .right-aside-inner.last {
    margin-right: 0px;
}


@media ( max-width : 990px ) {
    .home.row {
        padding: 0px 10px;
    }

    .home.row .right-aside-inner {
        width: 49%;
        float: left;
        margin: 18px 1% 0;
    }

    .home.row .right-aside-inner.first {
        margin-left: 0px;
    }

    .home.row .right-aside-inner.last {
        margin-right: 0px;
    }
}



@media ( max-width : 540px ) {
    .home.row {
        padding: 0 10px;
    }

    .home.row .right-aside-inner.first,
    .home.row .right-aside-inner.last {
        clear: left;
        width: 100%;
        margin-top: 18px;
        margin-left: 0;
        margin-right: 0;
    }
}

/* HEADER */
footer {
	font-size: 0.8125em; /* 13 / 16 */
	padding: 12px 0px 24px 0px;
	margin:0 0 24px 0;
	color: #999;
}

footer strong {
	font-size: 1.077em; /* 14 / 13 */
	color: #aaa;
}

.footer {
    background: rgb(0,0,0);
	background: rgba(0,0,0,0.9);
}

.sponsors {
    background: rgb(255,255,255);
	background: rgba(255,255,255,1.0);
	margin:18px 0 0 0;
}

.legal {
	text-align: center;
	margin: 18px 0 0 0;
	font-size: 0.78em; /* 13 / 16 */
}

.footerlinks a {
	display: block;
	margin:0 0 3px 0;
	width: auto;
}

.footer-logo {
	position: absolute;
	top:0px;
	right:0px;
	width:135px;
}

footer a:link, footer a:visited { color: #fff; text-decoration: underline; }
footer a:hover { color: #999; text-decoration: underline; }

#footerTitle a:hover {
    color: #fff; text-decoration: underline;
}

.no-bckgrd {
background: transparent !important;
}
/* MEDIA QUERIES FOR FOOTER*/
@media screen and (max-width: 540px){
	.footerlinks a {
		text-align: center;
	}

	.footer-logo {
		display: none;
	}
}


/* MEDIA QUERIES FOR SMALL VIEW PADDING*/
@media screen and (max-width: 991px){
	header {
		padding: 10px 10px 0px 10px;
		color: #ccc;
	}

	.left-article-inner,
	.right-aside-inner {
		margin-left: 10px;
		margin-right: 10px;
	}
}