body {font-family: "Archivo", Arial, Helvetica, sans-serif; margin: 0; padding: 0;}

#width {position: fixed; top: 0; z-index: 20; padding: 0 3px; font-size: 11px; line-height: 14px; font-family: Arial, Helvetica, sans-serif; background-color: #FF0;}

a, a:visited, a:hover {text-decoration: none; outline: none;}
img {border: 0;} hr {height: 1px; border: 0px; color: #CCC; background-color: #CCC; margin: 15px 0;}
.phlink {color: inherit !important; text-decoration: none !important; white-space: nowrap;} .phlink:hover {cursor: text;}

* {transition: 0.3s; -webkit-transition: 0.3s;}

/*-----------------------------------------------*/

/*HEADER*/

#header {position: relative; margin: auto; padding: 5px 0; text-align: center;}
#logo {font-family: "Work Sans", Gadget, sans-serif; padding: 5px 0 0 0; font-size: 40px; line-height: 42px; font-weight: 800; text-transform: uppercase; text-shadow: 1px 1px 1.5px #000;}
#logo, #logo a {text-decoration: none;}
h1 {font-size: 22px; line-height: 26px; font-weight: 600 !important; padding: 0 !important; margin: 0 auto !important; text-transform: none;}
#phone {margin: 10px auto; font-size: 26px; line-height: 32px; font-weight: 600;}
#phone a {text-decoration: none; white-space: nowrap;} .phbull {padding: 0 4px 0 12px; color: #222;}
#social {position: absolute; bottom: 5px;} #lic {font-size: 13px; line-height: 19px; padding-bottom: 3px;} #lic span {display: inline;}

@media (min-width: 876px) {
#header {max-width: 850px;} #social {right: 0; height: 20px; width: 70px; background:url('fb.png'); background-size: 70px 20px;}
}
@media (max-width: 875px) {#social {right: 6px; height: 22px; width: 22px; background:url('fb.gif'); background-size: 22px 22px;}}
@media (max-width: 820px) {#logo {font-size: 34px; line-height: 36px;}}
@media (max-width: 700px) {
#logo {font-size: 32px; line-height: 34px;} h1 {font-size: 20px; line-height: 24px;}
#phone {font-size: 24px; line-height: 30px;} .phbull {padding: 0 2px 0 8px;}
}
@media (max-width: 665px) {#logo span {display: block;} h1 {margin-top: 3px !important;}}
@media (max-width: 580px) {
#header {padding: 3px 0;} h1 {font-size: 19px; line-height: 23px;} #phone {font-size: 23px; line-height: 29px; margin: 8px auto;}
#social {top: 6px; bottom: auto; height: 20px; width: 20px; background-size: 20px 20px;}
}
@media (max-width: 540px) {#phone {font-size: 21px; line-height: 27px;} #lic {font-size: 12px; line-height: 18px;}}
@media (max-width: 500px) {
#header {padding: 2px 0;} h1 {font-size: 18px; line-height: 22px;} #phone {font-size: 20px; line-height: 26px;}
.phbull {padding: 0 1px 0 7px;} #lic {font-size: 11px; line-height: 15px; padding-bottom: 2px;}
}
@media (max-width: 450px) {
#logo {text-shadow: .5px .5px 1.2px #000;} h1 span, #phone a, #lic span {display: block;}
.phbull {display: none;} #phone {font-size: 22px; line-height: 28px;} #social {top: auto; bottom: 6px;}
}
@media (max-width: 375px) {#logo {font-size: 30px; line-height: 32px;}}
@media (max-width: 350px) {#logo {font-size: 28px; line-height: 30px;}}
@media (max-width: 290px) {#lic {text-align: left; margin-left: 8px;}}

/*-----------------------------------------------*/

/*MENU*/

#nav, #nav a {-webkit-tap-highlight-color:transparent;} #nav a:hover {background: none;}
#nav {text-align: center; position: relative; padding 0 !important; margin: 0 !important;} #nav li {list-style:none;}
#nav li a {display: table-cell; padding: 0; vertical-align: middle; font-size: 20px; line-height: 23px; font-weight: 600; text-transform: uppercase;}
@media (min-width: 306px) {	
#nav li a {height: 45px;} #nav ul {margin: 0; padding: 0;}
#nav li {display: inline-block; vertical-align: middle; margin-left: -4px;}
#nav li a {padding: 1px 18px 2px 18px;} #nav a.selected:hover {text-decoration: none !important;}
}
@media (max-width: 380px) {#nav li a {font-size: 18px; line-height: 21px; padding: 2px 15px 0 15px;}}
@media (max-width: 340px) {#nav li a {font-size: 17px; line-height: 20px; padding: 2px 12px 0 12px;}}
@media (max-width: 310px) {#nav li a {height: 38px; padding: 1px 10px 0 10px; width: 1%;}}

/*-----------------------------------------------*/

/*BODY*/

#bodyback, #bodyarea {position: relative;}

@media (min-width: 876px) {
#bodyback {margin: 0px auto auto auto; padding: 0; width: 850px; border-left: 4px solid #FDD934; border-right: 4px solid #FDD934;}
#bodyarea {padding: 25px 30px 20px 30px;}
}
@media (max-width: 875px) {#bodyarea {padding: 20px;}}

#bodyarea, h2 {font-size: 21px !important; line-height: 29px !important; font-weight: 400 !important;}
@media (max-width: 400px) {#bodyarea {padding: 20px 15px;} #bodyarea, h2 {font-size: 19px !important; line-height: 26px !important;}}
@media (max-width: 360px) {#bodyarea, h2 {font-size: 17px !important; line-height: 24px !important;}}

#bodyhead {text-align: center; font-weight: 700; font-size: 1.3em;}

/*-----------------------------------------------*/

/*BOTTOM AREA*/

#bottomarea {font-size: 12px; line-height: 19px; padding-bottom: 8px; text-align: center; font-family: Arial, Helvetica, sans-serif;}
#btm_menu {padding: 10px; margin-bottom: 7px; font-family: Arial, Helvetica, sans-serif !important; font-size: 16px; line-height: 20px; text-transform: uppercase;}
#btm_menu a {text-decoration: none;} #btm_menu a:hover {text-decoration: underline;} #btm_menu span {padding: 0 10px;}
.copy, .web {margin-top: 15px;}

@media (max-width: 475px) {.btmph {margin-top: 13px;}}
@media (max-width: 380px) {.city {display: block;}}
@media (max-width: 300px) {
#btm_menu {padding: 5px; line-height: 42px; text-transform: uppercase;}
#btm_menu a, .web a {display: block;} #btm_menu span {display: none;}
}
.tb {font-style: italic; text-decoration: none;} .tb:hover {text-decoration: underline;}

/*====================================================*/

/*COLORS*/

#bodyarea {background-color: #FFF;}
@media (min-width: 876px) {body {background: #333333 url('back.jpg') repeat;}}
a, a:visited, a:hover {color: #0066CC;}

#header {background-color: #FDD934;}
#logo, #logo a, #phone, #phone a, #bodyhead {color: #D30000;}
body {background-color: #333333;}
h1, #lic {color: #000000;}

#nav {background-color: #C00000;} #nav a {color: #FFF;} #nav a:hover {background-color: #E00000;}
#nav a.selected, #nav a.selected:hover {background-color: #900000;}
@media (max-width: 310px) {#nav li a {border-bottom: 1px solid #000; border-right: 1px solid #000;}}

.pic img {border: 1px solid #000;} .pic img:hover {border: 1px solid #FC0202;}

#bottomarea, #bottomarea a, #btm_menu a {color: #FFF;} #bottomarea {background-color: #000;} #btm_menu {color: #FFF; background-color:#900000;}
.ph2, .ph2 a {color: #FFF !important;} .tb {color: #FDD934 !important;}
