/*****************************************************************************
 * Travisty Website                                                          *
 *                                                                           *
 * Copyright (c) Pete Calvert                                                *
 *                                                                           *
 * General Site Layout (style/generic.css)                                   *
 *                                                                           *
 *****************************************************************************/
 
/* Global Defaults                                                           */
* {
	margin: 0;
	padding: 0;
	border: none;
}

html {
	overflow-y: scroll;
}

/* .Clear Elements                                                           *
 *   Move to below any floating elements                                     */
.Clear {
	clear: both;
}

/* Body Element                                                              *
 *   Provides top banner and overall background                              *
 *   Sets global font default, all other font sizes should be relative       */
body {
	background-color: #808080;
	font-family: "Trebuchet MS", sans-serif;
	font-size: 10pt;
	color: #222;
}

/* H1 Heading Elements                                                       *
 *   Simple with black horizontal rule                                       */
h1 {
	font-size: 120%;
	border-bottom: 1px solid black;
	margin-top: 13px;
}

/* H3 Subheading Elements                                                    *
 *   Used for /The/ Independent ....                                         */
h3 {
	font-size: 90%;
	font-weight: bold;
	margin-bottom: 10px;
}

/* List Elements                                                             *
 *   Ordered list for Constitution                                           *
 *   Bullet Points                                                           */
div#Content ol, div#Content ul {
	margin-left: 35px;
}

div#Content ol li, div#Content ul li {
	margin-bottom: 5px;
}

/* A Link Elements                                                           *
 *   Bold and Grey                                                           *
 *   Change to Red on Hover                                                  */
a {
	color: #666;
	font-weight: 600;
	text-decoration: none;
}

a:hover {
	color: #960000;
}

/* INPUT and TEXTAREA Elements                                               *
 *   Border and off white background                                         *
 *   Set width (300px)                                                       */
input, textarea, select {
	border: 1px solid #222;
	background-color: #FFE;
	width: 300px;
}

textarea {
	height: 150px;
}

input.Submit {
	width: auto;
}

/* #WrapOuter and #WrapInner Elements                                        *
 *   Centres page page to central 800px                                      *
 *   Provides rounded corners (30px radius)                                  */
div#WrapOuter {
	position: relative;
	width: 800px;
	margin: 20px auto;
	padding: 15px 0 0 0;
	
	background-image: url(../images/top.png);
	background-repeat: no-repeat;
	background-position: top;
	background-color: #FFF;
}

div#WrapInner {
	position: relative;
	padding: 0 0 15px 0;
	
	background-image: url(../images/bottom.png);
	background-repeat: no-repeat;
	background-position: bottom;
	background-color: #FFF;
}

/* #Logo Element                                                             *
 *   Travisty logo - centred and with space below                            */
img#Logo {
	display: block;
	margin: 0 auto;
}

/* #Left Element and Sub-elements                                            *
 *   Left hand column                                                        */
ul#Left {
	position: absolute;
	width: 130px;
	left: 0px;
	top: 95px;
	list-style: none;
}

ul#Left li {
	display: block;
	background-repeat: no-repeat;
	background-position: top;
	padding: 12px 0 0 0;
	margin-bottom: 20px;
}

ul#Left li.Red {
	background-image: url(../images/menu_red.png);
	border-bottom: 1px solid #960000;
}

ul#Left li.Blue {
	background-image: url(../images/menu_blue.png);
	border-bottom: 1px solid #000066;
}

ul#Left li div {
	font-size: 80%;
	padding: 2px 5px;
}

ul#Left li.Red div {
	border-right: 1px solid #960000;
}

ul#Left li.Blue div {
	border-right: 1px solid #000066;
}

ul#Left li a {
	display: block;
	border-top: 1px solid #DDDDDD;
	border-right: 3px solid #DDDDDD;
	padding: 1px 5px;
}

ul#Left li a:first-child {
	border-top: none;
}

ul#Left li.Red a:hover {
	border-right: 3px solid #960000;
}

ul#Left li.Blue a:hover {
	border-right: 3px solid #000066;
}

ul#Left li a.Highlight {
	border-right: 3px solid #969600;
}

ul#Left img {
	margin: 1px auto;
	display: block;
}


/* #Sponsors Element                                                         *
 *   Area for Sponsors' Logos at Bottom of Left Column                       */
div#Sponsors {
	text-align: center;
	position: absolute;
	left: 0px;
	bottom: 20px;
	width: 130px;
	font-size: 75%;
}

/* #Content Element                                                          *
 *   Main Content Area, leaving space for left-hand column                   */
div#Content {
	margin: 0 20px 30px 140px;
}


/* .Cover Elements                                                           *
 *   Front cover previews                                                    *
 *   Simply border with spacing                                              */
div.Cover {
	position: relative;
	text-align: center;
	width: 100%;
}

div.Cover a img {
	position: relative;
	border: 1px solid #222;
	margin: 10px;
}

div.Cover a:hover img {
	border: 3px solid #960000;
	margin: 8px;
}


/* .Face Elements                                                            *
 *   Thumbnail Photos for Committee Members                                  *
 *   Small Margin and Bordered                                               */
.Face {
	padding: 0 10px;
	margin: 0 0 10px 0;
	display: block;
	background-color: #FFF;
}

.Face img {
	border: 1px solid #666;
}


/* .Thumbs Elements                                                          *
 *   Past issue front cover thumbnails                                       *
 *   Inline list                                                             */
ul.Thumbs {
	list-style: none;
}

ul.Thumbs li {
	float: left;
	position: relative;
	padding: 10px 0;
	text-align: center;
	font-size: 80%;
}

ul.Thumbs li a img {
	display: block;
	border: 1px solid #222;
	margin: 2px 10px;
}

ul.Thumbs li a:hover img {
	border: 3px solid #960000;
	margin: 0 8px;
}


/* .Sudoku Elements                                                          *
 *   TCSUdoku Solutions                                                      *
 *   Inline list                                                             */
ul.Sudoku {
	list-style: none;
}

ul.Sudoku li {
	float: left;
	position: relative;
	padding: 10px 0;
	text-align: center;
	font-size: 80%;
	width: 50%;
}

ul.Sudoku li img {
	display: block;
	margin: 0 auto;
}



/* .Vote Table Elements                                                      *
 *   Small Central Table                                                     *
 *   Red and Blue Bars for Yes/No respectively                               */
table.Vote {
	border: none;
	margin: 10px auto;
}

table.Vote th {
	text-align: center;
	font-weight: bold;
}

table.Vote td {
	width: 200px;
}

table.Vote td div.YesBar {
	border: 1px solid #222;
	background-color: #960000;
	font-size: 75%;
	text-align: center;
	color: #FFF;
	font-weight: bold;
	overflow: hidden;
}

table.Vote td div.NoBar {
	border: 1px solid #222;
	background-color: #000066;
	font-size: 75%;
	text-align: center;
	color: #FFF;
	font-weight: bold;
	overflow: hidden;
}
