/*
Stylesheet by Tom Walsham, for for intertorontofc.ca
Please credit me with a link if you nab too much of this :-) Thanks.
*/

/* First I start with some general declarations: fonts, background, and a couple of 'utility classes' like .clear */

body {
background: #fff;
padding: 0px;
margin: 0px;
font-family: "Verdana","Arial","Helvetica",sans-serif;
}

.strike {
text-decoration: line-through;
}
.high {
background: #dfd;
}

h1 {
font-size: 2.2em;
color: #000;
}

h1 a {
text-decoration: none;
color: #000;
}

a img {
border: none;
}

small {
font-size: 0.8em;
}



/* Minwidth hack courtesy Stu Nicholss, cssplay.co.uk */
#container {
background: #B2B5BA;
width: 100%;
min-width: 705px;
text-align: left;
margin: 0px auto 0px auto;
padding: 0px;

}
* html .minwidth {border-left:705px solid #B2B5BA; position:relative; float:left; z-index:1;}
* html .mincont {margin-left:-705px; position:relative; float:left; z-index:2;}

#logo {
padding: 0px;
height: 80px;
}

#tfclogo {
width: 68px;
height: 65px;
background: transparent url('./common/tfclogo_65x68.gif') top left no-repeat;
position: absolute;
top: 5px;
left: 5px;
}

#logo h1 {
z-index: 200;
margin: -2px 0px 0px 0px;
padding: 5px 0px 25px 210px;
height: 76px;
background: #fff url(http://www.torontosoccerfans.com/common/light_header.jpg) bottom left no-repeat;
line-height: 25px;
}

* html #logo h1 {
padding-bottom: 30px;
}

#logo h1 a {
color: #E41736;
}


h4 {
text-align: center;
margin: 2px auto;
font-size: 90%;
}

#topmenu {
float:left;
position: relative;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 30px;
background: none;
font-size:60%;
}

#topmenu ul {
position: relative;
margin: 0px 0px 0px 0px;
padding:0px 0px 0;
list-style:none;
float:left;
}
* html #topmenu ul {
margin-top: 0px;
}


#topmenu li {
float:left;
display: block;
background: transparent;
margin:0px;
padding:0px 12px 0px 0px;
}

#topmenu a {
font-size: 1.3em;
float:left;
display:block;
background: #ccc;
padding: 5px 15px 5px 6px;
text-decoration:none;
color:#000;
}

#topmenu #current a {
background: #B2B5BA;
color:#000;
padding-bottom: 5px;
}

#topmenu a:hover {
text-decoration: underline;
background: #E41736;
}

.button {
padding: 3px;
border: solid 1px #ccc;
margin-left: 40px;
background: #66c;
color: #fff;
}


#breads {
float: left;
position: relative;
font-size: 0.8em;
padding-top: 8px;
padding-bottom: 8px;
}

#breads a {
text-decoration: none;
color: #000;
}

 #mainContent {
 float: left;
 clear: both;
 position: relative;
 margin: 0;
 width: 75%;
 min-height: 320px;
 min-width: 468px;
 background: #fff;
 padding: 10px 0px 0px 0px;
 font-size: 12px;
 margin: 0px 0px 10px 5px;
border: solid 1px #000;
}
* html #mainContent {height: 290px;}

#pagebody {
background: #B2B5BA;
width: 100%;
}

.innerH1 {
color: #c00;
text-align: center;
margin-bottom: 5px;
}

.aboutPage {
border: dashed 1px #00d;
background: #ccc;
color: #000;
padding: 10px;
width: 80%;
margin: 0px auto 10px auto;
}


.pageContent {
background: #fff;
color: #000;
border: solid 2px #aaa;
padding: 5px;
margin: 0px 10px;
}


#sidebar {
right: 0px;
padding: 5px 5px 20px 5px;
margin-top: 0px;
width: 20%;
float: right; 
background: #666; 
min-height: 280px; 
 }
* html #sidebar {height: 280px;}

 .sider {
border: 1px solid #dde;
padding: 0px 0px 10px 0px;
background: #fff;
}
.sider h4 {
padding: 0px 0px 0px 15px;
margin: 0px 0px 10px 0px;
background: #444;
color: #fff;
font-size: 110%;
}

.sider a {
background: #fff;
font-size: 0.8em;
}

#side1 {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
#side1 a, #side2 a {
padding: 0px 0px 0px 5px;
margin: 0px 2px 0px 2px;
width: 95%;
display: block;
text-decoration: none;
border-bottom: 1px solid #B2B5BA;
color: #000;
}



#side1 a:hover, #side2 a:hover {
background: #eef
}

#side2, #side3 {
font-size: 0.85em;
margin: 20px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}

#side2 img {
float: left;
}

#side2 a small {
color: #413;
}

#side1 a.arch_link {
padding-top: 10px;
font-size: 0.6em;
color: #f00;
}

p.comp_link {
text-align: center;
color: #f00;
background: #eef;
}

p.comp_link a {
color: #f00;
font-weight: bold;
font-size: 1.1em;
}

.gad {
margin-left: 15px;
}

.ghor {
text-align: center;
}

#footer {
clear: both; 
position: relative;
background: #fff; 
color: #666;
padding: 0px 0px 0px 0px;
margin: 0px 0px 0px 0px;
border-top: solid 3px #000;
}

#footer a {
color: #444;
}

#footer ul {
background: #ccc;
padding: 0px 0px 5px 10px;
margin: 0px 0px 0px 0px;
}

#footer ul li {
display: inline;
}
#footer li a {
margin: 0px;
padding: 5px 5px 5px 5px;
background: #ccc;
font-size: 0.7em;
color: #000;
border-right: solid 1px #000;
text-decoration: none;
}

#footer li a:hover {
text-decoration: underline;
}

#footer p {
font-size: 0.8em;
}


h2.innerH2 {
color: #00f;
}

.ftext {
margin: 0px auto 0px auto;
color: #333;
font-size: 1.0em;
background: #efe;
font-weight: normal;
border: solid 1px #a7a7a7;
text-align: left;
padding: 2px 0px 2px 0px;
}


.ftitle {
margin: 0px auto 0px auto;
color: #333;
font-size: 1.2em;
background: #eef;
font-weight: bold;
border: solid 1px #a7a7a7;
text-align: center;
padding: 2px 0px 2px 0px;
}

.abox {
border: solid 1px #a7a7a7;
border-top: none;
padding: 5px;
margin: 0px 10px 0px 10px;
background: #ffe;
min-height: 55px;
font-size: 0.9em;
}

* html .abox {
height: 55px;
}

.bbox {
border: solid 1px #a7a7a7;
border-top: none;
padding: 5px;
margin: 0px 10px 0px 10px;
background: #fee;
min-height: 55px;
font-size: 0.9em;
}

* html .bbox {
height: 55px;
}


.fdisp {
background: #fee;
border: solid 1px #a7a7a7;
border-top: none;
padding: 5px;
margin: 0px 0px 10px 0px;
font-size: 0.9em;
}

code {
display: block;
margin-left: 40px;
background: #fff;
padding: 5px;
border: dashed 2px #ddd;
}

pre {
display: block;
margin-left: 40px;
background: #fff;
padding: 5px;
border: dashed 2px #ddd;
}

.fdispcont {
border: dashed 2px #ddd;
position: relative;
margin-left: 40px;
background: #fff;
padding: 5px;
}

.pol {
width: 155px;
text-align: center;
border: solid 1px #000;
padding: 5px;
margin: 5px;
padding-bottom: 15px;
background: #fffffc;
font-family: "Times New Roman", serif;
}

.pol img {
border: solid 1px #000;
width: 150px;
height: 150px;
}

.spol {
width: 79px;
text-align: center;
border: solid 1px #000;
padding: 2px;
margin: 5px;
padding-bottom: 10px;
background: #fffffc;
font-family: "Times New Roman", serif;
}

.spol img {
border: solid 1px #000;
width: 75px;
height: 75px;
}

.right {
float: right;
}

.left {
float: left;
}

.clear {
clear: both;
}

.ingredients img {
float: right;
}
div.warning {
border: solid 2px #f00;
margin: 0px 20px 5px 20px;
background: #fee;
}
.warning h4 {
display: inline;
color: #f00;
margin-right: 20px;
}

.tips {
border: dashed 2px #0a0;
margin: 0px 20px 5px 20px;
padding: 5px;
}
div.tips h4 {
color: #050;
}

div.prodBlock {
text-align: center;
border: none;
float: left;
}

#socials {
position: absolute;
right: -23px;
bottom: 76px;
z-index: 0;
border: solid 2px #aaa;
border-left: none;
background: #efe;
}

#socials ul {
list-style: none;
margin: 0px;
padding: 0px;
}

#socials ul li {
margin: 2px 0px 0px 3px;
}