.TopSearch{	
	float: left;
	margin-top: 0px;
	margin-bottom: 15px;
	width:100%;
}

/* MAING BG WRAPPER */
.TopSearchWrapper {
	
	height: auto;
	background: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#d3d3d3));
    background: -moz-linear-gradient(top, #e8e8e8, #d3d3d3);
    background: -o-linear-gradient(top, #e8e8e8, #d3d3d3);
    background-color: #e8e8e8;
    -moz-border-radius:0 0 6px 6px;
	-webkit-border-radius:0 0 6px 6px;
	border-radius:0 0 6px 6px;
    padding: 10px;
  
}
/* LOCATION INPUT */
.TopSearch .TopSearchWrapper .InputBox{
	width: 306px;
	height: 60px;
	float: left;
	background: #fff;
	background-image: url("../../img/theme1/search/search-icon.png");
	background-repeat: no-repeat;
	background-position: 8px 8px;
	font-family: 'Lato', sans-serif;
	font-size: 18px;
	font-weight: 400;
	color: #000;
	border: 1px solid #b6b6b6;
	outline: none;
	padding: 0px 0px 0px 58px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin-right: 2px;
}

.TopSearch .TopSearchWrapper .InputBox:hover{
	border-color: #8c8c8c;
}

.TopSearch .TopSearchWrapper .InputBox_mls{
	width: 210px;
	height: 60px;
	float: left;
	background: #fff;
	background-image: url("../../img/theme1/search/search-icon.png");
	background-repeat: no-repeat;
	background-position: 8px 8px;
	font-family: 'Lato', sans-serif;
	font-size: 18px;
	font-weight: 400;
	color: #000;
	border: 1px solid #b6b6b6;
	outline: none;
	padding: 0px 0px 0px 58px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	margin-right: 2px;
}

.TopSearch .TopSearchWrapper .InputBox_mls:hover{
	border-color: #8c8c8c;
}

/* MAIN BUTTONS */
.TopSearch .TopSearchWrapper .toggleButton{
	width: auto;
	height: 43px;
	float: left;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f5f5f5));
    background: -moz-linear-gradient(top, #fff, #f5f5f5);
    background: -o-linear-gradient(top, #fff, #f5f5f5);
    background-color: #f5f5f5;
    background-image: url("../../img/theme1/search/downarrow.png");
  	background-repeat: no-repeat;
	background-position: 12px 25px;
	font-family: 'Lato', sans-serif;
	line-height: 1em;
	font-size: 22px;
	font-weight: 400;
	color: #696969;
	border: 1px solid #b6b6b6;
	outline: none;
	padding: 17px 26px 0px 39px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	text-decoration: none;
	margin-right: 2px;
}

.TopSearch .TopSearchWrapper .toggleButton:hover{
	background: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#fff));
    background: -moz-linear-gradient(top, #f5f5f5, #fff);
    background: -o-linear-gradient(top, #f5f5f5, #fff);
    background-color: #fff;
    background-image: url("../../img/theme1/search/downarrow.png");
	background-repeat: no-repeat;
	background-position: 12px 25px;
	border-color: #8c8c8c;
	cursor:pointer; 
}
/**** MLS toggleButton_mls*/
.TopSearch .TopSearchWrapper .toggleButton_mls{
	width: auto;
	height: 43px;
	float: left;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f5f5f5));
    background: -moz-linear-gradient(top, #fff, #f5f5f5);
    background: -o-linear-gradient(top, #fff, #f5f5f5);
    background-color: #f5f5f5;
    background-image: url("../../img/theme1/search/downarrow.png");
  	background-repeat: no-repeat;
	background-position: 12px 25px;
	font-family: 'Lato', sans-serif;
	line-height: 1em;
	font-size: 22px;
	font-weight: 400;
	color: #696969;
	border: 1px solid #b6b6b6;
	outline: none;
	padding: 17px 27px 0px 40px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	text-decoration: none;
	margin-right: 1px;
}

.TopSearch .TopSearchWrapper .toggleButton_mls:hover{
	background: -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#fff));
    background: -moz-linear-gradient(top, #f5f5f5, #fff);
    background: -o-linear-gradient(top, #f5f5f5, #fff);
    background-color: #fff;
    background-image: url("../../img/theme1/search/downarrow.png");
	background-repeat: no-repeat;
	background-position: 12px 25px;
	border-color: #8c8c8c;
	cursor:pointer; 
}

/* MAIN GO BUTTON */
.TopSearch .TopSearchWrapper .GoButton{
	width: 260px;
	height: 43px;
	float: left;
	background: -webkit-gradient(linear, left top, left bottom, from(#a8a8a8), to(#343434));
    background: -moz-linear-gradient(top, #a8a8a8, #343434);
    background: -o-linear-gradient(top, #a8a8a8, #343434);
    background-color: #343434;
	font-family: 'Lato', sans-serif;
	line-height: 1em;
	font-size: 22px;
	font-weight: 400;
	color: #fff;
	border: 0px solid #343434;
	outline: none;
	padding: 18px 0px 0px 0px;
	text-align: center;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	text-decoration: none;
	cursor: pointer; 
	cursor: hand;
}

.TopSearch .TopSearchWrapper .GoButton:hover{
	background: -webkit-gradient(linear, left top, left bottom, from(#dcdcdc), to(#8c8c8c));
 	 background: -moz-linear-gradient(top, #dcdcdc, #8c8c8c);
	  background: -o-linear-gradient(top, #dcdcdc, #8c8c8c);
	border-color: #dcdcdc;
	opacity: 0.8;
    filter: alpha(opacity=80);
}

.TopSearch .TopSearchWrapper .GoButton_mls{
	width: 100px;
	height: 30px;
	float: left;
	background: -webkit-gradient(linear, left top, left bottom, from(#a8a8a8), to(#343434));
    background: -moz-linear-gradient(top, #a8a8a8, #343434);
    background: -o-linear-gradient(top, #a8a8a8, #343434);
    background-color: #343434;
	font-family: 'Lato', sans-serif;
	line-height: 1em;
	font-size: 22px;
	font-weight: 400;
	color: #fff;
	border: 0px solid #343434;
	outline: none;
	padding: 18px 16px 12px 35px;
	text-align: center;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	text-decoration: none;
	cursor: pointer; 
	cursor: hand;
	text-align:left; 
}

.TopSearch .TopSearchWrapper .GoButton_mls:hover{
	background: -webkit-gradient(linear, left top, left bottom, from(#dcdcdc), to(#8c8c8c));
 	 background: -moz-linear-gradient(top, #dcdcdc, #8c8c8c);
	  background: -o-linear-gradient(top, #dcdcdc, #8c8c8c);
	border-color: #dcdcdc;
	opacity: 0.8;
    filter: alpha(opacity=80);
}

/* HIDDEN AREAS CONTAINER */
.TopSearchDivAreas{
	/*z-index: 1000;*/
	position: relative;
	left: 0px;
	top: 0px;
	margin: 0px;
	padding:0px;
	border: 0px;
	float:left;
	position:relative;
}

/* HIDDEN AREAS WITH CONTENT FOR TOGGLE BUTTONS */
.TopSearch .TopSearchDivAreas .toggleDivArea{
	display:none;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#f5f5f5));
    background: -moz-linear-gradient(top, #fff, #f5f5f5);
  	 background: -o-linear-gradient(top, #fff, #f5f5f5);
 	 background-color: #f5f5f5;
 	 width: auto;
 	 height: auto;
 	 border: 1px solid #b6b6b6;
   -moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
  	padding: 10px;
  	font-family: 'Lato', sans-serif;
	line-height: 1.2em;
	font-size: 18px;
	font-weight: 400;
	color: #000;
	text-transform: uppercase;
}

.TopSearch .TopSearchDivAreas .toggleDivArea:hover{
	border-color: #8c8c8c;
}

.TopSearch .TopSearchDivAreas .toggleType{
	position: absolute;
	top: 62px;
	z-index:1;
}

.TopSearch .TopSearchDivAreas .togglePrice{
	position: absolute;
	top: 62px;
}

.TopSearch .TopSearchDivAreas .togglePrice #amount {
	padding: 10px;
  	font-family: 'Lato', sans-serif;
	line-height: 1.2em;
	font-size: 18px;
	font-weight: 400;
	color: #000;
	text-transform: uppercase;
	border: 0px;
}

.TopSearch .TopSearchDivAreas .togglePrice .sliderRangeWrapper {
	padding: 10px 0px 10px 0px;
}

.TopSearch .TopSearchDivAreas .togglePrice .sliderHandles {
	font-family: 'Lato', sans-serif;
	line-height: 1em;
	font-size: 12px;
}


.TopSearch .TopSearchDivAreas .toggleBeds{
	position: absolute;
	top: 62px;
	z-index:1;
}

.TopSearch .TopSearchDivAreas .toggleBaths{
	position: absolute;
	top: 62px;
	z-index:1;
}

/* OK BUTTON WITHIN HIDDEN DIVS WRAPPER */
.TopSearch .TopSearchDivAreas .toggleButtonInnerWrapper{
	width: 100%;
	text-align: center;
	margin: 10px 0px 10px 0px;
}
	
/* OK BUTTON WITHIN HIDDEN DIVS */
.TopSearch .TopSearchDivAreas .toggleButtonInnerWrapper .toggleButtonInner{
	width: 50px;
	height: 20px;
	clear: both;
	background: -webkit-gradient(linear, left top, left bottom, from(#a8a8a8), to(#343434));
    background: -moz-linear-gradient(top, #a8a8a8, #343434);
    background: -o-linear-gradient(top, #a8a8a8, #343434);
    background-color: #343434;
	font-family: 'Lato', sans-serif;
	line-height: 1em;
	font-size: 15px;
	font-weight: 400;
	color: #fff;
	border: 1px solid #343434;
	outline: none;
	padding: 5px 10px 5px 10px;
	text-align: center;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	text-decoration: none;
	cursor: pointer; 
	cursor: hand;
}

.TopSearch .TopSearchDivAreas .toggleButtonInnerWrapper .toggleButtonInner:hover{
	background: -webkit-gradient(linear, left top, left bottom, from(#dcdcdc), to(#8c8c8c));
  background: -moz-linear-gradient(top, #dcdcdc, #8c8c8c);
  background: -o-linear-gradient(top, #dcdcdc, #8c8c8c);
	border-color: #dcdcdc;
}

autoc_big {
    margin: 0;
    position: absolute;
    width: 425px;
    z-index: 1000;
}
.cFloat {
    clear: both;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
.input_box{float:left; position:relative;}
.search_button{float:left; position:relative; width:190px; padding-left: 2px}

.search_button_mls{float:left; position:relative; padding-left:2px;}
.price_range{float:left; width:339px; padding-bottom:15px;}
.price_range_mls{float:left; width:230px; padding-bottom:15px;}
.TopSearchWrapper_mls{ padding-left:40px;}


/*/////////////////// fancy radio and checkbox*/

.has-js .label_check,
.has-js .label_radio { padding-left: 34px; cursor:pointer; font-weight:normal;  display: block;line-height: 20px; padding-bottom: 9px; color:#696969; }
.has-js .label_radio { background: url(../../img/theme1/search/radio-off.png) no-repeat; }
.has-js .label_check { background: url(../../img/theme1/search/check-off.png) no-repeat; }
.has-js label.c_on { background: url(../../img/theme1/search/check-on.png) no-repeat; }
.has-js label.r_on { background: url(../../img/theme1/search/radio-on.png) no-repeat; }
.has-js .label_check input,
.has-js .label_radio input { position: absolute; left: -9999px; }

/************************************************************************************
smaller than 768 by 800 
Css for ipad orientation : portrait
*************************************************************************************/

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) 
{ 
.TopSearch .TopSearchWrapper .InputBox {width:50px;}
.TopSearch .TopSearchWrapper .InputBox_mls {width:120px;}
.TopSearch .TopSearchWrapper .GoButton {width:100%;}
.TopSearch .TopSearchWrapper .toggleButton{ width:40px;}
.TopSearchDivAreas{ width:111px;}
.input_box{ width:112px}
.search_button{ width:24%;}

.input_box_mls{width:180px}
.TopSearchWrapper{padding:10px;}
.TopSearch .TopSearchWrapper .toggleButton_mls{ background-position: 20px 44px; padding: 17px 34px 0 4px;width: 22px;}
.TopSearch .TopSearchWrapper .toggleButton_mls:hover{background-position: 20px 44px;}
.div_area_mls{ width:62px;}
.price_range_mls{ width:125px;}
}

/************************************************************************************
smaller than 768 by 800 
Css for ipad orientation:landscape
*************************************************************************************/

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) 
{ 
.TopSearch .TopSearchWrapper .InputBox {width:210px;}
.input_box{ width:270px}
.TopSearchWrapper{padding:10px; padding-left:20px;}
.TopSearch .TopSearchWrapper .toggleButton{ width:38px;}
.TopSearch .TopSearchWrapper .toggleButton_mls{ width:30%;  background-position: 12px 25px;}
.TopSearchDivAreas{ width:11%;}
.div_area_mls{ width:100px;}
.price_range_mls{ width:200px;}
}
/************************************************************************************
smaller than 320 by 480
THis is used for iphone 5 for normal screen
*************************************************************************************/
@media screen and (min-width: 320px) and (max-width: 480px), (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) 
{
.TopSearch .TopSearchWrapper .InputBox {width:80%;}
.TopSearch .TopSearchWrapper .InputBox_mls {width:80%;}
.TopSearch .TopSearchWrapper .GoButton {width:98%;}
.TopSearch .TopSearchWrapper .GoButton_mls {width:94%; margin-bottom:5px;}
.TopSearch .TopSearchWrapper .toggleButton{ width:55%;}
.TopSearchDivAreas{ width:48%; padding:0.5%;}
.input_box{ width:100%;}
.search_button{ width:100%;}
.search_button_mls{ width:87%;}
.TopSearch .TopSearchDivAreas .toggleType{ z-index:1;}
.TopSearch .TopSearchDivAreas .togglePrice{ z-index:1; right:-5px;}
.TopSearch .TopSearchDivAreas .toggleBeds{ z-index:1;}
.TopSearch .TopSearchDivAreas .toggleBaths{ z-index:1;}
.price_range{ width:auto; text-align:center;}
.TopSearch .TopSearchWrapper .toggleButton_mls{ width:55%;  }
.price_range_button_mls{ width:40% !important;}
.TopSearchWrapper{padding:10px;}
.togglePriceWrap_mls{ width:38%;}
}

