.html, body, p, a, div, ul, li, h1, h2, h3 { 
margin: 0;
padding: 0;
}
body {
color: #666;
font-family: Open Sans,Arial,sans-serif;
}
* {
box-sizing: border-box;
}
a {
color: #2ea3f2;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
img {
height: auto;
}
input[type="text"], input[type="password"], input[type="date"], input[type="number"],
input[type="datetime-local"], input[type="email"], input[type="tel"], select, textarea {
width: 100%;
}
select {
background-color: white;
border: 1px solid #bbb;
padding: 2px;
}
textarea {
height: 100%;
}
input[type="text"]:read-only, input[type="text"]:disabled, textarea:read-only {
color: #666;
background-color: #EFEFEF;
}
input[type="text"]:-moz-read-only, textarea:-moz-read-only { /* For Firefox */
    color: #666;
background-color: #EFEFEF;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.page {
overflow-x: scroll;
scrollbar-width: none;
}
.page::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}
.datatable {
width: 100%;
max-width: 700px;
margin: auto;
table-layout: fixed;
}
.datatable tr td {
border: 2px solid #999;
padding: 2px;
text-align: center;
vertical-align: middle;
overflow: hidden;
}
.datatable tr:first-child, .header {
background-color: #EEE;
font-weight: bold;
text-align: center !important;
text-transform: uppercase;
height: 28px;
}
.datatable .left {
text-align: left !important;
padding: 5px !important;
}
.datatable .right {
text-align: right;
padding: 5px;
}
.notop tr:first-child td {
border-top: 0;
}
.nobottom tr:last-child td {
border-bottom: 0;
}
.entrytable {
width: 100%;
max-width: 400px;
margin: auto;
table-layout: fixed;
font-size: 11pt;
}
@media (max-width:600px) {
.datatable, .entrytable {
width: 98%;
}
}
.entrytable tr {
border: 2px solid #999;
}
.entrytable tr td {
padding: 3px !important;
text-align: left;
vertical-align: middle;
overflow: hidden;
}
.entrytable .center {
text-align: center;
}
.button {
width: 180px;
padding: 10px;
margin-top: 20px;
font-size: 18px;
box-sizing: border-box;
border: 1px solid #E0E2E3;
border-radius: 4px;
outline-offset: -2px;
display: inline-block;
-moz-appearance: none !important;
color: #FFF;
background-color: #7272ff;
cursor: pointer;
}
.cancel.button {
    background-color: darkorange !important;
    margin-right: 20px !important;
}
.small.button {
width: inherit;
padding: 0px 8px;
margin-top: inherit;
font-size: 11pt;
}
@media (max-width:400px) {
.button {
width: 150px;
}
}
.req {
color: #F00;
font-size: 12pt;
}
.no-over {
white-space: nowrap;
overflow: hidden;
}
.nohead tr:first-child {
background-color: transparent;
}
.nohead tr td {
font-weight: normal;
text-transform: none;
border-top: inherit;
}
.saved {
text-align: center;
padding-top: 10px; 
font-size: 18pt; 
color: red;
}
.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Old versions of Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
  supported by Chrome, Edge, Opera and Firefox */
}
:not(form) :invalid {
    outline: 2px solid red;
}
.scrollover1 {
overflow-x: scroll;
text-align: center;
scrollbar-width: none;
-webkit-overflow-scrolling: touch;
}
.scrollover2 {
display: inline-block; 
}
.scroll {
min-height: 200px;
overflow-x: hidden;
overflow-y: scroll;
border-bottom: 2px dashed;
-webkit-overflow-scrolling: touch;
scrollbar-width: none;
}

.fa-trash, .fa-print { color: red; }


/* NAVBAR */
.nav {
width: 100%;
height: 70px;
top: 0;
line-height: normal;
font-weight: 600;
background-color: white;
box-shadow: 0 1px 0 rgba(0,0,0,.1);
-moz-box-shadow: 0 1px 0 rgba(0,0,0,.1);
-webkit-box-shadow: 0 1px 0 rgba(0,0,0,.1);
transition: all .4s ease-in-out;
}
.nav .navctr {
position: relative;
width: 100%;
max-width: 100%;
padding: 0 30px;
height: 100%;
margin: auto;
}
.nav .logo {
display: inline-block;
height: 100%;
}
.nav img {
width: auto;
height: 100%;
padding: 8px 0px;
}
.nav .links {
display: inline-block;
float: right;
height: 100%;
padding-top: 26px;
transition: all .4s ease-in-out;
}
.nav .links > ul {
display: flex;
flex-wrap: wrap;
justify-content: center;
list-style: none;
height: 100%;
}
.nav .links > ul > li {
display: block;
position: relative;
float: left;
cursor: pointer;
list-style: none;
padding-left: 19px;
}
.nav .links > ul > li > a {
padding-bottom: 22px;
color: rgba(0,0,0,.6);
text-decoration: none;
display: block;
position: relative;
transition: all .4s ease-in-out;
}
/* SHRINK FIXED NAV */
.nav.fixed {
height: 44px;
position: fixed;
z-index: 9;
}
.nav.fixed img {
padding: 2px 0px;
}
.nav.fixed .links {
padding-top: 12px;
}
.nav.fixed .links > ul > li > a {
padding-bottom: 13px;
}
.nav .links a:hover {
opacity: 0.7;
}
.nav .submenu > a::after {
padding-left: 3px;
font-size: 8pt;
font-family: "Font Awesome 6 Free"; 
font-weight: 900;
content: "\f107";
}
.nav .submenu:hover > a::after {
 content: "\f106";
}
.nav .submenu ul {
position: absolute;
z-index: 9;
width: auto;
background: #fff;
visibility: hidden;
opacity: 0;
border-top: 3px solid #2ea3f2;
box-shadow: 0 2px 5px rgba(0,0,0,.1);
-moz-box-shadow: 0 2px 5px rgba(0,0,0,.1);
-webkit-box-shadow: 0 2px 5px rgba(0,0,0,.1);
-webkit-transform: translateZ(0);
text-align: left;
}
.nav li:hover ul {
visibility: visible;
opacity: 1;
}
.nav .submenu li {
display: inline-block;
position: relative;
line-height: 2em;
word-wrap: break-word;
}
.nav .submenu li a {
display: block;
position: relative;
width: 200px;
padding: 6px 20px;
color: rgba(0,0,0,.6);
text-decoration: none;
transition: all .4s ease-in-out;
}
.nav .submenu li:hover, .mobilenavopen li:hover {
background-color: #f7f7f7;
}
.mobilenav {
display: none;
font-size: 16pt;
color: #2ea3f2;
cursor: pointer;
}
.mobilenavopen {
display: block !important;
}

/* HOME */
.homewelcome {
position: relative;
display: block;
}
.homebg1 {
display: block;
width: 100%;
height: 750px;
position: absolute;
top: 0;
background-image: url("/images/home-servers.jpg");
background-repeat: no-repeat;
background-position: top;
background-size: cover;
}
.hometext1 {
position: relative;
padding: 10vw 0;
text-align: center;
background-image: linear-gradient(140deg,rgba(0,72,114,0.9) 0%,rgba(41,17,96,0.8) 100%);
background-color: rgba(0,0,0,0);
background-position: 50%;
background-size: cover;
font-family: 'Share Tech',Helvetica,Arial,Lucida,sans-serif;
font-size: 80px;
letter-spacing: 1px;
line-height: 1.2em;
color: white;
font-weight: 500;
}
@media (max-width:500px) {
.hometitle1 {
font-size: 45px;
line-height: 1em;
}
}
@media (max-width:700px) {
.hometitle2 {
font-size: 32px !important;
line-height: 1em;
}
.homecell {
width: 80% !important;
}
}
.homeservices {
display: block;
position: relative;
padding-top: 55px;
text-align: center;
font-family: 'Share Tech',Helvetica,Arial,Lucida,sans-serif;
font-size: 28px;
font-weight: 500;
line-height: 1.4em;
background-color: white;
}
.homeservice {
display: inline-block;
width: 29%;
margin-right: 5%;
border: 1px solid #333;
padding: 30px 20px;
vertical-align: top;
transition: all .8s ease-in-out;
opacity: 0;
transform: perspective(2000px) rotateY(-45deg);
}
.homeservice > div:first-child {
padding-bottom: 15px;
}
.homeservice > div:nth-child(2) {
font-size: 24px;
line-height: 1.2em;
padding-bottom: 10px;
}
.homeservice > div:last-child {
font-size: 16px;
line-height: 1.8em;
text-align: left;
}

.homeconnected {
position: relative;
margin-top: 40px;
margin-right: 5%;
border-radius: 0 26vw 26vw 0;
overflow: hidden;
}
.homeconnbg {
display: block;
width: 100%;
height: 750px;
position: absolute;
top: 0;
background-image: url("/images/home-mem.jpg");
background-repeat: no-repeat;
background-position: top;
background-size: cover;
}
.homeconntext {
position: relative;
padding: 10vw 0;
text-align: center;
background-image: linear-gradient(140deg,rgba(0,72,114,0.9) 0%,#291160 100%);
background-color: rgba(0,0,0,0);
background-position: 50%;
background-size: cover;
font-family: 'Share Tech',Helvetica,Arial,Lucida,sans-serif;
font-size: 80px;
letter-spacing: 1px;
line-height: 1.2em;
color: white;
font-weight: 500;
}

.homeapproach {
position: relative;
margin-top: 40px;
}
.homeapproachpic {
padding-top: 100px;
padding-left: 2%;
}
@media (max-width:700px) {
.homeapproachpic {
padding-top: 10px;
}
}
.homecontact {
position: relative;
margin-top: 40px;
padding: 54px 0;
text-align: center;
background-image: linear-gradient(140deg,#004872 0%,rgba(41,17,96,0.8) 100%), url(images/home-display.jpg);
background-color: rgba(0,0,0,0);
background-position: 50%;
background-size: cover;
font-family: 'Share Tech',Helvetica,Arial,Lucida,sans-serif;
font-size: 80px;
letter-spacing: 1px;
line-height: 1.2em;
color: white;
font-weight: 500;
}
.homecontactform > div {
width: 49%;
float: left;
padding-bottom: 3%;
padding-left: 3%;
line-height: 1em;
font-size: 14px;
font-family: 'Open Sans',Helvetica,Arial,Lucida,sans-serif;
font-weight: 700;
letter-spacing: 2px;
}
@media (max-width:600px) {
.homecontactform > div {
width: 100%;
}
}
.homecontactform input, .homecontact textarea {
padding: 14px;
color: white;
background: transparent;
    border: none;
border-radius: 0;
border-bottom-width: 2px;
border-bottom-style: solid;
    border-bottom-color: #ffffff;
font-size: 14px;
font-family: 'Open Sans',Helvetica,Arial,Lucida,sans-serif;
font-weight: 700;
letter-spacing: 2px;
}
.homecontactform textarea {
display: block;
min-height: 150px;
}
.homecontactform input:focus, .homecontact textarea:focus {
outline: 0;
appearance: none;
}
.homecontactform input::placeholder, .homecontact textarea::placeholder {
color: white;
font-family: 'Open Sans',Helvetica,Arial,Lucida,sans-serif;
font-weight: 700;
letter-spacing: 2px;
opacity: 1;
}
.homebutton {
display: inline-block;
padding: 20px 20px;
cursor: pointer;
color: white;
border: 0;
border-radius: 100px;
letter-spacing: 5px;
font-size: 15px;
font-family: 'Open Sans',Helvetica,Arial,Lucida,sans-serif;
font-weight: 700;
background-color: #ffa727;

}

.homerow {
width: 80%;
max-width: 1080px;
margin: auto;
}
.homecell {
display: inline-block; 
width: 48%; 
vertical-align: top;
}

/* MOBILE */
@media (max-width:900px) {
.nav .navctr {
width: 80%;
max-width: 1080px;
padding: 0;
}
.mobilenav {
display: block;
padding-bottom: 16px;
}
.nav .links > ul {
display: none;
position: absolute;
height: auto;
left: 0;
background: #fff;
width: 100%;
z-index: 9;
border-top: 3px solid #2ea3f2;
box-shadow: 0 2px 5px rgba(0,0,0,.1);
}
.nav .links > ul > li {
width: 100%;
padding-left: 0;
}
.nav .links > ul > li > a {
padding: 10px 5%;
line-height: 23px;
}
.nav .submenu > a {
background-color: #f7f7f7;
border-bottom: 1px solid rgba(0,0,0,.03);
}
.nav .submenu > a::after {
display: none;
}
.nav .submenu ul {
visibility: visible;
opacity: 1;
position: initial;
padding: 0;
border-top: inherit;
box-shadow: inherit;
-moz-box-shadow: inherit;
-webkit-box-shadow: inherit;
-webkit-transform: inherit;
}
.nav .submenu ul li {
width: 100%;
padding-left: 5%;
}
.nav .submenu ul li a {
width: 100%;
}

.homeservice {
width: 100%;
margin-right: 0;
margin-bottom: 20px;
}
.homeservicerow {
max-width: 300px;
margin: auto;
padding-top: 0 !important;
}
}