@font-face {
	font-family: pebbles;
	src: url(Pebble_W_Rg.woff);
}

html {
    background-color: #f8f8f8;
}

body {
    margin: 0 auto;
    max-width: 960px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 15px;
    line-height: 21px;
    color: #333;
    background-color: #f8f8f8!important;
}

body, body * {
    box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
    color: #333;
    font-weight: 600;
    line-height: 1.3em;
}

h2 {
    margin-top: 1.3em;
}

a {
    color: #ff6319;
}

b, strong {
    font-weight: 600;
}

samp {
    display: none;
}

.bh-sl-map {
    height:800px;
    width:620px;
    float:left;
    margin-top:4px
}

.bh-sl-loc-list {
    width:340px;
    float:left;
    height:800px;
    overflow-y:scroll;
    overflow-x:hidden
}

.form-input {
    float:left;
    width:100%;
    padding:20px 0px
}

.form-input label {
    float:left;
    width:100%;
    line-height:40px
}

.form-input input {
    float:left;
    width: 70%;
    max-width:334px;
    height: 37px;
    border-radius: 3px;
    border: 1px solid #d8d8d8;
    padding:8px

}

.form-input button {
    background-color: #ff6319;
    border:0;
    color:#fff;
    padding:10px 20px;
    border-radius:3px;
    font-size:15px;
    margin-left:10px
}

.maplegend {
    width:100%;
    background-color:#d8d8d8;
    float:left;
    height:18px
}
.maplegend p {
    float:left;
    color:#fff;
    line-height:18px;
    margin-top:0;
    font-size:13px;
    text-transform:uppercase;
    padding-left:2px
}

.maphead {
    width:640px
}

.list li {
    list-style: none;
    margin:4px 0;
    background-color:#fff!important;
    border:1px solid #d8d8d8;
    float:left;
    font-size:13px;
    width:100%
}

li:hover {
    cursor:pointer
}

ul.list {
    padding:0 0 0 4px;
    float:left;
    margin:0;
    width:100%
}

.topbar {
    background-color: #d8d8d8;
    color:#333;
    height:36px;
    line-height:36px;
    text-transform:uppercase;
    float:left;
    width:100%
}

.list-focus .topbar {
    background-color: #990ae3;
    color: #fff;
}


.list-label {
    font-family: pebbles;
    float:left;
    width:30px;
    height:30px;
    text-align:center;
    line-height:30px;
    background-color:#990ae3;
    color:#fff;
    font-weight:bold;
    border-radius:15px;
    margin:2px 4px
}

.address {
    border-right: 1px solid #d8d8d8;
    border-bottom: 1px solid #d8d8d8;
    width:50%;
    padding:8px;
    float:left;
    height:60px
}

.phone {
    width:50%;
    float:left;
    padding:0 40px;
    border-bottom:1px solid #d8d8d8;
    height:60px;
    background:url('assets/img/icon-phone.png') no-repeat 8px center;
    line-height:60px
}
.hours {
    width:100%;
    float:left;
    padding:8px 40px;
    background:url('assets/img/icon-clock.png') no-repeat 8px center;
}

.list-details {
    float: left;
    width: 100%;
    display: none;
}

.list-focus .list-details {
    display: block;
}

.regions, .regions ul {
    width: 100%;
    float: left;
    padding-left: 0
}

.regions li {
    float: left;
    height: 44px;
    list-style: none;
    margin-right: 10px;
}

.regions a {
    padding: 8px 16px;
    border: 1px solid #d8d8d8;
    border-radius: 2px;
    color: #333;
    text-decoration: none;
    background-color: #fff
}

.regions li.selected a, .regions li a:hover {
    border: 1px solid #990ae3;
    background-color: #f8f8f8
}


@media screen and (max-width: 960px) {
    body {
        padding: 10px
    }
    .maplegend {
        display: none;
    }
    
    .bh-sl-map {
        width: 480px;
        float:left;
        margin-top:4px;
        height:480px
    }

    .bh-sl-loc-list {
        width:100%;
        height:auto;
        float:left;
        /*display: none;*/
    }
    
    ul.list {
        padding:0
    }
	
	.form-input input {
		font-size:24px
	}


}