/************************************************************************************
MEDIA QUERIES
*************************************************************************************/

/* for 600px or less */
@media screen and (max-width: 650px) {

	body { background: #fff; margin: 0; padding: 0; }
	* { font-size: 15px!important; line-height: 1.5em!important; }
	a { text-decoration: underline; }
	h1 { font-size: 19px!important; line-height: 1.3em!important; }

	#mob-header { float: left; width: 100%; background: #1a8ebe; /* Change BG color to suit clients color scheme */ }
    #mob-menu-btn { float: left; width: 65%; font-size: 15px!important; color: #fff; cursor: pointer; cursor: hand; padding: 10px 5% 10px 35px; text-transform: uppercase; font-weight: bold; background: url(../media/mobile/nav-menu.png) no-repeat 12px center; background-size: auto 10px;  }
    #mob-logo { float: left; width: 100%; text-align: center; margin: 0 0 10px 0; background: #fff; }
    #mob-logo img { max-width: 100%; }	
	#mob-header .phone { float: right; padding: 10px 15px 8px 0; color: #fff; font-size: 15px; }
	#mob-header .phone a { color: #fff; text-decoration: none; }
	
	#contentholder,
	#header,
	#footer
	{ float: left; width: 88%; padding: 0 6%; }
	
	#container { float: left; width: 100%; }
	
	/* For anything that requires hiding */
	#logo,
    hr,
	#header,
	#nav,
	#slider_controls,
	#top_image,
	.cleaner,
	.searchbox_icon,
	.side_box_icon,
	#breadcrumbs,
	#calendar #sidebar,
	#b_container
    { display: none; }

    /* Mobile Navigation --------------- */

	#mob-nav { 
		float: left; 
		width: 100%;
		display: none; 
	}
    #mob-nav ul { 
        float: left; 
        width: 100%; 
        margin: 0; 
        padding: 0;
		border-top: none;
    }
    #mob-nav ul li { 
        float: left; 
        width: 100%;
        margin: 0;
		padding: 0;
		background: none;
        list-style-type: none;
    }
    #mob-nav ul li a {
        float: left;
        width: 85%;
        padding: 8px 10% 8px 5%;
        color: #fff;
        font-weight: 700;
        text-decoration: none;
        font-size: 14px;
        background: url(../media/mobile/subnav-arrow.png) no-repeat 94% center; 
        background-size: 10px auto;
        border-top: solid 1px #2a7aaa;
		text-decoration: none!important;
    }
    #mob-nav ul li a:hover { background-color: #18ceb2; }
	#mob-nav li li a{
		background-color:#052c43;
		border-top-color:#1d5374;
	}

	/* Feature Panel --------------- */
	
	#feature-panel, #feature_panel { float: left; width: 100%; background-size: 100% auto; }
	#feature-panel article, #feature_panel article { background-size: 100% auto; }
	#feature_panel #banners { float: left; width: 100%; }
	#feature_panel #banners img { width: 100%!important; height: auto!important; }
	
    /* General --------------- */
	table.responsive { margin:0 !important; }
	
	.pinned { position: absolute; left: 0; top: 0; background: #fff; width: 35%; overflow: hidden; overflow-x: scroll; border-right: 1px solid #ccc; border-left: 1px solid #ccc; }
	.pinned table { margin:0 !important; border-right: none; border-left: none; width: 100%; }
	.pinned table th, .pinned table td { white-space: nowrap; }
	.pinned td:last-child { border-bottom: 0; }
	
	div.table-wrapper { position: relative; margin-bottom: 20px; overflow: hidden; border-right: 1px solid #ccc; }
	div.table-wrapper div.scrollable { margin-left: 35%; }
	div.table-wrapper div.scrollable { overflow: scroll; overflow-y: hidden; }	
	
	table.responsive td, table.responsive th { position: relative; white-space: nowrap; overflow: hidden; }
	table.responsive th:first-child, table.responsive td:first-child, table.responsive td:first-child, table.responsive.pinned td { display: none; }

	.mob-hide { display:none!important; } /* can be used to hide elements only on small screen */
	.web-hide { display:block !important; }
	.innerpad { float: left; width: 100%; }
	.float-right { float: right; }
	img.float-left, img.float-right{display:block;float:none;margin:0 auto 1em !important;}
	.mobile-advert { float: left; width: 100%; min-height: 60px; margin: 20px 0; }
	#contentholder img { max-width: 100%!important; height: auto!important; } /* Adjusts width on photos within content */
	#contentholder img.bordered{
		max-width:94% !important;
	}
	.mob-banner{
		clear:both;
		margin:0 6% 5%;
	}
	.mob-banner img{
		max-width:100%;
		-webkit-border-radius:6px;
		-moz-border-radius:6px;
		border-radius:6px;
	}

	.mob-btns, .subList, #footer ul {
		/* Any list within content can be made into a nice button format by adding this class to the ul */ 
		float: left;
		width: 100%!important; 
		margin: 0 0 20px 0!important;
		padding: 0!important;
		background-color:#085380;
		-moz-border-radius:0 0 5px 5px;
		border-radius:0 0 5px 5px;
	}
	.mob-btns li, .subList li, #footer ul li { 
		float: left;
		width: 100%!important;
		list-style-type: none;
		margin: 0!important;
		padding: 0!important;
	}
	.mob-btns li a, .subList li a, .mob-btn, .map-btn, #footer ul li a, #sidebar h5 { 
		float: left;
		width: 90%;
		padding: 8px 5%;
        background: url(../media/mobile/subnav-arrow.png) no-repeat 94% center #085380; 
		color: #fff;
        background-size: 8px auto;
		text-decoration: none;
		border-bottom: solid 1px #2a7aaa;
	}
	.mob-btns li:first-child a, .mob-btns li.first a, .subList li.first a, #sidebar h5  { -moz-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; }
	.mob-btns li:last-child a, .mob-btns li.last a, .subList li.last a, .subList li:last-child a { -moz-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; border-bottom: none; }
	.mob-btn, .map-btn { margin: 0 0 15px 0; -moz-border-radius: 5px; border-radius: 5px; border: none; }
	.map-btn { background: url(../media/mobile/icon-map.png) no-repeat 95% center #000; background-size: 20px auto; }
	.mob-btns li a:hover, .subList li a:hover, .mob-btn:hover, .map-btn:hover { background-color: #024260; }
	.mob-btns ul, .subList ul, #footer li ul{
		padding-left:0;
		background-color:#064266;
	}
	.mob-btns li li a, .subList li li a, #footer li li a{
		width:85%;
		padding-left:10%;
		background-color:#064266;
		border-bottom:1px solid #126393;
	}

	.video-wrap{
		height:0;
		padding-bottom:66.25%;
		position:relative;
		overflow:hidden;
	}
	.video-wrap iframe{
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
	}

/*	.picture-box{
		float:left;
		width:35%;
		margin:0 5px 0 0;
		padding:1px;
		background-color: #fff;
		border:8px solid #e8eddc;
		-moz-border-radius:5px;
		border-radius: 5px;
	}*/
	.picture-box{
		margin:0 auto 10px;
		background-color: #fff;
		-moz-border-radius:5px;
		border-radius: 5px;
	}
	.picture-box p{
		margin:0;
		-moz-border-radius:0;
		border-radius:0;
		text-align:center;
	}
	.picture-box img{
		margin:0 auto;
	}
	.picture-box .bordered{
		margin-bottom:.5em;
		padding:0;
/*		border:0 none;*/
	}
	#contentholder .picture-box img.bordered{
		max-width:83% !important;
	}
	img.float-right{
		clear:none;
	}
	.book-now-mobile{
		text-align:center;
	}

	#weather div p {
		text-align: center;
	}
	#weather .current {
		float:right;
		width:auto;
		padding:10px;
		margin-bottom:15px;
		-moz-border-radius:6px;
		border-radius:6px;
		background-color:#e1eff8;
	}
	#weather .current .photo{
		float:left;
		width:62px;
		margin-right:10px;
	}
	#weather .current img {
		border: 5px solid #FFF;
		text-align: center;
	}
	#weather .current p {
		font-weight: bold;
		font-size: 14px;
		display: block;
		margin-bottom: 5px;
		text-align: center;
	}
	#weather .current h2 {
		text-shadow:1px 1px 0 #fff;
		text-align: center;
		margin: 0px;
	}
	#weather .forecast {
		float:left;
		width:47%;
		margin:.3em 1%;
		border:1px solid #e8eddc;
		-moz-border-radius:6px;
		border-radius:6px;
		padding-bottom:10px;
	}
	#weather h3{
		clear:both;
	}
	
	#weather .forecast h3 {
		text-align: center;
		-moz-border-radius: 6px 6px 0px 0px;
		border-radius: 6px 6px 0px 0px;
	}
	
	#weather .forecast p {
		margin: 0px 10px 5px;
		line-height: 18px;
	}
	
	#weather .forecast img {
		margin-bottom: 5px;
		border: 5px solid #e8eddc;
	}

	.accom-picture-box{
		margin:0 auto 10px;
		text-align:center;
/*		float: left; */
		margin-right: 15px;
	}
	#contentholder .accom-picture-box img.bordered{
		margin:0 auto;
	}
	.accom-content-box{
	  float:none;
	  margin-bottom: 20px;
	  margin-top: 5px;
	}
	.accom-content-box p a img.float-right { 
		float: right;
		width: 100px;
	}
	.accom-content-box .reviews { 
		border-top: solid 1px #efefef;
		padding: 10px 0;
		border-bottom: solid 1px #efefef;
		margin-top: 10px;
	}
	
	.accom-header{
		clear:both;
	}
	.bookingcom{
		clear:both;
		text-align:center;
	}

	a.previous {
		display: block;
		float: left;
	}
	a.next {
		display: block;
		float: right;
	}
	a.previous,
	a.next {
		padding: 4px 7px;
		color: #FFFFFF;
		background-color: #085380;
		-moz-border-radius:5px;
		border-radius: 5px;
		text-decoration: none;
	}
	
	a.next:hover,
	a.previous:hover {
		background-color: #8ca117;
	}
	
	#weather{
		float:left;
		width:100%;
	}
	.interesting {
		background-color: #F0F3E9;
		padding: 10px;
		-moz-border-radius:5px;
		border-radius: 5px;
		word-wrap: break-word;
	}

	.table-shark thead{
		display:block;
		float:left;
	}
	.table-shark thead th{
		display:block;
		width:auto;
	}
	.table-shark tbody{
		display:block;
		width:auto;
		overflow-x:auto;
		white-space:nowrap;
	}
	.table-shark tbody tr{
		display:inline-block;
		margin:0 -3px;
	}
	.table-shark tbody td{
		display:block;
	}
	
	.bookingcom .reviews{
		clear:both;
		display:block;
		float:none;
		margin-top:3px;
		text-align:center;
	}

	.accom-content-box .reviews{
		display:block;
		text-align:center;
	}
	.google_square { 
		margin-bottom: 20px;
	}
	
	#bg-airbnb-head { 
		float: left; 
		width: 90%; 
		margin-bottom:15px;
		padding: 15px 5%;
		background: url(/media/images/banner-cairns-lagoon2.jpg) no-repeat center bottom #106191; 
		background-size: 140% auto;
		cursor:pointer;
		text-align: center;
	}
	#bg-airbnb-head h2 { 
		color: #fff;
		font-size: 17px!important;
		line-height: 17px!important;
		margin: 0;
		text-shadow: none;
		background: none;
	}
	#bg-airbnb-head h2 span { 
		font-size: 25px!important;
	}
	body #bg-airbnb{
		float: left;
		width:90%;
		height:auto;
		padding:84px 5% 5%;
		margin-bottom: 30px;
	}
	body #bg-airbnb input{
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	body #bg-airbnb #form_location,
	body #bg-airbnb #datepicker1,
	body #bg-airbnb #datepicker2,
	body #bg-airbnb #guests,
	body #bg-airbnb #guests2{
		position:relative;
		left:0;
		top:0;
		width:100%;
		margin:5px 0;
	}
	body #bg-airbnb #guests2 { 
		text-align: center;
		padding: 10px 0;
	}
	body #bg-airbnb p:last-child{
		display:none;
	}
	body #bg-airbnb #button{
		position:relative;
		left:0;
		top:0;
	}
	body #bg-airbnb #logoair{
		width:100%;
		top:20px;
		left:0;
		text-align:center;
	}
	body #bg-airbnb #minus,
	body #bg-airbnb #plus{
		top:auto;
		bottom:81px;
	}
	body #bg-airbnb #minus{
		left:20px;
	}
	body #bg-airbnb #plus{
		left:auto;
		right:20px;
	}

	/* Accommodation Pagination */
	
	#accommodation_paging_index {
		margin-bottom: 20px;
		text-align:center;
	}
	
	.accommodation_paging_page{
		display:inline-block;
	}
	
	.accommodation_paging_page a,
	.accommodation_paging_next a,
	.accommodation_paging_previous a {
		display:inline-block;
		padding: 5px 10px;
		background-color: #E8EDDC;
		color: #9FB422;
		margin: 0 5px 10px;
		text-decoration: none;
		font-weight: bold;
		-moz-border-radius:5px;
		border-radius: 5px;
	}
	
	.accommodation_paging_page a:hover,
	.accommodation_paging_next a:hover,
	.accommodation_paging_previous a:hover {
		background-color: #9FB422;
		color: #fff;
	}
	
	.accommodation_paging_page .accommodation_paging_pageactive {
		display:inline-block;
		padding: 5px 10px;
		background-color: #9FB422;
		color: #fff;
		margin: 0 5px 10px;
		-moz-border-radius:5px;
		border-radius: 5px;
	}
  
  .top-banner-mobile{margin:0 auto 1.5em;width:320px;}

	/* Sidebar --------------- */
	
	#sidebar { float: left; width: 100%; border-top: solid 1px #d4d4d4; padding: 30px 0 10px 0; }
	#sidebar h2, #sidebar #subnav h2 { 
		float: left;
		width: 90%!important;
		padding: 10px 5%!important;
		margin: 0 0 1px 0;
        background: #000!important; 
		color: #fff;
        background-size: 8px auto;
		text-decoration: none;
		-moz-border-radius: 5px 5px 0 0; 
		border-radius: 5px 5px 0 0;
		border-bottom: solid 4px #ccc;
		font-weight: bold;
	 }
	#sidebar h5 { background: #1080b5; text-transform: uppercase; font-weight: bolder; }


    /* Calendar --------------- */
	
	#calendar #searchbox_title h1, #calendar h2 { float: left; width: 90%; padding: 10px 5%; background: #106293; color: #fff; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; text-shadow: none; }
	#calendar h1 { font-size: 23px!important;}
	#calendar h2 a { color: #fff; }
	#calendar #ad_searchtop { display: none; }
	#Calendar_EventsList h1 { margin-top: 20px; }
	#calendar .Calendar_EventWrapper { border-top: solid 2px #106293; }
	#calendar .Calendar_EventBody { float: right; width: 60%; }
	#calendar .Calendar_EventThumbnail { float: left; width: 30%; }
	#calendar .Calendar_EventWhenDate { font-style: italic; color: #106293; }
	#calendar .Calendar_EventWhen { width: 100%!important; margin-bottom: 10px; }
	#calendar .Calendar_EventHeader { width: 100%; }
	#calendar #Calendar_EventSideInfo { width: 100%; }
	#calendar #Calendar_EventSideInfoDetails { width: 90%!important; padding: 20px 5%; }
	#calendar #Calendar_Cost { color: #106293; font-weight: bold; font-size: 17px!important; }
	#calendar #Calendar_EventMainInfo { width: 90%; padding: 10px 5%; }
	#Calendar_CalendarHeader{position:relative;}
	.Calendar_CalendarWhenNavigationLast,.Calendar_CalendarWhenNavigationNext{width:33px;padding:0;position:absolute;top:10px;background-image:none;}
	.Calendar_CalendarWhenNavigationLast{left:0;}
	.Calendar_CalendarWhenNavigationNext{right:0;}
	.Calendar_CalendarWhenNavigationLast a,.Calendar_CalendarWhenNavigationNext a{display:block;width:33px;height:0;padding:33px 0 0;background-position:center center;background-repeat:no-repeat;overflow:hidden;}
	.Calendar_CalendarWhenNavigationLast a{background-image:url(../../../media/graphics/btn_last.gif);}
	.Calendar_CalendarWhenNavigationNext a{background-image:url(../../../media/graphics/btn_next.gif);}
	.Calendar_CalendarWhenNavigationCaption{float:none;width:auto;}
	.Calendar_CalendarWhenNavigationSmall,.Calendar_CalendarWhenNavigationSmall{display:none;}
	#Calendar_CalendarTable thead{display:none;}
	#content #Calendar_CalendarTable tbody,#content #Calendar_CalendarTable tr,#content #Calendar_CalendarTable td{display:block;}
	#content #Calendar_CalendarTable .Calendar_CalendarBoxInactive{display:none;}

    /* Fieldset --------------- */

	fieldset, #field_form { width: 90%;	}
	fieldset p,
	fieldset label,
	fieldset span {
		width: 100%;
		float: left;
	}
	fieldset { float: left; width: 88%; padding: 10px 6%; margin: 0; background: #efefef; border: solid 1px #d5d5d5; margin: 0 0 10px 0; }
	fieldset legend { font-weight: bold; }
	
	fieldset input[type="text"],
	fieldset input[type="email"],
	fieldset input[type="tel"],
	fieldset input.txtshort,
	fieldset input.txtshorter,
	fieldset textarea,
	fieldset .commentBox, 
	fieldset .long
	fieldset #enquiry,
	fieldset select
	{ width: 95%!important; padding: 4px; -moz-border-radius: 5px; border-radius: 5px; border: solid 1px #d5d5d5; }
	
	fieldset input[type="submit"], #submit { 
		-webkit-appearance: none;
		background: #f33e51;
		padding: 5px 10px;
		-moz-border-radius: 5px; 
		border-radius: 5px; 
		color: #fff;
		border: none;
		font-size: 1.1em;
	}
	
	 /* Footer --------------- */

	#footer { 
		float: left;
		background: url(../media/mobile/logo-footer.gif) no-repeat center 20px #1080b5;
		background-size: auto 40px;
		border-top: solid 5px #18ceb2;
		padding: 80px 10% 20px 10%;
		width: 80%;
		text-align: center;
	}
	#footer p,
	#footer p span,
	#footer p a, 
	#footer ul li,
	#footer ul li a { 
		color: #fff;
		font-size: 13px!important;
	}
	#footer a { 
		text-decoration: underline; 
	}
	#footer p, 
	#footer ul { 
		width: 100%!important; 
		margin: 0 0 15px 0;
		padding: 0;
		text-align: center;
	}
	#footer p, #footer p a { font-size: 11px!important; }
	#footer ul li { 
		width: 100%;
		padding: 0;
		margin: 0;
	}
	/* Advertisements ----------- */
	.side_box, .single_sidebar_ad { float: left; width: 100%; margin: 0 0 20px 0; }
	.link-unit-728x15, .google-ads-728x90 { display: none; }
	
	/* Searchbox holder ------------- */
	#searchbox_holder { float: left; margin: 0; background: #e7e7e7; -moz-border-radius: 10px; border-radius: 10px; margin: 0 0 20px 0; }
	#searchbox_holder h4 { float: left; width: 90%; padding: 10px 5%; margin: 0; background: #1080b5; -moz-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; color: #fff; }
	#searchbox_holder select { float: left; width: 100%; margin: 0 0 8px 0; border: solid 1px #d4d4d4; padding: 5px; background: url(../media/mobile/dropdown-arrow.gif) no-repeat right center #fff; background-size: 30px auto; -moz-border-radius: 3px; border-radius: 3px; }
	#searchbox_holder .innerpad { float: left; width: 90%; padding: 15px 5%; }
	#searchbox_holder .select-group { float: left; width: 100%; }
	#searchbox_holder .mob-select-sm { width: 25%!important; }
	#searchbox_holder .mob-select-med { width: 72%!important; float: right; }
	#searchbox_holder .gobutton_blue,
	#searchbox_holder .gobutton { background: url(../media/mobile/search.png) no-repeat center center #18ceb2; float: right; background-size: auto 60%; width: 100%; padding: 5px 0; border: none; -moz-border-radius: 3px; border-radius: 3px; }
	#searchbox_holder #checkin_year_month { width: 60%!important; margin-right: 20px!important; }	
	#searchbox_title h1 { font-size: 20px!important; }

	/* -- Regions ------------------ */
	.item { float: left; width: 100%; border-bottom: solid 1px #e1eff8; padding: 10px 0 0 0; }
	.item .thumb img { float: left; width: 30%; padding-top: 5px; }
	.item .desc { float: right; width: 65%; }

	#sidebar .button_holder { float: left; width: 100%; text-align: center; }
	#sidebar .button_ad, #sidebar .button_ad_padded { float: left; width: 48%; padding: 0 1% 0 1%; margin: 0 0 10px 0; }
	
	#cse-search-box { float: left; width: 90%; padding: 10px 5%; background: #f1f4ea; -moz-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; margin: 0; }
	#cse-search-box input[type='text'] {  border: solid 1px #d4d4d4; padding: 5px!important; background: #fff; background-size: 30px auto; -moz-border-radius: 3px; border-radius: 3px; width: 64%!important; float: left; }
	#cse-search-box input[type='submit'] { width: 30%!important; padding: 5px 0; float: right!important; border: none; background: #8ca117; -moz-border-radius: 3px; border-radius: 3px; font-weight: bold; color: #fff; }

  #place1{left:78.5%;top:17%;}
  #place2{top:23.5%;}
  #place3{left:70%;top:25.3%;}
  #place4{left:71%;top:27.4%;}
  #place5{left:77%;top:33%;}
  #place6{left:28%;top:37.2%;}
  #place7{left:29%;top:38.6%;}
  #place8{left:53.5%;top:52%;}
  #place9{left:54%;top:54.2%;}
  #place10{left:57.5%;top:57.8%;}
  #place11{left:69.5%;top:68%;}
  #place12{left:71%;top:81.2%;}
  #place13{left:71%;top:83.1%;}
  #place14{left:70.5%;top:85.3%;}
  #place15{left:74.4%;top:88.6%;}
  #place16{left:72%;top:91%;}
  #place17{left:45.7%;top:48.6%;}
  #place18{left:33%;top:49.9%;}
  #place19{left:74.5%;top:78.5%;}
  #place20{left:77%;top:27.4%;}
  #place21{left:64%;top:27.7%;}
  #place22{left:74.5%;top:32%;}
  #place23{left:70.7%;top:30.7%;}
  #place24{left:71%;top:33.2%;}
  #place25{left:38.6%;top:39.4%;}
  #place26{left:35.5%;top:37.2%;}
  #place27{left:27%;top:43%;}
  #place28{left:51.3%;top:53.7%;}
  #place29{left:46.5%;top:59.7%;}
  #place30{left:63%;top:70.5%;}
  #place31{left:69%;top:88.2%;}
  #place32{left:39%;top:75.1%;}
  #place33{left:57%;top:87.5%;}
  #place34{left:65.9%;top:92%;}
}

@media screen and (max-width:480px) {
	#weather .current {
		float:none;
	}
/*	.accom-content-box {
	  width:65%;
	}*/
}