/* *************************************************************** */
/* Tämä on CSS-tiedosto, jossa on määritelty HPS P01-joukkueen     */
/* sivuilla käytetyt tyylit.                                       */
/*                                                                 */
/*                   (c)   Lasse Häkkinen 2009                     */
/* *************************************************************** */


/* Zero down margin and padding on all elements */

* {
	margin  : 0;
	padding : 0;
}

a { text-decoration : none; }

body {
	background : #e6f8ee url('../kuvat/background.jpg') repeat-x;
}

#body_content {
	position 		 : relative;
	border			 : 2px solid gray;
	margin			 : 6px auto 6px auto;
	width			 : 800px;
	background-color : white;
}

.float_left  { float : left; }
.float_right { float : right;}

/* ---------------------------------------------*/
/* Warning messages.                            */
/* ---------------------------------------------*/

#warning_box {
	margin			 : 20px;
	padding			 : 20px;
	border			 : 1px solid gray;
	background-color : #e4dfe2;
	font-family		 : 'Trebuchet MS', Arial, sans-serif;
	text-align		 : center;
}

#warning_box h1 {
	color		: red;
	font-size	: 14pt;
}

#warning_box p {
	margin-top	: 10px;
	color		: black;
	font-size	: 10pt;
}

/* ----------------- */
/* For shaded images */
/* ----------------- */

.img-wrapper {
	background : url('../kuvat/shadow.gif') no-repeat right bottom;
	float	   : left;
}

.img-outer {
	background : url('../kuvat/bottom-left2.gif') no-repeat left bottom;
}

.img-inner {
	background : url('../kuvat/top-right2.gif') no-repeat top right;
	padding	   : 0 5px 5px 0;
}

.img-wrapper img {
	background-color : white;
	border			 : 1px solid #a9a9a9;
	padding			 : 4px;
	display			 : block;
}


/* -------------------------------------------------------------*/
/* Header style definitions                                     */
/* -------------------------------------------------------------*/

#header_layer {
	background	: #c7c7c7 url('../kuvat/vinjetti.jpg') repeat-x;
	height		: 100px;
	position	: relative;
}

#hps_logo {
	position : absolute;
	top		 : 0px;
	left     : 15px;
}

#hps_pojat_header {
	position : absolute;
	top		 : 0px;
	left     : 250px;
}

#paivays {
	position	: absolute;
	bottom		: 6px;
	right		: 10px;
	text-align	: right;
	font		: normal 8.5pt verdana,geneva,sans-serif;
	color		: #333333;
}


/* -------------------------------------------------------------*/
/* Navigation bar style definitions                             */
/* -------------------------------------------------------------*/

#navigation_bar {
	background	  : #c7c7c7 url('../kuvat/bar_background.jpg') repeat-x;
	border-top	  : 1px solid gray;
	border-bottom : 1px solid gray;
	font		  : normal 8pt 'Comic Sans MS','Trebuchet MS', Arial, sans-serif;
	overflow	  : visible;
	position	  : relative;
	height        : 19px;
	z-index		  : 999;
}

.dropdown {}

.dropdown li {
	list-style : none;
	position   : relative;
	text-align : center;
	display	   : inline;
	float	   : left;
}

.dropdown li.current_page { background : url('../kuvat/bar_curr_background.jpg') repeat-x; }
.dropdown li.current_page > a { color : white }
.dropdown li.current_page > a:hover { color : black; }

.dropdown.float_left  li { border-right : 1px solid #aaa; }
.dropdown.float_right li { border-left  : 1px solid #aaa; }


.dropdown a {
	display		: block;
	padding		: 0 0.8em;
	color		: #333;
	height		: 19px;
	line-height	: 19px;
	overflow	: hidden;
}

.dropdown a:hover {
	color	   : black;
	background : url('../kuvat/bar_over_background.jpg') repeat-x;
}

.dropdown ul a {
	background	: #eee;
	width		: 100%;
	height		: 22px;
	line-height	: 22px;
	padding-top : 8px;
	padding-bottom : 8px;
	border-left  : solid 1px gray;
	border-right : solid 1px gray;
	border-bottom   : solid 1px gray;
}

.dropdown ul a:hover {
	background: #666;
	color : white;
}

.dropdown ul {
	background	: #fff;
	position	: absolute;
	top			: 19px;
	left		: -1px;
	display		: none;
	border-top   : solid 1px gray;
}

.dropdown li.dropdown_trigger:hover ul { display: block; }




/* -------------------------------------------------------------*/
/* Content layer style definitions                              */
/* -------------------------------------------------------------*/

#content_layer {
	padding		: 15px 15px 20px 15px;
	text-align	: center;
	background-color : white;
	position	: relative;
	z-index		: 1;
}


/* -------------------------------------------------------------*/
/* Etusivu.php                                                  */
/* -------------------------------------------------------------*/


#joukkuekuva {
	width	   : 560px;
	margin	   : 20px auto auto auto;
}

#joukkuekuva_text {
	clear       : both;	/* clear the floats in img-wrapper */
	padding-top	: 3px;
	text-align	: center;
	font        : italic 8pt Arial;
}

#ajankohtaista {
	width		: 500px;
	margin		: 30px auto 20px auto;
	padding		: 15px;
	font		: normal 9pt 'Trebuchet MS',geneva,sans-serif;
	color		: black;
	text-align	: left;
	border		: 1px solid #a9a9a9;
}

#ajankohtaista h1 {
	font		  : italic bold 10pt 'Trebuchet MS',geneva,sans-serif;
	margin-bottom : 15px;
}

#ajankohtaista_taulu {
	border : 0px;
}

#ajankohtaista_taulu td {
	vertical-align : top;
	text-align     : left;
	padding-bottom : 10px;
}

#ajankohtaista_taulu td.pvm    { padding-right : 15px; }
#ajankohtaista_taulu td.teksti { width : 400px; }

#etusivu_text {
	font		: normal 10pt 'Trebuchet MS',geneva,sans-serif;
	color		: black;
	text-align	: justify;
	padding     : 20px 100px 20px 100px;

}

#etusivu_text p + p { margin-top: 1.0em; }

#etusivu_text p.italic {
	margin-top : 2.0em;
	font-style: italic;
}

#turnaus_logo {
	position : absolute;
	top      : 10px;
	right    : 10px;
	z-index  : 10;
	border   : 0px;
}



/* -------------------------------------------------------------*/
/* kalenteri.php                                                */
/* -------------------------------------------------------------*/

#calendar_div {
	width : 770px;
	margin : 0px auto 0px auto;

}

#calendar_div p {
	font-family : Tahoma, "Lucida Grande", Arial, sans-serif;
	font-size   : 7pt;
	text-align	: center;
	color		: #333333;
	margin-top	: 8px;
}

#cal_button_table {
	width : 640px;
	margin : 0px auto 0px auto;
}

#cal_button_list {
	width : 595px;
}



table.kalenteritaulu {
	background-color : #cccccc;
	border-style  : solid;
	border-width  : 1px;
	border-color  : #333333;
	margin-top    : 10px;
	margin : 20px auto 0px auto;
}

td.kuukausinimi {
	background-color : #666666;
	text-align : center;
	color : white;
	font-family: sans-serif;
	font-size: 14.0pt;
	text-decoration: none;
}

td.viikonpaivat {
	width       : 88px;
	font-family : Trebuchet MS;
	font-size   : 10pt;
	text-align : center;
	color       : #333333;
}

td.paivasolu {
	width :  90px;
	height : 73px;
	background-color : #ffffff;
	vertical-align : top;
}

td.tamapaivasolu {
	width :  90px;
	height : 73px;
	background-color : #bdf7fc;
	vertical-align : top;
}

div.paivanumero {
	height : 13px;
	color : white;
	background-color : #006600;
	background		 : url('../kuvat/paiva_nro_vinjetti.jpg') repeat-x;

	margin : 0px;
	font-family: verdana,geneva,sans-serif;
	font-size: 8.0pt;
	font-weight: bold;
	text-decoration: none;
	text-align : center;
	border : 2px;
	overflow      : hidden;
	border-style  : solid;
	border-width  : 0px;
	border-color  : #006600;
}

div.muukuukpaivanumero {
	height : 13px;
	color : #333333;
	background-color : #80c080;
	background		 : url('../kuvat/paiva_nro_vinjetti.jpg') repeat-x;
	margin : 0px;
	font-family: verdana,geneva,sans-serif;
	font-size: 8.0pt;
	font-weight: bold;
	text-decoration: none;
	text-align : center;
	border : 2px;
	overflow      : hidden;
	border-style  : solid;
	border-width  : 0px;
	border-color  : #80c080;
}

div.tamapaivanumero {
	display : block;
	height : 11px;
	color : black;
	background-color : #E6F3E6;
	margin : 0px;
	font-family: verdana,geneva,sans-serif;
	font-size: 8.0pt;
	font-weight: bold;
	text-decoration: none;
	text-align : center;
	border-style  : solid;
	border-width  : 1px;
	border-color  : #006600;
	overflow      : hidden;
}

div.paivateksti {
	margin : 0px;
	font-family: verdana,geneva,sans-serif;
	font-size: 7.0pt;
	text-decoration: none;
	text-align : left;
}

div.paivateksti a { text-decoration : none; } /* Mouse not over <a> */


span.eityyppia       { color : black;   font-weight : bold; }
span.leiri           { color : #ff00ff; font-weight : bold; }
span.peruutus        { color : #ff3333; }
span.treenit         { color : black;   }
span.tanoke          { color : #555555;   }
span.harjoituspeli   { color : #996600; font-weight : bold; }
span.harjoituspeli a { color : #996600; }
span.peli            { color : #ff0000; font-weight : bold; }
span.peli a          { color : #ff0000; }
span.piirisarja      { color : #009900; font-weight : bold; }
span.piirisarja a    { color : #009900; }
span.peli_ilta       { color : #0000ff; font-weight : bold; }
span.peli_ilta a     { color : #0000ff; }
span.peliT90         { color : #009900; font-weight : bold; }
span.peliT91         { color : #009900; font-weight : bold; }
span.peliT92         { color : #0000ff; font-weight : bold; }
span.kokous          { color : #009900; }
span.hallivartiointi { color : #000099; }
span.loma            { color : #008000; }
span.turnaus		 { color : #ff00ff; font-weight : bold; }
span.turnaus a		 { color : #ff00ff; }
span.oranssi		 { color : #cc6600; font-weight : bold; }
span.kello			 { color : black;   font-weight : bold; }
span.vihrea			 { color : #006000; }
span.musta			 { color : black; }

table.kalenterilista {
	background-color : #ffffff;
	border-style  : solid;
	border-width  : 1px;
	border-color  : #006600;
	border-collapse: separate;
	border-spacing : 0px;
}

td.lista_kuukausinimi {
	background-color : #006600;
	text-align       : center;
	color            : white;
	font-family      : sans-serif;
	font-size        : 10.0pt;
	padding          : 3px;
}

tr.lista_arkipaiva   { background-color: #ffffff; }
tr.lista_viikonloppu { background-color: #dddddd; }

td.lista_tanaan {
	font-family    : verdana,geneva,sans-serif;
	font-size      : 8.0pt;
	font-weight    : bold;
	vertical-align : top;
	text-align     : left;
	padding        : 1px;
}

td.lista_muupaiva {
	font-family    : verdana,geneva,sans-serif;
	font-size      : 8.0pt;
	vertical-align : top;
	text-align     : left;
	padding        : 1px;
}



/* -------------------------------------------------------------*/
/* yhteystiedot.php                                             */
/* -------------------------------------------------------------*/

#yhteystiedot {
	font-family : verdana,geneva,sans-serif;
	color	    : black;
}

#yhteystiedot h1 {
	font-size   : 12.0pt;
	text-align  : center;
	margin-top	: 20px;
}

#yhteystiedot table {
	text-align  : left;
	margin      : 30px auto 30px auto;
	font-size   : 10.0pt;
}

#yhteystiedot .kuva_teksti {
	clear       : both;	/* clear the floats in img-wrapper */
	font-size   : 10.0pt;
	text-align  : center;
	padding-top : 10px;
 }

#yhteystiedot p.nimi   { font-weight : bold; }
#yhteystiedot p.e_mail { font-style	: italic; }

#yhteystiedot td { padding : 5px;}
#yhteystiedot td.titteli { text-align : right;}
#yhteystiedot td.nimi    { text-align : left;}
#yhteystiedot td.e_mail    { text-align : left; font-style	: italic;}
#yhteystiedot td.puh     { text-align : left; padding-left:10px;}


/* -------------------------------------------------------------*/
/* Harjoituspeli-ikkunat                                        */
/* -------------------------------------------------------------*/

#peli_body {
	 background : #e6f3e6;
	 margin     : 0px;
	 padding    : 10px;
}

#peli_body h1 {
	text-align  : center;
	font 		: bold 12pt Verdana,geneva,sans-serif;
	color       : black;
	padding     : 20px;
}

#peli_body .info {
	text-align  : center;
	font		: normal 10pt Verdana,geneva,sans-serif;
	color       : black;
	margin-bottom : 20px;
}

#peli_body .info p {
	margin-bottom : 10px;
}

#peli_body .pelaajataulu {
	margin          : 0px auto 0px auto;
	border-collapse : separate;
	border-spacing  : 5px 5px;
}

#peli_body .joukkuesolu {
	background-color : #bfdfbf;
	border			: 2px solid #008000;
	padding			: 10px 20px 10px 20px;
	font			: normal 10pt Arial, sans-serif;
	text-align		: left;
	color			: black;
	vertical-align	: top;
}

#peli_body .joukkuesolu .otsikko {
	font-size	  : 14pt;
	margin-bottom : 15px;
	text-align	  : center;
}

#peli_body .joukkuesolu .ottelut {
	padding		  : 10px 0px 10px 0px;
	border-top	  : 1px solid #008000;
	border-bottom : 1px solid #008000;

}

#peli_body .joukkuesolu .pelaajat {
	margin-top : 20px;
}

#peli_body a	   { color : #336633; }
#peli_body a:hover { color : red;	  }


/* -------------------------------------------------------------*/
/* kuvagalleria.php                                             */
/* -------------------------------------------------------------*/

#kuvagalleria {
	border : 0px solid gray;
}

/* ------------------ */
/* Valikko vasemmalla */
/* ------------------ */

#kuvagalleria .vasen {
	vertical-align : top;
	width	       : 200px;
	font-family    : sans-serif;
	color          : white;
}

#kuvagalleria .vasen_otsikko {
	display			 : block;
	width			 : 165px;
	padding			 : 5px;
	text-align 		 : center;
	background		 : url('../kuvat/tur_ots_background.jpg') repeat-x;
	background-color : #96bc95;
	font-size        : 12.0pt;
}

#kuvagalleria .vasen_linkit {
	padding			 : 10px;
	background-color : #6f8a6e;
	text-align		 : left;
	font-size        : 10.0pt;
}

#kuvagalleria .vasen_linkit a		 		{ color : white;  }
#kuvagalleria .vasen_linkit a.current_page	{ color : yellow; }
#kuvagalleria .vasen_linkit a:hover 		{ color : maroon; }

#kuvagalleria .intend {
	padding-left : 20px;
	font-size    : 8.0pt;
}


/* ------------------ */
/* Sisältö oikella    */
/* ------------------ */

#kuvagalleria .oikea {
	vertical-align	 : top;
	width			 : 572px;
	background-color : #d7ffd6;
	border           : 1px solid gray;
	text-align		 : center;
}

#kuvagalleria_taulu {
	padding	 : 10px 0px 30px 0px;
}

#kuvagalleria_taulu h1 {
	font		  : normal 14pt Trebuchet MS, Arial, sans-serif;
	color		  : black;
	margin-top	  : 0px;
	margin-bottom : 20px;
}

#kuvagalleria_taulu table {
	margin			 : 0px auto 0px auto;
	border-collapse  : separate;
	border-spacing   : 2px;
	background-color : #dddddd;
	border			 : 1px solid #aaaaaa;
}

#kuvagalleria_taulu td {
	border	  : 0;
	font-size : 0pt;	/* Otherwise the image will not fill the whole cell (works also in Firefox) */
	background-color : #dddddd;
	text-align : center;
}

#kuvagalleria_taulu img {
	border  : 0;
	display :table-cell;	/* Otherwise the image will not fill the whole cell (does not work in Firefox) */
	margin : 0px auto 0px auto;
}