/*
 * Style sheet for coloursurgemedia.co.uk
 */

body { 
background: #555555; 
color: #777777; 
font-family: Arial, Helvetica, sans-serif;
font-size: 0.8125em ;  /* 13px / 16px = 0.8125em */
font-weight: normal;
text-align: left;
width: 900px ; 
margin-left: auto ;
margin-right: auto ;
overflow:scroll;
}

A:link { color: #FF6600 }       /* unvisited link */
A:visited { color: #777777 }   /* visited links */
A:active { color: #FF6600 }    /* active links */
                

p {
padding: 10px 10px 5px 5px;
border:  10px 10px 5px 5px;
margin:  5px 5px 5px 5px;
}


/* i { */
/* color: #FFFFFF; */
/* font-style: italic; */
/* } */


em {
font-size: 1.5em ;  /* 24px / 16px = 1.5em */
font-style: normal;
font-weight: bold;
color: #6688BB; 
padding: 10px 10px 5px 5px;
border:  10px 10px 5px 5px;
margin:  5px 5px 5px 5px;
}

em.events {
font-size: 1.5em ;  /* 24px / 16px = 1.5em */
font-style: normal;
font-weight: bold;
color: #6688BB; 
padding: 0px;
border:  0px;
margin:  0px;
}

p.small_print {
font-size: 0.6875em ;  /* 11px / 16px */
font-weight: bold;
}   

p.reducedpadding {
padding: 5px 5px 5px 5px;
border:  5px 5px 5px 5px;
margin:  0px 0px 5px 5px;
}  

h1 {
font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
font-size: 3.8em ;  /* 60.8px / 16px = 3.8em */
font-weight: bold;
text-align: left;
color: #FFFFFF; 
padding: 0px;
border:  0px;
margin:  0px;
}

h2 {
color: #6688BB; 
padding: 10px 10px 5px 5px;
border:  10px 10px 5px 5px;
margin:  5px 5px 5px 5px;
}

h3 {
font-size: 1.1em ;  /* 17.6px / 16px = 3.8em */
padding: 0px 0px 5px 5px;
border:  0px 0px 5px 5px;
margin:  0px 0px 5px 5px;
}



h2.reducedpadding {
padding: 0px 0px 0px 0px;
border:  0px 5px 0px 0px;
margin:  0px 0px 0px 0px;
} 


img.title {

}

img.linksbar {
border:0px;
}

img.socialmedia {
border:0px;
}

div.clr {clear:both;} 

div#pageheader
{ 
top:0px;
left:0px;
width:850px;
}


div#pagecontent {
width:860px;
background-color: #FFFFFF; 
border-style:solid;
border-width:5px; 
border-color: #EEEEEE;
margin:0px; padding:10px;
}

div#pagetitle {
float:left;
width:860px;
border:0px; 
margin:0px; 
padding:0px 0px 0px 10px;
}

div#logo
{ 
z-index:2;
width:370px;
position:relative;
top:-10px;
border:0px; margin:0px; padding:0px;
}


div#socialmedialinks {
float:right;
position:relative;
top:15px;
border:0px; margin:0px; padding:0px;
}

div#contacttext {
float:right;
position:relative;
left:0px;
top:20px;
width:250px;
text-align:right;
font-size: 1.25em ;  /* 20px / 16px = 1.5em */
font-weight: normal; 
}

div#contacttext_index {
float:right;
position:relative;
left:0px;
top:20px;
width:250px;
text-align:right;
font-size: 1.25em ;  /* 20px / 16px = 1.5em */
font-weight: normal; 
}

div#sitelinksbar {
float:left;
clear:both;
position:relative;
top:-10px;
left:10px;
border:0px; margin:0px; padding:0px;
}

div#sitelinksbar_index {
float:left;
clear:both;
position:relative;
top:-10px;
left:10px;
border:0px; margin:0px; padding:0px;
}


div#pagetitletext {
position:relative;
z-index:2;
top:-50px;
left:3px;
}


div.pageblockleft {
float:left;
position:relative;
top:-30px;
width:400px;
background-color: #FFFFFF; 
padding: 0px, 10px;
border:  0px 0px 0px 0px;
margin:  0px 0px 0px 15px;
}

div.pageblockright {
float:right;
position:relative;
top:-30px;
width:390px;
padding: 0px, 10px;
}

div.pageblockspan {
float:left;
position:relative;
top:-30px;
width:825px;
background-color: #FFFFFF; 
padding: 0px, 10px;
border:  0px 0px 0px 0px;
margin:  0px 0px 0px 15px;
}


div.featuredvideo {
float:left;
top:30px;
left:100px;
width:790px;
background-color: #FFFFFF; 
padding: 0px, 10px;
border:  0px 0px 0px 0px;
margin:  0px 0px 0px 15px;
}




div#testimonialcorp {
z-index:1;
position:relative;
left:50px;
top:20px;
width:230px;
background-color: #EEEEEE;   
text-align: center;  
padding: 5px;
}


div#testimonialevents {
z-index:1;
position:relative;
left:50px;
top:20px;
width:230px;
background-color: #EEEEEE;   
text-align: center;  
padding: 5px;
}


div.clipspacer {
position:relative;
top:30px;
left:180px;
width:650px;
height:40px;
}


div.clipspacerright {
position:relative;
top:30px;
left:0px;
width:350px;
height:40px;
}

div.thinspacer {
position:relative;
top:30px;
left:180px;
width:650px;
height:20px;
}



iframe.vimeovideo {
height: 291px;
width: 360px;
padding: 10px 10px 5px 5px;
border:  10px 10px 5px 5px;
margin:  5px 5px 5px 5px;
}

iframe.youtubevideolarge {
height: 568px;
width: 720px;
}

iframe.youtubevideo {
height: 290px;
width: 355px;
padding: 10px 10px 5px 5px;
border:  10px 10px 5px 5px;
margin:  5px 5px 5px 5px;
}

iframe.youtubevideo16-9 {
height: 230px;
width: 355px;
padding: 10px 10px 5px 5px;
border:  10px 10px 5px 5px;
margin:  5px 5px 5px 5px;
}

iframe.youtubevideo16-9large {
height: 480px;
width: 800px; 
padding: 10px 10px 5px 5px;
border:  10px 10px 5px 5px;
margin:  5px 5px 5px 5px;
}

div#twitterwidget 
{
position:relative;
left:10px;
}

div#contactbox
{
position:relative;
top:20px;
left:275px;
width: 350px;
border:0px; margin:0px; padding:0px;
}

label {
width: 4em;
margin-right: 0.5em;
display: block
}

textarea {
text-align: left;
margin-right: 0.5em;
display: block
overflow: auto;
}

input.submitbutton {
position:relative;
top:0px;
left:180px;
}

@media (max-width: 600px) {
  div#sitelinksbar,
  div#contacttext {
    float: none;
  }
  div.pageblockleft,
  div.pageblockright {
    float: none;  
    margin: 0px;
  }
  div.clipspacer,
  div.clipspacerright {
   left:0px;
   width:200px;
  }
  body {
   width:430px;
  }
  div#pagecontent,
  div#pageheader,
  div#pagetitle {
    width:400px;
  }
  div#logo {
   float: none;
   width:300px;
   position:relative;
   left:40px;
  }

  img.title {
   width:380px;
  }

  div#contacttext {
   right:0px;
  }
  iframe.youtubevideolarge {
   height: 240px;
   width: 360px;
  }
  
}