body {
	font-family: 'RobotoCondensed', sans-serif;
	font-size:15px;
}

.wrapper {
    width: 840px;
    position:relative;
	margin: 20px auto 0;
}



::-webkit-input-placeholder {
   color: #ffffff;  
}

:-moz-placeholder { /* Firefox 18- */
   color: #ffffff;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #ffffff;  
}

:-ms-input-placeholder {  
   color: #ffffff;  
}

.rvc-wrapper {

}

.rvc-title {
    font-family: 'RobotoBoldCondensed';
    font-size:15px;
    padding-bottom: 10px;
}

.rvc-content {
    overflow:hidden;
    padding-bottom: 15px;
}

.rvc-cities {
    display:block;
    list-style:none;
    float:left;
    height:44px;
    width:645px;
    color:#fff;
    font-size:21px;
}

.rvc-cities li{
    float:left; 
    width:200px;
    height:44px;   
    margin-right:12px;
}

a.rvc-city {
    position: relative;
    
    width:200px;
    height:44px;

    background:url("../images/rcv_bg.png");
    border-radius:5px;
    display:block;
    cursor:pointer;
}

.rvc-city button {
    background: url("../images/close.png") repeat scroll 0 0 transparent;
    border: medium none;
    height: 16px;
    color:#fff;
    margin:0;
    padding:0;
    position: absolute;
    right: 0;
    top: 0;
    width: 16px;
}

.rvc-city button.transparent {
    opacity: 0.5;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
}

.rvc-city button.no-transparent {
    opacity: 1!important;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100)!important;
}

.rvc-city button.pressed {
    background: url("../images/close.png") repeat scroll 1px 1px transparent;
}

.city-wrapper {
    font-size:21px;
    display: block;
    height: 44px;
    width: 127px;
     overflow: hidden;
}

.rvc-city .city-title, .rvc-city .city-temp {
    
    display:block;
    height:44px;
    line-height:44px;
    
}


.rvc-city .city-title{
   white-space:nowrap;
   /* width: 117px;*/
    margin-left: 10px;
}


.rvc-city .city-temp {
    color: #999;
    font-family: 'RobotoBoldCondensed';
    position: absolute;
    right: 42px;
    top: 0;    
}

.rvc-city.active .city-temp, .rvc-city:hover .city-temp {
    color: #96cfed;
}

.rvc-city.active, .rvc-city:hover {
    background:url("../images/rcv_bg_active.png");
}

.rvc-city .city-image {
    display: block;
    
    height: 44px;
    /*margin-right: 10px;*/
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    background-size: 100% auto;
}

.rvc-city#rvc-city1 .city-image {
    background:url("../images/conds/9000-day.png");
    background-size:100%;
}

.rvc-city#rvc-city2 .city-image {
    background:url("../images/conds/9001-day.png");
    background-size:100%;
}

.rvc-city#rvc-city3 .city-image {
    background:url("../images/conds/0006-day.png");
    background-size:100%;
}

.rvc-select {
    background:url("../images/select_bg.png");
    float:right;
    height:44px;
    width:166px;
    font-size:15px;
    border-radius:5px;
    color:#fff;
}

.rvc-select .rvc-select-input {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    height: 44px;

    margin: 0 0 0 45px;
    padding: 0;
    color:#fff;
    font-family: 'RobotoCondensed';
    font-size:15px;
    /*width: 82px;*/
    width: 118px;
    float: left;
    line-height: 44px\0/;
}

.rvc-select button {
    background: none repeat scroll 0 center transparent;
    border: 0 none;
    cursor: pointer;
    float: left;
    height: 44px;
    margin: 0 0 0 2px;
    padding: 0;
    width: 35px;
    display:none;
}




.ui-autocomplete {
    background:url("../images/dropdown_bg.png") repeat-y scroll 0 0 transparent;
  /*  height: 192px;*/
    position: absolute;
    right: 0;
    top: 70px;
    width: 166px!important;
    border-radius:5px;
    display:none;
    z-index: 200;
    list-style: none outside none;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 1px;
    margin-left: -2px;
}


.ui-autocomplete .ui-menu-item a {
    display: block;
    height: 23px;
    line-height: 23px;
    padding-left: 7px;
}

.ui-autocomplete .ui-menu-item a.ui-state-focus {
     background:#ccc;
}

.ui-helper-hidden-accessible {
 display:none;
}

.city-list-wrapper {
    background:url("../images/dropdown_bg.png") repeat-y scroll 0 0 transparent;
    height: 192px;
    position: absolute;
    right: 0;
    top: 70px;
    width: 166px;
    border-radius:5px;
    display:none;
    z-index: 200;
}


.ui-autocomplete li {
    cursor: pointer;

    overflow: hidden;

}

#city-list {
    list-style: none outside none;
    padding-top: 5px;
}

#city-list  li {
    cursor: pointer;
    height: 18px;
    line-height: 18px;
    margin-left: 15px;
    margin-top: 4px;
}

.conditions-wrapper {
 /*   height:343px;*/ /*wo slider*/
    background:url("../images/cond_bg.png");
    margin-bottom: 30px;
    position: relative;
    color:#fff;
     height:393px;
 /*   border-radius: 3px;*/
}

.conditions-wrapper div {
    position:absolute;
}

.city-name {
    font-size: 32px;
    left: 200px;
    top: 100px;
    width: 250px;    
}

.condition-title {
    font-family: 'RobotoBlack';
    font-size:48px;
    left: 200px;
    top: 40px;    
}

.condition-title .blue {
    color:#0572b1;
}


.conditions-wrapper .image {
    margin-top:70px;
    height:250px;
    width:250px;
    background:url("../images/conds/9001-day.png");
}

.conditions-wrapper .day-condition {
    font-family: RobotoLight;
    font-size: 21px;
    left: 45px;
    text-align: center;
    text-shadow: 1px 1px 2px black, 0 0 1em black;
    top: 251px;
    width: 150px;
}

.conditions-wrapper .temp {
    font-family: 'RobotoBoldCondensed';
    font-size:148px;
    left: 200px;
    top: 150px;    
    letter-spacing: -1px;    
}

.conditions-wrapper .more-current{
    font-size: 24px;
    left: 200px;
    top: 289px;
}

.conditions-wrapper .more-current .value {
    font-family: 'RobotoBoldCondensed';
}

.conditions-wrapper .separator {
    background: none repeat scroll 0 0 #FFFFFF;
    height: 210px;
    left: 500px;
    top: 100px;
    width: 1px;
}

.conditions-wrapper ul.details {
    color: #FFFFFF;
    font-family: 'RobotoBlack';
    font-size: 18px;
    list-style: none outside none;
    position: absolute;
    right: 11px;
    top: 100px;
}

.conditions-wrapper ul.details .title{
    padding-left: 45px;
    width: 174px;
}

.conditions-wrapper ul.details span.value{
    font-family: 'RobotoCondensed';
}

.conditions-wrapper ul.details li{
    background: url("../images/details_bg.png") no-repeat scroll 0 0 transparent;
    border-radius: 5px;
    height: 40px;
    padding-bottom: 2px;
    line-height: 40px;
    width: 317px;
    overflow: hidden;
}

.conditions-wrapper ul.details li span{
    float:left;
    display:block;
}

.conditions-wrapper ul.details .wind{
}

.conditions-wrapper ul.details .visibility{
    background-position: 0 -42px;
}

.conditions-wrapper ul.details .humidity {
    background-position: 0 -84px;
}

.conditions-wrapper ul.details .dewpt {
    background-position: 0 -126px;
}

.conditions-wrapper ul.details .pressure {
    background-position: 0 -168px;
}




.forecast-title {
    font-family: 'RobotoLight';
    font-size:40px;
    padding-bottom: 10px;
}

.forecast-title .blue {
    color:#0572b1;
}

.forecast-title .gray {
    color: #999;
}

.forecast-content {
    overflow:hidden;
    color:#fff;
}

.forecast-content .day {
    float:left;
    width:265px;
    height:194px;
    margin-left:22px;
    border-radius:5px;
    position: relative;
    background: url("../images/conds/9001-day.png") repeat scroll 0 0 #045788;
    position:relative;
}

.forecast-content #day1 {
    margin:0;
}

.forecast-content .day .date {
    font-family: 'RobotoBoldCondensed';
    font-size:18px;
    padding: 25px 0 0 20px;
    text-shadow: 1px 1px 2px black, 0 0 1em black;
}


.forecast-content .day .day-condition {
    font-family: 'RobotoLight';
    font-size:21px;
    padding: 10px 0 0 20px;
    text-shadow: 1px 1px 2px black, 0 0 1em black;
    width: 225px;
}

.forecast-content .day .hitemp {
    padding: 15px 0 0 20px;
    font-family: 'RobotoBoldCondensed';
    font-size:48px;
    opacity: 0.75;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=75);
    text-shadow: 1px 1px 2px black, 0 0 1em black;
    top: 93px;
    position: absolute; 
    left: 0;
}

.forecast-content .day .lotemp {
    font-family: 'RobotoBoldCondensed';
    font-size: 32px;
    margin-top: -15px;
    opacity: 0.75;
    padding-left: 75px;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=75);
    text-shadow: 1px 1px 2px black, 0 0 1em black;
    top: 162px;
    position: absolute; 
    left: 0;     
}

.forecast-content .day .diagonal {
    background: url("../images/diagonal.png") repeat scroll 0 0 transparent;
    height: 69px;
    left: 42px;
    position: absolute;
    top: 109px;
    width: 69px;
}


.forecast-content .precip-chance {
    border: medium none;
    font-family: 'RobotoLight';
    font-size: 16px;
    left: 112px;
    position: absolute;
    text-align: right;
    text-shadow: 1px 1px 2px black, 0 0 1em black;
    top: 27px;
    width: 145px;
}

.forecast-content .precip-chance .title {

}

.forecast-content .precip-chance .value {

}

#timeline-slider {
    background: url("../images/slider_bg.png") no-repeat scroll left center transparent;
    cursor: pointer;
    height: 55px;
    left: 40px;
    position: absolute;
    top: 326px;
    width: 760px;
}

#timeline-slider #timeline-bubble {
    background: none repeat scroll 0 0 #1E6C9B;
    border-radius: 6px;
    display:none;
    color: #FFFFFF;
    font-size: 20px;
    height: 28px;
    line-height: 28px;
    margin-left: -29px;
    overflow: hidden;
    position: absolute;
    text-align: center;
    top: -32px;
    width: 56px;
}

#timeline-slider .ui-slider-range {
    background: url("../images/slider_bg_fill.png") no-repeat scroll left center transparent;
    height: 100%;
    left: 10px;
    position: absolute;
    top: 0;
    
}

#timeline-slider .ui-slider-handle {
    background: url("../images/handle.png") no-repeat scroll center center transparent;
    cursor: default;
    height: 100%;
    margin-left: -27px;
    position: absolute;
    text-align: center;
    text-decoration: none;
    width: 55px;
}