/* Stuff that mostly stays the same */

/* Text */

html {
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    font-display: swap;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    text-align:center;
}

h1,h2,h3,h4 {column-span: all}

.action2 a {
    padding: 1rem 2rem;
    font-size: 2rem
}

header h1, .hidden, .verify {display:none}

.flexbtwn h2 {margin-top:0}

.iblock .action, .iblock .action a {margin:0;}

.iblock p {
    text-align:left; 
    margin-left:auto; 
    margin-right:auto;
    max-width:100%;
    font-weight:700;
    }

.contrast h3 {margin-top:0}

.gyro h1:first-of-type:after,
.highlight p,
.highlight2 p,
.block p {
    margin-left: auto;
    margin-right: auto
}

.block p {max-width: 35rem;}

.gyro h1, .gyro h2 {padding:0 0.5em}

.tx-h2 {
margin-bottom: 0;
padding-bottom:1.2em;
}

.sectionhlt, .sectionhdk {
margin: 0 0 0.5em 0;
font-size: 3rem;
}

.callus {
    flex-grow: 2;
    text-align: right;
    margin-right:0.4em;
}

.callus>a {display: inline-block}

a, a[href^=tel] {text-decoration: none}

button {transition: .3s}

a, .callus>a, strong {font-weight: 700}

blockquote cite {display: block;}

p {text-align:left}

.cr {margin-bottom: -0.6em; padding:0; font-size:0.5em}

@font-face {
    font-family: 'Source Sans Pro';
    font-weight: 400;
    font-style: normal;
    src: url(fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.eot);
    src: url(fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.eot?#iefix) format('embedded-opentype'), local('Source Sans Pro'), local('Source-Sans-Pro-regular'), url(fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.woff2) format('woff2'), url(fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.woff) format('woff'), url(fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.ttf) format('truetype'), url(fonts/Source-Sans-Pro-regular/Source-Sans-Pro-regular.svg#SourceSansPro) format('svg')
}

@font-face {
    font-family: 'Source Sans Pro';
    font-weight: 700;
    font-style: normal;
    src: url(fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.eot);
    src: url(fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.eot?#iefix) format('embedded-opentype'), local('Source Sans Pro Bold'), local('Source-Sans-Pro-700'), url(fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.woff2) format('woff2'), url(fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.woff) format('woff'), url(fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.ttf) format('truetype'), url(fonts/Source-Sans-Pro-700/Source-Sans-Pro-700.svg#SourceSansPro) format('svg')
}

/* End of Text */



/* Containers */


body {
    margin: 0;
    margin-left: auto;
    margin-right: auto;
}

html, body {height:100%}

ul {text-align: left;}
li {list-style: none}

.block ul {
    margin-left: auto;
    margin-right: auto;
    max-width: 25em;
} 
 
header {
    position: sticky;
    position: -webkit-sticky;
    top: 0;
    align-items: center
}

.limiter {max-width:1400px; margin-left: auto; margin-right: auto}

.reviews {
  max-width:1700px;
  margin:auto;
  padding-left: 1vw;
  padding-right: 1vw;
}

.reviewer {
  font-weight: 700;
  margin-left:2em;
  margin-top:2em;
}

.review {display: inline-block}

.flex,.flexbtwn,.flexwrap, .flexr, .flexl {display: flex}

.flexwrap {
    flex-flow: row wrap;
    justify-content: center;
    padding-top: 2em;
    padding-bottom: 2em
}

.flexbtwn {
    flex-flow: row wrap;
    justify-content: space-around;
    padding: 3em 0
}

.flex {flex-wrap: nowrap}

.flexr {justify-content: flex-end; margin:2em auto}

.flexr img  {
float: left;
margin: -2rem -5rem;
object-fit: cover;
border-radius: 50%;
width: 6rem;
height: 6rem;
}

.flexl {justify-content: flex-start; margin:2em auto}

.flexl img, blockquote img{
float: right;
margin: -2rem -5rem;
object-fit: cover;
border-radius: 50%;
width: 6rem;
height: 6rem;
}

.nav-item {padding:0.8em 1.5em}

.fleximage img {width:100%;}

.scroll {
  display: flex;
  flex-wrap: nowrap;
  overflow: auto;
  -webkit-scrollbar { width:0 !important }
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: -ms-autohiding-scrollbar;
}

.nav-item {
  flex: 0 0 auto;
}     

.block {padding: 6em 0}

.block .flexwrap:first-of-type {padding-top: 0}

.iblock {
padding: 4em 0;
width:100%;
text-align:center;
}

.iblock:nth-of-type(2) {padding: 5em 0;}

.contrast {
border-radius: 10px;
display: inline-block;
border:0;
}

.highlight,
.highlight2,
.highlight3 {
    padding: 1em 0;
    margin-bottom:5em;
}

.highlight3 {
padding: 0;
display:inline-block;
border-radius:1em;
overflow: hidden;
}

button {
    overflow: visible;
    border: 0;
    font: inherit;
    -webkit-font-smoothing: inherit;
    letter-spacing: inherit;
    cursor: pointer
}

blockquote {
    border-radius: 20px;
    padding: 1em;
    max-width: 25em;
    display: inline-block
}

.action,.action2 {margin: 0 auto}

.action a,.action1 a, .action2 a {
    display: inline-block;
    margin: 0.5em auto;
    padding: 1em;
    border-radius: .3em
}

.action1 {
display:inline;
margin-right:1em;
}

.action1 a {padding: 0.5em 0.8em}

.gyro {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height:40vh;
    display:flex;
    justify-content:space-between;
    flex-wrap:nowrap;
    
}

.gyro blockquote {margin-right:5em}

.footer p {text-align: center}
.footer {padding:1em}
.footer div.flexwrap {padding: 2em}
.footer ul:last-of-type {padding-top:3em}

.materialL1lnk{
    transition: all .3s cubic-bezier(.25, .8, .25, 1)
}

.materialL1,.materialL1lnk {
    z-index: 1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24)
}

.materialL1lnk:hover {
    z-index: 2;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23)
}

.materialL2 {
    z-index: 2;
    box-shadow: 0 3px 6px rgba(0, 0, 0, .16), 0 3px 6px rgba(0, 0, 0, .23)
}

.materialL3 {
    z-index: 3;
    box-shadow: 0 10px 20px rgba(0, 0, 0, .19), 0 6px 6px rgba(0, 0, 0, .23)
}

/* End of Containers * /


/* Images */

p img {padding: 1rem}

img, .footer p {max-width: 100%}

img {
    height: auto;
    border: 0
}

.logo {flex: 0 0 6rem; padding-left: 1rem; padding-top: 0.2rem}

.fleximage img {width: 100%}

.tidbiticons {
    height: 7rem;
    padding: .5rem;
    border-radius:1rem
}

.iblock img {
width:16rem; 
padding:0 1rem;
margin-right:auto;
margin-left:auto;
display:block;
border-radius:120px 0 180px 0
}


/*End of Images */



/* Form Stuff */

.tab {
  display: none;
}

form {
margin:1em auto 3em auto;
padding: 1em 2em;
}

form label {
font-size:110%;
display: block;
}

.mauticform_wrapper button{
    display: inline;
    margin:1em auto 1em auto;
    padding: 0.4em 1em 0.5em;
    border-radius: .2em;
}

input {
width: 100%;
height: 4em;
border-radius: 0.2em;
margin: 1em 0;
font-size:0.5em
}

.step {
height: 1.5em;
width: 33.3%;
padding: 0;
margin: 0 -2px -7px -2px;
border: none;
display: inline-block;
}

.prog {
display: inline-block;
width: 100%;
margin-right: auto;
margin-left: auto;
border-bottom-left-radius: 1.2rem;
border-bottom-right-radius: 1.2rem;
}

.mauticform-errormsg{
width: 6em;
text-align: center;
border-radius: 8px;
padding: 5px 10px;
z-index: 3;
display: inline-block;
margin-top: -6%;
margin-left: 25%;
margin-bottom: 3rem;
}

/* End of Form Stuff */



/* Stuff that changes frequently */

/* Colors and Graphics */


body {
    background-color: #fafafa;
    color: #323232;
}

header {background:#fff; background-color: rgba(252, 252, 252, .87);}

.gyro h1 {color: #fff;text-align:left;margin:0;padding-top:2rem;display:inline-block;white-space: nowrap}

.gyro span {color: #12f4af;margin-top:0}

.contrast {background:#000; background-color: rgba(0, 0, 0, .60);}

.contrast h3 {color:#ffc905; text-align: left;}

.contrast p {color:#f6f6f6}

.tx-h2 {
color:#f4faff;
background: #6cc1bf;
text-shadow: 1px 2px 0 #343434;
}

.highlight,.highlight2,.highlight3 {color: #fff;}

h1,h2,h3,h4,h5,h6 {color: #141414}

.highlight h2, .highlight h3, .highlight h4, .highlight2 h2, .highlight3 h2, .highlight3 h3 {color: #ffe605}

.highlight a {color:#c8e1ff}

.highlight a:visited {color:#E0E0E0}

.strk {color: #ff6668;}

.sectionhdk {
color:#141414;
text-shadow: 1px 2px 0 #808080;
}
.sectionhlt {
color: #f4faff;
text-shadow: 1px 2px 0 #343434;
}

.highlight, .highlight3 {background: url(pttn-lt.png)}
.highlight2 {background: url(pttn-drk.png)}

a {color: #35d3e0}

a:visited {color: #003D7A}

a, a[href^=tel], button {color: inherit}

.callus>a {color: #0062da;}

.nav-item:not(:last-child) {
  border-right-color:#ececec;
  border-right: 1px solid rgba(114, 124, 135, 0.2);
}

.nav-item a, .nav-item a:visited {color:#464c52;}

#p1lnk .p1-lnk, #p2lnk .p2-lnk, #p3lnk .p3-lnk 
{color:#35d3e0;}
  
blockquote {
   background-color:#ececec;
   border-left: 5px solid #e0e0e0;
   border-right: 5px solid #e0e0e0;
}

.gyro blockquote {
  background:#000;
  background-color: rgba(1, 31, 45, 0.54);
  color:#fff;
  font-weight:700;
  border:none;
  }

blockquote cite {color:#12f4af;font-weight:400}

.action a,.action1 a {
    background: #d73c53;
    color: #fff;
}

.action1 a {background: #0a86ba}

.action2 a {
    background: #97eb9b;
    color: #1e1e1e;
}

.cr {color:#222222;}

input {border: 0.1rem #5abcba solid;}

input.invalid {background-color: #ffdddd;}

.mauticform_wrapper button{
    background: #d73c53;
    color: #fff;
}

.step {background:#414141; background-color: rgba(193, 193, 193, 0.51);}

.step.active {
   background:#7BA69D;
   background-color: rgba(198, 198, 198, 0.8);
}

.step.finish {
  background-color: #4CAF50;
}

.mauticform-errormsg {
    background:#FFA47E;
    color: #333;
}

.iblock:nth-of-type(3) {background-color:#6cc1bf}
.iblock:nth-of-type(4) {background-color:#ffede1}
.iblock:nth-of-type(5) {background-color:#f4faff}
.iblock:nth-of-type(6) {background-color:#6db9e5}
.iblock:nth-of-type(7) {background-color:#ececec}
.iblock:nth-of-type(8) {background-color:#6cc1bf}

.firstloc {background:#ececec}

.astg {
background: linear-gradient(-70deg, #6cc1bf 15%, rgba(0, 0, 0, 0) 15%), url('street-blur@4x.jpg');
}

.myo {
background: url(tulip@4x.png);
}

.hyp {
background:url(mountain@4x.png);
}

.hypcolor {background: linear-gradient(70deg, #ffede1 15%, rgba(0, 0, 0, 0) 15%);}

.pres {background: linear-gradient(-70deg, #6db9e5 15%, rgba(0, 0, 0, 0) 15%), url('eye-closeup@4x.jpg');}

.end {background: linear-gradient(-70deg, #6db9e5 15%, rgba(0, 0, 0, 0) 15%);}

.astg, .myo, .hyp, .hypcolor, .pres, .end {
background-repeat: no-repeat;
background-size: cover;
background-position: bottom
}

.myo, .hyp {background-size: contain;}
 
.footer {
    background: -webkit-linear-gradient(17deg, #ececec 40%, rgba(0, 0, 0, 0) 30%), -webkit-radial-gradient(farthest-corner at 0% 0%, #fff 71%, #ececec 70%);
    background: -o-linear-gradient(17deg, #ececec 40%, rgba(0, 0, 0, 0) 30%), -o-radial-gradient(farthest-corner at 0% 0%, #fff 71%, #ececec 70%);
    background: -moz-linear-gradient(17deg, #ececec 40%, rgba(0, 0, 0, 0) 30%), -moz-radial-gradient(farthest-corner at 0% 0%, #fff 71%, #ececec 70%);
    background: linear-gradient(17deg, #ececec 40%, rgba(0, 0, 0, 0) 30%), radial-gradient(farthest-corner at 0% 0%, #fff 71%, #ececec 70%);
}

/* Media queries */

@media (max-width: 400px) {
    .callus {font-size:0.4em}
    .callus a {font-size:1.4em}
    .nav-item {padding: 0.5em 0.3em;font-size:0.5em}
    
    .iblock p {
    width: 14em;
    font-size:1.1em;
    padding:0.1em
    }

}

@media (max-width:600px) {


    body {line-height:1.45}
    
    html {font-size:1.2rem;}
    
    p {margin-bottom:1.3em}
    
    h1, h2, h3, h4 {
    margin:1.414em 0 0.5em;
    line-height:1.2
    }
    
    h1 {
    margin-top:0;
    font-size: 1.602em
    }

    h2 {font-size:1.424em}
    
    h3 {font-size:1.266em}
    
    h4 {font-size:1.125em}
    
    small, .font_small {font-size:0.889em}
    
    .gyro {background-image: url("gyro@1x.jpg"); height:25vh;}
    
    .flexwrap {padding: 1.5rem 0}
    
    .block {padding: 3rem 0}
    
    .action2 a {padding: 1em}
    
    .logo {flex: 0 0 3rem; padding-left: 0.3rem; padding-right:0.3rem}
    
    .flexl img {
    margin:0
    }

    .flexr img {
        margin: 0rem -1rem;
    }

    blockquote {margin-left: 0; margin-right: 0}
    .review {display:none}
    
    .sectionhlt, .sectionhdk {
    margin: 0 0 0.5em 0;
    font-size: 2.5em;
    }
    
    .iblock>div {
    padding: 0.3em;
    margin: 0 0 1em 0;
    }
    
    .iblock img {width:14em}
}

@media (min-width:400px) and (max-width:600px) {

    .callus {font-size:0.6em;padding-right: 0.3em;} 
    .callus a {font-size:1.4em}
    .nav-item {padding: 0.5em 0.3em;font-size:0.7em}
    
    .iblock p {
    width: 15em;
    font-size:1.2em;
    padding:0.2em
    }
}

@media (min-width:600px) {
    .gyro {background-image: url("gyro@2x.jpg");height:35vh}
    
      .iblock p {
      width: 20em;
      padding:0.5em
      }

      form {max-width:15em}
}

@media (min-width:800px) {

    html {font-size:1.3rem}
    
    body {line-height: 1.45}
    
    p {margin-bottom: 1.3em}
    
    h1, h2, h3, h4 {
      margin: 1.414em 0 0.5em;
      line-height: 1.2
    }
    
    h1 {
      margin-top: 0;
      font-size: 2.074em
    }
    
    h2 {font-size: 1.728em}
    
    h3 {font-size: 1.44em}
    
    h4 {font-size: 1.2em}
    
    small, .font_small {font-size: 0.833em}
    
    .iblock p {
    width: 30em;
    font-size:1.2em;
    }
    
    .sectionhlt, .sectionhdk {
    margin: 0 0 0.5em 0;
    font-size: 3rem;
    }
    
    .iblock>div {
    padding:1em; 
    margin:0 0 1em 0;
}
    

}

@media (min-width:1000px) {

    html {font-size:1.5rem}

    body {line-height: 1.45}
    
    p {margin-bottom: 1.3em}
    
    h1, h2, h3, h4 {
      margin: 1.414em 0 0.5em;
      line-height: 1.2
    }
    
    h1 {
      margin-top: 0;
      font-size: 3.157em
    }
    
    h2 {font-size: 2.369em}
    
    h3 {font-size: 1.777em}
    
    h4 {font-size: 1.333em}
    
    small, .font_small {font-size: 0.75em}
    
    .gyro {background-image: url("gyro@3x.jpg"); height:45vh;}
    
      .iblock p {
      width: 30em;
      font-size:1.2em;
    }
    
}

@media (min-width:1400px) {

    html {font-size:1.8rem}

    .gyro {background-image: url("gyro@4x.jpg");}
    
    blockquote {max-width: 30em}
}

/* End of Media Queries */