/* default
-------------------------------------------------------------------------------*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
}									

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites, like, say for Google Maps custom placemarkers. 
   There has been a report of problems with standard Google maps as well, but we haven't been able to duplicate or diagnose the issue. */
img,
object,
embed {width: 100%; height:auto}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; color:#f1b434; text-decoration:none; transition: all .4s; -moz-transition: all .4s; -webkit-transition: all .4s; -o-transition: all .4s; }
a:hover{ text-decoration:none}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

h1,h2,h3,h4,h5,h6{ font-weight:400}

hr {display: block; height: 1px; border: 0; border-bottom: 1px solid #e9ecef; margin: 0 0 30px; padding: 10px 0 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

 canvas { -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; }

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  

.clear { clear: both; }

.show { display: block !important; }
.hide { display: none !important; }

img { display: block; }

.left { position: relative; float: left; }
.right { position: relative; float: right; }

.text-left { text-align: left !important; }
.text-center { text-align: center !important; }
.text-right { text-align: right !important; }

a.tel, a.tel:hover { color: #2e2e2e; cursor: default; }

/*** site styles ***/

html { -webkit-text-size-adjust: 100%; }
html, BODY { height: 100%; }
BODY { background: #eef0f2; font-family: circe, sans-serif; font-weight: 400; font-style: normal; font-size: 16px; line-height: 1.3; color: #3b4252; text-align: center; }

h1, h2, h3, h4 { margin: 0; padding: 0; line-height: 1.2; color: #000; font-weight: 700; }

p { padding: 0 0 20px; margin: 0; line-height: 1.4; }
p:last-child, p:last-of-type { padding-bottom: 0; }
/*p + h2, p + h3 { padding-top: 30px; }*/
p:last-child + h2, p:last-of-type + h2, p:last-child + h3, p:last-of-type + h3 { padding-top: 25px; }

a { color: #000; text-decoration: none; font-weight: 700; }
a:hover { color: #8c92a0; text-decoration: none; }

strong, b { font-weight: 700; }

ul, ol { padding: 0 0 20px; margin: 0; }
ul:last-of-type, ol:last-of-type { padding-bottom: 0; }
ul li, ol li { list-style-type: disc; margin: 0 0 0 25px; padding: 2px 0 3px; }
ol li { list-style-type: decimal; }
ol.alphabet > li { list-style-type: upper-alpha; }
ol.alphabet li ul li { list-style-type: disc; }
p:last-of-type + ul, p:last-of-type + ol { padding-top: 10px; }
ul:last-of-type + p, ol:last-of-type + p, ul:last-of-type + h3, ol:last-of-type + h3 { padding-top: 20px; }

.row { position: relative; display: block; box-sizing: border-box; -moz-box-sizing: border-box; }
.row + .row { padding-top: 25px; }

.grid { display: grid; gap: 0px 50px; grid-template-rows: 1fr; grid-template-rows: auto; grid-auto-rows: minmax(min-content, max-content); }
.grid .col { position: relative; display: block; box-sizing: border-box; -moz-box-sizing: border-box; }
.grid .col.col-1 { grid-area: col-1; }
.grid .col.col-2 { grid-area: col-2; }
.grid .col.col-3 { grid-area: col-3; }

.grid .col.align-bottom { display: grid; align-content: end; }

a.button { display: block; padding: 25px 20px 20px; font-family: industry, sans-serif; font-weight: 700; text-transform: uppercase; background: #eef0f2; color: #000; text-decoration: none; text-align: center; }
a.button:hover { background: #e5e7eb; color: #000 !important; text-decoration: none; }

a.button.dark { background: #000; color: #fff; text-decoration: none; text-align: center; }
a.button.dark:hover { background: #00c0b4; color: #fff !important; text-decoration: none; }

.header-wrapper { position: relative; display: block; background: #fff; padding: 0 20px; border-bottom: 1px solid #e5e7eb; box-sizing: border-box; -moz-box-sizing: border-box; }
#header { position: relative; display: block; width: 100%; max-width: 1600px; margin: 0 auto; padding: 90px 0 35px; }
#header .row.grid { grid-template-columns: auto 1fr auto; grid-template-areas: "col-1 col-2 col-3"; gap: 0px 40px; }
#header .logo { position: relative; display: block; width: 120px; margin: 0; padding: 0; z-index: 100; }
#header .logo a { display: block; }
#header .logo a svg { float: left; }
#header .logo img { position: relative; display: block; }
#header .col-2 { display: grid; align-content: center; text-align: left; }
#header h1 { font-size: 42px; margin: 10px 0 0; padding: 0; font-family: industry, sans-serif; font-weight: 700; font-style: normal; text-transform: uppercase; }
#header h1 span { display: block; }



.site-wrapper { position: relative; display: block; padding: 50px 20px 80px; background: #fff; box-sizing: border-box; -moz-box-sizing: border-box; }
.site { position: relative; display: block; width: 100%; max-width: 1600px; margin: 0 auto; box-sizing: border-box; -moz-box-sizing: border-box; }

.site h2.category-title { font-size: 22px; padding: 0; margin: 0 0 25px; font-family: industry, sans-serif; font-weight: 700; text-transform: uppercase; }

.site .row { grid-template-columns: 320px 1fr; grid-template-areas: "col-2 col-1"; gap: 0px 160px; text-align: left; }
.site .row.registration-form { grid-template-columns: 400px 1fr; gap: 0px 75px; }


.site .content-width { width: 100%; max-width: 1275px; margin: 0 auto; }


.site .row.business-listing.grid { grid-template-columns: 1fr 1fr 1fr; grid-template-areas: ""; gap: 30px 30px; }
.site .row.business-listing.grid .business {}
.site .row.business-listing.grid .business a { position: relative; display: grid; height: 270px; align-content: center; }
.site .row.business-listing.grid .business a:hover {}
.site .row.business-listing.grid .business a .title { font-weight: 800; color: #fff; font-size: 18px; padding: 0 50px; text-align: center; z-index: 20; }
.site .row.business-listing.grid .business a .title.alt { font-size: 18px; font-weight: 700; font-size: 22px; text-transform: uppercase; }
.site .row.business-listing.grid .business a .credit { position: absolute; bottom: 20px; left: 0; display: block; width: 100%; font-weight: 700; color: #fff; font-size: 9px; padding: 0 50px; text-align: center; text-transform: uppercase; z-index: 20; box-sizing: border-box; -moz-box-sizing: border-box; }
.site .row.business-listing.grid .business a .image { position: absolute; top: 0; bottom: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; z-index: 10; }
.site .row.business-listing.grid .business a .image::after { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; content: ''; background: rgba(59, 66, 82, .3); text-decoration:none; transition: all .4s; -moz-transition: all .4s; -webkit-transition: all .4s; -o-transition: all .4s; }
.site .row.business-listing.grid .business a:hover .image::after { background: rgba(59, 66, 82, .7); }

.tax-business_category .site h2.page-title { text-transform: uppercase; font-size: 22px; margin: 0 0 20px; }


.single-business .site .details { grid-template-columns: 1fr 320px; grid-template-areas: ""; gap: 0px 60px; }
.single-business .site .details .content .image { position: relative; display: block; margin: 0 0 30px; }
.single-business .site .details .content h1 { font-size: 24px; margin: 0 0 20px; }

.single-business .site .content-side .gallery { grid-template-columns: 50% 50%; grid-template-areas: ""; gap: 0px 0px; margin: 0 0 90px; }
.single-business .site .content-side .gallery a { position: relative; display: block; height: 120px; border: 1px solid #e5e7eb; overflow: hidden; }
.single-business .site .content-side .website { position: relative; display: block; margin: 0 0 20px; }
.single-business .site .content-side .website a.button { background: #00c0b4; color: #fff; font-size: 12px; padding: 0 20px; margin: 0; line-height: 50px; border: 2px solid #00c0b4; }
.single-business .site .content-side .website a.button span { margin-left: 10px; }
.single-business .site .content-side .website a.button:hover { background: #fff; color: #00c0b4 !important; }
.single-business .site .content-side .social { position: relative; display: block; margin: 0; }
.single-business .site .content-side .social a { position: relative; display: inline-block; font-size: 28px; margin: 0 0 0 25px; }
.single-business .site .content-side .social a:first-of-type { margin-left: 0; }

.single-business .site .content-side .social + .location, .single-business .site .content-side .website + .location { padding-top: 70px; }
.single-business .site .content-side .location { position: relative; display: block; }
.single-business .site .content-side .location h4 { font-size: 18px; margin: 0 0 5px; }
.single-business .site .content-side .location a { font-size: 12px; color: #00c0b4; text-transform: uppercase; }
.single-business .site .content-side .location a span { margin-left: 10px; }
.single-business .site .content-side .location a:hover { color: #000; }


.site .side-box { position: relative; display: block; padding: 0; }
.site .registration-form .side-box { padding: 25px 0; }
.site .side-box h3 { font-size: 20px; font-weight: 700; margin: 0; padding: 0; }
.site .side-box ul { position: relative; }
.site .side-box li { padding-left: 10px; list-style-type: none; }

.site .side-box .side-menu.categories ul {  }
.site .side-box .side-menu.categories li.title { font-size: 14px; padding: 15px 20px; font-family: industry, sans-serif; font-weight: 700; text-transform: uppercase; }
.site .side-box .side-menu.categories li { border-bottom: 1px solid #f7f8f9; margin: 0; padding: 0; }
.site .side-box .side-menu.categories li a { display: block; padding: 15px 20px; font-size: 18px; color: #000; font-weight: 700; line-height: 1; }
.site .side-box .side-menu.categories li a:hover, .site .side-box .side-menu.categories li.active a { color: #00c0b4; background: #f7f8f9; }

.site .side-box.register { background: #f8f9fa; padding: 25px 30px; }
.site .side-box.register h3 { font-weight: 800; font-size: 20px; margin: 0 0 5px; }
.site .side-box.register li:before { position: absolute; left: 10px; margin-top: 1px; font-size: 18px; content: '\e803'; font-family: "fontello"; color: #00c0b4;
  font-style: normal;
  font-weight: normal;
  speak: never;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: 0;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  margin-left: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}




.site .form .section { position: relative; display: block; }
.site .form .section + .section { padding: 60px 0 0; }
.site .form .section h3 { font-family: industry, sans-serif; font-weight: 700; font-size: 22px; text-transform: uppercase; margin: 0 0 10px; }
.site .form .section p { font-size: 15px; }
.site .form .section p + .question-split { padding-top: 15px; }
.site .form .section .question-split + .question-split { padding-top: 20px; }
.site .form .section p.padding-top { padding-top: 30px; }


.contact-form-wrapper { position: relative; display: block; background: url("../images/taylor-heery-ZSgWcW70cTs-unsplash.jpg") center center no-repeat; background-size: cover; }
.contact-form-wrapper .contact-form-wrapper-inner { padding: 60px 0; position: relative; display: block; background-color: rgba(59, 66, 82, .7); z-index: 1; }
.contact-form-wrapper .contact-form { padding: 0 20px; }
.contact-form-wrapper .site .form .section h3 { color: #fff; font-size: 36px; }

.contact-form-wrapper .question-col-split { display: grid; gap: 15px 30px; grid-template-columns: 1fr 1fr; grid-template-rows: auto; grid-auto-rows: minmax(min-content, max-content); }
.contact-form-wrapper .question-col-split .question-col { display: grid; gap: 15px 0px; grid-template-columns: 1fr; grid-template-rows: auto; grid-auto-rows: minmax(min-content, max-content); }

.contact-form-wrapper .question input[type="text"], .contact-form-wrapper .question input[type="email"], .contact-form-wrapper .question select, .contact-form-wrapper .question textarea { background: none; color: #fff; border-bottom-color: #fff; }
.contact-form-wrapper .question.text .form-field { height: 100%; }
.contact-form-wrapper .question.floating label { color: #fff; }
.contact-form-wrapper .question.floating:hover label { color: #000; }
.contact-form-wrapper .question input[type="text"]:active, .contact-form-wrapper .question input[type="email"]:active, .contact-form-wrapper .question select:active, .contact-form-wrapper .question textarea:active, .contact-form-wrapper .question input[type="text"]:focus, .contact-form-wrapper .question input[type="email"]:focus, .contact-form-wrapper .question select:focus, .contact-form-wrapper .question textarea:focus, .contact-form-wrapper .question input[type="text"]:hover, .contact-form-wrapper .question input[type="email"]:hover, .contact-form-wrapper .question select:hover, .contact-form-wrapper .question textarea:hover { border-bottom-color: #000; }
.contact-form-wrapper .question textarea { height: 100%; }
.contact-form-wrapper .question.submit { grid-template-columns: 1fr 240px; }
.contact-form-wrapper .question.submit input[type="submit"] { background: #000; font-size: 12px; max-width: 240px; border-color: #000; }
.contact-form-wrapper .question.submit input[type="submit"]:hover { border-color: #fff; }
.contact-form-wrapper .response-output { font-size: 20px; font-weight: 700; color: #fff; }
.contact-form-wrapper .response-output.error { color: #fff; }



.question-split { display: grid; gap: 0px 35px; grid-template-columns: 1fr 1fr; grid-template-rows: auto; grid-auto-rows: minmax(min-content, max-content); }
.question-split.single { grid-template-columns: 1fr; }
.question-split.third { grid-template-columns: 1fr 1fr 1fr; }

.question { position: relative; display: block; margin: 0; box-sizing: border-box; -moz-box-sizing: border-box; }
.question label { position: absolute; top: 0; display: none; width: 100%; opacity: 0; font-size: 16px; color: #8894a4; font-weight: 500; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; z-index: 1; }
.question label.reg { color: #343a40; }
.question label em { font-size: 12px; }
.question span.form-field { position: relative; display: block; }


.question input[type="text"], .question input[type="email"], .question select, .question textarea { position: relative; width: 100%; background: #fff; font-family: circe, sans-serif; font-size: 16px; letter-spacing: .02rem; color: #8c92a0; padding: 20px 0px 10px; border: none; border-bottom: 2px solid #cfd2d9; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-transition: all 0.3s ease-out; transition: all 0.2s ease-out; border-radius: 0; -webkit-appearance: none; }
.question input[type="text"]:active, .question input[type="email"]:active, .question select:active, .question textarea:active, .question input[type="text"]:focus, .question input[type="email"]:focus, .question select:focus, .question textarea:focus, .question input[type="text"]:hover, .question input[type="email"]:hover, .question select:hover, .question textarea:hover { border-bottom-color: #00c0b4; outline: none; }
.question textarea { height: 100px; }


.question .select-wrap { position: relative; display: block; }
.question .select-wrap .hide { display: none; }
.question .select-wrap .form-field { position: relative; display: block; z-index: 20; }
.question select { -webkit-appearance: none; -moz-appearance: none; text-overflow: ''; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 45px; cursor: pointer; }
.question select::-ms-expand { display: none; }
.question .select-dir { position: absolute; top: 18px; right: 0px; display: block; height: 43%; padding: 0 0 0 15px; color: #00c0b4; line-height: 1.1; z-index: 30; }

.question .error input[type="text"], .question .error input[type="email"], .question .error input[type="password"], .question .error textarea, .question .error select { border-color: #cc0000; outline: none; }

.question span.form-field .error { color: #cc0000; display: none !important; }
.question.checkbox { padding-top: 20px; }
.question.checkbox .grid { grid-template-columns: auto 1fr; gap: 0 10px; }
.question.checkbox label { display: block; cursor: default; position: relative; opacity: 1; font-size: 15px; text-align: left; color: #3b4252; }
.question.checkbox span { display: grid; align-content: center; }
.question.checkbox .form-field.error label { color: #cc0000; }


.question.submit { display: grid; gap: 0px 50px; grid-template-columns: 1fr 360px; padding: 40px 0 0; grid-template-rows: auto; grid-auto-rows: minmax(min-content, max-content); }
.question.submit label { display: grid; align-content: center; cursor: default; position: relative; opacity: 1; font-size: 15px; text-align: left; color: #3b4252; }
.question.submit input[type="submit"] { width: 100%; max-width: 360px; color: #FFF; font-family: industry, sans-serif; font-size: 16px; padding: 18px 15px 15px; text-align: center; outline: 0; border: 2px solid #00c0b4; background: #00c0b4; font-weight: 700; transition: all .6s; -moz-transition: all .6s; -webkit-transition: all .6s; -o-transition: all .6s; border-radius: 6px; box-sizing: border-box; -moz-box-sizing: border-box; text-transform: uppercase; border-radius: 0; -webkit-appearance: none; }
.question.submit input[type="submit"]:hover { background: #fff; color: #00c0b4; }


.question.floating label { position: absolute; top: 0; left: 0; display: block; margin-top: 2px; margin-left: 0; padding: 0 50px 0 0; text-align: left; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-transform: translateY(3px); transform: translateY(3px); pointer-events: none; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -webkit-box-sizing: border-box; box-sizing: border-box; opacity: 1; font-family: industry, sans-serif; font-weight: 600; font-size: 9px; z-index: 50; text-transform: uppercase; }
.question.floating:hover label { color: #00c0b4; }

.response-output { position: relative; display: none; padding: 30px 0 0; font-size: 15px; text-align: left; color: #00c0b4; font-family: industry, sans-serif; font-size: 16px; }
.response-output.error { color: #cc0000; }


.footer-wrapper { position: relative; display: block; background: #f8f9fa; padding: 0 20px; box-sizing: border-box; -moz-box-sizing: border-box; }
#footer { position: relative; display: block; width: 100%; max-width: 1280px; margin: 0 auto; padding: 80px 0; }
#footer .row.grid.footer-row { grid-template-columns: 180px 1fr; grid-template-areas: "col-1 col-2"; gap: 0px 100px; }
#footer .row.grid.footer-row .logo a { display: block; }
#footer .row.grid.footer-row .logo a svg { float: left; }
#footer .row.grid.footer-row .col-2 { text-align: right; font-size: 18px; display: grid; align-content: center; }
#footer .row.grid.footer-row .col-2 a { color: #000; text-decoration: none; }
#footer .row.grid.footer-row .col-2 a:hover { color: #8c92a0; text-decoration: none; }
#footer .row.grid.footer-row .col-2 ul { margin: 0; padding: 0; list-style-type: none; }
#footer .row.grid.footer-row .col-2 li { margin: 0; padding: 0 24px 0 0; list-style-type: none; display: inline-block; }
#footer .row.grid.footer-row .col-2 .row.buttons { grid-template-columns: 1fr 1fr; grid-template-areas: "col-1 col-2"; gap: 0px 80px; }

#footer .row.grid.footer-row .col-2 .row + .row { padding-top: 35px; }
#footer .row.grid.footer-row .col-2 .row.menus { grid-template-columns: 1fr auto; grid-template-areas: "col-1 col-2"; gap: 0px 40px; }
#footer .row.grid.footer-row .col-2 .row.menus .col-1 { text-align: left; }

.footer-bottom-wrapper { position: relative; display: block; background: #eef0f2; padding: 0 20px; box-sizing: border-box; -moz-box-sizing: border-box; }
.footer-bottom { position: relative; display: block; width: 100%; max-width: 800px; margin: 0 auto; padding: 25px 0; }
.footer-bottom .row.grid { grid-template-columns: 130px 1fr; grid-template-areas: "col-1 col-2"; gap: 0px 35px; }
.footer-bottom .col-1 { display: grid; align-content: center; }
.footer-bottom .col-2 { display: grid; align-content: center; color: #3b4252; font-size: 14px; text-align: right; }
.footer-bottom .col-2 a { color: #000; text-decoration: none; }
.footer-bottom .col-2 a:hover { color: #3b4252; text-decoration: none; }





.dots-bars-6 {
  width: 40px;
  height: 20px;
  --c:radial-gradient(farthest-side,currentColor 93%,#0000);
  background:
    var(--c) 0    0,
    var(--c) 50%  0;
  background-size:8px 8px;
  background-repeat: no-repeat;
  position: relative;
  clip-path: inset(-200% -100% 0 0);
  animation: db6-0 1.5s linear infinite;
}
.dots-bars-6:before {
  content: "";
  position: absolute;
  width: 8px;
  height: 12px;
  background:currentColor;
  left:-16px;
  top:0;
  animation: 
    db6-1 1.5s linear infinite,
    db6-2 0.5s cubic-bezier(0,200,.8,200) infinite;
}
.dots-bars-6:after {
  content: "";
  position: absolute;
  inset:0 0 auto auto;
  width:8px;
  height: 8px;
  border-radius: 50%;
  background:currentColor; 
  animation: db6-3 1.5s  linear infinite;
}

@keyframes db6-0 {
  0%,30%  {background-position: 0  0   ,50% 0   }
  33%     {background-position: 0  100%,50% 0   }
  41%,63% {background-position: 0  0   ,50% 0   }
  66%     {background-position: 0  0   ,50% 100%}
  74%,100%{background-position: 0  0   ,50% 0   }
}

@keyframes db6-1 {
  90%  {transform:translateY(0)}
  95%  {transform:translateY(15px)}
  100% {transform:translateY(15px);left:calc(100% - 8px)}
}

@keyframes db6-2 {
  100% {top:-0.1px}
}

@keyframes db6-3 {
  0%,80%,100% {transform:translate(0)}
  90%         {transform:translate(26px)}
}





@viewport { width: auto; }

@media only screen and (max-width: 1200px) {
  
  .site .row { grid-template-columns: 1fr; grid-template-areas: "col-2" "col-1"; gap: 50px 0; }
  
}

@media only screen and (max-width: 800px) {
  
  #header .row.grid { gap: 0px 20px; }
  #header .logo { width: 100px; }
  #header h1 { font-size: 32px; }
  
  .question.submit { grid-template-columns: 1fr 280px; }
  
  #footer .row.grid.footer-row { grid-template-columns: 120px 1fr; gap: 0px 50px; }
  #footer .row.grid.footer-row .col-2 .row.buttons { gap: 0px 20px; }
  #footer .row.grid.footer-row .col-2 .row.menus { grid-template-columns: 1fr; grid-template-areas: "col-1" "col-2"; gap: 30px 0; }
  #footer a.button { font-size: 15px; }
  
}
  
@media only screen and (max-width: 667px) {
  
  .site .form .section .question-split + .question-split { padding-top: 15px; }
  .question-split, .question-split.third { grid-template-columns: 1fr; gap: 15px 0; }
  .contact-form-wrapper .question-col-split { grid-template-columns: 1fr; }
  .question.submit { grid-template-columns: 1fr; gap: 20px 0; }
  .question.submit span { display: none; }
  .question.submit input[type="submit"] { max-width: 100%; }
  
  .contact-form-wrapper .site .form .section h3 { font-size: 30px; }
 
  #footer { padding: 40px 0; }
  #footer .row.grid.footer-row { grid-template-columns: 1fr; gap: 30px 0; grid-template-areas: "col-1" "col-2"; }
  #footer .row.grid.footer-row .logo { max-width: 130px; margin: 0 auto; }
  #footer .row.grid.footer-row .col-2 .row.buttons { grid-template-columns: 1fr; grid-template-areas: "col-1" "col-2"; gap: 20px 0; }
  #footer .row.grid.footer-row .col-2 ul { margin: 0 auto; display: inline-block; }
  #footer .row.grid.footer-row .col-2 .row.menus .col-1 { text-align: center; }
  .footer-bottom .row.grid { grid-template-columns: 1fr; grid-template-areas: "col-1" "col-2"; gap: 30px 0; }
  .footer-bottom .row.grid .col-1 a { display: block; max-width: 120px; margin: 0 auto; }
  .footer-bottom .col-2 { text-align: center; }
  
}

@media only screen and (max-width: 480px) {
  
  #header { padding-top: 40px; }
  /*#header .row.grid { grid-template-columns: 1fr; grid-template-areas: "col-1" "col-2"; gap: 25px 0; }*/
  #header .logo { width: 80px; }
  #header h1 { font-size: 24px; }
  
  .site-wrapper { padding-bottom: 50px; }
  .contact-form-wrapper .site .form .section h3 { font-size: 26px; }
  .contact-form-wrapper .question.submit { grid-template-columns: 1fr; }
  .contact-form-wrapper .question.submit input[type="submit"] { max-width: 100%; }
  
  #footer .row.grid.footer-row .logo { max-width: 90px; }
  
}