/*************************************************************
 
Laszlo Media CSS design
-------------------------------------------------------------
 
Author	:	Ralph Cowling
Contact	:	acastofthousands [at] gmail [dot] com
  
*************************************************************/


/*============================================================
Universal Elements
============================================================*/

a	
	{
	text-decoration: none;
	}

a:hover 
	{
	text-decoration:none;
	}

a img, a img:hover
	{
	border: none;
	}
img
	{
	border: none;
	}

/*============================================================
Layout
============================================================*/

#container
{
	width: 860px;
	height: 630px;
	padding: 0px;
	background-color: #fff;
	margin-left: auto;
	margin-right: auto;
	margin-top: auto;
	margin-bottom: auto;
	text-align: center;
	border-color: #000;
	border-width: 3px;
	border-style: solid;
	padding: 15px;
}

#banner
{
	float: left;
	width: 850px;
	height: 140px;
	margin-top: 5px;
	padding: 0px;
}

#divider

{
	float: left;
	width: 827px;
	margin-left: 16px;
	margin-bottom: 2px;
	margin-top: 5px;
	background-color: #fff;
	border-top: 1px solid black;
}


/*------------------------------------------------------------
 Box-Navigation
------------------------------------------------------------*/


#nav
	{
	width: 830px;
	height: 30px;
	float:left;
	margin-left:10px;
	margin-bottom:5px;
	}
	
#nav a img {
	margin-top: 5px;
	margin-right: 10px;
}
	
.active-box
	{
	float:left;
	display:inline;
	margin: 0px;
	background-color:#fff;
	border-left: 3px solid white;
	border-top: 1px solid white;
	border-bottom: 1px solid white;
	padding:0px;
	vertical-align:top;
	text-align:center;
	width:163px;
	height:30px;
	}

.active-box a
	{
	display: block;
	font: 14px Helvetica, Verdana, Arial, "trebuchet ms";
	background-color:#990033;
	letter-spacing: 2px;
	color: #fff;
	font-weight: normal;
	text-decoration: none;
	line-height:30px;
	}
	
.active-box a:hover
{
	background-color: #ababab;
	color: #fff;
	font-size: 14px;
	font-weight: normal;
	text-decoration: none;
} 	


.box
	{
	float:left;
	display:inline;
	margin: 0px;
	background-color:#000;
	border-left: 3px solid white;
	border-top: 1px solid white;
	border-bottom: 1px solid white;
	padding:0px;
	vertical-align:top;
	text-align:center;
	width:163px;
	height:30px;
	}

.box a,
.box a:visited
	{
	display: block;
	font: 14px Helvetica, Verdana, Arial, "trebuchet ms";
	letter-spacing: 2px;
	color:#fff;
	font-weight:normal;
	text-decoration: none;
	line-height:30px;
	}
	

.box a:hover
	{
	background-color:#ababab;
	color: #fff;
	font-size: 14px;
	font-weight: normal;
	text-decoration:none;
	} 



/*------------------------------------------------------------
Index Container
------------------------------------------------------------*/

#tagline-container
	{
	float: left;
	width: 310px;
	height: 400px;
	margin-left:16px;
	margin-right:2px;
	margin-top: 2px;
	}

#tagline-content
	{
	padding: 10px 0 5px 5px;
	text-align: left;
	}
	


/*------------------------------------------------------------
Image Display -- Front Page, Contact Page
------------------------------------------------------------*/

#images-display
	{
	float:	left;
	margin-left: 20px;
	margin-top: 2px;
	background-color: #dd9999;
	width: 	495px;
	height: 400px;
	overflow: hidden;
	}


/*------------------------------------------------------------
 Left Column
------------------------------------------------------------*/

#left-col 
	{
	float: left;
	width: 245px;
	height: 400px;
	margin-left:16px;
	margin-top: 2px;
	overflow: auto;
	text-align: left;
	background-color: #fff;
	}
	
#left-col-content
	{
	padding: 10px 0 5px 2px;
	text-align: left;
	}

#left-col-names
	{
	padding: 0px 0 5px 6px;
	text-align: left;
	}
	



/*------------------------------------------------------------
 Commercials Columns
------------------------------------------------------------*/

#right-column
	{
	float: left;
	margin-left: 6px;
	margin-top: 2px;
	background-color: #fff;
	width: 	407px;
	height: 400px;
	}

#selection
{
	float: left;
	margin-left: 6px;
	margin-top: 2px;
	width: 163px;
	height: 360px;
	background-color: #fff;
	padding: 10px 0 0 5px;
	vertical-align: middle;
	text-align: left;
}

#video
	{
	float: left;
	margin-left: 30px;
	margin-top: 0px;
	width: 350px;
	height: 280px;
	background-color: #fff;
	}
	
#picture
	{
	float: left;
	margin-left: 0px;
	margin-top: 0px;
	width: 407px;
	height: 400px;
	background-color: #ddd;
	text-align: center;
	}
	
/*------------------------------------------------------------
 Stills Columns
------------------------------------------------------------*/

#stills-col
	{
	float: left;
	margin-left: 6px;
	margin-top: 2px;
	background-color: #fff;
	width: 	575px;
	height: 400px;
	}


.stills-content
	{
	float: left;
	margin-top: 12px;
	background-color: #fff;
	width: 	575px;
	height: 125px;
	text-align: right;
	}	
	
	
/*------------------------------------------------------------
 Client
------------------------------------------------------------*/

#client-col 
	{
	float: left;
	width: 827px;
	height: 400px;
	margin-left:6px;
	margin-top: 2px;
	text-align: center;
	}

#password
	{
	float: left;
	margin-top: 50px;
	margin-left: 40%;
	margin-right: 70%;
	text-align: left;
	width: 170px;
	height: 50%;
	}

.login
	{
	font: 14px Helvetica, Verdana, Arial, "trebuchet ms";
	}

.login-fail
	{
	font: 14px Helvetica, Verdana, Arial, "trebuchet ms";
	color: #ee0000;
	text-align: center;
	padding: 0 10px 0 0;
	}


/*----------------------------
 Listings - Names
------------------------------*/

h3.names,
h3.names a,
h3.names a:visited,
h3.names a:active
	{
	color: #333333;
	font-family: Helvetica, Verdana, Arial;
	font-size: 16px;
	font-weight: normal;
	text-decoration: none;
	line-height: 100%;
	margin-top: 8px;
	}
	
h3.names a:hover
	{
	color: #330011;
	font-size: 16px;
	font-weight: normal;
	text-decoration: none;
	line-height: 100%;
	margin-top: 8px;
	}

h3.names-active,	
h3.names-active a,
h3.names-active a:active,
h3.names-active a:visited

	{
	color:#990033;
	font-family: Helvetica, Verdana, Arial;
	font-size: 16px;
	margin-top: 8px;
	line-height: 100%;
	font-weight: normal;
	text-decoration: none;	
	}


h3.names-active a:hover
	{
	color:#333333;
	font-family: Helvetica, Verdana, Arial;
	font-size: 16px;
	font-weight: normal;
	text-decoration: none;	
	}

/*----------------------------
 Listings - Titles
------------------------------*/

.titles,
.titles a,
.titles a:visited,
.titles a:active
	{
	color: #000;
	font-family: Helvetica, Verdana, Arial;
	font-size: 20px;
	text-decoration: none;
	font-weight: normal;
	}
	
.titles a:hover
	{
	color: #ababab;
	font-size: 20px;
	text-decoration: none;
	font-weight: normal;
	}

.titles-active,	
.titles-active a,
.titles-active a:active,
.titles-active a:visited

	{
	color:#990033;
	font-family: Helvetica, Verdana, Arial;
	font-size: 20px;
	text-decoration: none;	
	font-weight: normal;
	}


.titles-active a:hover
	{
	color:#fff;
	font-family: Helvetica, Verdana, Arial;
	font-size: 20px;
	text-decoration: none;	
	font-weight: normal;
	}


/*------------------------------------------------------------
Footer
------------------------------------------------------------*/

#footer
	{
	float: left;
	width: 827px;
	height: 30px;
	background-color:#000;
	margin-left:16px;
	margin-right:2px;
	margin-top: 8px;
	}

#footer-content
	{
	margin-left: auto;
	margin-right:auto;
	text-align: center;
	padding: 1px 0 0 0;
	}