.progress, sub, sup { vertical-align: baseline } .block, .elem-left, .elem-right, article, aside, details, figcaption, figure, footer, header, hr, main, menu, nav, section, summary { display: block } hr, sub, sup { position: relative } body, figure { margin: 0 } button, hr, input, select { overflow: visible } [type=checkbox], [type=radio], legend { box-sizing: border-box; padding: 0 } html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; box-sizing: border-box; font-size: 100% } audio, canvas, progress, video { display: inline-block } audio:not([controls]) { display: none; height: 0 } [hidden], template { display: none } a { background-color: transparent } a:active, a:hover { outline-width: 0 } abbr[title] { border-bottom: none; text-decoration: underline; -webkit-text-decoration: underline dotted; text-decoration: underline dotted } b, strong { font-weight: 700 } dfn { font-style: italic } h1 { font-size: 2em; margin: 0 0 .67em } mark { background-color: #ff0; color: #000 } small { font-size: 80% } sub, sup { font-size: 50%; line-height: 0 } sub { bottom: -.25em } sup { top: -.65em } img { border-style: none } svg:not(:root) { overflow: hidden } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em } hr { box-sizing: content-box; height: 0; border: 0 } button, input, select, textarea { font: inherit; line-height: initial; margin: 0 } optgroup { font-weight: 700 } button, select { text-transform: none } [type=button], [type=reset], [type=submit], button { cursor: pointer } [disabled] { cursor: default } [type=reset], [type=submit], button, html [type=button] { -webkit-appearance: button; -moz-appearance: button; appearance: button; border: 0 } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0 } button:-moz-focusring, input:-moz-focusring { outline: ButtonText dotted 1px } fieldset { border: 1px solid silver; margin: 0 2px; padding: .35em .625em .75em } legend { color: inherit; display: table; max-width: 100%; white-space: normal } textarea { overflow: auto } [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto } [type=search] { -webkit-appearance: textfield; -moz-appearance: textfield; appearance: textfield } [type=search]::-webkit-search-cancel-button, [type=search]::-webkit-search-decoration { -webkit-appearance: none; appearance: none } *, ::before, ::after { box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } .clearfix:before, .clearfix:after { display: table; content: " " } .clearfix:after { clear: both } address { font-style: normal !important } img { max-width: 100%; display: block; margin: 0 auto } .icon-gplus:before { margin-left: -1px !important } *, ::before, ::after { box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } [class*=" icon-"]:before, [class^=icon-]:before { line-height: 1 !important; display: block !important } img { max-width: 100% } header { z-index: 101 } footer { z-index: 102 } .fixons { z-index: 103 } .flex-ed, .col-flex-ed { display: flex } .flex-ed { flex-flow: row wrap } .animated { -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-fill-mode: both; animation-fill-mode: both } @-webkit-keyframes fadeIn { from { opacity: 0 } to { opacity: 1 } } @keyframes fadeIn { from { opacity: 0 } to { opacity: 1 } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn } @-webkit-keyframes slideIn { from { transform: translate3d(0, -100%, 0) } to { transform: translate3d(0, 0, 0) } } @keyframes slideIn { from { transform: translate3d(0, -100%, 0) } to { transform: translate3d(0, 0, 0) } } @-webkit-keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0) } to { opacity: 1; transform: none } } @keyframes fadeInUp { from { opacity: 0; transform: translate3d(0, 100%, 0) } to { opacity: 1; transform: none } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp } @-webkit-keyframes fadeInRight { from { opacity: 0; transform: translate3d(100%, 0, 0) } to { opacity: 1; transform: none } } @keyframes fadeInRight { from { opacity: 0; transform: translate3d(100%, 0, 0) } to { opacity: 1; transform: none } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight } @-webkit-keyframes fadeInLeft { from { opacity: 0; transform: translate3d(-100%, 0, 0) } to { opacity: 1; transform: none } } @keyframes fadeInLeft { from { opacity: 0; transform: translate3d(-100%, 0, 0) } to { opacity: 1; transform: none } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft } .star:before { font-size: 28px; font-family: 'fontello'; font-weight: 400; margin: 0; font-style: normal; content: '\e80f \e80f \e80f \e80f \e80f'; color: #FEBB21; letter-spacing: .3em; } [data-embed], [data-player], [data-vimeo] { position: relative } [data-embed] .close, [data-player] .play, [data-vimeo] .close { background-color: #00a5be; color: #fff; padding: 11px; text-transform: uppercase } [data-embed] .close:hover, [data-player] .play:hover, [data-vimeo] .close:hover { background-color: #464646; color: #fff } [data-embed] .play { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) } [data-embed] .close { position: absolute; top: 0; right: 0 } [data-embed] .close i:before { transform: rotate(45deg) } .vimeo[class*=elem-], .youtube[class*=elem-] { width: 440px } .vimeo, .youtube { position: relative; cursor: pointer; width: 100%; font-size: 0 } .vimeo:after, .vimeo:before, .youtube:after, .youtube:before { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) } .vimeo:after, .youtube:after { font-size: 70px; color: #fff; font-family: fontello; font-weight: 400; margin: 0; font-style: normal; content: "\e80e" } .vimeo:after { color: #00adef } .vimeo:hover:after, .youtube:hover:after { color: red } .vimeo.active:after, .vimeo.active:before, .youtube.active:after, .youtube.active:before { display: none } @media (min-width:1031px) { #fixed-tabs { display: none } } @media (max-width:1030px) { #fixed-tabs { position: fixed; right: 0; text-align: center; line-height: 1; font-size: 0; z-index: 10000; bottom: 0; width: 100%; box-shadow: 0 0 15px rgba(0, 0, 0, .3); display: flex } #fixed-tabs a { padding: 13px 0; flex: 0 1 25%; font-size: 16px; font-weight: 700; font-family: Rubik, sans-serif; background-color: #d2b046; color: #000; text-transform: uppercase } #fixed-tabs a span { display: inline-block; vertical-align: middle } #fixed-tabs a span:last-child { margin-left: 7px } #fixed-tabs a:nth-of-type(2) { background-color: #003073; color: #fff } #fixed-tabs a:first-of-type { flex: 0 1 50%; background-color: #009cdc; color: #000 } #fixed-tabs i { font-size: 16px; margin-right: 5px } #fixed-tabs i, #fixed-tabs i:before { display: inline-block; margin: 0 auto } footer { margin-bottom: 42px !important } } @media (max-width:600px) { #fixed-tabs strong { display: none } #fixed-tabs a span:last-child { margin-left: 0 } } body { position: relative; background-color: #fff; font-family: Rubik, sans-serif; text-align: center; overflow-x: hidden } p { font: 400 20px/1.6 Rubik, sans-serif; color: #000 } a { display: inline-block; text-decoration: none; cursor: pointer; transition: .3s all } h1, h2, h3, h4, h5, h6 { font-family: Rubik, sans-serif } .mobile-banner-reviews { display: none } h1 { margin: 0; text-align: center; color: #000; font: 700 96px/1.1 Rubik, sans-serif; letter-spacing: .1em } h2 { color: #000; text-align: left; font: 600 55px/1.1 Rubik, sans-serif } h2 span { display: block; font-size: 24px; font-weight: 400; color: #000; font-family: Rubik, sans-serif; margin-bottom: 10px; text-transform: none } h3 { font-size: 32px; line-height: 1.41 } .h3 { color: #000; font: 500 22px/1 Rubik, sans-serif; letter-spacing: -.02em } .h4 { letter-spacing: .05em; color: #009cdc; font: 700 16px/1.1 Rubik, sans-serif; text-transform: uppercase; margin: 10px auto } .mobile-break { display: none } header { position: relative; padding: 15px 10px; background-color: #fff; z-index: 1000 } header .flex-ed { justify-content: space-between; align-items: center; flex-wrap: nowrap; max-width: 1300px; margin: auto; width: 100%; padding-top: 5px; padding-bottom: 5px } .mobile-buttons { display: none } .hd-info { display: flex; flex-direction: column; text-align: right; flex: 0 1 370px; order: -1 } .hd-btns { flex: 0 1 200px; margin-left: 20px } .hd-btns .btn, .hd-btns .btn-alt { padding: 18px 25px; font-size: 14px; min-width: 200px; letter-spacing: .15em; width: 100%; border-radius: 8px; font-weight: 700; background: #009cdc; color: #000 } .hd-btns .btn-alt:hover, .hd-btns .btn:hover { background: #d2b046; color: #fff } .hd-btns .btn span, .hd-btns .btn-alt span { display: block; font-size: 34px } .mobile-image { display: none } .desktop-image { display: block } .subpage { text-align: center; max-width: 1200px; margin: 100px auto; padding: 15px } .phone { color: #009cdc; font-size: 34px; line-height: 1.1; font-family: Rubik, sans-serif; font-weight: 700; position: relative; letter-spacing: normal; text-align: center; margin-bottom: 0 } .phone span { color: #000; display: block; font-size: 16px; font-weight: 400; letter-spacing: .03em } .phone:hover { color: #000 } .address { font-size: 20px; color: #000; position: relative; text-align: center; flex: 0 1 220px } .address:hover { color: #009cdc } .fix-nav header { position: fixed; width: 100%; left: 0; top: 0; right: 0; animation: slideIn .8s both; box-shadow: 1.6px 2.5px 7px rgba(6, 7, 7, .35) } .fix-nav header .logo { margin-bottom: 0 } .fix-nav header .logo img { max-height: 90px } .btn, .btn-alt { cursor: pointer; position: relative; display: inline-block; margin: 3px auto; padding: 14px 25px 12px; min-width: 300px; color: #fff; font: 500 18px/1 Rubik, sans-serif; transition: border .3s; background-color: #009cdc; transition: .3s all; text-align: center; text-transform: uppercase; border-radius: 23px; letter-spacing: .15em } .btn span, .btn-alt span { display: block; font-size: 29px; font-weight: 700; letter-spacing: .05em } .btn-alt:hover, .btn:hover { background-color: #003073; border-color: #003073; color: #fff } .btn-alt { background: #d2b046 } .btn-alt:after { background-color: #009cdc } .split { display: flex; justify-content: space-around; flex-wrap: nowrap; align-items: center; justify-content: center; margin: 100px auto 50px; padding: 0 20px; overflow: hidden } .split .flex-ed { max-width: 1250px; width: 100%; margin: 50px auto; position: relative; display: flex; flex-wrap: nowrap } .split article { margin: 10px; flex: 0 1 730px; text-align: left; padding: 25px 10px 20px 30px; display: flex; flex-direction: column; justify-content: center } .split h2 { margin: 5px auto 15px; color: #003073; font-weight: 600 } .split h2 span { color: #000; font-size: 24px; font-weight: 400; letter-spacing: normal } .split ul { text-align: left; list-style-type: none; padding: 0 } .split ul li { font-size: 30px; position: relative; padding-left: 35px; margin: 10px auto } .split ul li:before { content: "+"; font-family: Rubik, sans-serif; color: #009cdc; position: absolute; left: 0; top: 50%; transform: translateY(-50%) } .split figure { position: relative; flex: 0 1 500px } .split figure figcaption { position: relative; font-weight: 700; text-align: center; margin-top: 15px; letter-spacing: .2em; width: 100%; text-transform: uppercase; border-radius: 0; bottom: 0 } .split figure figcaption a { color: #000; font-size: 11px; font-weight: 700; font-family: Rubik, sans-serif; letter-spacing: .15em } .split figure figcaption.caption-top { top: 0; bottom: auto } .split figure iframe { width: 100%; display: block } .split figure .youtube { width: 420px; max-width: 100% } .split.alt figure { order: -1 } .top-bar { width: 100%; position: relative; box-shadow: 0 3px 15px rgba(0, 0, 0, .2); background-color: #ffdc48; z-index: 10; color: #000; font: 700 22px/1.2 Rubik, sans-serif; padding: 9px 10px; text-align: center; letter-spacing: .08em; transition: .3s all } .top-bar span { margin: 0 20px; text-transform: uppercase; min-width: 400px; font-weight: 400 } .top-bar .flex-ed { justify-content: space-between; max-width: 1200px; margin: auto } #banner { background-size: cover; overflow: hidden; border-bottom: 6px solid #d2b046; position: relative; max-width: 1920px; margin: 0 auto; padding: 50px 0; background-color: #003073; } #banner .banner-extra-stamps { position: absolute; top: 20px; right: 20px; max-width: 280px; z-index: 5 } #banner .flex-ed { max-width: 1090px; margin: auto; flex-wrap: nowrap; justify-content: space-between; position: relative; z-index: 2 } #banner article { display: flex; flex-direction: column; justify-content: center; flex: 0 1 42%; padding: 25px 10px; position: relative; z-index: 3 } #banner article img { margin-top: 25px } #banner article hr { height: 3px; background: #003073; width: 100px } #banner article .btn { margin-top: 20px } #banner article .banner-btn { padding: 15px 30px; box-shadow: 0 3px 6px rgba(19, 19, 19, .4); font-weight: 700; max-width: 390px; width: 100%; margin: 30px auto; background: #009cdc; border-radius: 46.5px; color: #000; font-size: 15px; letter-spacing: .05em; font-family: Rubik, sans-serif; text-transform: uppercase; transition: .3s all } #banner article .banner-btn:hover { background-color: #003073; color: #fff } #banner article .banner-btn span { font-size: 40px; display: block } #banner h1 { margin-top: 0; color: #fff; font-size: 69px; line-height: 1; letter-spacing: normal; text-transform: none; font-family: Rubik, sans-serif; font-weight: 600 } #banner h1 span { font-family: Rubik, sans-serif; margin-top: 10px; color: #fff; font-size: 22px; display: block; letter-spacing: .2em; text-transform: uppercase; position: relative; font-weight: 400; max-width: 390px; margin: 0 auto; position: relative; margin-bottom: 15px } #banner figure { flex: 0 1 510px; align-self: flex-end; position: relative } #banner figure figcaption { position: absolute; color: #000; font-weight: 700; text-align: center; top: 20px; left: 20px; text-align: center; padding: 8px 20px; font-family: Rubik, sans-serif; letter-spacing: .2em; font-size: 18px; text-transform: uppercase } #banner figure img { width: 100% } #banner figure .mobile-banner { display: none } #welcome { max-width: 1920px; margin: 0 auto; padding: 60px 20px; background: #efefef } #welcome .container { max-width: 1100px; margin: 20px auto } #welcome .container p { font-size: 18px } #welcome .container p span { font-size: 30px } .holiday-bkg { max-width: 1920px; margin: 0 auto; padding: 50px 20px; background-size: cover; background-color: #D8EDFA; } .count { background: #fff; position: relative; display: flex; max-width: 980px; margin: 100px auto; border-radius: 8px; border-top: 3px solid #d2b046; border-bottom: 3px solid #d2b046; box-shadow: 1px 1px 12px 5px rgba(0, 0, 0, .2) } .count .h2 { text-align: center; color: #000; font: 600 90px/1 Rubik, sans-serif; letter-spacing: normal; display: flex; margin: auto 20px; align-items: center; justify-content: center; padding: 25px 0 } .count:after, .count:before { position: absolute; z-index: -2; width: 348px; left: -75px; top: -50px; height: 348px; content: ""; background: #efefef; background-size: cover } .count:after { top: auto; left: auto; bottom: -50px; right: -75px } .count article { background: #fff; flex: 1; border-radius: 0 8px 8px 0 } .count ul { font-size: 27px; list-style-type: none; text-align: left; line-height: 1.2; margin: 10px auto; padding: 50px 20px; padding-right: 20px; display: table } .count ul li { position: relative; padding: 10px 0 10px 30px; font-weight: 400 } .count ul li:before { content: "+"; color: #009cdc; font-family: Rubik, sans-serif; position: absolute; left: 0; top: 50%; transform: translateY(-50%); font-size: 30px } .box { position: relative; width: 100%; max-width: 980px; height: 100%; margin: auto } .box:after, .box:before { position: absolute; inset: -5px; height: 20px; z-index: 5; content: "" } .box:after { border-top: 5px solid #003073; border-left: 5px solid #003073; border-right: 5px solid #003073; top: 0; left: 0; bottom: auto; right: 0 } .box:before { border-bottom: 5px solid #003073; border-left: 5px solid #003073; border-right: 5px solid #003073; bottom: 0; left: 0; top: auto; right: 0 } .alt-box { position: relative; width: 100%; max-width: 1120px; height: 100%; margin: auto } .alt-box:after, .alt-box:before { content: ""; position: absolute; inset: -5px; height: 20px; z-index: 5 } .alt-box:after { border-top: 5px solid #009cdc; border-left: 5px solid #009cdc; border-right: 5px solid #009cdc; top: -7px; left: -7px; bottom: auto; right: -7px } .alt-box:before { border-bottom: 5px solid #009cdc; border-left: 5px solid #009cdc; border-right: 5px solid #009cdc; bottom: -7px; left: -7px; top: auto; right: -7px } #services { max-width: 1170px; padding: 10px; margin: 30px auto } #services h2 { margin: 10px 0 } #services p { text-align: left } #services .flex-ed { margin: 20px auto; justify-content: center } #services .flex-ed .service-item { margin: 20px auto } #services .flex-ed .service-item h3 { font: 300 16px/1.5 Rubik, sans-serif; text-transform: uppercase; letter-spacing: .15em } #services .flex-ed .service-item span { height: 110px; display: flex; align-items: center } .insurance { text-align: left; padding: 0; position: relative; overflow: hidden; margin: 40px auto } .insurance .container { max-width: 1240px; margin: auto; padding: 10px 20px; text-align: center } .insurance h2 { display: flex; align-items: center; position: relative; font-size: 55px; color: #003073; text-align: center; z-index: 2; padding: 10px 20px 15px; margin: 10px auto -15px; justify-content: center } .insurance h2:after, .insurance h2:before { content: ""; height: 2px; background-color: #003073; flex: 1; margin-left: 15px } .insurance h2:before { margin-left: auto; margin-right: 15px } .insurance .flex-ed { display: flex; justify-content: center; align-items: center; max-width: 1100px; margin: 0 auto } .insurance .flex-ed span { padding: 10px 12px; flex: 0 1 auto; margin: auto } .insurance .flex-ed:first-of-type { max-width: 1200px } .insurance p { line-height: 1.8; max-width: 1200px; margin: 10px auto; padding: 10px } .insurance .disclaim { color: #898989; font: 400 14px/1 Rubik, sans-serif; margin-top: 10px; text-align: center } .streak { display: flex; align-items: center; position: relative } .streak:after { content: ""; height: 2px; background-color: #003073; flex: 1; margin-left: 50px } #about .container { max-width: 1200px; margin: 100px auto } #about .container h2 { color: #003073; margin-bottom: 20px } #about .container p { text-align: left } #about .container .flex-ed { justify-content: space-between; margin: 50px auto } #about .container .flex-ed span { box-shadow: 0 12px 16px rgba(0, 0, 0, .16) } footer { overflow: hidden; padding: 40px 0 0; background: linear-gradient(#434445 0, #2e2f30 100%); position: relative } footer h2 { color: #fff; text-transform: uppercase; text-align: center } footer .flex-ed { display: flex; max-width: 1200px; margin: 40px auto; align-items: center; flex-wrap: nowrap; justify-content: space-evenly } footer .flex-ed .fo-map { flex: 0 1 570px; padding: 10px } footer .flex-ed .fo-map h2 { font-size: 28px; text-transform: none; margin-bottom: 10px } footer .flex-ed .fo-map .phy { color: #fff; font-size: 18px; text-transform: uppercase } footer .flex-ed .fo-map .phy:hover { color: #009cdc } footer .flex-ed .fo-map .frame iframe { height: 370px; border-radius: 10px } footer .flex-ed .fo-phone { filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .16)); background: #009cdc; font-size: 19px; line-height: 1.4; color: #000; border-radius: 10px; padding: 40px 20px; flex: 0 1 320px } footer .flex-ed .fo-phone .large { font-weight: 700; font-size: 32px; letter-spacing: .03em } footer .flex-ed .fo-phone:hover { background: #003073; color: #fff } footer .split { justify-content: space-between; max-width: 1160px; padding: 0; align-items: flex-start; margin: auto; margin-bottom: 70px } footer .split article { flex: 0 1 530px; background-color: #003073; padding: 85px 60px; margin: 0; align-self: center; border-radius: 8px } footer .split figure p { text-align: center } footer figure { flex: 1 1 650px; align-self: center; order: 1 } .hours { display: table; margin: 0; text-align: left !important; position: relative } .hours label { width: 131px; display: inline-block; font-weight: 400 } .hours>div { font-size: 20px; color: #fff; font-family: Rubik, sans-serif; margin: 0 auto; display: flex; justify-content: space-between } .frame { overflow: hidden; display: table; width: 100%; margin: auto; flex: 0 1 50% } .frame iframe { height: 615px; display: block; margin: auto; width: 100% } .copy { margin-top: 20px; padding: 40px 10px 20px; margin: auto; text-transform: uppercase; font: 400 15px/1.4 Rubik, sans-serif; color: #fff; letter-spacing: .15em } .copy a, .copy p { font: 400 15px/1.4 Rubik, sans-serif; color: #fff } .copy p { margin: 20px auto; max-width: 1090px; letter-spacing: normal } .copy a:nth-of-type(1), .copy a:nth-of-type(2) { color: #009cdc } .copy a:nth-of-type(1):hover, .copy a:nth-of-type(2):hover { color: #fff } .copy a:hover { color: #009cdc; text-decoration: underline } .copy span { margin: 0 2px } ::-moz-placeholder { color: #000 } ::placeholder { color: #000 } #lp-appointment-form { max-width: 850px; padding: 10px; margin: 20px auto; position: relative; text-align: center } #lp-appointment-form h1 { font-size: 50px; font-weight: 700; margin: 10px auto 40px; color: #000 } #lp-appointment-form>p { max-width: 700px; margin: auto; margin-bottom: 30px } #lp-appointment-form .simple { margin: 40px auto 20px; max-width: 550px; padding-right: 3px } #lp-appointment-form label { display: none } #lp-appointment-form input, #lp-appointment-form select, #lp-appointment-form textarea { width: 93%; display: table; margin: 10px auto; background-color: #d3d3d3; color: #000; border-radius: 5px; padding: 15px; font-size: 16px; border: none; box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, .5) } #lp-appointment-form input:focus, #lp-appointment-form select:focus, #lp-appointment-form textarea:focus { background-color: #e3e3e3 } #lp-appointment-form textarea { height: 200px; margin-bottom: 30px } #lp-appointment-form button:focus, #lp-appointment-form input:focus, #lp-appointment-form select:focus, #lp-appointment-form textarea:focus { outline-style: solid; outline-width: thin; outline-color: #003073 } #lp-appointment-form .submitBtn { text-align: center; width: 200px; margin: auto; display: table } @media (max-width:1660px) { #banner article:before { left: -130px } } @media (max-width:1520px) { #banner { background-size: cover } #banner article:before { left: -70px } } @media (max-width:1330px) { #banner article:before { left: 0 } } @media (max-width:1200px) { #banner { background-size: cover } #banner article:before { left: 0 } #banner h1 { font-size: 62px } #banner h1 span:after { right: 10px } #banner h1 span:before { left: 10px } } @media (max-width:1080px) { .address { font-size: 16px } .phone { font-size: 32px } .over { top: -60px; left: 5px } h1 { font-size: 60px } #banner article img { margin: 30px auto 10px } .split article { padding: 0 } .split h2 { font-size: 76px } } @media (max-width:1024px) { header { padding: 0 } header .address { display: none } header .btn-alt { margin: 0; order: 0 } header .flex-ed { justify-content: center } header .flex-ed .logo { margin-bottom: 10px } .hd-btns, .hd-info { display: none } .mobile-buttons { display: flex; align-items: stretch; flex-wrap: wrap; width: 100% } .mobile-buttons a { flex: 0 1 50%; padding: 14px 10px; font: 700 16px/1.1 Rubik, sans-serif; letter-spacing: .05em; color: #fff; text-transform: uppercase; background: #003073; text-align: center } .mobile-buttons a span { display: block; font-size: 20px } .mobile-buttons a small { font-size: 14px; display: block } .mobile-buttons a:nth-of-type(2) { background: #009cdc; color: #000; padding: 11px 10px; font-size: 16px } .mobile-buttons a:nth-of-type(2) span { font-size: 26px } #banner { background-size: cover } #banner .flex-ed { display: block } #banner h1 { margin-top: 20px } #banner article { padding: 20px 20px } #banner article div { margin: 25px auto } #banner article h1 { font-size: 57px } #banner article:before { display: none } #banner figure { background-color: transparent; position: relative } #banner figure img { width: 100%; max-width: 500px; margin: 0 auto 30px } #banner figure figcaption { font-weight: 700; font-size: 17px; width: 100%; bottom: 0; right: 0; text-align: center } #banner figure figcaption span { display: none } #banner figure .banner-award { position: absolute; left: 15px; bottom: 40px; max-width: 58px } #banner .banner-extra-stamps { position: relative; margin: 10px auto 30px; top: auto; right: auto; left: auto; max-width: none } .comment:after { display: none } .phone { font-size: 24px } .box { max-width: 95%; margin: auto } #top-spot h2 { font-size: 36px; padding: 0 10px } .split { margin: 50px auto; display: block } .split .flex-ed { display: block } .split .flex-ed article>div { text-align: center } .split figure { width: -moz-fit-content; width: fit-content; margin: 0 auto } .split figure img { width: 100%; margin: 0; max-width: 500px } .split figure figcaption { width: 100%; left: 0; bottom: 0; top: auto; transform: none; padding: 6px; text-align: center; background: rgba(255, 255, 255, .8) } .split.alt figure figcaption { left: auto; right: auto } .split h2 { text-align: center; font-size: 45px; color: #000 } .split ul { display: table; margin: auto } .insurance h2, .split h2 { color: #003073 } #about { padding: 20px } #about h2, #about p { text-align: center } #about .container .flex-ed { justify-content: center } #about .container .flex-ed span { margin: 20px } footer { padding: 20px } footer .flex-ed { flex-wrap: wrap; justify-content: center } footer .split { margin-bottom: 0 } footer .split article { padding: 50px 10px 10px; border-radius: 0 } footer .split p { text-align: left } footer .hours, footer .pho, footer .phy { display: table; margin: 20px auto } footer .pho { margin-top: 40px } footer .flex-ed .fo-map .phy { margin: 10px auto } footer .flex-ed .fo-map { text-align: center } .frame iframe { height: 400px } } @media (max-width:790px) { .mobile-image { display: block } .desktop-image { display: none !important } .top-bar span { display: block; font-size: 0; width: auto; min-width: auto } header { padding: 0 } header .flex-ed { flex-flow: row wrap; flex-wrap: wrap; align-items: stretch; padding: 0 } header .btn-alt, header address { flex: 0 1 50% } header .logo { width: 100%; margin: 10px; max-width: none } header .btn-alt { color: #000; color: #fff; background-image: none; border: 0; border-radius: 0; box-shadow: none; text-shadow: none; padding: 10px 3px } header .btn-alt:hover { color: #fff; background-color: #3d3d3d } header .btn-alt:after { display: none } header .hd-info { order: 1; flex: 0 1 50% } header .phone { display: none } .insurance h2 { font-size: 40px } .mobile-break { display: block } footer .hours, footer .pho, footer .phy { margin: 15px 0 } .mobile-banner-reviews { display: block; background-color: #f3f3f3; text-transform: uppercase } .mobile-banner-reviews img, .mobile-banner-reviews p { display: inline-block; vertical-align: middle } .mobile-banner-reviews p { padding: 0 50px; font-weight: 700 } #banner h1 span:after, #banner h1 span:before, .insurance h2:after, .insurance h2:before, .streak:after { display: none } #services { padding: 20px; text-align: center } #services h2, #services p { text-align: center; display: block } #banner h1 span { display: block } .comment, .split p { text-align: center } .split .flex-ed { box-shadow: none } footer h2 { font-size: 42px } footer .split>div { margin-top: 0 } footer article { margin-bottom: 30px } footer .flex-ed { padding: 20px 10px } .insurance .flex-ed { justify-content: center } #banner .caption { left: 50%; transform: translateX(-50%) } } @media (max-width:700px) { #google>div { margin-top: 20px } #google p { margin-bottom: 0 } .comment .caption2 { margin-top: 0 } #lp-appointment-form h1 { font-size: 36px } .insurance { padding: 0 } .count ul { padding: 20px 10px } } @media (max-width:590px) { .hours label { width: 151px } footer .flex-ed .fo-contact { padding: 10px 0 } .count:after, .count:before, .split .flex-ed:after, .split .flex-ed:before { display: none } .count .h2 { font-size: 90px; padding-bottom: 0; color: #000; padding-top: 40px; font-weight: 500; letter-spacing: normal } .full-split .flex-ed article ul li { font-size: 20px } .split { margin-top: 0 } .split ul li { font-size: 23px } .split ul li:before { top: 0; transform: none } h2 { font-size: 56px; margin-top: 10px } .top-bar { letter-spacing: 0; font-size: 16px } .top-bar span { margin: 0 } .holiday-bkg { padding: 20px } #about .container p { text-align: center } .box { margin: 15px auto; max-width: 95% } #reviews { margin-top: 50px } footer h2 { font-size: 40px; margin-top: 0; padding: 0 } footer article { padding-top: 20px } footer article p { font-size: 32px; margin-top: 5px } footer figure { margin-top: -10px } footer .flex-ed .fo-logo { margin: 50px 0 } footer .flex-ed .fo-map { margin-top: 30px } footer .flex-ed .fo-logo { margin: 30px 0 50px } .insurance h2 { padding: 10px 0 15px; font-size: 37px } .insurance .container { padding: 10px } .frame { display: none } .copy { padding: 30px 10px 20px } .caption span { display: block; font-size: 0 } #banner .caption { line-height: .7; bottom: 10px; max-width: 90% } #banner h1 span:after, #banner h1 span:before { display: none } #banner h1 { font-size: 70px } #banner article { padding: 0px 10px } .insurance h2:after, .insurance h2:before { display: none } } @media (max-width:480px) { footer h2, h2 { font-size: 56px } header .phone { font-size: 20px } .btn-alt span { font-size: 24px } .over { top: -50px } .offer { padding: 0 } .count ul { padding: 0 } .copy span:first-of-type, .copy span:last-of-type { display: block; font-size: 0 } .split figure .youtube { width: 340px } } @media (max-width:400px) { header .btn-alt { font-size: 14px } .mobile-banner-reviews p { padding: 0 30px; font-size: 16px } .top-bar { font-size: 15px } #banner .caption { max-width: 90%; padding: 10px 5px; bottom: 30px } #banner .caption span { display: none } #banner .caption a { display: block } .caption a { font-size: 14px } .count ul { font-size: 20px } .comment .caption2 { font-size: 15px } .split ul li { font-size: 20px } h2 { font-size: 30px } footer .split h2 { font-size: 12vw; padding: 0 } #google p { font-size: 14px } footer .pho { font-size: 30px; margin-top: 20px } footer .pho:before { top: 0 } .hours:before { top: 10px } footer .split p { font-size: 16px } .insurance h2 { margin: 10px 0 -15px; padding: 10px 0 15px } .insurance .flex-ed div { margin: 15px 18px; flex: 1 1 100% } .insurance .flex-ed { justify-content: center } } @media (max-width:380px) { footer { padding: 20px } .hours label { width: 130px } .hours p { font-size: 18px } }
