@charset "UTF-8";
/* universal declarations  */
@font-face {
  font-family: Technique-Sans;
  src: url("../fonts/Technique-Sans.otf") format("otf"),;
  src: local(Technique-Sans), url("../fonts/Technique-Sans.otf");
}


@font-face {
  font-family: Hanson-Bold;
  src: url("../fonts/Hanson-Bold.otf") format("otf"),;
  src: local(Hanson-Bold), url("../fonts/Hanson-Bold.otf");
}

@font-face {
  font-family: Courier Prime Sans;
  src: url("../fonts/Courier Prime Sans.ttf") format("otf"),;
  src: local(Courier Prime Sans), url("../fonts/Courier Prime Sans.ttf");
}

@font-face {
  font-family: Courier Prime Sans Italic;
  src: url("../fonts/Courier Prime Sans Italic.ttf") format("otf"),;
  src: local(Courier Prime Sans Italic), url("../fonts/Courier Prime Sans Italic.ttf");
}

@font-face {
  font-family: Courier Prime Sans Bold Italic;
  src: url("../fonts/Courier Prime Sans Bold Italic.ttf") format("otf"),;
  src: local(Courier Prime Sans Bold Italic), url("../fonts/Courier Prime Sans Bold Italic.ttf");
}

@font-face {
  font-family: Courier Prime Sans Bold;
  src: url("../fonts/Courier Prime Sans Bold.ttf") format("otf"),;
  src: local(Courier Prime Sans Bold), url("../fonts/Courier Prime Sans Bold.ttf");
}



.padded {
  padding-top:5%;
  padding-bottom:5%;
}

.padded-top {
  padding-top:5%;
}

.padded-btm {
  padding-bottom:5%;
}

.padded-sml {
  padding-top:2.5%;
  padding-bottom:2.5%;
}

.padded-sml-top {
  padding-top:2.5%;
}

.padded-sml-btm {
  padding-bottom:2.5%;
}

.text-center {
  text-align: center;
}

body {
 /* background: #f9f9f9 url(http://i.imm.io/LpUT.jpeg); */
 /* -webkit-font-smoothing: antialiased; */
  overflow: hidden;
  margin: 5;
    background:#D7E3F4;
}

a {

}


#bars {
    position: fixed;
      bottom: 0;
      margin-left:32.5%;
      padding-bottom:2rem;
      height:85px;
      z-index:10;
      overflow:hidden;
} 

#triangle {
    position: fixed;
        right: 0;
        margin-right: 3px;
        margin-top:12.5%;
        z-index:10;
      height:80px;
      overflow:hidden;
}

#circle {
    position: fixed;
      left: 0;
      margin-left: 10px;
      margin-top:35%;
      padding-bottom:2rem;
             z-index:10;
      height:90px;
      overflow:hidden;
}

.site-window {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
margin: 4rem;
border:15px solid black;
overflow-y:scroll;
overflow-x:hidden;
padding:1.75rem;
padding:30px;
/* background:#D7E3F4;
resize: vertical; */
}
/*
.site-window:before {
  display: block;
  content: ' ';
  background-image: url('../media/bars.svg');
  background-size: 28px 28px;
    position: fixed;
      bottom: 0;
      margin-left:32.5%;
      padding-bottom:2rem;
      height:85px;
      overflow:hidden;
}
*/
.site-wrapper {
  max-height:98%;
  max-width:100%;
  overflow-x:hidden;
  overflow-y: inherit;
  padding: 0px  0px 0px 10px;
} 


p {
      font-family:"Technique-Sans", "Technique-Sans", arial,sans-serif;
      font-size:22px;
      line-height: 1.5em;
      font-weight: 400;
      color:black;
}

.about li {
        font-family:"Technique-Sans", "Technique-Sans", arial,sans-serif;
      font-size:22px;
      line-height: 1.5em;
      font-weight: 400;
      color:black;
}

.about ul , ol {
  list-style: none;
}


.about li {
list-style: none;
}

.about li::before {
  content: "1️⃣:";
      margin: 0px 0px 0px -35px;
}

.about li:nth-child(2)::before {
  content: "2️⃣:";
}
.about li:nth-child(3)::before {
  content: "3️⃣:";
}
.about li:nth-child(4)::before {
  content: "4️⃣:";
}
.about li:nth-child(5)::before {
  content: "5️⃣:";
}
.about li:nth-child(6)::before {
  content: "6️⃣:";
}

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}


@media (max-width:767px) {
  section .row {
    padding-left:0px;
    padding-right:0px;
  }


}

section {
    overflow-x: hidden;
    width:100%;
}

.medium-zoom-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    transition: opacity .3s;
    will-change: opacity;
    z-index: 50;
    background-color: #D7E3F4 !important;
}

.medium-zoom-image--open {
    position: relative;
    cursor: pointer;
    cursor: zoom-out;
    will-change: transform;
    z-index: 55;
}

.modal-content {
    position: relative;
    background-color: #D7E3F4;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 10px solid black;
    border-radius: 0px;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}

.modal-body {
    position: relative;
    padding: 0px;
}

.modal-header {
    min-height: 16.42857143px;
    padding: 15px;
    border-bottom: none;
}

.modal-footer {
    padding: 15px;
    text-align: right;
    border-top: none;
}

.fade .modal-header .close {
    opacity:1;
    width:2rem;
    z-index: 1100;
    margin-top: -15px;
}

.modal-header button.close span{
    font-size:5rem;
    z-index: 1100;
}


@media (min-width: 768px){
.modal-dialog {
    width: 600px;
    margin: 10% auto;
} 
}

#contactModal .modal-dialog {
    position: relative;
    width: auto;
    margin: 7%;
}

@media (min-width: 767px) {
.ekko-lightbox-nav-overlay a {
    -ms-flex: 1;
    flex: 1;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    opacity: 1 !important;
    transition: opacity 0s;
    color: black !important;
    font-size: 30px;
    z-index: 1;
}
}

@media (max-width: 767px) {
  .modal-body {
    position: relative;
    padding: 0px;
}

}

::selection {
 background: #316DF4;
  color:#F9F191;
  text-shadow:  -1px 1px 0px #e56b4a, -1px 1px 0px #e56b4a, -1px 2px 0px #e56b4a, -2px 1px 0px #e56b4a, -2px 2px 0px #e56b4a, -3px 3px 0px #e56b4a;
}
::-moz-selection {
  background: #316DF4;
  color:#F9F191;
  text-shadow:  -1px 1px 0px #e56b4a, -1px 1px 0px #e56b4a, -1px 2px 0px #e56b4a, -2px 1px 0px #e56b4a, -2px 2px 0px #e56b4a, -3px 3px 0px #e56b4a;
}

/* end of universal declarations  */

/* navbar styles  */


nav a {
  padding-top: 20px;
  padding-bottom: 20px;
  font-size: 18px;
    background: none;
}

.navbar-toggle {
   padding:0px;
}

nav .navbar-toggle {
  margin: 0px 0px 13px 0px;
  height:20px;
 
}

p > a , li > a {
  background: linear-gradient(to bottom, #316DF4 0%, #316DF4 100%);
    background-position: 0 100%;
    background-repeat: repeat-x;
    background-size: 3px 3px;
  color: #000;
  text-decoration: none;
}

p > a:hover, li > a:hover {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg id='squiggle-link' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:ev='http://www.w3.org/2001/xml-events' viewBox='0 0 20 4'%3E%3Cstyle type='text/css'%3E.squiggle{animation:shift .3s linear infinite;}@keyframes shift {from {transform:translateX(0);}to {transform:translateX(-20px);}}%3C/style%3E%3Cpath fill='none' stroke='%23316DF4' stroke-width='2' class='squiggle' d='M0,3.5 c 5,0,5,-3,10,-3 s 5,3,10,3 c 5,0,5,-3,10,-3 s 5,3,10,3'/%3E%3C/svg%3E");
  background-position: 0 100%;
  background-size: auto 6px;
  background-repeat: repeat-x;
  text-decoration: none;
    color: #000;
}

.navbar-toggle {
  border: none;
  background: transparent !important;
}
.navbar-toggle:hover {
  background: transparent !important;
}


.navbar-default .navbar-toggle .icon-bar {
    background-color: #E56B4A;
    margin:10px;
}

.navbar-toggle .icon-bar {
    display: block;
    width: 50px;
    margin-top: 5px;
    height: 8px;
    border-radius: 0px;
}

.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover {
    background-color: transparent;
}

.navbar-default .navbar-toggle {
    border: none;
}


.navbar-toggle span.icon-bar {
     visibility: visible;
}


.navbar-toggle span:nth-child(2) {
    transform: rotate(45deg);
    transform-origin: 0% 274%;
    transition: all 0.15s;
}

.navbar-toggle[aria-expanded="true"] span:nth-child(3){
 visibility: visible;
} 

.navbar-toggle[aria-expanded="false"] span:nth-child(3){
 visibility: visible;
} 

.navbar-toggle span:nth-child(4) {
    transform: rotate(-45deg);
    transform-origin:20% -69%;
    transition: all 0.15s;
}

.navbar-toggle.collapsed span:nth-child(2),
.navbar-toggle.collapsed span:nth-child(4) {
    transform: rotate(0);
} 
.navbar-toggle.collapsed span:nth-child(3)  {
    visibility: visible;
} 


.navbar-header {
  background-color: transparent;
 
}

.navbar-default {
  /*background-color: #efeded; */
  background-color: transparent;
}
.navbar .navbar-nav {
  display: inline-block;
  float: none;
  vertical-align: top;
}

.navbar .navbar-collapse {
  text-align: center;
}

.navbar-default .navbar-collapse {
  box-shadow: none;
}

.navbar-brand {
    padding: 15px 0px;
}


.navbar-default a {
     color: black;
    font-family:"Hanson-Bold", "Hanson-Bold", arial,sans-serif;
     font-size: 2.25em;
}



.navbar-brand {
    float: left;
    width:auto;
    line-height:28px;
}

.navbar-default  .navbar-brand{
    color:#F9F191;
     text-shadow: -1px 1px 0px #e56b4a, -1px 1px 0px #e56b4a, -2px 2px 0px #e56b4a, -3px 2px 0px #e56b4a, -3px 3px 0px #e56b4a, -4px 3px 0px #e56b4a, -5px 4px 0px #e56b4a, -6px 4px 0px #e56b4a, -1px 1px 0px #000000, -1px 1px 0px #000000, -2px 2px 0px #000000, -3px 2px 0px #000000, -3px 3px 0px #000000, -4px 3px 0px #000000, -5px 4px 0px #000000, -6px 4px 0px #000000, -1px 1px 0px #316df4, -2px 2px 0px #316df4, -2px 2px 0px #316df4, -3px 3px 0px #316df4, -4px 4px 0px #316df4, -5px 5px 0px #316df4, -6px 6px 0px #316df4, -6px 6px 0px #316df4, -7px 7px 0px #316df4, -8px 8px 0px #316df4, -1px 1px 0px #000000, -2px 2px 0px #000000, -2px 2px 0px #000000, -3px 3px 0px #000000, -4px 4px 0px #000000, -5px 5px 0px #000000, -6px 6px 0px #000000, -6px 6px 0px #000000, -7px 7px 0px #000000, -8px 8px 0px #000000;
}

.navbar-default  .navbar-brand:hover, 
.navbar-default  .navbar-brand:focus,
.navbar-default  .navbar-brand:active

        {
    color:#316DF4;
     text-shadow: -1px 1px 0px #f9f191, -1px 1px 0px #f9f191, -2px 2px 0px #f9f191, -3px 2px 0px #f9f191, -3px 3px 0px #f9f191, -4px 3px 0px #f9f191, -5px 4px 0px #f9f191, -6px 4px 0px #f9f191, -1px 1px 0px #000000, -1px 1px 0px #000000, -2px 2px 0px #000000, -3px 2px 0px #000000, -3px 3px 0px #000000, -4px 3px 0px #000000, -5px 4px 0px #000000, -6px 4px 0px #000000, -1px 1px 0px #e56b4a, -2px 1px 0px #e56b4a, -3px 2px 0px #e56b4a, -4px 3px 0px #e56b4a, -5px 4px 0px #e56b4a, -6px 4px 0px #e56b4a, -7px 5px 0px #e56b4a, -8px 6px 0px #e56b4a, -9px 6px 0px #e56b4a, -10px 7px 0px #e56b4a, -1px 1px 0px #000000, -2px 1px 0px #000000, -3px 2px 0px #000000, -4px 3px 0px #000000, -5px 4px 0px #000000, -6px 4px 0px #000000, -7px 5px 0px #000000, -8px 6px 0px #000000, -9px 6px 0px #000000, -10px 7px 0px #000000;
            }

.navbar-default .navbar-nav > li > a:link {
    color: black;
    background: transparent;
}

.navbar-default .navbar-nav > li > a {
    color: black;
}

.navbar-default .navbar-nav > li > a:hover , 
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li > a:active  {
    color: #316DF4;
}

.navbar-default .navbar-nav > li > a {
        line-height:28px;
        display:inline-block;
}

@media (min-width: 860px) {
.navbar-default .navbar-nav > li > a {
        line-height:28px;
        display:inline-block;
}

.navbar-default {
  background-color: transparent; 
  margin-top: 15px;
}
.navbar-nav {
  float:right;
}
}

@media (max-width:860px) {
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border-color: transparent;
    text-align: center;
    box-shadow: none;
    z-index:11;
    /* opacity: .5; */
}
 .navbar-header{
   box-shadow: transparent; 
   z-index:11;
}
.navbar-default .navbar-collapse ul {
  text-align: center;
  margin: 30px 0px;
    float:none;
  width:100%;
}
.nav li {
    text-align: center;
    display:inline-block;
}

}




 @media (max-width:860px) {
.navbar-default a  {
font-size:2em;
}
.navbar-collapse {
  width:100%;
}
}


 @media (min-width:768px) and (max-width: 992px) {
  .navbar-default a {
  font-size:1.9em;
}
.navbar-default .navbar-nav > li > a  {
  font-size: 1.7em;
}

} 
@media (min-width: 768px) and (max-width: 860px) {
    .navbar-collapse.collapse {
        display: none !important;
    }
    .navbar-collapse.collapse.in {
        display: block !important;
    }
    .navbar-header .collapse, .navbar-toggle {
        display: block !important;
    }
    .navbar-header {
        float:none;
    }
    .nav li {
      float:none;
    }
}
 @media (max-width:630px) {
.site-window {
margin: 2rem;
border:10px solid black;
overflow-y:scroll;
overflow-x:hidden;
padding:1.75rem;
}

#bars {
    position: fixed;
      bottom: 0;
      margin-left:30%;
      margin-bottom: 0px;
      height:50px;
      padding-bottom:0px;
}

#triangle {
    position: fixed;
        right: 0;
        margin-right: -3px;
        margin-top:27.5%;
        z-index:10;
      height:50px;
}

#circle {
    position: fixed;
      left: 0;
      margin-left: -65px;
      margin-top:95.5%;
      padding-bottom:2rem;
             z-index:10;
      width:175px;
      height:70px;
}
.navbar-brand {
    padding: 15px 0px;
}
 .navbar-default a {
  font-size:1.9em;
}
.navbar-default .navbar-nav > li > a  {
  font-size: 1.5em;
}


}
  

 @media (max-width:440px)  {
     .navbar-default a {
  font-size:2em;
  max-width: 150px;
  line-height: 30px;
}

.navbar-brand {
    padding: 0px 0px;
}
 }

  @media (max-width:345px)  {
     .navbar-default a {
  font-size:1.8em;
  max-width: 140px;
  line-height: 30px;
}

.navbar-brand {
    padding: 0px 0px;
}
 }

 @media (max-width:390px)  {
.col-md-4.feature-box .stacked-boxes {
  margin: 3rem 0rem;
}
 } 


/* section 1 styles */

.intro-text {
  margin-top: 40px;
}


h2 {
       color: #E56B4A;
    font-family:"Hanson-Bold", "Hanson-Bold", arial,sans-serif;
     font-size: 2.25em;
}

.at-symbol {
       color: #F9F191;
    font-family:"Hanson-Bold", "Hanson-Bold", arial,sans-serif;
     font-size: 5em;
}


/* section 1 styles */
@media (min-width: 992px) {
.feature-box {
  padding: 5rem 5rem;
}
}

.feature-box img {
  border: 15px solid black;
}

.stacked-boxes {
margin: 3rem 0rem;
}

.topbox {
  position:relative;
  border:5px solid black;
  background-color:white;
   max-width:26rem;
   max-height:13rem;
   min-width:22rem;
   min-height:7rem;
   padding:5px 10px;
   margin:0.5em 0rem .5rem 2rem;
   z-index: 15;
   text-transform: uppercase;
}


.btmbox {
    position:relative;
  border:5px solid black;
  background-color:white;
   max-width:25rem;
   max-height:13rem;
      min-height:7rem;
      min-width:22rem;
  padding:28px;
  margin:-4.2em 0rem;
     z-index: 11;
}

h4 {
        font-family:"Courier Prime Sans Bold Italic", "Courier Prime Sans Bold Italic", arial,sans-serif;
      font-size:1.2em;
      line-height: .9em;
      font-weight: 400;
      color:black;
}

h3 {
        font-family:"Courier Prime Sans Bold Italic", "Courier Prime Sans Bold Italic", arial,sans-serif;
      font-size:2em;
      line-height: .9em;
      font-weight: 400;
      color:black;
}


.img-with-text{
    position: relative;
}
.img-with-text > div{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0);
    color: transparent;
    transition: .5s;
    display:inline-block;
}
.img-with-text > div:hover{
    background-color: rgba(255, 255, 255, 0.9);
      border: 15px solid black;
       transform: translateY(0px);
}

.img-with-text > div h3{
    text-align:center;
    visibility:hidden;
    margin: 30% 0;
    letter-spacing: 2px;
}

.img-with-text > div:hover h3{
    color: #316DF4;
    text-align:center;
    visibility:visible;
}

.feature-box div:hover ~ div .topbox , .feature-box > a:hover ~ div .topbox  {
  border: 5px solid #316DF4;
 transform: translateY(-7px);
  }

  .feature-box div:hover ~ div .btmbox , .feature-box > a:hover ~ div .btmbox {
    border: 5px solid #316DF4;
  }

   .feature-box div:hover ~ div h4 , .feature-box > a:hover ~ div h4 {
     color:#316DF4;
     text-decoration: none;
   }



 .col-md-4.feature-box  {
  padding: 2.5rem 2.5rem;
}

 .col-md-4.feature-box  img {
  border: 10px solid black;
}


@media (max-width: 500px) {

  .feature-box {
    padding:5rem 1.5rem;
  }

  .feature-box img {
  border: 10px solid black;
}

.topbox {
  position:relative;
  border:5px solid black;
  background-color:white;
   max-width:50%;
   max-height:70%;
   padding:5px 10px;
   margin:.5em 3rem;
   z-index: 15;
   text-transform: uppercase;
}


.btmbox {
    position:relative;
  border:5px solid black;
  background-color:white;
   max-width:50%;
   max-height:70%;
  padding:28px;
  margin:-4.2em 1rem;
     z-index: 11;
}
.stacked-boxes {
  margin: 3rem 1rem;
}

.img-with-text > div h3{
    text-align:center;
    visibility:hidden;
    margin: 27% 12%;
    letter-spacing: 2px;
    text-align:center;
}
.img-with-text > div:hover{
    background-color: rgba(255, 255, 255, 0.9);
      border: 10px solid black;
       transform: translateY(0px);
}
}

@media (max-width: 375px) {

.stacked-boxes {
  margin: 3rem 1rem;
}
.topbox {
  position:relative;
  border:5px solid black;
  background-color:white;
   max-width:29rem;
   max-height:13rem;
   min-width:19rem;
   min-height:5rem;
   padding:5px 5px;
   margin:.5em 1.25rem;
   z-index: 15;
   text-transform: uppercase;
}


.btmbox {
    position:relative;
  border:5px solid black;
  background-color:white;
   max-width:20rem;
   max-height:13rem;
      min-height:5rem;
      min-width:15rem;
  padding:28px;
  margin:-4.2em -1rem;
     z-index: 11;
}

 .col-md-4.feature-box  {
  padding: 5rem 1.5rem;
}
.col-md-4.feature-box .stacked-boxes {
  margin: 3rem 1rem;
}
}


 @media (min-width:500px) and (max-width:992px) {
.col-md-6.feature-box {
    margin: 0rem 0rem 12rem;
}
.col-md-4.feature-box {
    margin: 0rem 0rem 6rem;
}
}

.contact-row {
  display: inline-block;
}
.contact-row a , .contact-row a:hover {
  text-decoration: none;
}

.contact-row a img:hover, .at-symbol:hover {
  transform: scale(1.15); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  text-decoration: none;
  font-size:calc(+80px);
}

.social {
  max-width: 140px;
  display: inline-block;
}

.fun div {
  padding: 15px 15px;
}


.fun p {
  font-size:.95em;
}

.fun img {
  border: solid 10px black;
  display: inline-block;
           box-sizing: border-box;
    -moz-box-sizing: border-box;
}
.fun img:hover {
  border:  solid 10px black;
  box-shadow: inset 15px #0f0;
}

.fun .stacked-boxes {
  padding: 3rem 1rem; 
}
.fun .topbox {
  border:5px solid black;
  background-color:white;
   max-width:33rem;
   max-height:18rem;
   min-width:19rem;
   min-height:10rem;
   padding:5px 5px;
   margin:.5em 1.25rem;
   z-index: 15;
   text-transform: uppercase;
}


.fun .btmbox {
  border:5px solid black;
  background-color:white;
   max-width:27rem;
   max-height:18rem;
      min-height:10rem;
      min-width:15rem;
  padding:28px;
  margin:-6.2em -1rem;
     z-index: 11;
}

.feature-box a:hover h4 , .feature-box a .topbox h4:hover , .feature-box:hover a .topbox h4 , .feature-box a:hover {
     text-decoration: none !important;
   }