@charset "utf-8";
/* CSS Document

Author: Chris Stevens, © AA Tourism 2012

[ TABLE OF CONTENTS ]

1. Resets
2. Main Editable Elements
  2.1 Paragraphs and Headings
  2.2 Main Navigation
  2.3 Backgrounds
  2.4 Feature Blocks (home page header)
  2.5 Negative Space
  2.6 Buttons and Links
  2.7 Quotes

3. Layout / Other
  3.1 Template Layout / OOCSS
  3.2 Page Columns
  3.3 Footer

4.  CSS for Mobile Devices
  4.1 Screen size: 580px wide
  4.2 Screen size: 420px wide
*/


/**********************************************
 1. RESET
***********************************************/
* {
  margin: 0;
  padding: 0;
  border:none;
  text-decoration:none;
  font-weight:normal;
}

/*img {
  display:block;
}*/

:focus {
  outline: 0;
}

small{
  font-size:11px;
}


/**********************************************
 2. MAIN EDITABLE ELEMENTS
***********************************************/
/*2.1 Paragraphs and Headings*/
h1, h2{
  color:#2888ab;
  margin-bottom:15px;
  font-size:27px;
  line-height:30px;
}

h3 {
  font-size:22px;
  line-height:25px;
  color: #423d44;
  margin-bottom:15px;
  font-weight:bold;
}

h4 {
  font-size:15px;
  color: #423d44;
  margin-bottom:5px;
  font-weight:bold;
}

#specials h4 {
  color: #FFFFFF;
}

h4 a, h3 a, h2 a, h1 a {
  text-decoration:none;
}

.heading-underline {
  padding-bottom:5px;
  border-bottom: 1px dotted #888;
}

.call-to-action {
  font-size:27px;
}

.divider {
  border-bottom:1px solid #dcdcdc;
  padding-bottom:12px!important;
  margin-bottom:15px;
}

.phone, .email {
  display:block;
  padding:3px 5px 3px 40px;
}

.phone {
  background:url(../images/phone-icon.png) no-repeat;
}

.email {
  background:url(../images/email-icon.png) no-repeat;
}

strong {
  font-weight:bold;
}

p, .large-content-column, .small-content-columnm, .full-width-content {
  line-height:19px;
}

p {
  margin-bottom:20px;
}

.relative {
  position:relative;
}

/*2.2 Main Navigation */
/*Main Navigation Colours */
#header ul li a {
  color:#FFFFFF;
  text-decoration:none;
}

#header ul li a:hover, .nav-selected {
  color:#000 !important;
}

/*Main Navigation Other*/
#header ul {
  margin:20px 0 20px 0px;
  text-transform:uppercase;
  float:left;
  background-color: #2888AB;
  width: 100%;
}

#header ul li {
  float:left;
  display:block;
  list-style:none;
  padding:15px 16px;
  /*background:url(../images/main-nav-divider.png) no-repeat right;*/
}

#header ul li a {
  font-size:12px;
  font-family:Verdana, Geneva, sans-serif;
  padding:11px 0 0 0;
  display:block;
}

#header ul li a:hover, #header ul li .nav-selected {
  padding:7px 0 0 0;
  border-top:solid 4px;
}

.large-content-column ul, .small-content-columnm ul, .full-width-content ul {
  margin:20px 0 20px 0;
}

.large-content-column li, .small-content-columnm li, .full-width-content li {
  margin-left:35px;
}

/*2.3 Backgrounds */
body {
  color:#555555;
  background-color: #2a8bac;
  background-image: url(../images/body-background.jpg);
  background-repeat: no-repeat;
  background-position: top center;
  background-attachment: fixed;
  background-size: cover;
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
}

#main-container {
  background:#f8f8f8;
  padding:25px 25px 0;
}

.standout {
  background: #fbfbfb;
  border:1px solid #eae6e6;
}

/*2.4 Feature Blocks (home page header)*/
.feature {
  position:relative;
  height:162px;
}

.feature-bg1, .feature-bg2 {
  filter: alpha(opacity=50); /* internet explorer */
  -khtml-opacity: 0.5;      /* khtml, old safari */
  -moz-opacity: 0.5;       /* mozilla, netscape */
  opacity: 0.5;           /* fx, safari, opera */
  position:absolute;
  bottom:0px;
  left:0px;
  width:335px;
  z-index:200;
  height:43px;
}

.feature-bg1 {
  background-color:#30434a;
}

.feature-bg2 {
  background-color:#30434a;
}

.feature-link:hover {
  background-color:#163e57;
  color:#ffffff;
  -webkit-transition: background-color 130ms linear;
  -moz-transition: background-color 130ms linear;
  -o-transition: background-color 130ms linear;
  -ms-transition: background-color 130ms linear;
  transition: background-color 130ms linear;
}

.feature-link {
  color:#FFFFFF !important;
  position:absolute;
  bottom:0px;
  left:0px;
  display:block;
  padding:10px 10px 10px 18px;
  height:23px;
  width:307px;
  font-size:20px;
  z-index:300;
  letter-spacing:1px;
  text-decoration:none;
}

.feature img {
  z-index:100;
}

/*2.5 Negative Space*/
.large-content-column, .small-content-column, .full-width-content {
  padding:25px;
}

.bottom-margin {
  margin-bottom:20px;
}

.double-bottom-margin {
  margin-bottom:40px;
}

.top-margin {
  margin-top:20px;
}

.left-margin {
  margin-left:20px;
}

.right-margin {
  margin-right:20px;
}

.room-thumbs img {
  margin:0px 12px 0 0;
  float:left;
}

.clear-left-margin {
  margin-left:0px !important;
}

.clear-right-margin {
  margin-right:0px !important;
}

.clear-bottom-padding {
  padding-bottom:0px !important;
}

.clear-top-padding {
  padding-top:0px !important;
}

/*2.6 Buttons and Links*/
.button-book, .button-enquire, .button-viewprices {
  display:block;
  height:29px;
  text-indent:-9999px;
  margin-right:15px;
  margin-bottom:10px;
}

.enquirebold{
  /*font-weight:bold;*/
  /*color:#2888ab !important;*/
}

.button-book {
  background:url(../images/button-book.png);
  width:127px;
}

.button-viewprices {
  background:url(../images/button-viewprices.png);
  width:127px;
}

.button-enquire {
  background:url(../images/button-enquire.png);
  width:97px;
}

.button-book:hover, .button-enquire:hover, .button-viewprices:hover {
  background-position:bottom;
}

a {
  color:#423d44;
  text-decoration:underline;
}

a:hover {
  color:#8ea852;
}

.mobileph {
  display: none;
}

a[href^=tel]{
  color: inherit;
  text-decoration: none;
}

.copyright a {
  color: #555555;
  text-decoration: underline;
}

.copyright a:hover {
  color: #FFF;
}

/*2.7 Quotes */
.quote {
  font-style:italic;
  padding-left:36px;
  background:url(../images/quote-icon.png) no-repeat left top;
}


/**********************************************
 Slideshow
***********************************************/
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
}

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
}

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
}

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
}


/**********************************************
 3. LAYOUT / OTHER
***********************************************/
/* 3.1 Template Layout Elements */
.left {
  float:left;
}

.right {
  float:right;
}

.contactnumber{
  padding:15px 0 0 0;
  font-size:22px;
  color: #2888ab;
  float:right;
}

.contactnumber p{
  line-height:25px !important;
}

.contactnumber span{
  font-size:30px;
  margin-top:5px;
}

.clearfloat {
  clear: both;
  height:0px;
  font-size: 1px;
  line-height: 0px;
  margin:0px;
  padding:0px;
}

.textcenter {
  text-align: center;
}

.wrapper {
  width:990px;
  max-width: 100%;
  background:url(../images/wrapperbg.png);
  padding:11px;
  margin:40px auto 40px auto;
  border:1px solid #dbdbdb;
}

/* 3.2 Page Columns */
.large-column {
  width:590px;
  background-color: #F8F8F8;
}

.small-column {
  width:335px;
  background-color: #F8F8F8;
}

.large-content-column {
  width:540px;
  background-color: #F8F8F8;
}

.small-content-column {
  width:285px;
  background-color: #F8F8F8;
}

.red{
  background-color:red;
  color:#fff;
}

.red p{
  col:#fff;
  font-size:15px;
}

.block {
  display:block; /*apply to fix images that are creating unwanted negative space in ie*/
}

.floating-content {
  width:348px;
}

/* 3.3 Footer */
.footer {
  border-bottom-right-radius:20px;
  background-color:#ffffff !important;
  border-top: solid 1px #d4d4d4;
  font-size:11px;
  padding: 25px;
}

.footer p {
  margin:0px;
}

.footer-icons {
  text-align:right;
}

.footer-icons img {
  margin-left:15px;
}

.copyright {
  padding: 10px 0 1px 0;
  width: 1015px;
  max-width: 98%;
  border-radius: 5px;
  display: block;
  background: url(../images/wrapperbg.png);
  text-align: center;
  margin: 0 auto;
  margin-bottom: 10px;
}

div.policies p, div.policies li {
  font-size: 11px;
}

.css-button {
  border-radius:5px;
  text-align:center;
  text-indent:0;
  height:auto;
  padding:8px 14px 8px 14px;
  line-height:12px;
  text-decoration:none;
  font-weight:bold;
  color:#fff;
  text-shadow: 1px 1px 0px #575757;
  text-transform:uppercase;
  background: #00455D;
}

.css-button:hover {
  color:#fff;
  background:#1c6f8d;
}

.css-button {
  margin-right:15px;
  margin-bottom:10px;
}

.css-button-booknow {
  background-color: #BF0D0D;
}

.css-button-booknow:hover {
  background:#cb3d3d;
}

iframe{
  width:432px;
  height:243px;
}


/**********************************************
 4. CSS FOR MOBILE DEVICES
***********************************************/
@media screen and (max-width: 1280px) {
}

@media screen and (max-width: 1024px) {
}

@media screen and (max-width: 960px) {
  .wrapper {
    padding: 0;
    border: none;
  }

  .large-column, .small-column, #header ul {
    width:100%;
  }

  .large-content-column, .small-content-column {
    width:auto;
  }

  .scale {
    width:100%;
    height:auto;/*scales image proportionately*/
  }

  .exclude-from-mobile {
    display:none;
  }
}

@media screen and (max-width: 780px) {
  .left, .right {
    float:none !important;
  }

  .wrapper {
    max-width:95%;
    margin-top:3px;
  }

  .contactnumber{
    padding:15px 0 0 0;
    font-size:22px;
    color: #2888ab;
    float:none;
    text-align:center;
  }

  #header ul {
    margin:0px;
  }

  #header ul li {
    float:none;
    background-image:none;
    padding:0px;
    margin-top:8px;
  }

  #header ul li a, #header ul li a:hover {
    font-size:18px;
    padding:10px 10px 10px 10px;
  }

  #header ul li a:hover, #header ul li .nav-selected {
    padding:6px 10px 10px 10px;
  }

  .large-column, .small-column, #header ul {
    width:100%;
  }

  .large-content-column, .small-content-column {
    width:auto;
  }

  .scale {
    width:100%;
    height:auto;/*scales image proportionately*/
  }

  .exclude-from-mobile {
    display:none;
  }

  .email {
    word-wrap:break-word
  }

  .button-viewprices {
    position:static; /*sets absolute positioning to default*/
    margin-top:10px;
  }

  .room-thumbs img, .floating-content {
    margin-top:12px;
  }

  .floating-content {
    width:auto;
    margin-left:0px;
  }

  body {
    font-size:14px;
    background-image:none;/*stops background image loading*/
  }

  .logo {
    width:250px;
    height:auto;
    display:block;
    margin:auto;
  }
}

.map {
  position: relative;
  padding-bottom: 75%; /* This is the aspect ratio */
  height: 0;
  overflow: hidden;
  border: 1px solid #000;
  margin-bottom: 5px;
}

.map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

@media screen and (max-width: 625px) {
}

@media screen and (max-width: 580px) {
  .left, .right {
    float:none !important;
  }

  .wrapper {
    max-width:94%;
    margin-top:3px;
  }

  iframe{
    width:320px;
    height:180px;
  }

  .contactnumber{
    padding:15px 0 0 0;
    font-size:22px;
    color: #2888ab;
    float:none;
    text-align:center;
  }

  #header ul {
    margin:0px;
  }

  #header ul li {
    float:none;
    background-image:none;
    padding:0px;
    margin-top:8px;
  }

  #header ul li a, #header ul li a:hover {
    font-size:18px;
    padding:10px 10px 10px 10px;
  }

  #header ul li a:hover, #header ul li .nav-selected {
    padding:6px 10px 10px 10px;
  }

  .large-column, .small-column, #header ul {
    width:100%;
  }

  .large-content-column, .small-content-column {
    width:auto;
  }

  .scale {
    width:100%;
    height:auto;/*scales image proportionately*/
  }

  .exclude-from-mobile {
    display:none;
  }

  .email {
    word-wrap:break-word
  }

  .button-viewprices {
    position:static; /*sets absolute positioning to default*/
    margin-top:10px;
  }

  .room-thumbs img, .floating-content {
    margin-top:12px;
  }

  .floating-content {
    width:auto;
    margin-left:0px;
  }

  body {
    font-size:14px;
    background-image:none;/*stops background image loading*/
  }

  .logo {
    width:250px;
    height:auto;
    display:block;
    margin:auto;
  }

  .mobileph {
    display: block;
    background-color: inherit;
    color: inherit;
    font-size: 18px;
    padding: 10px 0;
    text-align: center;
  }

  a[href^=tel]{
    color: inherit;
    text-decoration: underline;
  }
}

/* 4.2 Screen size: 420px wide */
  @media screen and (max-width: 420px) {
  .wrapper {
    max-width:93%;
  }

  iframe{
    width:270px;
    height:152px;
  }

  #main-container{
    padding:5px;
  }
}