@font-face {
    font-family: 'open_sansregular';
    src: url('OpenSans-Regular-webfont.eot');
    src: url('OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Regular-webfont.woff') format('woff'),
         url('OpenSans-Regular-webfont.ttf') format('truetype'),
         url('OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sanslight';
    src: url('OpenSans-Light-webfont.eot');
    src: url('OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Light-webfont.woff') format('woff'),
         url('OpenSans-Light-webfont.ttf') format('truetype'),
         url('OpenSans-Light-webfont.svg#open_sanslight') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'open_sanssemibold';
    src: url('OpenSans-Semibold-webfont.eot');
    src: url('OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('OpenSans-Semibold-webfont.woff') format('woff'),
         url('OpenSans-Semibold-webfont.ttf') format('truetype'),
         url('OpenSans-Semibold-webfont.svg#open_sanssemibold') format('svg');
    font-weight: normal;
    font-style: normal;

}


html, body, div, span, applet, object,
iframe, h2, h3, h4, h5, h6, blockquote,
pre, a, abbr, acronym, address, big, cite,
code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b,
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
font-family: 'open_sanslight';
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
background: linear-gradient(90deg, #fdfcfb, #ffffff, #fdfcfb);
}

#header.website-hosting video
Specificity: (1,1,1)
 {
    text-align: center;
    position: relative;
    background-color: #000000;
    background-size: cover;
    padding: 0;
    margin: 0em 0 0 0;
    opacity: 1;
    width: 100%;
    z-index: 0;
}
body, select {
    font-family: 'open_sanslight';
    font-weight: 300;
    line-height: 1.65em;
}
#header.website-hosting
Specificity: (1,1,0)
 {
    position: relative;
    background: none;
    background-color: rgba(0, 0, 0, 1);
    margin: 0;
}
#header.website-hosting video
Specificity: (1,1,1)
 {
    text-align: center;
    position: relative;
    background-color: #000000;
    background-size: cover;
    padding: 0;
    margin: 0em 0 0 0;
    opacity: 1;
    width: 100%;
    z-index: 0;
}
.skip2 {
position: absolute;
color: #ffffff;
left: -10000px;
top: auto;
width: 1px;
height: 1px;
overflow: hidden;
}
.skip2:focus {
color:#ffffff !important;
background-image: none;
outline: 3px dotted #a307fc;
background: #d004fc !important;
position: static;
width: auto;
height: auto;
}
.website .container {
padding: 3em 0 0 0;
margin-right: auto;
margin-left: auto;
max-width: 75em;
width: 100%;
}
#header.website-hosting  {
text-align: center;
position:relative;
background:none;
margin: 0;
}
#header > .container-hosting {
position: absolute;
top: 8%;
right: 5%;			
padding:  0;
margin: 0;
height: 125px;
width: 370px;
z-index: 1;
}
#header.website-hosting img {
display: block;
width: 100%;
}
@keyframes fadeIn { from { opacity: 0;}
}
 h1 {
position: relative;
text-align: right;
font-size: 2.5em;
color:  rgba(0, 0, 0, 1);
font-weight: 300;					
letter-spacing: 0px;
text-transform: uppercase;
line-height: 1.15em;
padding: 0;
margin: 0;
z-index: 1;
animation: fadeIn 6s;
}
#header h2 {
position: relative;
text-align: right;
font-family: "Source Sans 3", sans-serif;
font-size: 1.25em;
color:  rgba(0, 0, 0, 1);
font-weight: 300;					
letter-spacing: 0px;
text-transform: uppercase;
line-height: 1em;
padding: 0 0 0 0;
margin: 0;
z-index: 1;
}
#header p {
position: relative;
text-align: right;
font-size: 1em;
color:  rgba(0, 0, 0, 1);
font-weight: 700;					
letter-spacing: 0px;
text-transform: uppercase;
line-height: 1.5em;
padding: 0;
margin: 0;
z-index: 1;
}
.myWebsite {
position: relative;
display: block;
background: #5e7ca8;
padding: 0 0 15em 0;
min-height: 100px;
width: 100%;
}
.vidbox {
display: block;
position: absolute;
border-radius: 1em;
box-shadow: 0px 8px 25px rgba(0, 0, 0, .2);
left: 8%;
bottom: 0;
padding:0;
margin:  0;
height: 416px;
width: 600px;
max-width:100%;
z-index: 1;
}
.myWebsite video {
display: block;
position: relative;
border-radius:1em;
box-shadow: 8px 8px 30px rgba(0, 0, 0, .1);
padding:0;
margin: 0 0 0 0;
height: auto;
width: 100%;
max-width:100%;
z-index: 1;
}
img#stand {
display: block;
position: relative;
padding:0;
margin-right: auto;
margin-left: auto;
height: auto;
width: 170px;
max-width:100%;
z-index: 1;
}
#main.website {
position: relative;
padding: 0 2em 9em 2em;
margin: 0; 
}
#main h2 {
font-family: 'open_sanssemibold';
position: absolute;
right: 3em;
font-size: 4.5em;
color: #ffffff;
font-weight: 400;
padding: 0 0 0 0;
margin-top: -1.75em;
}
#main h3 {
text-align: center;
position: relative;
font-size: 3em;
color: rgba(0, 0, 0, 1);
font-weight: 400;
padding: 2em 0 1em 0;
line-height: 1.35em;
margin-left: auto;
margin-right: auto;
max-width: 18em;
}
.whatwedo {
text-align: center;
position: relative;
font-size: 2em;
color: rgba(0, 0, 0, 1);
font-weight: 400;
padding: 1em 0 2em 0;
line-height: 1.35em;
margin-left: auto;
margin-right: auto;
max-width: 28em;
}
#main p {
text-align: justify;
position: relative;
font-size: .85em;
color: rgba(0, 0, 0, 1);
line-height: 1.65em;
padding: 0 0 1em 0;
margin-left: auto;
margin-right: auto;
margin-bottom: 0;
margin-top: 0;
width: 100%;
}
.hosting-comes-with {
text-align: center;
display: block;
border-radius: 6px;
background: rgba(210, 217, 227, .2);
border-bottom: solid 5px #8caede;
border-top: solid 5px #8caede;
padding: 1em 0 2em 0;
margin-bottom: 2em;
margin-top: 1em;
width: 75em;
max-width: 100%;
}
.hosting-comes-with h4 {
text-align: center;
position: relative;
font-size: 1.5em;
color: #000000;
font-weight: 600;
text-transform: uppercase;
padding: 1em 0 .5em 0;
}
ul {

}
.hosting-comes-with li {
text-align: center;
display: inline-block;
font-size: 1.25em;
color: rgba(0, 0, 0, 1);
font-weight: 500;
padding: 0;
width: 11em;
max-width: 100%;
}
.hosting-comes-with li.vg {
text-align: center;
display: inline-block;
font-size: 1.25em;
color: rgba(0, 0, 0, 1);
font-weight: 500;
padding: 0;
width: 15em;
max-width: 100%;
}
.hosting-comes-with li.lg {
text-align: center;
display: inline-block;
font-size: 1.25em;
color: rgba(0, 0, 0, 1);
font-weight: 500;
padding: 0;
width: 9em;
max-width: 100%;
}
.hosting-comes-with li.sm {
text-align: center;
display: inline-block;
font-size: 1.25em;
color: rgba(0, 0, 0, 1);
font-weight: 500;
padding: 0;
width: 7.5em;
max-width: 100%;
}
.hosting-comes-with li:before {
content: '.';
font-size: 3em;  
color: #96a6ba;
margin-right: .1em;
vertical-align: .05em;
}
.featuredhostingplans {
position: relative;
text-align: center;
display: block;
padding: 0;
margin-top: 0em;
margin-bottom: 0em;
margin-right: auto;
margin-left: auto;
width: 100%;
z-index: 2;
}
.button-hosting-plans {
text-align:center; 
text-transform: uppercase;
display:block; 
font-size: 1em; 
color: rgba(255, 255, 255, 1) !important; 
box-shadow: inset 0px 0px 20px 5px rgba(255, 255, 255, 0);
border: 1px solid rgba(255, 255, 255, .5); 
border-radius: 2em;
background: #000000;
line-height: 1em;
cursor:pointer; 
padding: .65em 0 .5em 0;
margin-bottom: 0;
margin-top: 1em;
margin-right:auto; 
margin-left:auto; 
height: 2.35em;
max-width: 100%;
width: 185px;
}
.button-hosting-plans b {
margin-right: .1em;
margin-left: .1em;
}
.button-hosting-plans:visited  {
background: #000000;
}
.button-hosting-plans:hover  {
background: #3b4342;
border: 1px solid rgba(255, 255, 255, .5); 
}
.button-hosting-plans:active  {
background: #000000;
}
.button-hosting-plans:focus {
color:#ffffff !important;
background: none;
outline: 3px dotted #a307fc;
background: #d004fc !important;
border: 0px;
box-shadow: none; 
}
.button-hosting-plans:before, .button-hosting-plans:before {
content: url(''); 
font-size: 1em; 
color: rgba(255, 255, 255, .65);  
margin-right: 0; 
vertical-align: middle; 
}
.website-development {
display:block;
padding:0;
margin-top:0em;
margin-right:auto;
margin-left:auto;
width:100%;
}
.hosting-websites {
display: inline-block;
padding:1em 0em 1em 1em;
margin-right:.25em;
margin-left:.25em;
width:calc(33% - 1em);
}
.website-designers {
display:inline-block;
text-align: center;
padding:1em 1em 1em 0em;
margin-right:.25em;
margin-left:.25em;
width:calc(33% - 1em);
}
 .hosting-websites  {
text-align:left;
}
.website-designers  {
text-align:right;
}
.hosting-websites a, .website-designers a  {
font-size:1.25em;
}
.hosting-websites a {
display:block;
transition: color 0.25s ease-in-out, 
border-bottom-color 0.25s ease-in-out;
font-size:1.15em;
color:rgba(0, 0, 0, 1);
border-bottom: 1px dotted  rgba(0, 0, 0, 1);
text-decoration:none;    
line-height:1.75em;
font-weight: bold;
}
.hosting-websites a:visited {
color:rgba(0, 0, 0, 1);
text-decoration:none;    
}
.hosting-websites a:hover {
color: rgba(0, 0, 0, 1) !important;
border-bottom:1px dotted  rgba(0, 0, 0, 0);
text-decoration:none;    
}
.hosting-websites a:active {
color:rgba(0, 0, 0, 1);
text-decoration:none;    
}
.hosting-websites a:focus {
color:#ffffff !important;
background: none;
outline: 3px dotted #a307fc;
background: #d004fc !important;
}
.website-designers a {
display:block;
transition: color 0.25s ease-in-out, 
border-bottom-color 0.25s ease-in-out;
font-size:1.15em;
color:rgba(0, 0, 0, 1);
border-bottom: 1px dotted  rgba(0, 0, 0, 1);
text-decoration:none;    
line-height:1.75em;
font-weight: bold;
}
.website-designers a:visited {
color:rgba(0, 0, 0, 1);
text-decoration:none;    
}
.website-designers a:hover {
color: rgba(0, 0, 0, 1) !important;
border-bottom:1px dotted  rgba(0, 0, 0, 0);
text-decoration:none;    
}
.website-designers a:active {
color:rgba(0, 0, 0, 1);
text-decoration:none;    
}
.website-designers a:focus {
color:#ffffff !important;
background: none;
outline: 3px dotted #a307fc;
background: #d004fc !important;
}

.myhostingplans {
text-align: center;
display: block;
padding: 0;
margin-top: 6em;
margin-right: auto;
margin-left: auto;
width: 100%;
}
#host {
position:relative;
text-align:center;
font-size: 2em;
color: #000000;
font-weight: 400;
line-height: 1.15em;
text-transform:capitalize;
margin: 4em 0 1em 0;
clear: both;
}
#main .hostingPlan {
position: relative;
text-align: center;
display: block;
margin-right: auto;
margin-left: auto;
height: 5em;
width: 460px;
max-width: 100%;
}
#main #left a, #main #right a {
display: inline-block;
position: relative;
text-align: center;
font-size:1em;
color: rgba(255, 255, 255, 1);
font-weight: 600;
background: rgba(64, 88, 125, 1);
text-decoration: none;
cursor: pointer;
text-transform: capitalize;
border-radius: 8px;
padding: .5em 1em;
}
#left {
display: inline-block;
float: left;
}
#right {
display: inline-block;
float: right;
}
#main .hostingPlan a:visited {
background: rgba(64, 88, 125, 1);
}
#main .hostingPlan #right a:hover, #main .hostingPlan #left a:hover {
transition: all 0.25s ease-in-out;
background: rgba(85, 117, 165, 1);
margin-top: -1em;
}
#main .hostingPlan a:active {
background: rgba(64, 88, 125, 1);
}
.website p {
text-align: justify;
position:relative;
font-size: 1.15em;
color: #000000;
font-weight: 400;
line-height: 1.5em;
margin: 0;
width: 100%;
}
.hostingone {
margin-right: 1.1em;
margin-bottom: 4em;
float: left;
width: calc(33.33% - .75em);
}
.hostingtwo {
float: inline-start;
width: calc(33.33% - .75em);
}
.hostingthree {
float: right;
width: calc(33.33% - .75em);
}
.hostingone img,  .hostingtwo img,  .hostingthree img {
display: block;
border-top-right-radius: 6px;
border-top-left-radius: 6px;
border-bottom-right-radius: 0px;
border-bottom-right-radius: 0px;
padding: 0;
margin: 1em 0 0 0;
width: 100%;
}

.website .hostingone p, .website .hostingtwo p, .website .hostingthree p {
font-size: .85em;
}
.button-free, .button-emailboxes, .button-maintenance, 
.button-ssl, .button-security, .button-backups  {
transition: all 0.5s ease-in-out;
text-align:center; 
display: inline-block; 
font-size:1em; 
color: rgba(0, 0, 0, 1);
background: rgba(255, 255, 255, 1);
box-shadow:inset 0px -3px 10px 0px rgba(0, 0, 0, .1); 
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-top-right-radius: 0px;
border-top-left-radius: 0px;
border: 0px;
line-height:1.75em;
cursor:pointer; 
padding:.5em 0 .35em 0; 
margin-top: 0;
margin-bottom: .5em;
margin-right: auto; 
margin-left: auto; 
width: calc(100% - 0em);
}
.button-terms  {
transition: all 0.5s ease-in-out;
text-align: center; 
display: block; 
font-size:1.15em; 
color: rgba(0, 0, 0, 1);
background: rgba(255, 255, 255, 1);
box-shadow: inset 0px 0px 15px 1px rgba(0, 0, 0, .15);
    border-radius: .5em;
border: 0px;
line-height:1.25em;
cursor:pointer; 
padding:.5em 0 .35em 0; 
margin-top: 0;
margin-bottom: .5em;
margin-right: auto; 
margin-left: auto; 
width: 220px;
}
.button-ssl:hover, .button-free:hover, .button-security:hover, .button-emailboxes:hover, 
.button-backups:hover, .button-maintenance:hover, .button-terms:hover {
transition: all .5s ease-in-out;
color: rgba(255, 255, 255, 1);
background: rgba(113, 152, 208, 1);
border: 0px;
}
.button-ssl:before, .button-free:before, .button-security:before, .button-emailboxes:before, 
.button-backups:before, .button-maintenance:before, .button-terms:before {
content: url('retailArrow.png'); 
margin-right: 0.5em; 
vertical-align: middle; 
}
.button-ssl:hover::after, .button-free:hover::after, .button-security:hover::after, .button-emailboxes:hover::after, 
.button-backups:hover::after, .button-maintenance:hover::after
.button-Support:hover::after, .button-terms::after {
content: url('retailArrow2.png');
}
.ssl,  .security, .backups, .free, .emailboxes, .maintenance,  .terms {
text-align:center; 
display:none;
}
.plan1 h2 {
display:inline-block;
text-transform: uppercase;
font-size:1.5em;
color: #e0ecd0;
font-weight:600;
letter-spacing:0px;
transform: scale(1, .85);
padding:0 0 0 0;
margin-right:.5em;
margin-left:.5em;
margin-bottom: 1em;
margin-top:0;
}
.terms {
padding: 0;
margin-top: 1em;
margin-bottom: 1em;
}
#main .terms p {
position: relative;
text-align: justify;
font-size: .85em;
color: #000000;
padding: .5em 0;
margin: 0;
}
/* Nav */
input[type="button"], input[type="submit"], input[type="reset"],
button.sample, .button.sample {
transition: all 0.25s ease-in-out;
-webkit-appearance: none;
text-align: center;
position: relative;
display: inline-block;
font-size: 1em;
color: #ffffff !important;
font-weight: 400;
background: linear-gradient(90deg, #3b4342, #55605f, #3b4342);
text-transform: capitalize;
border-top-right-radius: 20%;
border-top-left-radius: 20%;
border-bottom-right-radius: 20%;
border-bottom-left-radius: 20%;
border-bottom: 4px solid #d5d5d5;
border-top: 4px solid #d5d5d5;
border-right: 0px;
border-left: 0px;
cursor:pointer;
box-shadow: inset 0 0 10px 3px rgba(0, 0, 0, 0.10);
line-height: 2em;
letter-spacing: 0px;
text-decoration:none;
padding: 0em 0em 0em 0em;
margin-bottom: 4em;
width: 200px;
}
input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover,
button.sample:hover,
.button.sample:hover {
color: rgba(0, 0, 0, 1) !important;
border-bottom: 3px solid #d5d5d5;
border-top: 4px solid #d5d5d5;
background: linear-gradient(90deg, #faf8f5, #fdfcfb, #faf8f5);
box-shadow: inset 0 0 5px 3px rgba(0, 0, 0, 0.025);
}
input[type="button"]:active, input[type="submit"]:active, input[type="reset"]:active,
button.sample:active,
.button.sample:active {
background: #67c69b;
}
input[type="button"]:focus, input[type="submit"]:focus, input[type="reset"]:focus,
button.sample:focus,
.button.sample:focus {
color:#ffffff !important;
background: none;
outline: 3px dotted #a307fc;
background: #d004fc !important;
}
.sampleSites {
position: relative;
display: table;
margin-top: 1em;
margin-bottom: 3em;
height: auto;
width: 100%;
}
img#casa {
position: relative;
display: inline-block;
border-radius: .5em;
box-shadow: 0px 8px 16px rgba(0, 0, 0, .2);
margin-right: 1.35em;
float: left;
width: calc(25% - 1em);
}
img#bartonis {
position: relative;
display: inline-block;
border-radius: .5em;
box-shadow: 0px 8px 20px rgba(0, 0, 0, .2);
margin-right: 1.35em;
width: calc(25% - 1em);
}
img#natures {
position: relative;
display: inline-block;
border-radius: .5em;
box-shadow: 0px 8px 20px rgba(0, 0, 0, .2);
margin-right: 1.25em;
width: calc(25% - 1em);
}
img#apex {
position: relative;
display: inline-block;
border-radius: .25em;
box-shadow: 0px 8px 20px rgba(0, 0, 0, .2);
float: right;
width: calc(25% - 1em);
}
.featured-restaurants {
    text-align: center;
    display: none;
    background-color: rgba(0, 0, 0, 0);
    margin-top: 0;
    margin-bottom: 1em;
    margin-right: auto;
    margin-left: auto;
    max-width: 1400px;
}
.featured-sites {
text-align: center;
display: none;
background-color: rgba(0, 0, 0, 0);
margin-top: 0;
margin-bottom: 1em;
margin-right: auto;
margin-left: auto;
max-width: 1400px;
}
.hosting-websites a, .website-designers a  {
font-size:1em;
}
#siteposter {
display: block;
text-align: center;
background: rgba(140, 174, 222, .2);
padding: 5em 1em 7em 1em;
margin: 0;
width: 100%;
}
#siteposter .container {
margin-right: auto;
margin-left: auto;
max-width: 76em;
width: 100%;
}
img#poster {
display: inline;
max-width: 80px;
margin-right: .25em;
vertical-align: sub;
}
#siteposter p {
text-align: justify;
font-size: 1em;
color: #3b4342;
font-weight: 400;
    line-height: 1.5em;
    margin-bottom: 1em;
}
#siteposter h2 {
display: inline-block;
font-family: "Source Sans 3", sans-serif;
font-size: 6em;
color: #3b4342;
font-weight: 400;
letter-spacing: 0px;
line-height: 1em;
padding: 0 0 0 0;
margin: 0;
max-width: 560px;
}
#siteposter h3 {
font-size: 1em;
color: #000000;
font-weight: 400;
letter-spacing: 2px;
margin: 0 0 3em 0;
}
#host2 {
position:relative;
text-align:center;
font-size: 1.25em;
color: #3b4342;
font-weight: 400;
line-height: 1.15em;
text-transform:capitalize;
margin: 2em 0 1em 0;
clear: both;
}
.plan1 h4 {
display:inline-block;
text-transform: uppercase;
font-size:1.15em;
color: #3b4342;
font-weight:600;
letter-spacing:0px;
transform: scale(1, .85);
padding:0 0 0 0;
margin-right:.5em;
margin-left:.5em;
margin-bottom: 1em;
margin-top:0;
}
.inset-text2 {
/*text-shadow: 0px 0px 0px rgba(255, 255, 255, .5), -5px 0px 4px rgba(0, 0, 0, .35), 0px 0px 0px rgba(255, 255, 255, 1);*/
}

@media screen and (max-width: 2200px) {

.myWebsite {
padding: 0 0 12em 0;
}
.vidbox {
right: 8%;
height: 346px;
width: 500px;
}
img#stand {
width: 170px;
}
#main h2 {
position: absolute;
margin-top: -1.5em;
right: 2.5em;
}
}
@media screen and (max-width: 2000px) {
#main h2 {
margin-top: -1.65em;
right: 2.5em;
font-size: 4em;
}
}
@media screen and (max-width: 1800px) {

.vidbox {
right: 8%;
height: 311px;
width: 450px;
}
img#stand {
width: 155px;
}
#main h2 {
margin-top: -1.8em;
right: 2.5em;
font-size: 3.5em;
}
}
@media screen and (max-width: 1600px) {
#main h2 {
margin-top: -2.15em;
right: 2.5em;
font-size: 3em;
}
}
@media screen and (max-width: 1480px) {

.myWebsite {
padding: 0 0 10em 0;
}
#main h2 {
margin-top: -2em;
right: 1.75em;
font-size: 2.75em;
}
.vidbox {
right: 8%;
height: 277px;
width: 400px;
}
img#stand {
width: 145px;
}
 h1 {
font-size: 2em;
letter-spacing: 0px;
}
}
@media screen and (max-width: 1280px) {

.myWebsite {
padding: 0 0 8em 0;
}
.vidbox {
right: 8%;
margin: -9em 0 0 0;
height: 225px;
width: 325px;
}
img#stand {
width: 130px;
}
#main h2 {
margin-top: -1.85em;
right: 1.75em;
font-size: 2.5em;
}
}
@media screen and (max-width: 1100px) {

#main h2 {
margin-top: -2.25em;
right: 1.75em;
font-size: 2em;
}
}
@media screen and (max-width: 980px) {

 h1 {
font-size: 1.65em;
line-height: 1.15em;
}
#header h2 {
font-size: 1.15em;
line-height: 1em;
}
#header p {
font-size: .85em;
}
.vidbox {
right: 8%;
height: 190px;
width: 275px;
}
.myWebsite video {
border-radius: .5em;
}
img#stand {
width: 115px;
}
#main h2 {
right: 1.75em;
        font-size: 2em;
        line-height: 1.2em;
        text-indent: -1.85em;
        margin-left: auto;
        margin-right: auto;
        margin-top: -3.25em;
        max-width: 275px;
}
#main h3 {
font-size: 1.85em;
}
.whatwedo {
font-size: 1.2em;
}
.hosting-websites, .website-designers {
width:calc(50% - 1em);
}
#header h1#website {
font-size: 4em;
letter-spacing: 0px;
padding: .5em 0 0 0;
}
#siteposter h2 {
font-size: 4.5em;
}
#siteposter h3 {
font-size: .85em;
}
}
@media screen and (max-width: 850px) {

#main h2 {
margin-top: -3.15em;
right: .75em;
line-height: 1.2em;
}
}
@media screen and (max-width: 736px) {

.myWebsite {
padding: 0 0 6em 0;
}
#main h2 {
right: .75em;
font-size: 1.7em;
line-height: 1.2em;
text-indent: -1.25em;
margin-top: -3em;
max-width: 250px;
}
.vidbox {
right: 8%;
height: 139px;
width: 200px;
}
.myWebsite video {
border-radius: .5em;
}
img#stand {
width: 95px;
}
#main h3 {
font-size: 1.5em;
padding: 1em 0em 1em 0em;
}
img#casa {
margin-right: 0;
margin-bottom: 1em;
width: calc(50% - .5em);
}
img#bartonis {
margin-right: 0;
margin-bottom: 1em;
float: right;
width: calc(50% - .5em);
}
img#natures {
margin-right: 0;
width: calc(50% - .5em);
}
img#apex {
width: calc(50% - .5em);
}
.website p.hostingintro, .website p {
font-size: 1em;
line-height: 1.5em;
}
.hostingone {
margin-bottom: 0;
float: none;
width: calc(100% - 0em);
}
.hostingtwo {
float: none;
width: calc(100% - 0em);
}
.hostingthree {
float: none;
width: calc(100% - 0em);
}
.hosting-websites a, .website-designers a  {
text-align: center;
}
#host {
font-size: 2em;
margin: 1em 0 1em 0;
}
#siteposter h2 {
font-size: 3em;
}
img#poster {
max-width: 40px;
}
}
@media screen and (max-width: 640px) {

#main h2 {
right: 1em;
font-size: 1.5em;
line-height: 1.2em;
text-indent: -1.25em;
margin-top: -3.2em;
max-width: 200px;
}
}
@media screen and (max-width: 550px) {

 h1 {
font-size: 1.25em;
}
#header h2 {
font-size: 1em;
}
#header p {
font-size: .8em;
}
#header h2#websites {
font-size: 1.15em;
letter-spacing: 4px;
line-height: 1.25em;
}
#header h1#website {
font-size: 2.5em;
letter-spacing: 0px;
}
.myWebsite {
margin-top: 0;
}
#main h2 {
margin-top: -3.5em;
font-size: 1.25em;
max-width: 175px;
}
#main h3 {
font-size: 1.35em;
padding: 0em 1em 1em 1em;
}
.whatwedo {
font-size: 1.2em;
padding: 1em 1em 2em 1em;
}
.vidbox {
right: 5%;
height: 104px;
width: 150px;
}
.myWebsite video {
border-radius: .25em;
}
img#stand {
width: 75px;
}
#main.website {
padding: 0 1em 6em 1em;
}
#host {
font-size: 1.75em;
margin: 1em 0 1em 0;
}
#main p, #siteposter p {
font-size: .85em;
}
.website-designers {
padding:0em 1em 1em 1em;
margin-right:0em;
margin-left:0em;
width:calc(100% - 1em);
}
.hosting-comes-with h4 {
text-align: center;
position: relative;
font-size: 1.5em;
color: #000000;
font-weight: 600;
text-transform: uppercase;
padding: 1em 1em .5em 1em;
}
.hosting-websites  {
padding:1em 1em 0em 1em;
margin-right:0em;
margin-left:0em;
width:calc(100% - 1em);
}
#main .hostingPlan {
height: 7em;
max-width: 100%;
}
#main #left a, #main #right a {
display: block;
position: relative;
text-align: center;
font-size:1em;
color: rgba(255, 255, 255, 1);
font-weight: 600;
background: rgba(64, 88, 125, 1);
text-decoration: none;
cursor: pointer;
text-transform: capitalize;
border-radius: 8px;
padding: .5em 1em;
width: 100%;
}
#left, #right {
display: block;
margin-bottom: .5em;
float: none;
}
#main .hostingPlan #right a:hover, #main .hostingPlan #left a:hover {
transition: all 0.25s ease-in-out;
background: rgba(85, 117, 165, 1);
margin-top: 0em;
}
}
@media screen and (max-width: 480px) {

h1 {
 font-size: 1em;
}
#header h2 {
font-size: .85em;
}
#header p {
font-size: .7em;
}
.vidbox {
right: 5%;
height: 90px;
width: 130px;
}
img#stand {
width: 50px;
}
#main h2 {
right: .75em;
font-size: 1.35em;
font-weight: 400;
line-height: 1.2em;
text-indent: -1.25em;
margin-top: -3.5em;
max-width: 185px;
}
img#casa {
margin-right: 0;
margin-bottom: 1em;
float: none;
width: 100%;
}
img#bartonis {
margin-right: 0;
margin-bottom: 1em;
float: none;
width: 100%;
}
img#natures {
margin-right: 0;
margin-bottom: 1em;
float: none;
width: 100%;
}
img#apex {
float: none;
width: 100%;
}
}

#footer {
text-align: center;
position: relative;
overflow: hidden;
border-top: solid 0px #e5e5e5;
background: linear-gradient(90deg, #f8f8f8, #ffffff, #f8f8f8);
padding: 6em 0 6em 0;
margin: -1.5em 0 0 0;
}
#footer .container {
    color: #000000;
    padding: 0 1.5em;
    margin-right:auto;
    margin-left:auto;
    max-width: 64em;
}
#footer form input[type="text"],
#footer form input[type="email"],
#footer form input {
transition: background-color 0.25s ease-in-out;
-webkit-appearance: none;
display: block;
font-size: 1em;
color: #ffffff;
font-weight: 600;
background: rgba(0, 0, 0, .5);
border: none;
border-radius: 4px;
line-height: 1.25em;
padding: .5em 1em .5em 1em;
width: 100%;
}
#footer form input::placeholder {
text-align: center;
font-size: .8em;
color: #ffffff;
}
#footer form input[type="text"]:focus,
#footer form input[type="email"]:focus,
#footer form input:focus {
box-shadow:inset 0px 0px 1px 2px rgba(163, 7, 252, .4);
color:#ffffff !important;
background: none;
outline: 3px dotted #a307fc;
background: #d004fc !important;
}
.myservices {
display: block;
margin-right: auto;
margin-left: auto;
padding: 0;
margin-top: 2em;
max-width: 800px;
}
#footer a.button.service {
transition: all 0.25s ease-in-out;
    -webkit-appearance: none;
    text-align: center;
    position: relative;
    display: inline-block;
    font-size: 1em;
    color: rgba(0, 0, 0, .85) !important;
    font-weight: 400;
    background: rgba(255, 255, 255, 1);
    text-transform: capitalize;
    border-radius: 10px;
    border-bottom: 3px solid #dddddd;
    border-top: 3px solid #dddddd;
    border-right: none;
    border-left: none;
    cursor: pointer;
    box-shadow: inset 0 0 10px 3px rgba(0, 0, 0, .1);
    line-height: 2.25em;
    letter-spacing: 0px;
    text-decoration: none;
    padding: 0em 0em 0em 0em;
    margin-bottom: .25em;
    margin-top: 0;
    width: 250px;
}
#footer a.button.service:visited {
font-size: 1em;
}
#footer a.button.service:hover {
font-size: 1em;
color: #000000;
box-shadow: inset 0 0 10px 3px rgba(0, 0, 0, .025);
}
#footer a.button.service:active {
font-size: 1em;
color: #000000;
}
#footer a.button.service:focus {
color:#ffffff !important;
background-image: none;
outline: 3px dotted #a307fc;
background: #d004fc !important;
}
/*#footer form input:focus::placeholder {
color:transparent;
}*/
#footer a {
transition: color 0.25s ease-in-out, border-bottom-color 0.25s ease-in-out;
color: rgba(64, 88, 125, 1);
    font-weight: 600;
    text-decoration: none;
}
#footer a:visited {
color: rgba(64, 88, 125, 1);
    text-decoration: none;
}
#footer a:hover {
transition: color 0.25s ease-in-out, border-bottom-color 0.25s ease-in-out;
text-decoration: none;
color: #6c7f06;
}
#footer a:active {
color: rgba(64, 88, 125, 1);
    text-decoration: none;
}
#footer a:focus { 
color:#ffffff !important;
background: none;
outline: 3px dotted #a307fc;
background: #d004fc !important;
}
#footer h2 {
text-align: center;
color: rgba(0,0,0, 1);
margin: 1em 0 0.75em 0;
}
#footer h3 {
text-align: center;
font-size: 1.25em;
color: rgba(0,0,0, 1);
font-weight: 600;
margin: 1em 0 0 0;
}
#footer .container p {
position: relative;
display: block;
text-align: justify;
font-size: 1em;
color: rgba(0,0,0, 1);
font-weight: 400;
line-height: 1.5em;
}

P#disclaimer {
font-size:.7em;
color: rgba(0,0,0, 1);
font-weight:400;
line-height:1.3em;
}
#footer .container {
color: #000000;
max-width:64em;
}
.form-group {
display:inline-block;
margin: 0 .25em 0 .25em;
width:calc(25% - .7em);
}
.form-single {
display:block;
margin: 0 .05em 1em .05em;
width:calc(25% - .25em);
}
.control-label {
display: block;
position: relative;
text-align:left;
font-size: 1em;
color: rgba(0,0,0, 1);
font-weight: 600;
padding: 0 0 .15em 0;
margin: 0;
}
form input[type="text"]:focus,
form input[type="email"]:focus,
form input[type="password"]:focus,
form select:focus,
form textarea:focus {
box-shadow: inset 0px 0px 1px 4px rgba(0, 0, 0, 0.1);
color:#ffffff !important;
background: none;
outline: 3px dotted #a307fc;
background: #d004fc !important;
}
form textarea {
min-height: 11em;
}
form ::-webkit-input-placeholder {
color: #000000;
line-height: 1.35em;
}
form :-moz-placeholder {
color: #000000;
}
form ::-moz-placeholder {
color: #000000;
}
form :-ms-input-placeholder {
color: #000000;
}
form ::-moz-focus-inner {
border: 0;
}
.button.small {
position:relative;
display:block;
border-right: none;
border-left: none;
margin-left:.15em;
width: 80px;
}
.controls {
padding: 0 0 1em 0;
margin:0;
}
.employment {

}
.employment a {
font-size: 1.25em;
color: #646c57;
font-weight: 600;
}
.employment a:visited {
color: #646c57;
font-weight: 600;
}
.employment a:hover {
color: #a2ae91;
font-weight: 600;
}
.employment a:active {
color: #646c57;
font-weight: 600;
}
#secondGreatestCommandent {
font-size: 1.5em;
font-weight: 500;
padding:0 2em 0 2em;
margin-top: 2em;
}
#secondGreatestCommandent span {
font-size:1.5em;
}
#copyright {
text-align: center;
font-size: 1.5em;
padding: 0em 0 0 0;
width:100%;
}
.address {
font-size: 1em;
padding:.5em 0 0 0;
margin:0;
}
img#YeshuaSymbol {
display:block;
position:relative;
margin-bottom:.5em;
margin-top:1em;
margin-right:auto;
margin-left:auto;
max-width:100px;
width:100%;
}
#navPanel, #titleBar {
display: none;
}
.menu-container { 
display:block; 
position:relative;
padding:0 0 0 0; 
margin-top:0; 
margin-bottom:0; 
margin-right:auto; 
margin-left:auto; 
max-width: 1200px;
}
.modalWindow::-webkit-scrollbar { width: 0px; }
.modalWindow { 
position: fixed; 
display: block; 
text-align:justify; 
box-shadow:none; 
top: 0; 
background: linear-gradient(90deg, #fdfcfb, #ffffff, #fdfcfb);
opacity: 0;
left: 0; 
right: 0; 
padding: 3em 1em 20em 1em;
margin: 0 auto; 
transition: opacity 400ms ease-in; pointer-events: none; 
z-index: 10001;
overflow-y:scroll; 
width: 100%; 
height: 100%;
}

.modalWindow:target { 
opacity: 1; 
pointer-events: auto;
}
.modalWindow .modalHeader { 
padding: 0 0 0 0; 
}
.modalWindow .modalContent { 
padding: 50px 50px 50px 50px; 
}
.closeWindow  { 
text-align:center; 
display: block; 
position: relative; 
text-decoration:none;
padding: 2em 0em 2em 0em; 
line-height: 1em; 
margin: 0 auto; 
width: 200px; 
}
.modalWindow .container {
position: relative;
height: 80vh;
  width: 100vw;
}
object {
position: relative;
display: block;
box-sizing: border-box;
background: transparent;
margin-bottom: 2em;
height: 80vh;
width: 1200px;
max-width: 100%;
z-index: 1;
}
a.samplesites {

}
a.viewSite {
position: relative;
display: block;
color: #ffffff;
background: #000000;
height: 80vh;
width: 1200px;
z-index: 4;
}
a.viewSite:hover::before {
content: 'Click here to navigate to';
color: #ffffff;
background: #000000;
}
a.viewSite:hover::after {
content: ' Casa Tequila website';
color: #ffffff;
background: #000000;
}
.viewSite:focus {
color:#ffffff !important;
background-image: none;
outline: 3px dotted #a307fc;
background: #d004fc !important;
}
@media screen and (max-width: 550px) {

#secondGreatestCommandent {
    font-size: 1.25em;
}
#footer a.button.service {
font-weight: 500;
width: 100%;
}
#footer .container p  {
    font-size: .85em;
}