﻿body{
margin: 0 auto;
background-color: #333;
padding: 0;	
font-family: Arial;
font-size: 0.9em;
color: #333;
background: #000;
}

p a:link	{ color: rgba(26,110,97,1); text-decoration: none; }
p a:visited { color: rgba(26,110,97,1); text-decoration: none; }
p a:active	{ color: rgba(26,110,97,1); text-decoration: none; }
p a:hover	{ color: rgba(26,110,97,1); text-decoration: underline; }

h3 a:link	{ color: rgba(26,110,97,1); text-decoration: none; }
h3 a:visited { color: rgba(26,110,97,1); text-decoration: none; }
h3 a:active	{ color: rgba(26,110,97,1); text-decoration: none; }
h3 a:hover	{ color: rgba(26,110,97,1); text-decoration: underline; }


h2{
font-family: Oswald;
font-size: 2em;
color: rgba(26,110,97, 1);

background: rgba(229,229,229,1);;
width: 100%;
margin: 0;
padding-left: 1em;
padding-right: 1em;
border-top-right-radius: 1em;
border-bottom-right-radius: 1em;
border:  inset 5px #333;
}

h3{
font-family: Oswald;
font-size: 2em;
color: rgba(26,110,97, 0.5);
text-align: center;
}

::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background-color:rgba(255,255,255,0.8)}
::-webkit-scrollbar-thumb{background-color:rgba(26,110,97,0.5); }
::-webkit-scrollbar-thumb:hover{background-color:rgba(26,110,97,0.8)}


/* unvisited link */
a:link {
    color: rgba(229, 229, 229, 1);
    text-decoration:none;
}

/* visited link */
a:visited {
    color: rgba(229, 229, 229, 1);
    text-decoration:none;

}

/* mouse over link */
a:hover {
    color: #fff;
    text-decoration:none;
}

/* selected link */
a:active {
    color: rgba(51, 51, 51, 1);
    text-decoration:none;
}

.page_wrapper{
margin: 0 auto;
}

.content{
	width: 90%;
	float: left;
	margin-left: 5%;
	margin-right: 5%;
	margin-top: 2em;
	margin-bottom: 2em;
	
}

.top_team_bar{
float: left;
width: 100%;
vertical-align: middle;
text-align:center;
height: auto;
background: #333;
color: rgba(251,251,251, 1);
font-family: Oswald;
font-size: 0.7em;
padding-top: 1em;
padding-bottom: 1em;
}

.masthead{
float: left;
width: 80%;
height: 150px;
margin-left: 10%;
margin-right: 10%;
padding-top: 10px;
padding-bottom: 10px;
background: #000;
}

.logo{
float: left;
height: auto;
width: 50%;
}

.site_title{
float: right;
width: 50%;
color: rgba(251,251,251,1);
font-size: 3em;
font-family: Lobster;
vertical-align: text-top;
text-align:right;
text-shadow: 2px 2px rgba(240,197,86,0.5);
}

.trophy{
height: 100px;
vertical-align: middle;
top: 25px;
}

.content_wrapper{
width: 80%;
float: left;
margin-left: 10%;
margin-right: 10%;	
background: #fff;
}

.menu_wrapper{
float: left;
width: 100%;
height: auto;
/*background: rgba(3,79,71, 1);*/
background: #000;
}

.menu_button_wrapper{ /*make buttons a span to avoid link overiding style*/
float: left;
width: auto;
padding: 10px;
font-family: Oswald;
text-transform:uppercase;
font-size: 1em;
color: rgba(195,195,195,1);
font-weight:bold;
cursor: pointer;
vertical-align:middle;
}

.menu_button_wrapper_hover{ /*make buttons a span to avoid link overiding style*/
float: left;
width: auto;
padding: 10px;
font-family: Oswald;
text-transform:uppercase;
font-size: 1em;
color: rgba(195,195,195,1);
font-weight:bold;
cursor: pointer;
vertical-align:middle;
background: #333;
}

.social_buttons{
float: right;
width: auto;
height:auto;
vertical-align: middle;

}

.slider_wrapper{
float: left;
width: 65%;
height: 400px;
background: rgba(206,224,207,1);
}

.just_text_twitter{
font-family: Oswald;
font-size: 4em;
color: rgba(229,229,229,1);
text-align: center;
vertical-align: middle;
background: rgba(64,153,255,1);
padding: 10px;
}

.just_text_instagram{
font-family: Oswald;
font-size: 4em;
color: rgba(229,229,229,1);
text-align: center;
vertical-align: middle;
background: rgba(64,99,156,1);
padding: 10px;
}

.caption{
font-family: Oswald;
font-size: 2em;
color: rgba(51,51,51,1);
text-align: left;
vertical-align: middle;
background: rgb(26,110,97,1);
padding: 10px;
}


.twitter_wrapper{
float: left;
width: 34%; /*should be 35% but box title padding makes wider*/
height: 400px;
background: #fff;
}

.box_info_wrapper{
float: left;
width: 	95%;
margin-left: 2.5%;
margin-right: 2.5%;
margin-top: 20px;
margin-bottom: 20px;
}

.league_table{
float: left;
width: 34%;
height: 500px;	
background: #FDFDFD;
padding-top: 20px;
}

.box_title{
float: left;
width: 100%;
height: auto;
padding-top: 5px;
padding-bottom: 5px;
color: rgba(251,251,251,1);
vertical-align:middle;
text-align:left;
font-size: 1em;
font-weight: bold;
text-transform: uppercase;
font-family: Oswald;
background: rgba(0,92,80, 1);
border-left:solid 1px rgba(203,203,203,1);
border-right:solid 1px rgba(203,203,203,1);

}

.next_matches{
float:left;
width: 48%;
margin-right: 4%;
margin-bottom: 20px;
height: auto;
background: #fff;			
}

.latest_results{
float:left;
width: 48%;
margin-bottom: 20px;
height: auto;
background: #fff;			
}

.top_scorer_players{
float:left;
width: 48%;
margin-right: 4%;
margin-bottom: 20px;
height: auto;
background: #fff;			
}

.top_scorer_teams{
float:left;
width: 48%;
margin-bottom: 20px;
height: auto;
background: #fff;			
}

.matchup_holder{
float: left;
width: 100%;
height:auto;
background:	rgba(238,238,238, 1);
border-bottom:solid 1px rgba(203,203,203,1);
border-left:solid 1px rgba(203,203,203,1);
border-right:solid 1px rgba(203,203,203,1);
}

.team_logos_versus{
float: left;
width: 100%;
height:auto;	


}

.team_names_versus{
float: left;
width: 100%;
height:auto;

}

.team_logo_left{
background: rgba(26,110,97,0.3);
width: 40%;
height: 75px;
float:left;
border-bottom-right-radius: 1em;
}
.team_logo_right{
background: rgba(26,110,97,0.5);
width: 40%;
height: 75px;
float:left;
border-bottom-left-radius: 1em;
}

.versus{
font-family: Oswald;
width: 20%;
height: 75px;
font-size: 2em;
float:left;
text-align:center;
vertical-align:middle;
color: rgba(51,51,51,1);
}

.match_date_time{
float:left;
width: 100%;
text-align: center;
vertical-align: middle;
height: auto;
margin: 0 auto;
margin-top: 5px;
margin-bottom: 5px;
}

.match_date{
color: #666;
font-family: Arial, Helvetica, sans-serif;
font-size: 0.75em;
}

.match_time{
color: #333;
font-family: Oswald;
font-weight: bold;
text-transform:uppercase;
font-size: 1.5em;
}

.team_names_versus{
color: rgba(0,127,112,1);
width: 100%;
font-size: 1.5em;
font-family: Oswald;
font-weight: bold;
text-transform:uppercase;
float: left;
vertical-align: middle;
text-align: center;
}

.line{
float: left;
width: 100%;
height:auto;
font-size: 0.9em;
font-family:Arial, Helvetica, sans-serif;
padding-bottom: 10px;
padding-top: 10px;
color: #333;
}



.line_alt{
float: left;
width: 100%;
height:auto;
font-size: 0.9em;
font-family:Arial, Helvetica, sans-serif;
background: rgba(244,244,244,1);
padding-bottom: 10px;
padding-top: 10px;
color: #333;
}

.name_rank{
color: rgba(0,127,112,1);
font-weight: bold;
float:left;
text-align:left;
}

.name_rank a:link	{ color: rgba(0,127,112,1); text-decoration: none; }
.name_rank a:visited { color: rgba(0,127,112,1); text-decoration: none; }
.name_rank a:active	{ color: rgba(0,127,112,1); text-decoration: none; }
.name_rank a:hover	{ color: rgba(0,127,112,1); text-decoration: underline; }


.goals{
font-weight: bold;
float:right;
text-align:right;
}

.footer{
width: 80%;
float: left;
background: rgba(0,92,80,1);
margin-left: 10%;
margin-right: 10%;
padding-top: 30px;
padding-bottom: 30px;
font-size: 1em;
color: rgba(229,229,229,1);
font-family: Arial, Helvetica, sans-serif;
}

.footer_section{
float:left;
width: 50%;
text-align: center;
vertical-align:middle;
}

.copyright{
width: 80%;
float: left;
text-align:center;
vertical-align:middle;
margin-left: 10%;
margin-right: 10%;
padding-top: 30px;
padding-bottom: 30px;
font-size: 1em;
color: rgba(229,229,229,1);
font-family: Arial, Helvetica, sans-serif;
}

.copyright a:link	{ color: #333; text-decoration: none; font-weight: bold;}
.copyright a:visited { color: #333; text-decoration: none; }
.copyright a:active	{ color: #333; text-decoration: none; }
.copyright a:hover	{ color: #FFF; text-decoration: none; }

/*Subpage Styles*/
.page_title{
width: 98%;
float: left;
background:rgba(229,229,229,1);
font-family: Oswald;
font-size: 2em;
padding-bottom: 0.5em;
padding-top: 0.5em;
margin-bottom: 0.5em;
color: #333;
padding-left: 2%;
}

.sidebar{
float: left;
width: 34%;
margin-top: 20px;
margin-bottom: 20px;
}

.full_table{
width: 100%;
float: left;

}

.league_table_sidebar{
width: 100%;
float:left;
margin-top: 5px;
margin-bottom: 5px;

}

.newsletter{
float: left;
width: 100%;
background: rgba(203,203,203,1);
margin-top: 5px;
margin-bottom: 5px;
}

.weather{
float: left;
width: 100%;
background: rgba(0,92,80,0.5);
margin-top: 5px;
margin-bottom: 5px;

}


.twitter_sidebar{
width: 100%;
float: left;
margin-top: 5px;
margin-bottom: 5px;
}

.player_info_box{
float: left;
width: 100%;
}

.player_name{
font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
font-size: 1.5em;
color: rgba(0,127,112,1);
margin-bottom: 1em;
margin-top: 1em;
font-weight: bold;
}

.player_image{
width: 200px;
padding: 1em;
background: rgba(229,229,229,1);
margin: 5px;
}

.player_synopsis{
width: 95%;
float: left;
margin-left: 2%;
}
@media all and (max-width: 1024px),only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px),only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px),only screen and (-o-min-device-pixel-ratio: 21) and (max-width: 1024px),only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px),only screen and (min-resolution: 192dpi) and (max-width: 1024px),only screen and (min-resolution: 2dppx) and (max-width: 1024px){
.masthead{
height: auto;
}
.site_title{
font-size: 2em;
width:100%;
float: left;
text-align: left;
}

.slider_wrapper{
width: 100%;
height: auto;
}

.just_text_twitter{
font-size: 2.5em;

}
.just_text_instagram{
font-size: 2.5em;

}

.twitter_wrapper{
width: 100%;
}

.box_info_wrapper{
width: 95%;
}

.league_table{
margin-left: 2%;
width: 95%;
}

.sidebar{
margin-left: 2%;
width: 95%;
}

}
@media all and (max-width: 600px),only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 600px),only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 600px),only screen and (-o-min-device-pixel-ratio: 21) and (max-width: 600px),only screen and (min-device-pixel-ratio: 2) and (max-width: 600px),only screen and (min-resolution: 192dpi) and (max-width: 600px),only screen and (min-resolution: 2dppx) and (max-width: 600px){
.next_matches{
width: 100%;
}

.latest_results{
width: 100%;
}

.top_scorer_players{
width: 100%;
}

.top_scorer_teams{
width: 100%;
}
}





