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

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

	body { background: #fff; margin: 0; padding: 0; font-family: arial, helvetica, sans-serif; }
	* { font-size: 13px!important; line-height: 1.5em!important; color: #666; }
	a { text-decoration: underline; color: #de474b; }
	h1 { font-size: 22px!important; line-height: 25px!important; color: #0464a1; }
    h2 { }
    h3, h3 a { font-size: 16px!important; }

	#mob-header { float: left; width: 100%; background: #0464a1; /* Change BG color to suit clients color scheme */ }
    #mob-menu-btn { float: left; width: 35%; font-size: 15px; color: #fff; cursor: pointer; cursor: hand; padding: 10px 5% 10px 12%; text-transform: uppercase; font-weight: bold; background: url(../images/mobile/nav-menu.png) no-repeat 8% center; background-size: auto 12px;  }
    #mob-logo { float: left; width: 100%; text-align: center; margin: 0; padding: 10px 0; background: #fff; border-bottom: solid 1px #ccc; }
    #mob-logo img { max-width: 70%; max-height: 75px; }	
	#mob-header .phone { float: right; padding: 10px 15px 8px 0; color: #fff; font-size: 15px; }
	#mob-header .phone a { color: #fff; text-decoration: none; }
	
	#container,
	#content-holder,
	#header,
    #wrapper,
	#footer
	{ float: left; width: 88%; padding: 0 6%; }
	
	
	/* For anything that requires hiding */
	#logo,
    hr,
	#header,
    #mainMenu,
	#nav,
	#slider_controls,
	.cleaner,
    #breadCrumbs,
    #magGlass,
    #columnRight
    { display: none; }
    
    #home #columnRight { display: block; }

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

	#mob-nav { 
		float: left; 
		width: 100%; 
	}
    #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(../images/mobile/subnav-arrow.png) no-repeat 94% center; 
        background-size: 10px auto;
        border-top: solid 1px #9cc1d8;
		text-decoration: none!important;
    }
	#mob-nav ul li a span { color: #fff; }
    #mob-nav ul li a:hover { background-color: #0c3b59; }

	/* 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 --------------- */

	.mob-hide { display: none; } /* can be used to hide elements only on small screen */
	.expand-menu-btns { display: none; } /* hide initially */
	#wrapper img { max-width: 100%!important; height: auto!important; } /* Adjusts width on photos within content */

    #blueBar { padding: 10px 5%; background: #f1f2f2; border: solid 1px #ccc; border-top: none; margin-bottom: 20px; -moz-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; }
    #blueBar input { width: 88%; border: solid 1px #ccc; background: url(../images/mobile/icon-search.png) no-repeat 8px center #fff; background-size: 18px auto; padding: 5px 5px 5px 30px; -moz-border-radius: 5px; border-radius: 5px; }
    #quickFinderSection { border-bottom: solid 1px #ccc; padding-bottom: 15px; }
    #quickFinderSection select { float: left; width: 96%; padding: 5px 2%; background: #efefef; border: solid 1px #ccc; margin: 0 0 10px 0; -moz-border-radius: 5px; border-radius: 5px; }
    
    .newListings { float: left; width: 100%; margin: 0 0 30px 0; padding: 0; }
    .newListings li { float: left; width: 100%; padding: 0; list-style-type: none; }
    .newListings li a { float: left; width: 94%; background: #f1f2f2; border-bottom: solid 2px #fff; padding: 6px 3%; text-decoration: none; color: #666; }
    .newListings li a:hover { background-color: #0071b7; color: #fff; }
    
    .listing, .listing2 { float: left; width: 100%; padding: 12px 0; border-bottom: solid 1px #ccc; }
    .listing h3, 
    .listing h3 a, 
    .listing h3 a span, 
    .listing2 h3, 
    .listing2 h3 a, 
    .listing2 h3 a span 
    { color: #38a9f0; text-decoration: none; }
    
    .listing h3, .listing2 h3 { margin: 0; }
    .listing ul li { list-style-type: none; padding: 0; }
    .listing.featured { width: 90%; padding: 12px 5%; border: solid 2px #38a9f0; background: #eaf3f9; }
    
    #mapBox { float: left; width: 89.5%; padding: 20px 5%; background: #f1f2f2; text-align: center; border: solid 1px #ccc; }
    
	.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;
	}
	.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 { 
		float: left;
		width: 90%;
		padding: 8px 5%;
        background: url(../images/mobile/subnav-arrow.png) no-repeat 94% center #000; 
		color: #fff;
        background-size: 8px auto;
		text-decoration: none;
		border-bottom: solid 1px #666;
	}
	.mob-btns li:first-child a, .mob-btns li.first a, .subList li.first a  { -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 { -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(../images/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: #666; }

	.ad-responsive{
		clear:both;
	}

	/* 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;
	 }

    /* 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="password"] { 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: #03619f;
		padding: 20px 6%;
		width: 88%;
		text-align: center;
        color: #fff!important;
        margin: 20px 0;
	}
	#footer p,
	#footer a, 
	#footer ul li,
	#footer ul li a { 
		color: #fff!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 { font-size: 11px!important; }
	#footer ul li { 
		width: 100%;
		padding: 0;
		margin: 0;
	}

}