.topheader {
  background-color: #0b314a;
}

.maincontent{
  background : none; 
}
body{
  background : rgb(0, 160, 218); 
  
  
}



.pagesmaintext {
  font-family: sans-serif;
  color: #fff;
  font-size: 1.2em;
  text-align: center;
}

#system-message .message {
color: #000;
}


h2{
  font-family: sans-serif;
  margin: 2px auto;
}

a {
  color: #fff;
  text-decoration: underline;
}

a:hover{
  text-decoration: underline;
}

.bannerheader {
width: 100%;
height: auto;
background : rgb(10, 60, 97); 
z-index: 0;
position: relative;
/*align: center;*/
}



.contentbanner {
  padding: 0px;
  max-width: 1024px;
  margin: 0 auto;
  width: 100%;
  height: 165px;
  z-index: 1000;
  position: relative;
  overflow: hidden;
}


.logo {
    top: 45%;
    left: 40%;
    width: 120px;
    position: absolute;
    z-index: 4003;
}

/*
.logo {
    float: right!important;
    bottom: 25%!important;
    right: 2%!important;
    left: initial!important;
    top: initial!important;
    position: absolute!important;
    z-index: 4003;
}*/

#top_star_line {
    width: 100%;
    height: 1px;
    background: url('../images/strip.jpg') no-repeat;
    top: 77%;
    position: absolute;
    z-index: 11;
}


#menu-overlap {
  position: absolute;
  max-width: 1024px;
  width: 100%;
  left: 0;
  
  margin: 0 0 -40px 0;
  padding: 0;
  height: 40px;
  z-index: 100;
}

.tbph, .tbbox {
  float: left;
  width: 96%;
  margin: 0 2% 25px;
  min-height: 290px;
  min-width: 255px;
}

.verybtm {
  display: none;
}


/* countdown timer */ 
#clockdiv {
  position: absolute;
  right: 10px;
  bottom: 25%;
}



#clockdiv h4{
  font-family: sans-serif;
  font-size: 1em;
  text-align: center;
  color: rgb(0, 160, 218);
}


.countdown_clock {
    font-family: sans-serif;
    color: #fff;
    display: inline-block;
    font-weight: 100;
    text-align: center;
    font-size: 20px;
    
    padding: 10px;
    border-radius: 3px;
    background: #0b314a;
}

.countdown_clock > div{

    display: inline-block;
}

.countdown_clock div > span{
    padding: 10px;
    border-radius: 3px;
    background: rgb(0, 160, 218);
    display: inline-block;
}

.smalltext{
    padding-top: 4px;
    font-size: 11px;
}



@media only screen and (min-width: 400px) {
  .contentbanner {
    height: 160px;
  }
  

}


@media only screen and (min-width: 700px) {
  .contentbanner {
    height: 180px;
  }
  
  .first, .second  {
    width: 45%;
  }
}


@media only screen and (min-width: 800px) {
  .contentbanner {
    height: 220px;
  }

}

@media only screen and (max-width: 800px) {
  .section_header img {  
    width: 380px;
  }
  
  .section_header {  
    left: 40%;
    margin-left: -20%;
  }
}

@media only screen and (max-width: 900px) {
  .logo {  
     left: initial;
     top: initial;
     right: 2%;
     bottom: 35%;
  }
}

@media only screen and (min-width: 900px) {

  .booknight_wrapper #map-wrapper{
    height: 800px;
  }
  .booknight_wrapper #map-placeholder {
    
  height: 720px;
  }
}

@media only screen and (min-width: 980px) {
  .tbph, .tbbox {
    width: 29%;
  }

}

@media only screen and (max-width: 1024px) {
    .section_header img {  
    width: 380px;
  }
}

@media only screen and (min-width: 1024px) {
/*  .contentbanner {
    height: 270px;
  }*/
  
  .section_header {
    height: 118%;
  }

  #menu-overlap {
    margin: 0 0 -40px -512px;
    left: 50%;
  }
}

@media only screen and (max-width: 450px) {
    .logo {
    display: none;
  }

}

@media only screen and (max-width: 620px) {
    .mobile_hide_s {
      display: block!important;

  }
  
  
  .section_header img {  
    width: 256px;
    min-width:  256px;
    clip: rect(0,160px,0,0);
  }

  .logo {
    width: 100px;
  }

  .flip-counter {
    zoom: 0.5;
    -moz-transform: scale(0.5);
  }
  
}

@media only screen and (max-width: 900px) {
  .bannerheader {
    width: 100%;
    background-repeat: repeat-x;
    background-position: center;
  } 
  
  .mainpages {
    background-image: none;
  }
  .pagesmaintext {
    padding-bottom: 20px;
  }
  
  
  
 
}