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

#background {
   position: fixed;
   left: 0em;
   top: 0em;
   right: 0em;
   bottom: 0em;
   z-index: -5;
   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=80);
   -moz-opacity: 80%;
   opacity: 0.8;
   position: absolute;
   left: 1%;
   top: 0.2em;
   z-index: 1;
   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: 2;
   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;
   left: 5em;
   top: 47vh;
   z-index: 4;
   width: 10em;
   content: 'Call Us!';
}

.copyright {
   font-family: Arial;
   font-size: 0.80em;
   color: #ffffff;
   margin-right: 2em;
   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: absolute;
   left: 0vw;
   bottom: -12em;
   z-index: 3;
   display: -webkit-flex;
   display: flex;
   width: 100vw;
   -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: 50vh;
   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%;
}

.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;
}

#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;
}

#footer {
   background-color: #122F6B;
   position: fixed;
   left: 0px;
   bottom: 0px;
   z-index: 3;
   width: 100vw;
   height: 3vh;
   visibility: visible;
}

h1 {
   font-family: Arial;
   font-size: 1.70em;
   color: #0D2054;
   text-shadow: #ffffff 2px 2px 2px;
   position: relative;
   top: -0.5em;
}

h2 {
   font-family: Condiment;
   font-size: 1.30em;
   color: #0D2054;
   text-shadow: #ffffff 2px 2px 2px;
   text-align: center;
}

a:link {
   color: #0a2c6b;
}

a:visited {
   color: #0a2c6b;
   font-weight: bold;
}

a:hover {
   color: #0a2c6b;
   font-weight: normal;
   text-shadow: #00bb00 0px 0px 3px;
}

a:active {
   color: #0a2c6b;
}

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

#top_div {
    background: -webkit-linear-gradient(left, rgba(10,44,107,1), rgba(22,196,179,0)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, rgba(10,44,107,1), rgba(22,196,179,0)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, rgba(10,44,107,1), rgba(22,196,179,0)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, rgba(10,44,107,1), rgba(22,196,179,0)); /* Standard syntax */
}

.sub_level_a_down1 {
position:relative;
  top:1em;
}


/* SDS custom scrollbar effect
::-webkit-scrollbar {
    width: 1em;
}
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(75,168,165,1); 
    -webkit-border-radius: 0em;
    border-radius: 0em;
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: .2em;
    border-radius: .2em;
    background: rgba(100,193,190,.9); 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
::-webkit-scrollbar-thumb:window-inactive {
	background: rgba(150,223,230,.6); 
}
*/

/* 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: 57vh;
	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: 40vh;
    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%;
}