/*
Theme Name: DavidBroad.co.uk
Theme URI: www.davidbroad.co.uk
Description: A brief description.
Version: 1.0
Author: David Broad
Author URI: www.davidbroad.co.uk
*/




body {
	overflow:hidden; 		/* needed to eliminate scrollbars caused by the background image */
	padding:0;margin:0;		/* necesarry for the raster to fill the screen */
	height:100%;width:100%;
}

@font-face {
    font-family: 'FranchiseRegular';
    src: url('franchise-bold-webfont.eot');
    src: url('franchise-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('franchise-bold-webfont.woff') format('woff'),
         url('franchise-bold-webfont.ttf') format('truetype'),
         url('franchise-bold-webfont.svg#FranchiseRegular') format('svg');
    font-weight: normal;
    font-style: normal;
	}
	
#bgimg {
	position:absolute;
	z-index: -1;
	border:none;
}

#realBody{
	position:absolute;
	z-index: 5;				/* Place the new body above the background image */
	overflow:auto; 			/* restore scrollbars for the content */
	height:100%;width:100%;	/* Make the new body fill the screen */
	background: url('/img/raster.png'); /* this is just a fancy raster, you can remove it; I kinda like it though */
}

/* 
	The following CSS code is for illustrative purposes, and is NOT necesarry for the fullscreenr plugin to work
*/

a{font-weight: bold;
text-decoration: none;
color: #1B222C;}

p {
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	padding:0 0 20px 0;
	margin:0;
	}
	
h2 {font-family: 'FranchiseRegular', Arial;
	font-size:1.5em;
	text-transform:uppercase;
	color:#1a3838;
	padding:10px 0 10px 0;
	margin:0;}	

img{
	border:10px solid rgba(97, 16, 1, 0.4);
}

ul{list-style-type:none;padding-left:0px;font-family: Verdana, Geneva, sans-serif;font-size:0.7em;}

#video{
	-pie-background: rgba(255, 255, 255, 0.7);
	background: rgba(255, 255, 255, 0.7);
	-ms-filter: alpha(opacity=70);
	width:601px;
	height:339px;
	margin:100px 0 0 60px;
	padding:0;
	border:solid rgb(97, 16, 1) 10px;
	border:solid 10px rgba(97, 16, 1, 0.4);
}

#content{
	background-color:white;
	width:45%;
	margin:25px 0 0 60px;
	padding:10px 30px 300px 30px;
	border:solid rgb(97, 16, 1) 10px;
	border:solid 10px rgba(97, 16, 1, 0.4);
	
	min-height:400px;
    height:auto !important;
   float:left;
	
	-pie-background: rgba(255, 255, 255, 0.7);
	background: rgba(255, 255, 255, 0.7);
	-ms-filter: alpha(opacity=70);
}

#content p{
	line-height: 1.5;
}


#name{
	background:#611001;
	right:0px;
	position:absolute;
	top: 50px;
	text-align:center;
	padding:8px 12px;
	margin-right:17px;
	font-family: 'FranchiseRegular', Arial;
	font-size:1.5em;
	text-transform:uppercase;
	color:#fffbe1;
	position:fixed;
}
#name h1 {
	 padding:0;
	 margin:0;
	 font-size:30px;
	 }

#navigation {
	width:100%;
	background:#611001;
	position:absolute;
	bottom: 50px;
	text-align:center;
	padding: 0;
	position:fixed;
	right:17px;
}

#navigation ul{
	margin:0;
	padding:0 0 0 32px;
	list-style:none;
	float:left;
	position:relative;

	
}
#navigation li{
	float:left;
	list-style:none;
	position:relative;
	font-family:'FranchiseRegular', Arial;
	font-size:20px;
	text-transform:uppercase;
	color:#ffff00;
				padding:12px 0 12px 0;

}
	#navigation a {
		color:#fffbe1;
		font-family:'FranchiseRegular', Arial;
		font-weight:normal;
		font-size:22px;
		text-decoration:none;
			padding:12px 10px 12px 10px;
			border-left:solid #611001 1px;
			border-right:solid #611001 1px;

	}

	#navigation li a:hover {
		border-left:solid #831f20 1px;
		border-right:solid #831f20 1px;
		padding:12px 10px 12px 10px;
		color:;
	}
	
textarea#comment { 
	-pie-background: rgba(255, 255, 255, 0.7);
	background: rgba(255, 255, 255, 0.7);
	-ms-filter: alpha(opacity=70);
	}  
	
	input[type=submit]{
	color: #FFFBE1;
font-family: 'FranchiseRegular', Arial;
font-weight: normal;
font-size: 22px;
text-decoration: none;
padding: 2px 6px 4px 6px;
border: solid #831f20 1px;
background-color: #611001;
}

input[type=submit]:hover{background-color:#831f20;}
/*myspace iframe */

#outerdiv
{
width:350px;
height:360px;
overflow:hidden;
position:relative;
}

#inneriframe
{
position:absolute;
top:-220px;
left:-310px;
width:1280px;
height:1200px;
}

.aligncenter{
	margin:0 auto;
}

.wp-caption-text{
	text-align: center;
}

@media screen and (max-width: 750px) and (min-width: 100px) {

img, iframe, .wp-caption{
width: 80% !important;
height: auto;
  }
  
  #content{
width: 65%;
margin: 159px 5% 0 5%;
padding: 10px 10% 300px 10%;
	
  }  
  
  #name{top: 0;
left: 0;position: absolute;
  margin-right: 0px;}
	
  #navigation{
  top: 48px;
	bottom:auto;
	position: absolute;
	margin-right: 0px;
	right: 0px;
  }
  
  #navigation li{
	width: 24%;}
  
  #bgimg{
  width:100% !important;
  }
  
  #video{width: 86%;
margin: 159px 5% 0 5%;
padding: 0;
  height:auto;}
  
  #video iframe{width: 100% !important;
height: 50%;}