/****************************************************************
 * layout.css
 *
 * talent4.tv | talent4media.com | talent4media.co.uk
 * 
 * site layout - element positioning etc
 ****************************************************************/


* {
		margin: 0;
		padding: 0;
}

/* IE5 Mac hide \*/
html, body{
		height:100%;
		width:100%;
}
/* end hide */


body {
		text-align: center;         /* centres blocks in IE5 */
		background-color: #fff;
		min-width: 782px;
		min-height: 552px;
}


#wrapper{
		height: 100%;
		width: 100%;
		display: table;
		vertical-align: middle;
}

.vcenter {
		text-align: center;
		position: relative;
		vertical-align: middle;
		display: table-cell;
		height: 552px;
} 


#site {
    margin: 10px auto;
		position: relative;
    top: 0px;
    width: 782px;
   	height: 552px;
   	background-color: #fff;
    text-align: center;
}


#header {
    position: absolute;	
    left: 0px;
    top: 0px;
    width: 782px;
    height: 40px;
    background-color: #fff;
    border-bottom: 1px solid #f09;
}


#sitelogo {
    position: absolute;
    top: 0px;
    left: 442px;
    width: 340px;
    height: 40px;
    float: right;
    background-image: url(/images/sitelogo.png);
    background-repeat: no-repeat;
}


#sidebar {
    position: absolute;
    top: 56px;
    left: 0px;
    width: 180px;
    height: 495px; 
    border-bottom: 1px solid #f09;
}


#copyright {
    position: absolute;
    top: 460px;
    left: 0px;
    width: 180px;
    height: 32px;
    overflow: hidden;
}


#contentarea {
    position: absolute;
    top: 60px;
    left: 200px;
    width: 580px;
    height: 490px;
    text-align: left;
}


#square1 {
    position: absolute;
    left: 0px;
    width: 180px;
    height: 180px;
    border: 1px solid #f09;   
}


#square2 {
    position: absolute;
    left: 200px;
    width: 180px;
    height: 180px;
    border: 1px solid #f09;  
}


#square3 {
    position: absolute;
    left: 400px;
    width: 180px;
    height: 180px;
    border: 1px solid #f09;   
}


#photo1 {
		position: absolute;
    left: 0px;
    width: 180px;
    height: 180px;
    border: 0px;
}


#photo2 {
		position: absolute;
    left: 0px;
    width: 180px;
    height: 180px;
    border: 0px;
}


#photo3 {
		position: absolute;
    left: 0px;
    width: 180px;
    height: 180px;
    border: 0px;
}


#rectangle {
		border: 0px;
}


#movielink {
    position: absolute;
    top: 157px;
    width: 170px;
    height: 22px;
    text-align: right;
    color: #f09;
    overflow: hidden;
    border: 0px;
}


#showreel {
    position: absolute;
    left: 200px;
    width: 380px;
    height: 180px;
    border: 1px solid #f09;
    background-color: #000;
		visibility: hidden;
		overflow: hidden;
}


#main {
    position: absolute;
    top: 200px;
    left: 0px;
    width: 580px;
    height: 290px;
    border: 1px solid #f09;
    background-color: #fff;
}


#title {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 530px;
    height: 30px;
}


#container {
    position: absolute;
    top: 41px;
    left: 12px;
    width: 555px;
    height: 240px;
    overflow: hidden;
}


#content {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 550px;  	
   	height: 240px;
		overflow:auto;
		padding-right: 5px;
}


#contact {
		width: 187px;
}


table {
		width: 180px;
		border: 0px;
		border-spacing: 0px;
    border-collapse: collapse; /*IE*/		
}


td.col1 {
		width: 37px;	
}


td.col2 {
		width: 143px;	
}


#map_canvas {
		position: absolute;
		top: 0px;
		left: 187px;
		width: 366px;
		height: 238px;
		border: 1px solid #f09;
}