/* CSS Document

Author: Richard Jarvis, © AA Tourism 2013

[ TABLE OF CONTENTS ]

1. Generic Styles / OOCSS
2. Main Editable Elements
    2.1. Headings
    2.2. Main Navigation
    2.3. Company Branding
    2.4. Content Blocks
3. Footer
4. Template Colors
5. Media Queries
    5.1 Screen size: 1200px wide
    5.2 Screen size: 1024px wide
    5.3 Screen Size: 764px wide
    5.4 Screen Size: 480px wide
    5.5 Screen Size: 320px wide
*/



/**********************************************

/* 1. Generic Styles  OOCSS - Use them as you please*/
.fullWidth {width: 100%;}
.absolute {position: absolute;}
.relative {position: relative;}
.fixed {position: fixed;}
.floatLeft {float: left;}
.floatRight {float: right;}
.noFloat {float: none;}
.center {margin: 0 auto;}
.clearFix {clear: both; height: 1px; overflow: hidden;}
.clearLeft {clear: left;}
.textRight {text-align: right;}
.textCenter {text-align: center;}
.textLeft {text-align: left;}
.upperCase {text-transform: uppercase;}
.lowerCase {text-transform: lowercase;}
.titleCase {text-transform: capitalize;}
.noMargin {margin: 0;}
.noPadding {padding: 0;}
.noWrap {white-space: nowrap;}
.noOverflow {overflow: hidden;}
.overflow {overflow: auto;}
.bold {font-weight: bold;}
.hide {display: none;}
.hideText {text-indent: -9999px;}
.show,.block {display: block;}
.inline {display: inline-block;}
.pointer {cursor: pointer !important;}
.noPointer {cursor: default !important;}
.first {margin-left: 0 !important;}
.last {margin-right: 0 !important;}
.marginRight{margin:0 10px 0 0;}
.marginBottom{margin-bottom:15px !important;}
.marginTop{margin-top:25px !important;}
.clearfix:before, .clearfix:after { content: " "; display: table;}
.clearfix:after { clear: both;}
.clearfix {*zoom: 1;}
/*End Generic Styles*/

/*2 Main Editable Elements*/
body{
  background:#EEEEEE;
}

body, a{
  color: #333333;
}

i {
  margin:0 10px;
}

hr{
  border-top:1px solid #DDDDDD;
  border-bottom:1px solid #FFFFFF;
}

/*2.1 Headings*/
h1{
  margin:0;
  line-height:60px;
  text-shadow: 1px 1px 2px #111111;
  filter: dropshadow(color=#111111, offx=1, offy=1);
}

h2{
}

h3{
  margin:5px 0 0 0;
  padding:0 0 12px;
}
/*End Headings*/

/*2.2 Navigation*/
nav {
  height: auto;
  width: 100%;
  font-size: 1em;
  position: relative;
}

nav ul {
  padding: 0;
  height: 52px;
  margin:0;
}

nav li {
  display: inline;
  float: left;
  margin:0;
  padding:0 20px;
}

nav a {
  display: inline-block;
  text-align: center;
  text-decoration: none;
  line-height: 52px;
}

nav li a {
  /*border-right: 1px solid #576979;
  box-sizing:border-box;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;*/
}

nav li:last-child a {
  border-right: 0;
}

nav a#pull {
  display: none;
}
/*End Navigation*/

/*2.3 Company Branding*/
.headingColorBG{
   *zoom: 1;
}

.logo{
  position:absolute;
  z-index:1000;
  padding:10px;
  -webkit-box-shadow: 0px 0px 8px 4px #666666; /* Android 2.3+, iOS 4.0.2-4.2, Safari 3-4 */
  box-shadow: 0px 0px 8px 4px #666666; /* Chrome 6+, Firefox 4+, IE 9+, iOS 5+, Opera 10.50+ */
  max-height:111px;/*Change to height of logo */
  max-width:225px;/*Change to width of logo */
}

/*.logo img{
  width:100%;
  height:auto;
  max-height:111px;
  max-width:124px;
}*/

.marginLeft {
  margin-left: 250px;
}

.mobileLogo{
  display:none;
}
/*End Company Branding*/

/*2.4 Content Blocks*/
#pageTitle{
  margin:-60px 0 0 0;
  position:relative;
}

#content{
  margin:20px 0;
}

#mainContent article{
  border:1px solid #DDDDDD;
  margin:15px 0;
}

.infoBlock{
  padding:10px;
}

.infoBlock .slideCopy{
  right:20px !important;
}

.tariff{
  border-top:1px solid #DDDDDD;
  padding:10px;
}

.tariff h3{
  padding:0;
}

#mainContent article span{
  font-size:18px;
}

#mainContent article span i{
  margin:0 2px;
}

#mainContent hr{
  margin: 0 0 10px;
}

#mainContent img{
  padding:5px;
  border:1px solid #DDDDDD;
  margin: 0 10px 0 auto;
}

.video-container{
  max-width:460px;
  max-height:258px;
  margin: 20px auto;
}

.video{
  padding:5px 5px 0 5px;
  border:1px solid #CCCCCC;
  margin:0 auto;
}

.summary-container{
  background:transparent;
  margin:0 0 20px;
  height: 200px;
  position: relative;
  overflow:hidden;
}

.summary-container img{
  width:100%;
}

.summary{
  bottom: -147px;
  font-size: 13px;
  padding:10px;
  position: absolute;
  width: 100%;
  height:100%;
  text-align: left;
  text-shadow: 1px 1px 2px #111111;
  filter: dropshadow(color=#111111, offx=1, offy=1);
}

.summary h3{
  border-bottom:1px solid #102130;
}

.summary p{
  border-top:1px solid #627789;
  padding:10px 0 0 0;
}

#contact i{
  margin:0 10px 0 0;
}

#contact span{
  font-size:14px;
  font-weight:600;
  line-height:26px;
}
/*End Content*/

/*Sidebar*/
aside hr{
  margin: 15px 0;
}

aside article{
  border:1px solid #DDDDDD;
  padding:10px;
  font-size:13px;
}

.thumb{
  max-width:100px;
  margin:0 10px 0 auto;
}
/*End Sidebar*/

/*End Content Blocks-*/

/*Footer*/
footer{
  font-size:12px;
  padding: 25px 0 15px;
}

footer i{
  margin:0;
}

footer ul, footer li{
  list-style:none;
  margin:0;
  padding:0;
  display:inline-block;
}

footer #social{
  float:right;
}

footer #social a:hover{
  color:#DDDDDD;
  text-decoration:none;
}

ul.links{
  margin:0;
}

.links li{
  padding: 0;
  margin:0 0 10px 0;
}

footer hr{
  border-top:1px solid #000000;
  border-bottom:1px solid #666666;
}
/*End Footer*/

/*4. Template Colours*/
.primaryCompanyColor, nav a, footer a, .btn-primary, .btn-info{
  color:#FFFFFF;
}

.secondaryCompanyColor, a:hover{
  color:#0092CC;
}

.headingColorBG{
  background:rgba(24, 49, 71, 0.8);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC183147,endColorstr=#CC183147)"; /* IE8 */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC183147,endColorstr=#CC183147);   /* IE6 & 7 */
}

.primaryColorBG, #mainContent img, .video, .mobileLogo{
  background:#FFFFFF;
}

.secondaryColorBG{
  background:#333333;
}

.logo{
  background:#F5F5F5;
}

.btn-primary {
  background-color:#0092CC;
}

.btn-info {
  background-color: #01456B;
}

nav a:hover, footer a:hover{
  color:#CCCCCC;
}

.infoBlock{
  background:#f5f5f5;
}

.tariff h3, #mainContent article span{
  color: #01456B;
}

footer, footer #social a:hover{
  color:#DDDDDD;
}
/*End Template Colours*/


/********** Affiliation icons ***************/
.visa {
  display: table;
  float: left;
}

.eftpos {
  display: block; text-align: center; width: 130px; margin: 0 auto;
}

.mastercard {
  display: block; width: 90px; float: right; margin-top: -50px;
}


/********** Map ***************/
.map {
  width: 100%;
  position: relative;
  padding-bottom: 75%; /* This is the aspect ratio */
  height: 0;
  overflow: hidden;
}

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

/*5.Media Queries */

/*5.1 Screen size: 1200px wide*/
@media screen and (max-width: 1200px) {
  nav li {
    padding:0 5px;
  }

  nav ul{
    float:right;
  }

  nav li {
    padding:0 2px;
  }

  .visa, .eftpos, .mastercard {
    float: none;
    margin: 20px auto;
  }

  .marginLeft {
    margin-left: 0px;
  }
}

/*5.2 Screen size: 1024px wide*/
@media screen and (max-width: 1024px) {
  nav {
    font-size: 11px;
  }

  .mobileHide{
    display:none;
    visibility:hidden;
  }
}

/*5.3 Screen size: 764px wide*/
@media screen and (max-width: 769px) {
  #social{
    margin-top:10px;
  }

  nav {
    height: auto;
    font-size:13px;
  }

  nav.col-md-10{
    padding-left:0 !important;
    padding-right:0 !important;
  }

  nav ul {
    width: 100%;
    display: none;
    height: auto;
    margin:0;
  }

  nav a#pull {
    display: block;
    width: 100%;
    position: relative;
    border-bottom: 1px solid #000000;
  }

  nav li {
    width: 50%;
    float: left;
    position: relative;
    padding:0;
  }

  nav li a {
    border-bottom: 1px solid #000000;
    border-top:1px solid #666666;
    border-right:1px solid #666666;
    border-left:1px solid #000000;
  }

  nav a {
    text-align: left;
    width: 100%;
  }

  .logo{
    display:none;
  }

  .mobileLogo{
    display:block;
    text-align:center;
    padding:20px 0;
  }

  #pageTitle{
    margin:0;
    position:relative;
  }

  footer .floatRight{
    float:left !important;
    text-align:left !important;
  }
}

/*5.4 Screen size: 480px wide*/
@media only screen and (max-width : 480px) {
  nav {
    float:left;
    border-bottom: 0;
  }

  nav ul {
    display: none;
    height: auto;
  }

  nav a#pull:after {
    display: inline-block;
    position: absolute;
    right: 15px;
    top: 10px;
  }

  #social.floatRight{
    float:left;
  }

  #social.textRight{
    text-align:left;
  }
}

/*5.5 Screen size: 320px wide*/
@media only screen and (max-width : 320px) {
  nav li {
    display: block;
    float: none;
    width: 100%;
  }

  nav li a {
    border-bottom: 1px solid #000000;
    border-top:1px solid #666666;

  }

  aside .thumb{
    width:100%;
    max-width:100%;
    display:block;
  }

  aside .floatRight{
    float:left;
  }

  .btn{
    margin:5px 0;
  }
}
/*End Media Queries */