/* ---------------------------------------------------







AUTHOR          :  	Erwin Aligam



WEBSITE         :   http://www.styleshout.com/



TEMPLATE NAME   :	CoolWater



TEMPLATE CODE   : 	S-0019



VERSION         :   1.1



DATE            :	January 18, 2010







---------------------------------------------------- */







/* ---------------------------------------------------



   HTML ELEMENTS



---------------------------------------------------- */







/* top elements */



* { margin: 0; padding: 0; outline: 0; }







body {



	background: #caced1;



	font: 80%/1.3em 'Trebuchet MS', sans-serif;



	color: #000;



	text-align: center;



	margin: 15px 0;



}







/* links */



a, a:visited {



	text-decoration: none;

	color: #FB9233; 



}



a:hover {



	text-decoration: underline;

	color: #93C600;



}







/* headers */



h1, h2, h3 { font-family: 'Trebuchet MS', Tahoma, Sans-serif;  }



h1 {



	font-size: 170%;	



	font-weight: normal;	



	color: #777;



}



h2 {



	font-size: 160%;



	color: #88ac0b;



	font-weight: normal;



}



h3 {



	font-size: 135%;	 



	color: #2666c3;



}


/* images for gallery */
#main #img_gallery img {
background: transparent;
  border: 0px;
padding: 0px;
}

/* images */



img {



	background: #fff;



    border: 1px solid #E5E5E5;



	padding: 7px;



}



img.float-right { margin: 5px 0px 10px 10px;  }



img.float-left { margin: 5px 10px 10px 0px; }

img.normal {
	margin: 0px;
	border: 0px;
	padding: 0px;
	}





h1, h2, h3, p {



	margin: 10px 15px;



	padding: 0;



}



ul, ol {



	margin: 5px 15px;



	padding: 0 25px;



}







code {



  margin: 5px 0;



  padding: 15px;



  text-align: left;



  display: block;



  overflow: auto;  



  font: 500 1em/1.5em 'Lucida Console', 'courier new', monospace ;



  /* white-space: pre; */



  border: 1px solid #E5F0FB;  



  background: #F4F8FD;



}



acronym {



  cursor: help;



  border-bottom: 1px dotted #777;



}



blockquote {



  margin: 10px 15px;



  padding: 0 0 0 25px;  



  font: bold 1.3em/1.5em "Trebuchet MS", Tahoma, arial, Sans-serif; 



  color: #2361BA;



  border: 1px solid #E5F0FB;   



  background: #F4F8FD url(../images/quote.jpg) no-repeat 8px 6px;



}







/* start - table */



table {



	border-collapse: collapse;



	margin: 10px 15px;	



}



th strong {



	color: #fff;



}



th {



	background: #306bc1 url(../images/button-bg.jpg) repeat-x 0 0; 



	height: 35px;



	padding-left: 12px;



	padding-right: 12px;



	color: #fff;



	text-align: left;



	border: 1px solid #306bc1;



	border-bottom-width: 2px;



}



tr {



	height: 32px;



	background: #fff;	



}



td {



	padding-left: 0px;



	padding-right: 0px;



	border: 1px solid #E5F0FB; 



}



/* end - table */

table.styled th, table.styled td {
    padding-right : 1em;
    text-align : left;
	border : 0px;
	background-color: transparent;
}

table.styled th {
    padding-top : 0.5em;
	background-color: transparent;
}

table.styled tr td.required {
    text-align : center;
	border : 0px;
	background-color: transparent;
}

table.styled img {
    vertical-align : middle;
	background-color: transparent;

}

table.logo {
	border-width: 1px;
	border-spacing: 0px;
	border-style: solid;
	border-color: #E5F0FB;
	border-collapse: collapse;
	background-color: transparent;
}
table.logo th {
	border-width: 1px;
	padding-left: 10px;
	border-style: none;
	border-color: #E5F0FB;
	background-color: transparent;
	-moz-border-radius: 0px 0px 0px 0px;
}
table.logo td {
	border-width: 1px;
	padding-left: 10px;
	border-style: none;
	border-color: #81C524;
	background-color: transparent;
	-moz-border-radius: 0px 0px 0px 0px;
}




/* form elements */



form {



	margin:10px 15px; 



	padding: 10px 0;



	border: 1px solid #E5F0FB; 



	background: #F4F8FD;



}





#Side .form {

	margin-left: 0px;

	margin-right: 10px;



	padding: 0px 0px 0px 0px;



	border: 1px solid #E5F0FB; 



	background: #F4F8FD;

	}





fieldset {



	margin: 0;	padding: 0;



	border: none;



}



legend {



	display: none;



}



label {



	display:block;



	font-weight:bold;



	margin: 7px 0;



}



input {



	padding:3px;



	border: 1px solid #E5F0FB; 



	font: normal 1em Verdana, sans-serif;



	color:#777;	



}



textarea {



	width:400px;



	padding:3px;



	font: normal 1em Verdana, sans-serif;



	border: 1px solid #E5F0FB; 



	height:100px;



	display:block;



	color:#777;



}



input.button { 



	font: bold 12px Arial, Sans-serif; 



	height: 28px;



	margin: 0;



	padding: 2px 3px; 



	color: #fff;



	background: #306bc1 url(../images/button-bg.jpg) repeat-x 0 0; 



	border: 1px solid #306bc1;



}

input.newsbutton { 



	font: bold 12px Arial, Sans-serif; 



	height: 28px;



	margin-top: 7px;



	padding: 2px 3px; 



	color: #fff;



	background: #306bc1 url(../images/button-bg.jpg) repeat-x 0 0; 



	border: 1px solid #306bc1;



}







/* search form */



.searchform {



	background-color: transparent;



	border: none;	



	margin: 0; 



	padding: 5px 0 5px 0;	



	width: 180px;	



}



.searchform p { margin: 0; padding: 0; }



.searchform input.textbox { 



	width: 110px;



	color: #777; 



	height: 20px;



	padding: 2px;	



	border: 1px solid #D2E8F7; 



	vertical-align: top;



}



.searchform input.button { 



	width: 55px;



	height: 26px;



	padding: 2px 5px;



	vertical-align: top;



}







/********************************************



   LAYOUT



********************************************/ 



#wrap {



	width: 790px;



	background: #CCC url(../images/content.jpg) repeat-y center top;



	margin: 0 auto;



	text-align: left;



}



#content-wrap {



	clear: both;



	width: 760px;	



	margin: 5px auto;



	padding: 0;



}



#header {



	position: relative;



	height: 131px;



	background: #caced1 url(../images/header.jpg) no-repeat center top;



	padding: 0;	



	color: #fff;	



}

#header-image-link {
  position: absolute;
  top: 20px;
  left: 60px;

}

#header-image-link IMG {
  border: 0px none;
visibility: hidden;
}

#header h1#logo-text a {



	position: absolute;



	margin: 0; padding: 0;



	font: bolder 55px 'Trebuchet MS', Arial, Sans-serif;



	letter-spacing: -3px;



	color: #fff;



	text-transform: none;



	text-decoration: none;



	background: transparent;



	



	/* change the values of top and left to adjust the position of the logo*/



	top: 18px; left: 35px;	



}



#header p#slogan {



	position: absolute;



	margin: 0; padding: 0;



	font: bold 13px 'Trebuchet MS', Arial, Sans-serif;



	text-transform: none;



	color: #FFF;



	



	/* change the values of top and left to adjust the position of the slogan*/



	top: 80px; left: 50px;		



}





.pane{

float: left;		/* you need that!!! */

display: none;		/* you need that - if you remove this, at load the page will have height of the heighest pane, see more instructions in html-file */

width:500px;		/* set the width of your content here, it's not necessary if you dont wanna have fixed with */

padding:0px 25px 25px 30px;		/* unimportant */	

}



#paincontent {

overflow:hidden;	/*you need that!!! */

}



#paneContainer{

float:left;			/*you need that!!! */

background-color: transparent;

}




/* header links */



#header #header-links {



	position: absolute;



	color: #C6DDEE;



	font: bold 12px "Trebuchet MS", Arial, Tahoma, Sans-serif;



	top: 20px; right: 20px;	



}



#header #header-links a {	



	color: #fff;



	text-decoration: none;	



}



#header #header-links a:hover {



	color: #D4FF55;	



}





#Currently_Playing {



	float:left;

	position: absolute;


	left:450px;

	width: 330px;
	height: 23px;
	

	top:105px;


	font: bold 12px Arial, Tahoma, Sans-serif;


	padding: 0px;

	overflow: hidden;



}



#Currently_Playing ul{



	list-style-image: none;



	list-style-type: none;	



	float:left;

	width: 330px;
	height: 23px;

	margin-right:0px;



	padding: 0px;
	
	overflow: hidden;



}

#Currently_Playing a {



	text-decoration: none;

	color: #fff;



}



#Currently_Playing a:hover {



	text-decoration: none;

	color: #93C600;



}







/* Listen Module */



#Listen_Module {



	float:right;



	font: bold 12px "Trebuchet MS", Arial, Tahoma, Sans-serif;

	

	margin-top: 0px;



	margin-right: 30px;



	margin-bottom: 15px;



	padding: 0px



}



#Listen_Module a {



	text-decoration: none;

	color: #fff;



}



#Listen_Module a:hover {



	text-decoration: none;

	color: #93C600;



}



#Listen_Module img {



	background: transparent;



	border: 0px;



}







#Listen_Module .listenImg {



	position: absolute;



	right:20px;



	top:10px;



	float:right;



	height: 85px;



	width: 85px;



}



#Listen_Module ul{



	position: absolute;



	right:100px;



	top:10px;



	font: bold 100%/1.4em  Arial, Tahoma, Sans-serif;



	list-style-image: none;



	list-style-type: none;	



	float:right;





}



#Listen_Module h3{



	font-size: 18px;



	color: #ef7222;



	font-weight: normal;



	margin: 0px;



	padding: 0px;



}



#Listen_Module #Listen {



	background-image: url('../images/Listen_Icon.png');



	background-repeat: no-repeat;



	background-position: left center;



	padding-left: 25px;



}



#Listen_Module #Text {



	background-image: url('../images/Text_Icon.png');



	background-repeat: no-repeat;



	background-position: left center;



	padding-left: 25px;



}



#Listen_Module #Email{



	background-image: url('../images/Email_Icon.png');



	background-repeat: no-repeat;



	background-position: left center;



	padding-left: 25px;



}



#Listen_Module #Webcam{



	background-image: url('../images/Webcam_Icon.png');



	background-repeat: no-repeat;



	background-position: left center;



	padding-left: 25px;



}




#main #logos ul li{




	list-style-image: none;



	list-style-type: none;	


}



/* navigation */



#menu {



	clear: both;	



	margin: 0 auto; padding: 0;



	background: #81C524 url(../images/menu.jpg) no-repeat;	



	font: bold 16px/40px "trebuchet MS", Arial, Tahoma, Sans-serif;



	height: 40px;



	width: 790px;	



}



#mainbanner {



	clear: both;	



	margin: 0 auto; padding: 0;



	position: relative;



	z-index: 0;


	font: bold 16px/40px "trebuchet MS", Arial, Tahoma, Sans-serif;



	height: 120px;



	width: 780px;	



}



#menu-dropdown {



	clear: both;	



	margin: 0 auto; padding: 0;



	background: #81C524 url(../images/menu.jpg) no-repeat;	



	font: bold 15px/40px "trebuchet MS", Arial, Tahoma, Sans-serif;



	height: 40px;



	width: 790px;



}



#menu ul {



	float: left;



	list-style: none;



	margin:0; padding: 0 0 0 20px;



}



#menu ul li {



	display: inline;



}




#menu ul li a:hover {



	color: #3b5e0b;	



}



#menu ul li#current a {	



	color: #3b5e0b;



}







/* Main Column */



#main {



	float: left;



	width: 555px;



	margin: 0; padding: 20px 0 0 0; 



	display: inline;



	background: url(../images/box.jpg) no-repeat; 	



}



#main h2 {



	font: normal 180% 'Trebuchet MS', Tahoma, Arial, Sans-serif;



	padding: 0;



	margin-bottom: 0;		



	color: #2666c3;



}



#main h2 a {



	color: #2666c3;



	text-decoration: none;	



}


#main blockquote, #main table, #main form {



	margin-left: 20px;



	margin-right: 25px;



}



#main ul li {



	list-style-image: url(../images/bullet.png); 



}

#main ul.playlist {
	margin-left: 0px;
}

#main li.playlist {
	margin-left: 20px;

	list-style-image: url(../images/bullet.png); 

}






#socialSearch {

	border-top-width: 1px;

	border-bottom-width: 1px;

	border-top-style: solid;

	border-bottom-style: solid;

	border-top-color: #CCCCCC;

	border-bottom-color: #CCCCCC;

	padding-top: 10px;

	padding-bottom: 10px;

	margin-bottom: 10px;

	overflow:auto;



}

#socialIcons {

	float:left;

}

#socialIcons ul {

	margin-top: 0px;

	margin-right: 0px;

	margin-bottom: 0px;

	margin-left: 0px;

	padding-top: 0px;

	padding-right: 0px;

	padding-bottom: 0px;

	padding-left: 0px;

}



#socialIcons li{

	display:inline;

	padding: 0px;

	margin-top: 0px;

	margin-right: 1px;

	margin-bottom: 0px;

	margin-left: 1px;

}

#socialIcons li img {

	padding: 0px;

	border: 0px;

	 /* IE 8 */

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";



  /* IE 5-7 */

  filter: alpha(opacity=50);



  /* Netscape */

  -moz-opacity: 0.5;



  /* Safari 1.x */

  -khtml-opacity: 0.5;



  /* Good browsers */

  opacity: 0.5;

}

#socialIcons li img:hover {

  /* IE 8 */

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";



  /* IE 5-7 */

  filter: alpha(opacity=100);



  /* Netscape */

  -moz-opacity: 1.0;



  /* Safari 1.x */

  -khtml-opacity: 1.0;



  /* Good browsers */

  opacity: 1.0;

}





span.tplTitle{

	color:white;

}



/* Sidebar */	



#sidebar {



	float: right;



	width: 195px;



	padding: 0; margin: 10px 0 0 0;



	font: 90%/1.3em 'Trebuchet MS', Tahoma, Sans-serif;	



	color: #555;	



}	



#sidebar h2 {



	margin: 15px 5px 10px 5px;



	font: bold 130%/1.4em 'Trebuchet MS', Tahoma, Sans-serif;



	color: #357cd0;	



}



#sidebar p {



	margin-left: 5px;



}







#sidebar ul.sidemenu {



	list-style: none;



	text-align: left;



	margin: 7px 10px 8px 0; padding: 0;



	text-decoration: none;	



	border-top: 1px solid #A9D4EF;	



}



#sidebar ul.sidemenu li {



	list-style: none;



	padding: 4px 0 4px 5px;



	margin: 0 2px;	



	color: #777;	



	border-bottom: 1px solid #D2E8F7; 



}



* html body #sidebar ul.sidemenu li {



	height: 1%;



}



#sidebar ul.sidemenu li a {



	text-decoration: none;	



	color: #1773BC;				



}



#sidebar ul.sidemenu li a:hover {	



	color: #333;



}



#sidebar ul.sidemenu ul { margin: 0 0 0 5px; padding: 0; }



#sidebar ul.sidemenu ul li { border: none; }







/* Footer */	



#footer {



	color: #C6DDEE;



	background: #caced1 url(../images/footer.jpg) no-repeat center top;



	clear: both;



	width: 790px;



	height: 57px;



	text-align: center;	



	font-size: 90%;	



}



#footer p { 



	padding: 10px 0;



	margin: 0;



}



#footer a { 



	color: #fff;



	text-decoration: none; 



}







/* post footer */



.post-footer {



	background: #F4F8FD;



	padding: 5px; margin: 20px 25px 0 25px;



	border: 1px solid #E5F0FB; 



	font-size: 95%;	



}



.post-footer .date {	padding-left: 0px; margin: 0 5px; }



.post-footer .comments { padding-left: 0px; margin: 0 5px; }



.post-footer .readmore { padding-left: 0px; margin: 0 5px; }







.post-by { font-size: .95em;	margin-top: 0;	}







/* alignment classes */



.float-left  { float: left; }



.float-right { float: right; }



.align-left  { text-align: left; }



.align-right { text-align: right; }







/* clearing */



.fix {



	clear: both;



	height: 1px;



	margin: -1px 0 0;



	overflow: hidden;



}



.clear { display:inline-block; }



.clear:after {



	display:block;



	visibility:hidden;



	clear:both;



	height:0;



	content: " ";



}



.lhead {
background-color:#fff;
padding:3px;
font-weight:bold;
font-size:16px;
}
.lpart {
background-color:#f0f0f0;
padding:0px;
}
.lpage {
font:normal;
}
.lcount {
background-color:#bbbbbb;
color:#fff;
padding:2px;
margin:2px;
font:bold 12px 'Trebuchet MS', sans-serif;
}

	#mediaplayer1 {
		padding-left: 20px;
		}
	#mediaplayer2 {
		padding-left: 20px;
		}
	#playlist {
		padding-left: 20px;
		}