/* styles for spontaneous.me.uk */



html, body {
    height: 100%;

    margin: 0;
    padding: 0;

    font-family: "Courier New";
    color: #4E4E4E;

    background: #ffffff;
    background-image: url('/images/bg_texture.jpg');
    background-repeat: repeat;
}



div {
    margin: 0;
    padding: 0;
}

/* ADDED */
#fullpage { position:absolute; top:0;left:0; width: 100%; }
div.fullpage {  width: 100%;
  min-height: 100%;
  height: auto !important;
  margin: 0 auto -4em;
  height: 100%;
}
#topSection {position:relative; left:0px; top:0px; height: 286px; width:100%; }
div.container { position: relative;
  width: 100%;
  min-height: 100%;
  height: auto !important;
  margin: 0 auto -4em auto;
  height: 100%;

  padding: 0 0 160px 0;

  background-image: url('/images/bg_edge2.jpg');
  background-repeat: repeat-y;
}
/* END */
img.logo {
  position:absolute;
  top: 0;
  left: 0;
  border: 0;
}

img.icon {
  border: 0;
  margin: 0;
  padding: 0;
}

img.premiumLogo{
  float: left;
  border: 1px solid #CC0202;
  margin-right: 20px;
}

img.rating{
  float: right;
  margin-right: 20px;
}



.pullquote {
  font-style: italic;
  font-size: 45pt;
  font-weight: bold;
  font-family: Georgia, "Times New Roman", serif;
  line-height: 1;
}



a img {
  border: 0;
}



a {
  text-decoration: none;
  color: #4E4E4E;
}

a:hover {
  text-decoration: underline;
}

h1,h2,h3,h4,h5,h6 {
  text-align:center;
}



span.underline{
  text-decoration: underline;
}

div.clearBoth{
  clear: both;
}



span.adRates{
  font-family: verdana,arial;
}

span.adRates h4{
  text-align: left;
  margin-top: 2em;
}

dl.adRates dd{
  font-weight: bold;
  margin: 10px 0 0 0;
}

dl.adRates dt{
  margin: 0 20px 0 2em;
}



/* contains intro panel, sets part of the bg for it */
div.columnLeft {
/* CHANGED */
  position: relative;
  left: 100px;
  top: 60px;
  float: left;
/* END */

  width: 220px;

  padding: 20px 0 0 0;

  background-image: url('/images/intro_bg_top.png');
  background-repeat: no-repeat;
  background-position: top center;
}



#intro div.endBg {
  padding: 0 25px 0 15px;

  background-image: url('/images/intro_bg_bottom.png');
  background-repeat: no-repeat;
  background-position: bottom left;
}



/* middle image for intro panel and most of the content */
#intro {
  color: #5E5E5E;
  font-weight: bold;
  font-size: 10pt;

  background-image: url('/images/intro_bg_middle.png');
  background-repeat: repeat-y;
}

#intro p {
  padding: 0;
  margin: 0 0 2em 0;

  clear: both;
}



#intro h1,h2,h3,h4,h5 {
  margin: 0;
  padding: 0;

  color: #CC0202;
  font-weight: bold;
  text-align: center;
  width: 100%;
}

#intro h3 {
  font-size: 14pt;
}



/* social media list of icons */
ul.socialMedia{
  list-style: none;

  padding: 0 0 25px 0;
  margin: 3px 0 0 0;

}

ul.socialMedia li {
  display: inline;

  margin: 0 4px 0 0;
}





/* seperate the rss icon a little */
ul.socialMedia li.rss img.icon{
  margin-left: 15px;
}

div.bannerAd {
  float: right;
  margin: 15px 45px 0 0;
}

div.bannerAd a img {
  border: 2px solid #4E4E4E;
}





/* wrapper for location menu.
  Fixed width (hack) as ul/li menu doesn't wrap properly on smaller browser windows */
div.locationMenu {
  position: absolute;
  left: 315px;
  top: 85px;

  margin: 0;
  padding: 0;

  font-size: 2em;
  font-weight: bold;
  letter-spacing: -1px;
  text-transform: lowercase;

}

div.locationMenu ul {
  margin: 20px  0 20px 0;

  list-style: none;
}

div.locationMenu li {
  display: inline;
  padding: 7px 0 8px 19px;

  background-image: url("/images/menu_bg_left.png");
  background-position: left;
  background-repeat: no-repeat;
}



div.locationMenu ul.lineOne {
  padding: 0;
}

div.locationMenu ul.lineTwo {
  padding: 0 0 0 40px;
}



div.locationMenu a {
  padding: 7px 0 8px 0;

  background-image: url("/images/menu_bg_middle.png");
  background-repeat: repeat-x;
}

div.locationMenu a:hover {
  text-decoration: none;
  color: #8E8E8E;
}

div.locationMenu div.endBg {
  display: inline;

  padding: 6px 30px 9px 0;

  background-image: url("/images/menu_bg_right.png");
  background-position: right;
  background-repeat: no-repeat;

}



#fadeshow1 {
  position: absolute;
  left: 340px;
  top: 280px;
  height: 300px;
  overflow: hidden;
}



div.postIt {
  position: absolute;

  width: 243px;



  padding: 85px 0 0 0;

  font-size: 10pt;
  letter-spacing: -1px;
  text-align: justify;

  background-image: url("/images/post-it_bg_top.jpg");
  background-position: left top;
  background-repeat: no-repeat;
}


#threeCol div.postIt {
  left: 830px;
  top: 230px;
}

#twoCol div.postIt {
  left: 85px;
  top: 310px;
}



div.postIt_bg_middle {
  padding: 5px 0 0 0;

  background-image: url("/images/post-it_bg_middle.jpg");
  background-position: left;
  background-repeat: repeat-y;
}

div.postIt_bg_bottom {
  padding: 0 37px 40px 27px;



  background-image: url("/images/post-it_bg_bottom.jpg");
  background-position: left bottom;
  background-repeat: no-repeat;
}

div.postIt span.newsTime {
  font-weight: bold;
  font-size: 10pt;
  float: right;
}

div.postIt a {
  display: block;
  clear: both;
  text-align: right;
  color: #2903E9;
  font-weight: bold;
  font-size: 10pt;
  text-decoration: underline;
}

div.postIt a:hover {
  text-decoration: none;
  color: #7E7E7E;
}







/* news scroller stuff */
dl#newsScroller{
  padding: 0 0 0 10px;
  margin: 0;
}



dl#newsScroller dd{
  margin: 0;
  padding: 20px 0 10px 0;

  clear:both;
}



dl#newsScroller img.tweetIcon {
  border: 0;
  float: left;
  margin: 0 5px 0  0;
}



/* news scroller magic - changing this makes it break ... */
div.ns{
  height:450px;
  position:relative;
  overflow:hidden;
}
div.ns div{
  height:450px;
  overflow:hidden;
}
div.ns dl{
  position:relative;
  top:0;
}
div.ns dl dd{
  position:relative;
}





div#mapForm {
  position: absolute;
  top: 610px;
  left: 330px;
  width: 465px;
  height: 391px;

  background-image: url("/images/map_bg.jpg");
  background-position: top left;
  background-repeat: no-repeat;
}



div#mapForm form {
  padding: 50px 0 0 20px;
}

div#mapForm li{
  margin: 0 0 0 0;
  padding: 0;

  list-style: none;
}

div#mapForm label{
  padding: 0;
  margin: 0;

  font-weight: bold;
  letter-spacing: -1px;
}



/* map pin stuff from */
dl.mapPinData {
  display: inline;
  margin: 0px;
  padding: 0px;
  text-align:left;
  width: 465px;
  height: 391px;
  position: relative;
  top: 0;
  left: 0;
}



dl.mapPinData dt {
  display: inline;
}

dl.mapPinData dd {
  border: 2px solid #4E4E4E;
  background-color: #ffffff;
  border-radius: 8px; /* CSS3 rounded corners */
  -moz-border-radius: 8px; /* Mozilla rounded corners */
  color: #4E4E4E;
  padding: 4px;
  width: 180px;
  position: absolute;
  left: -9999px;
  z-index: 11;
  font-size: 8pt;
}

dl.mapPinData a.location {
  background: url("/images/map_dot.png") no-repeat top left;
  display: block;
  outline: none;
  text-decoration: none;
  text-indent: -9999px;
  width: 14px;
  height: 15px;
  position: absolute;
  z-index: 10;
}
dl.mapPinData a.location:hover {
  background: url("/images/map_dot.png") no-repeat -1px -1px;
}

dl.mapPinData a#landsEnd {
  left: 220px; /*-8 for pin image size */
  top: 342px; /*-8 for pin image size */
}

dl.mapPinData a#johnOGroats {
  left: 288px; /*-8 for pin image size */
  top: 49px; /*-8 for pin image size */
}

dl.mapPinData a#london {
  left: 363px; /*-8 for pin image size */
  top: 293px; /*-8 for pin image size */
}





/* CXHANGED */
div.push { clear: both; }
div.footer { position:relative;
/* END */
  width: 100%;
  height: 100px;

  margin-left:auto;
  margin-right:auto;

  padding: 50px 0 10px 0;

  text-align: center;
  font-weight: bold;

  background-image: url('/images/bg_edge2.jpg');
  background-repeat: repeat-y;
}

div.footer ul{
  list-style: none;
}

div.footer li{
  display: inline;

  border-left: 1px solid #4E4E4E;
  border-right: 1px solid #4E4E4E;

  padding: 0 5px 0 5px;
  margin: 0 1px 0 1px;
}

div.footer hr {
  width: 60%;
  color: #4E4E4E;
  background-color: #4E4E4E;
  height: 3px;

  margin: 20px auto 10px auto;
}

span.lightflowinterrupted{
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 90%;
  color: #aaaaaa;
  background-color: #353535;
  padding: 0 10px 0 10px;
}

span.lightflowinterrupted_slash{
  padding: 0.0em 0.15em 0.0em 0.0em;
  font-size: 1.05em;
  font-weight: bold;
  letter-spacing: -3px;
  background-color: white;
  color: #353535;
}







div.searchResults{
  position: relative;
  float: right;
 /* left: 340px;*/
  top: 30px;
  width: 720px;

  background-color: #ffffff;
  background-image: url("/images/search_results_bg_top.jpg");
  background-position: left top;
  background-repeat: no-repeat;

  padding: 50px 0 0 0;
  margin-right: 50px;
}
/* idiot solution late at night */
div.absoluteSearchResults{
  position: absolute;
  top: 280px;
}

div.searchResults h3{
  color: #CC0202;
}

div.searchResults_bg_middle{
  background-color: #ffffff;
  background-image: url("/images/search_results_bg_middle.jpg");
  background-repeat: repeat-y;
}

div.searchResults_bg_end{
  padding: 0px 0px 50px 30px;

  background-image: url("/images/search_results_bg_bottom.jpg");
  background-position: bottom;
  background-repeat: no-repeat;
}

div.paginationControl{
  clear: both;
  margin-top: 25px;
  width: 100%;

  text-align: center;
  font-weight: bold;
  font-size: 12pt;
}

div.paginationControl span.disabled{
  color: #A0A0A0;
}

div.paginationControl span.currentPage{
    color: #A0A0A0;
  text-decoration: underline;
}

div.paginationControl a {
  text-decoration: underline;
}
div.paginationControl a:hover {
  text-decoration: none;
}



div.premiumProviderListing{
  border: 2px solid #CC0202;
  width: 90%;
  margin: 0 auto 20px auto;

  font-size: 10pt;
}



div.premiumProviderListing h2{
  margin: 20px auto 10px auto;
}

div.premiumProviderListing a{
  color:#CC0202;
  text-decoration: underline;
}

div.premiumProviderListing a:hover{
  text-decoration: none;
}

div.premiumProviderListing table{
  margin: 20px;

}

div.premiumProviderListing th{
  text-align: right;
}



table.providerListing{
  margin-left: auto;
  margin-right: auto;
  width: 80%;
}

table.providerListing th{
  text-align: left;
  background-color: #F0F0F0;
  border-bottom: 1px solid #4E4E4E;
  padding: 10px 5px 10px 5px;
}

table.providerListing td{
  padding: 5px 5px 5px 5px;
  margin: 0;
  font-size: 10pt;
  font-weight: bold;
  vertical-align: top;
}

table.providerListing td a{
  color: #CC0202;
  text-decoration: underline;
}
table.providerListing td a:hover{
  text-decoration: none;
}

table.providerListing tr.evenLine{
  background-color: #FFFFFF;
}

table.providerListing tr.oddLine{
  background-color: #F0F0F0;
}



ul.activityList{
  font-size: 10pt;
  list-style: none;
  margin: 0;
  padding: 0;
}

ul.activityList li{
  margin: 0;
  padding: 0;
}

ul.activityList a{
  font-size: 8pt;
  margin-left: 2em;
}

/* testing only, can be removed when we ahve the real google ads div */
img.AdsenseSkyscraper{
  position: absolute;
  right: 0;
  top: 180px;
}



div.providerSearchFormWrapper{
  padding-bottom: 50px;

}

div.providerSearchFormWrapper h4{
  padding-top: 10px
}

div.providerSearchFormWrapper ul{
  list-style: none;
  margin: 0;
  padding: 0;
}

div.providerSearchFormWrapper li{
  margin: 0;
  padding: 0;
}

div.providerSearchFormWrapper hr{
  width: 60%;
  height: 1px;
  padding: 0;
  margin: 10px auto 0 auto;

  color: #4E4E4E;
  background-color: #4E4E4E;
}

div.providerSearchFormWrapper .searchButton{
  width: 100%;
  text-align: center;
  margin-top: 20px;
}

div.providerSearchFormWrapper a.more{
  margin: 0 0 0 25px;
  color: #222222;
}



div.showProvider p{
  font-family: arial, verdana;
  font-weight: bold;
  padding-right: 100px;
  font-style: italic;
  text-indent: -1em;
}

div.showProvider h1{
  color: #CC0202;
  margin: 0;
  padding: 1em 0 0 0;
}

div.showProvider ul.socialMedia{
  width: 100%;
  text-align: center;
}

div.showProvider a{
  color: #CC0202;
  text-decoration: underline;
  font-weight: bold;
}



a#reportBroken{
  float: right;
  font-size: 8pt;
}

div.showProvider a:hover{
  text-decoration:none;
}

div.showProvider div.colOne{
  float: left;
  width: 300px;
  padding: 25px 20px 0 0;

}
div.showProvider div.colTwo{

  width: 300px;
  margin: 25px 0 0 320px;
  padding-left: 25px;
  border-left: 1px solid black;
}

div.showProvider dt {
  font-weight: bold;
}

/*div.showProvider hr {
  clear: both;
}*/

h4.providerComments{
  text-align: left;
  text-decoration: underline;
  color: #4E4E4E;
  margin: 30px 0 0 30px;
  padding: 0;
  width: auto;
}

dl.providerComments {
  font-size: 10pt;
  margin-left: 30px;
  width: 80%;
}

dl.providerComments dt {
  padding-top: 15px;
  font-weight: normal;
}

dl.providerComments span.commentName{
  font-style: italic;
  font-weight: bold;
}

div.commentFormPane{
  padding: 5px 0 0 30px;
}



object.youTubeVideo{
  width: 100%;

  margin-left:80px;
  margin-right:auto;
}

div.youTubeWrapper{
  width: 90%;
  margin-left:auto;
  margin-right:auto;
  margin-top: 50px;
  margin-bottom: 50px;
}

div.youTubeWrapper h4{
  text-align: left;
}