@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;
}


/**********************************************
 2. MAIN EDITABLE ELEMENTS
***********************************************/
/*2.1 Paragraphs and Headings*/
#content-block ul {
  margin-left:35px;
}

h1, h2{
  color:#005494; /*default heading colour #93ad53 green*/
  margin-bottom:15px;
  font-size:27px;
  line-height:30px;
}

h3 {
  font-size:22px;
  line-height:25px;
  color: #000;
  margin-bottom:15px;
  font-weight:bold;
}

.photo-overlay h3 {
  color:#5fafec;
}

.photo-overlay strong {
  color:#ff9813;
}

h4 {
  font-size:15px;
  font-color: #423d44;
  margin-bottom:5px;
  font-weight:bold;
}

h4 a, h3 a, h2 a, h1 a {
  text-decoration:none;
}

.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;
}

b, 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:#544f57;  /*default state*/
  text-decoration:none;
}

#header ul li a:hover, .nav-selected {
  color:#005494!important;
  -webkit-transition: color 222ms linear;
  -moz-transition: color 222ms linear;
  -o-transition: color 222ms linear;
  -ms-transition: color 222ms linear;
  transition: color 222ms linear;
}

/*Main Navigation Other*/
#header ul {
  margin:35px 0 20px 0px;
  text-transform:uppercase;
}

#header ul li {
  float:left;
  display:block;
  list-style:none;
  padding:15px;
  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;
}

/*2.3 Backgrounds */
body {
  color:#000;
  background-color:#2a7da8;
  background-image: url(../images/body-background.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  background-size: cover;
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
}

#main-container {
  background:#f8f8f8;
  padding:25px;
}

.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:#08142f;
}

.feature-bg2 {
  background-color:#08142f;
}

.feature-link:hover {
  background-color:#08142f;
  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-enquire, .button-viewprices {
  display:block;
  height:29px;
  text-indent:-9999px;
  margin-right:15px;
  margin-bottom:10px;
}

.button-viewprices {
  background:url(../images/button-viewprices.png);
  width:127px;
  margin-top:2px;
}

.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:#20a8ff;
}

.mobileph {
  display:none;
}

a[href^=tel]{
  color: inherit;
  text-decoration: none;
}

.map {
  position: relative;
  padding-bottom: 75%; /* This is the aspect ratio */
  height: 0;
  overflow: hidden;
  border: 1px solid #000;
}

.map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

/*2.7 Quotes */
.quote {
  font-style:italic;
  padding-left:36px;
  background:url(../images/quote-icon.png) no-repeat left top;
}

/*TRIP ADVISOR WIDGET STYLING*/
#ULcoDXGJ {
  width:100%;
}


/**********************************************
 3. LAYOUT / OTHER
***********************************************/
/* 3.1 Template Layout Elements */
.photo-overlay {
  background:#005494;
  padding:15px;
  font-size:12px;
  color:#fff;
  float:left;
  height:287px;
  width:232px;
  border-bottom:8px solid #f55b13;
}

#header {
  position:relative;
}

.css-button, .css-button-book {
  border-radius:5px;
  color:#000;
  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: rgb(0,135,231); /* Old browsers */
  background: -moz-linear-gradient(top,  rgba(0,135,231,1) 25%, rgba(0,104,178,1) 83%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(25%,rgba(0,135,231,1)), color-stop(83%,rgba(0,104,178,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(0,135,231,1) 25%,rgba(0,104,178,1) 83%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(0,135,231,1) 25%,rgba(0,104,178,1) 83%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(0,135,231,1) 25%,rgba(0,104,178,1) 83%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(0,135,231,1) 25%,rgba(0,104,178,1) 83%); /* W3C */
}

.css-button-book {
  background:#007CD9;
  text-shadow:#0085B7;
}

.css-button:hover {
  color:#fff;
  background:#134a92;
}

.css-button {
  margin-right:15px;
  margin-bottom:10px;
}

.photo-overlay .css-button {
  margin:15px 0 0 0;
  display:block;
  width:100px;
}

.left {
  float:left;
}

.right {
  float:right;
}

.cf {
  clear: both;
}

.padTwoFive {
  padding:25px;
}

.marginRight {
  margin-right: 5px;
}

.clearfloat {
  clear: both;
  height:0px;
  font-size: 1px;
  line-height: 0px;
  margin:0px;
  padding:0px;
}

.wrapper {
  width:990px;
  max-width: 98%;
  background:url(../images/wrapperbg.png);
  padding:11px;
  margin:40px auto 40px auto;
  border:1px solid #dbdbdb;
}

/* 3.2 Page Columns */
.large-column {
  width:590px;
}

.small-column {
  width:335px;
}

.large-content-column {
  width:540px;
}

.small-content-column {
  width:285px;
}

.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;
}

.fotorama__nav-wrap {
  background:#E5E5E5!important;
}


/**********************************************
 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;
  }

  .photo-overlay{
    width:auto;
    float:none;
    height: 180px;
  }

  .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: 767px) {
}

@media screen and (max-width: 625px) {
  .photo-overlay {
    height: 220px;
  }
}

@media screen and (max-width: 580px) {
  .left, .right {
    float:none!important;
  }

  .photo-overlay{
    width:auto;
    float:none;
    height: 210px;
  }

  .wrapper {
    width:500px;
    margin-top:3px;
  }

  #header ul {
    margin:0px;
  }

  #header ul li {
    float:none;
    background-image:none;
    padding:0px;
    margin-top:8px;
  }

  .css-button, .css-button-book {
    display:block;
    margin-bottom:15px;
  }

  #header ul li a, #header ul li a:hover  {
    background-color:#eaeaea;
    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*/
  }

  .mobileph {
    display:block;
    background-color:#FFF;
    color:inherit;
    font-size:18px;
    padding:10px 0;
    text-align: center;
  }

  a[href^=tel]{
    color: inherit;
    text-decoration: underline;
  }
}

  @media screen and (max-width: 420px) {
  .wrapper {
    width:300px;
  }

  .photo-overlay{
    height: 230px;
  }
}