#webmail_links {
   position: absolute;
   left: 10px;
   display: none;
}

#hosting_links {
   position: absolute;
   left: 115px;
   display: none;
}

#cust_links {
   font-family: Arial;
   font-size: 0.80em;
   position: absolute;
   left: 430px;
   top: 10px;
}

#cust_links a:link {
   color: #FFF;
   text-decoration: none;
}

#cust_links a:visited {
   color: #FFF;
   text-decoration: none;
}

#cust_links a:hover {
   color: #FFF;
   text-decoration: underline;
}

#cust_links a:active {
   color: #FEE;
   text-decoration: underline;
}

#domain {
   width: 300px;
   clear: right;
}

#background {
   position: fixed;
   left: 0em;
   top: 0em;
   right: 0em;
   bottom: 0em;
   z-index: -500;
   display: -webkit-flex;
   display: flex;
   width: 100vw;
   height: 100vh;
   background-image: url('/images/wave.jpg');
   background-attachment: fixed;
   background-repeat: no-repeat;
   background-position: top left;
   background-size: 100vw 100vh;
}

#index_content {
   font-family: Arial;
   font-size: 1.70em;
   color: #000000;
   margin-left: 10vw;
   position: relative;
   left: 5em;
   right: 5em;
   z-index: 4;
   width: 55vw;
   visibility: visible;
}

#header_title {
   font-family: Yellowtail;
   font-size: 2.00em;
   color: #ffffff;
   font-weight: normal;
   text-decoration: none;
   margin-left: 1em;
   position: relative;
}

#tagline {
   font-family: Condiment;
   font-size: 1.20em;
   color: #ffffff;
   text-align: left;
   margin-top: 0.5em;
   margin-left: 4em;
   position: relative;
   z-index: 5;
}

#dolphin_element {
   filter: alpha(opacity=70);
   -moz-opacity: 70%;
   opacity: 0.7;
   position: absolute;
   left: 1%;
   top: 0.2em;
   z-index: -100;
   width: 99%;
   height: 99%;
   background-image: url('/images/dolphin_1.svg');
   background-repeat: no-repeat;
   background-size: contain;
}

.banded_content {
   background: rgba(186, 239, 221, 0.55);
   position: absolute;
   left: 0vw;
   top: 12vh;
   right: 0vw;
   z-index: 5;
   width: 100vw;
}

#about_content {
   font-family: Arial;
   font-size: 1.70em;
   color: #000000;
   margin-left: 10vw;
   position: relative;
   left: 5em;
   right: 5em;
   z-index: 4;
   width: 55vw;
}

#hosting_content {
   font-family: Arial;
   font-size: 1.30em;
   color: #000000;
   margin-left: 10vw;
   position: relative;
   left: 5em;
   right: 5em;
   z-index: 4;
   width: 60vw;
}

#design_content {
   font-family: Arial;
   font-size: 1.30em;
   color: #000000;
   margin-left: 10vw;
   position: relative;
   left: 5em;
   right: 5em;
   z-index: 4;
   width: 55vw;
}

#cloud_content {
   font-family: Arial;
   font-size: 1.30em;
   color: #000000;
   margin-left: 10vw;
   position: relative;
   left: 5em;
   right: 5em;
   z-index: 4;
   width: 55vw;
}

#portfolio_content {
   font-family: Arial;
   font-size: 1.30em;
   color: #000000;
   margin-left: 10vw;
   position: relative;
   left: 5em;
   right: 5em;
   z-index: 4;
   width: 55vw;
}

#support_content {
   font-family: Arial;
   font-size: 1.70em;
   color: #000000;
   margin-left: 10vw;
   position: relative;
   left: 5em;
   right: 5em;
   z-index: 4;
   width: 55vw;
}

#contact_info {
   font-family: Arial;
   font-size: 0.60em;
   color: #000000;
   position: absolute;
   right: 1em;
   bottom: 0.5%;
   z-index: 4;
   float: right;
}

.hosting_pricing {
   font-family: Arial;
   color: #000000;
   padding-top: 0px;
   background-color: #FFFFFF;
   margin-left: 0px;
   position: relative;
   left: 1vw;
   top: 1vh;
   right: 1vw;
   bottom: 0px;
   z-index: 4;
   width: 95vw;
   -webkit-flex-shrink: 0;
   flex-shrink: 0;
}

.hosting_features {
   font-family: Arial;
   padding-bottom: 6.5em;
   letter-spacing: normal;
   text-align: left;
   background-color: #E1F4ED;
   position: relative;
   z-index: 4;
   width: 100%;
   height: 100%;
   list-style-type: none;
   box-shadow: 0px -1000000px;
   text-indent: 0px;
}

.hosting_software {
   font-family: Arial;
   background-color: #E1F4ED;
   position: relative;
   z-index: 4;
   float: right;
   width: 100%;
   list-style-type: none;
}

.first_col {
   font-weight: bold;
   text-align: left;
}

.hosting_special {
   font-weight: bold;
}

.hosting_special_small {
   font-size: 0.80em;
   text-align: left;
}

#contactform_content {
   position: absolute;
   top: 15vh;
   right: 0em;
   z-index: 4;
   width: 75vw;
}

#cloud_element {
   filter: alpha(opacity=80);
   -moz-opacity: 80%;
   opacity: 0.8;
   position: absolute;
   left: 20vw;
   top: 15vh;
   z-index: 2;
   float: right;
   width: 80vw;
   height: 80vh;
   background-image: url('/images/cloud-storage.svg');
   background-repeat: no-repeat;
   background-size: contain;
}

#websites_content {
   font-family: Arial;
   font-size: 1.30em;
   color: #000000;
   margin-left: 10vw;
   position: relative;
   left: 5em;
   right: 5em;
   z-index: 4;
   width: 55vw;
}

#breeze_content {
   font-family: Arial;
   font-size: 1.20em;
   color: #000000;
   margin-left: 10vw;
   position: relative;
   left: 5em;
   right: 5em;
   z-index: 4;
   width: 55vw;
   list-style-type: circle;
}

#breeze_logo-grey {
   filter: alpha(opacity=80);
   -moz-opacity: 80%;
   opacity: 0.8;
   position: absolute;
   top: 10vh;
   right: 1vw;
   z-index: -1;
   float: right;
   width: 50vw;
   height: 70vh;
   background-image: url('/images/Breeze-logo_grey_no-text.svg');
   background-repeat: no-repeat;
   background-size: contain;
}

#design_element {
   filter: alpha(opacity=70);
   -moz-opacity: 70%;
   opacity: 0.7;
   position: absolute;
   top: 6vh;
   right: 5vw;
   z-index: 3;
   float: right;
   width: 40vw;
   height: 90vh;
   background-image: url('/images/ideas.svg');
   background-repeat: no-repeat;
   background-size: contain;
}

#app_element {
   filter: alpha(opacity=70);
   -moz-opacity: 70%;
   opacity: 0.7;
   position: absolute;
   left: 10vw;
   top: 35vh;
   z-index: 2;
   width: 80vw;
   height: 40vh;
   background-image: url('/images/apps.svg');
   background-repeat: no-repeat;
   background-size: contain;
}

#website_element {
   filter: alpha(opacity=70);
   -moz-opacity: 70%;
   opacity: 0.7;
   position: absolute;
   left: 10vw;
   top: 35vh;
   z-index: 2;
   width: 80vw;
   height: 40vh;
   background-image: url('/images/website.svg');
   background-repeat: no-repeat;
   background-size: contain;
}

#tile_07 {
   background-color: #BCBCBC;
   border: none;
   position: relative;
   left: 15%;
   bottom: 0.3%;
   z-index: 4;
   float: left;
   width: 15%;
   height: 15%;
   border-top-left-radius: 0.3em;
   border-top-right-radius: 0.3em;
   border-bottom-right-radius: 0.3em;
   border-bottom-left-radius: 0.3em;
}

#tile_08 {
   background-color: #BCBCBC;
   border: none;
   position: relative;
   left: 25%;
   bottom: 0.3%;
   z-index: 4;
   width: 15%;
   height: 15%;
   border-top-left-radius: 0.3em;
   border-top-right-radius: 0.3em;
   border-bottom-right-radius: 0.3em;
   border-bottom-left-radius: 0.3em;
}

#tile_09 {
   background-color: #BCBCBC;
   border: none;
   position: relative;
   left: 35%;
   bottom: 0.3%;
   z-index: 4;
   width: 15%;
   height: 15%;
   border-top-left-radius: 0.3em;
   border-top-right-radius: 0.3em;
   border-bottom-right-radius: 0.3em;
   border-bottom-left-radius: 0.3em;
}

#call_caption {
   font-family: Condiment;
   font-size: 1.00em;
   color: #0a2c6b;
   position: fixed;
   top: 47vh;
   right: 20em;
   z-index: 4;
   width: 10em;
   content: 'Call Us!';
}

.copyright {
   font-family: Arial;
   font-size: 0.80em;
   color: #ffffff;
   margin-top: 10em;
   margin-right: 3em;
   float: right;
}

#app_content {
   font-family: Arial;
   font-size: 1.30em;
   color: #000000;
   margin-left: 10vw;
   position: relative;
   left: 5em;
   right: 5em;
   width: 55%;
}

#breeze_wowza {
   position: absolute;
   right: 10vw;
   bottom: 10vh;
   z-index: 4;
   float: right;
   width: 15vw;
   border-top-left-radius: 0.3em;
   border-top-right-radius: 0.3em;
   border-bottom-right-radius: 0.3em;
   border-bottom-left-radius: 0.3em;
}

#tile_00 {
   font-family: Arial;
   font-size: 1.00em;
   padding-top: 1em;
   padding-bottom: 1em;
   position: relative;
   z-index: 3;
   display: -webkit-flex;
   display: flex;
   width: 80vw;
   -webkit-flex-wrap: inherit;
   flex-wrap: inherit;
}

#tile_07z {
   font-size: 1.00em;
   padding-right: 0.5em;
   padding-left: 0.5em;
   text-shadow: #ffffff 0px 0px 3px;
   line-height: 1.7em;
   text-align: center;
   position: absolute;
   left: 15%;
   z-index: 5;
   width: 15%;
   height: 15%;
}

#tile_08z {
   font-size: 1.00em;
   padding-right: 0.5em;
   padding-left: 0.5em;
   text-shadow: #ffffff 0px 0px 3px;
   line-height: 1.7em;
   text-align: center;
   position: absolute;
   left: 40%;
   z-index: 5;
   width: 15%;
   height: 15%;
}

#tile_09z {
   font-size: 1.00em;
   padding-right: 0.5em;
   padding-left: 0.5em;
   text-shadow: #ffffff 0px 0px 3px;
   text-align: center;
   position: absolute;
   left: 70%;
   z-index: 5;
}

#marketing_content {
   font-family: Arial;
   font-size: 1.30em;
   color: #000000;
   margin-left: 10vh;
   position: relative;
   left: 5em;
   right: 5em;
   width: 55%;
}

#portfolio_ent {
   margin-top: 0.5em;
   margin-right: 0.5em;
   margin-left: 0.5em;
   margin-bottom: 0.5em;
   position: relative;
   z-index: 5;
   display: inline;
   width: 13vw;
   border-top-left-radius: 1em;
   border-top-right-radius: 1em;
   border-bottom-right-radius: 1em;
   border-bottom-left-radius: 1em;
   -webkit-transition-property: width, height;
   transition-property: width, height;
   -webkit-transition-timing-function: ease-in-out;
   transition-timing-function: ease-in-out;
   -webkit-transition-duration: 1s;
   transition-duration: 1s;
}

.portfolio {
   text-align: center;
   background: rgba(255, 255, 255, 0.8);
   margin-bottom: 10vh;
   position: absolute;
   left: 15vw;
   top: 280px;
   z-index: 4;
   width: 70vw;
   border-top-left-radius: 1em;
   border-top-right-radius: 1em;
   border-bottom-right-radius: 1em;
   border-bottom-left-radius: 1em;
}

#ppl_sds {
   font-family: Arial;
   position: absolute;
   top: 60vh;
   right: 2em;
   z-index: 4;
   width: 50vw;
   height: 30vh;
   background-image: url('/images/bg-test2.svg');
   background-repeat: no-repeat;
   background-position: top right;
   background-size: contain;
}

.ppl_sds {
   margin-top: 0.5em;
   margin-right: 0.5em;
   margin-left: 0.5em;
   margin-bottom: 0.5em;
   position: relative;
   z-index: 5;
   float: right;
   height: 95%;
   border-top-left-radius: 1em;
   border-top-right-radius: 1em;
   border-bottom-right-radius: 1em;
   border-bottom-left-radius: 1em;
}

.sds_cart_contents {
   font-size: 2.30em;
   font-weight: bold;
   margin-bottom: 10%;
   position: absolute;
   left: 40%;
   top: 15%;
}

.sds_cart {
   width: 20vw;
   height: 15vh;
   background-image: url('/images/SDS-cart.svg');
   background-repeat: no-repeat;
   background-size: contain;
}

.sds_cart_desc {
   position: absolute;
   bottom: 5%;
}

.header_title_suffix {
   font-size: 0.50em;
}

.alpha_layer {
   padding-right: 20px;
   padding-bottom: 20px;
   padding-left: 20px;
   text-align: left;
   background: rgba(255, 255, 255, 0.6);
   margin-top: 0px;
   margin-right: auto;
   margin-left: auto;
   margin-bottom: 0px;
   top: 85px;
   z-index: -90;
   width: 80%;
   height: 100%;
}

.alpha_layer_1 {
   padding-right: 20px;
   padding-bottom: 20px;
   padding-left: 20px;
   text-align: left;
   background: transparent;
   margin-top: 0px;
   margin-right: 20%;
   margin-left: 12%;
   margin-bottom: 0px;
   top: 85px;
   z-index: -90;
   width: 62%;
   height: 100%;
}

.alpha_layer_2 {
   padding-right: 20px;
   padding-bottom: 20px;
   padding-left: 20px;
   text-align: left;
   background: transparent;
   margin-top: 0px;
   margin-right: auto;
   margin-left: auto;
   margin-bottom: 0px;
   top: 85px;
   z-index: -90;
   width: 80%;
   height: 100%;
}

.small_txt {
   font-size: 11px;
}

.hosting_pricing tbody {
   text-align: center;
   background-color: #B4E8D5;
   margin-bottom: 0px;
   left: 0%;
   box-shadow: 0px -1000000px;
}

.hosting_pricing td {
   background-color: #E1F4ED;
   margin-bottom: 0px;
   left: 0px;
   box-shadow: 0px -1000000px;
}

.hosting_features th {
   font-family: Condiment;
   font-size: 1.20em;
   text-shadow: #ffffff 0px 0px 3px;
   text-align: center;
   background-color: #3F7C93;
   width: 100%;
   box-shadow: 0px -1000000px;
   text-indent: 0px;
}

.hosting_software th {
   font-family: Condiment;
   font-size: 1.20em;
   text-shadow: #ffffff 0px 0px 3px;
   text-align: center;
   background-color: #3F7C93;
   box-shadow: 0px -1000000px;
   text-indent: 0px;
}

.hosting_special_small a:link {
   color: #1F6800;
   font-weight: bold;
   font-variant: small-caps;
   white_space: nowrap;
}

#breeze_content a:link {
   color: #0D2054;
}

.hosting_features td {
   text-align: left;
}

.hosting_software td {
   text-align: left;
}

#tile_09z h4 {
   font-size: 2.00em;
   color: #910000;
   font-weight: bold;
   text-shadow: #ffffff 0px 0px 4px;
   line-height: 1em;
   text-align: center;
   position: absolute;
   left: -3em;
   bottom: -2.5em;
}

.hosting_pricing tbody th {
   font-family: Condiment;
   font-size: 1.20em;
   padding-right: 1em;
   padding-left: 1em;
   text-shadow: #ffffff 0px 0px 3px;
   text-align: center;
   background-color: #3F7C93;
   white_space: nowrap;
   box-shadow: 0px -1000000px;
   text-indent: 0px;
}

.hosting_special_small a:visited {
   color: #00440A;
   font-variant: small-caps;
   white_space: nowrap;
}

#breeze_content a:visited {
   color: #0D2054;
}

.hosting_special_small a:hover {
   color: #98AF00;
   font-weight: bold;
   font-variant: small-caps;
   white_space: nowrap;
}

#breeze_content a:hover {
   color: #0D2054;
   text-shadow: #ffffff 2px 2px 3px;
}

.hosting_special_small a:active {
   color: #1F6800;
   font-weight: bold;
   font-variant: small-caps;
   white_space: nowrap;
}

#wrap {
   padding-bottom: 140px;
   overflow: auto;
   display: block;
   width: 100%;
}

.howtotitle {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 1.40em;
   font-weight: bold;
}

#content_div {
   margin-right: auto;
   margin-left: auto;
   overflow: auto;
   display: block;
   width: 100%;
}

#content_div td {
   font-family: Arial, Helvetica, sans-serif;
}

#content_div p {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 1.20em;
   color: #000000;
}

#content_div h1 {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 2.30em;
   color: #0D2054;
   text-shadow: #ffffff 2px 2px 2px;
}

#content_div h2 {
   font-family: Condiment, Comic Sans MS, Edwardian Script ITC;
   font-size: 2.20em;
   color: #0D2054;
   text-shadow: #ffffff 2px 2px 2px;
}

#content_div h3 {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 1.60em;
}

#content_div h4 {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 1.40em;
}

#content_div li {
   font-family: Arial, Helvetica, sans-serif;
}

#content_div a:link {
   color: #0a2c6b;
   text-decoration: none;
}

#content_div a:hover {
   color: #0a2c6b;
   text-decoration: underline;
   text-shadow: #00bb00 0px 0px 3px;
}

#content_div a:visited {
   color: #0a2c6b;
   text-decoration: none;
}

#content_div a:active {
   color: #0b3d7c;
   text-decoration: underline;
}

#top_td {
   background-color: #122F6B;
   position: fixed;
   left: 0em;
   top: 0em;
   right: 0em;
   z-index: 6;
   width: 100%;
   height: 3em;
   visibility: visible;
   -webkit-transition-property: height;
   transition-property: height;
   -webkit-transition-timing-function: ease-in;
   transition-timing-function: ease-in;
   -webkit-transition-duration: 5s;
   transition-duration: 5s;
    -webkit-transition-delay: 1s;
   transition-delay: 1s;
}

#top_div {
   background-color: #122F6B;
   position: fixed;
   left: 0em;
   top: 0em;
   right: 0em;
   z-index: 6;
   width: 100%;
   height: 3em;
   visibility: visible;
   -webkit-transition-property: height;
   transition-property: height;
   -webkit-transition-timing-function: ease-in;
   transition-timing-function: ease-in;
   -webkit-transition-duration: 4s;
   transition-duration: 4s;
}

#header {
   background: -webkit-linear-gradient(90deg, rgba(10, 44, 107, 1), rgba(22, 196, 179, 0));
   background: -o-linear-gradient(90deg, rgba(10, 44, 107, 1), rgba(22, 196, 179, 0));
   background: -moz-linear-gradient(90deg, rgba(10, 44, 107, 1), rgba(22, 196, 179, 0));
   background: linear-gradient(90deg, rgba(10, 44, 107, 1), rgba(22, 196, 179, 0));
}

#footer {
   background-color: #122F6B;
   position: fixed;
   left: 0px;
   bottom: 0px;
   z-index: 3;
   width: 100vw;
   height: 160px;
   visibility: visible;
   background: -webkit-linear-gradient(90deg, rgba(10, 44, 107, 1), rgba(22, 196, 179, 0.7));
   background: -o-linear-gradient(90deg, rgba(10, 44, 107, 1), rgba(22, 196, 179, 0.7));
   background: -moz-linear-gradient(90deg, rgba(10, 44, 107, 1), rgba(22, 196, 179, 0.7));
   background: linear-gradient(90deg, rgba(10, 44, 107, 1), rgba(22, 196, 179, 0.7));
}

header {
   position: sticky;
   top: 0px;
}

footer {
   background: rgba(18, 47, 107, 0.8);
}

html {
   height: 100%;
}

/* portfolio effects */
#portfolio_ent:hover {
  position: relative;
  z-index: 6;
  width: 25vw;
}
#slideshow .slides li p::first-line {
  font-family: Arial Black;
  margin-bottom: 1.5em;
}
.sds_cart {
  font-family: Ariel, sans-serif;
  z-index:10;
  background-color: rgba(255, 255, 255,.9);
  position:absolute;
  top: 50vh;
  right:2vw;
  float:right;
  width: 5em;
  padding:1em;
  margin:1em;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  -o-border-radius: 1em;
  border-radius: 1em;
  padding: 6px 12px;
  border-top: none;
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}
.hostplan {
  font-family: Ariel, sans-serif;
  z-index:7;
  background-color: rgba(255, 255, 255,.9);
  position:absolute;
  top: 45vh;
  width: 85%;
  padding:1em;
  margin:1em;
  -webkit-border-radius: 1em;
  -moz-border-radius: 1em;
  -o-border-radius: 1em;
  border-radius: 1em;
  display: none;
  padding: 6px 12px;
  border-top: none;
  -webkit-animation: fadeEffect 1s;
  animation: fadeEffect 1s;
}
.hostplan button.add-to-cart, button.buydom {
  background-color: rgba(176, 229, 211, 1);
  font-size: 1em;
  -webkit-border-radius: .5em;
  border-radius: .5em;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 1em 2em;
  margin: .5em;
}
button.add-to-cart:hover, button.buydom:hover {
  background-color: rgba(186, 239, 221, 1);
}
.hostplan button.upgrade {
  -webkit-border-top-left-radius: 30em;
  -webkit-border-bottom-right-radius: 30em;
  -webkit-border-top-right-radius: 2em;
  -webkit-border-bottom-left-radius: 2em;
  border-top-left-radius: 30em;
  border-bottom-right-radius: 30em;
  border-top-right-radius: 2em;
  border-bottom-left-radius: 2em;
  float: right;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 3em 4em;
}
button.upgrade:hover {
  background-color: rgba(186, 239, 221, 1);
}
div.tab {
  position:absolute;
  left:0vw;
  height: 6em;
  top: 30vh;
  z-index:7;
  width: 100%;
  overflow: hidden;
  background: rgba(186, 239, 221, 0.9);
}
div.tab button {
  -webkit-border-radius: .2em;
  border-radius: .2em;
  border: 1px solid #aaa;
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 2em 3em;
  transition: 0.3s;
}
div.tab button:hover {
  background-color: #ccc;
  color:#000;
}
div.tab button.active {
  background-color: #aaa;
  color:#000;
}
@-webkit-keyframes fadeEffect {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeEffect {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fullscreen-bg {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  z-index: -100;
}
.fullscreen-bg__video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media (min-aspect-ratio: 16/9) {
  .fullscreen-bg__video {
    height: 300%;
    top: -100%;
  }
}
@media (max-aspect-ratio: 16/9) {
  .fullscreen-bg__video {
    width: 300%;
    left: -100%;
  }
}
@media (max-width: 767px) {
  .fullscreen-bg {
    background: url('../img/videoframe.jpg') center center / cover no-repeat;
  }
  .fullscreen-bg__video {
    display: none;
  }
}