@charset "utf-8";
/* CSS Document */ 

/* Font/Families */
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Akshar:wght@600&family=Anton&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inconsolata:wght@700&family=Rubik&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@900&family=Open+Sans:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Slabo+27px&display=swap');


/*  End */



body {
background-color: #bdd7ee;
	
}



#header {
	width: 425px;
	height: 106px;
	color: white;
	border: solid 0.5px #000;
	margin-top: 10px;
	margin-right: auto;
	margin-left: auto;
	padding-top: -40px;
	padding-bottom: -20px;
	

	
}

#header img {
	box-shadow: 2px 2px 2px black;
}

.footer {
	left: 0;
	bottom: 0;
	width: 100%;
	background: linear-gradient(90deg, rgba(222,255,252,1) 8%, rgba(183,233,247,1) 100%);
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	padding-top: 5px;
	padding-bottom: 5px;
	margin-top: 15px;
	color: darkblue;
	font-weight: bold;
	clear: both;


}

nav {
	border: thick;
	padding-bottom: 5px;
	padding-top: 5px;
	position: fixed;
	text-align: center; 
	
	
}

nav {
	position:relative; 
	top:15px; 
	margin-left:auto; 
	margin-right:auto; 
	margin-bottom: 50px;
	width:780px; 
	height:15px; 
	background: linear-gradient(90deg, rgba(222,255,252,1) 8%, rgba(183,233,247,1) 100%);
	box-shadow: 3px 3px 3px black;
	padding-top: 20px;
	padding-bottom: 20px;

}

nav ul { 
	display:block; 
	list-style-type:none; 
	text-align:center;
}

nav ul li {
	display:inline-block; 
	margin-left:15px; 
	margin-right:15px;

}

nav ul li a {
text-decoration: none;
font-weight: bold;
color: black;
font-family: 'Lato', sans-serif;

}

li a:hover {
	color: darkblue;
}

.featurebox {
	width: 250px;
	height: 350px;
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 10px;
	background-color: #00af50;
	margin-right: auto;
	margin-left: 300px;
	margin-top: 40px;
	margin-bottom: 40px;
	box-shadow: 4px 4px 4px green;
}

.welcome {
	font-family: 'Anton', sans-serif;
	padding-top: 8px;
	padding-bottom: 8px;
	text-align: center;
	color: white;
}

.stylo {
	font-family: 'Akshar', sans-serif;
	color: #fff;
	font-size: 18px;
	font-weight: normal;	
}


.homepg1 img {

margin-left: 450px;
margin-right: 50px;
margin-top: -600px;
margin-bottom: 200px;

	align-content: center;
	
	border: thick black solid;

	
}

.homepg2 img {

margin-left: 450px;
margin-right: 50px;
margin-top: -500px;
margin-bottom: -18px;

	align-content: center;
	
	border: thick black solid;

	
}


h1 {
	font-family: 'Montserrat', sans-serif;
	text-align: center;
	padding-top: 15px;
	text-decoration: none;
	color: #00000;
}



.featureboxabout {
	width: 780px;
	height: 205px;
	background-color: #3b5066;
	margin-right: auto;
	margin-left: auto;
	margin-top: 15px;
	margin-bottom: auto;
	box-shadow: 4px 4px 4px gray;
	border: solid 1px black;
}

.aboutus {
	font-family: 'Anton', sans-serif;
	padding-top: 8px;
	padding-bottom: 8px;
	text-align: center;
	color: white;
	font-size: 30px;

}

.aboutimg img {
	
		margin-top: 10px;
		margin-left: auto;
	margin-right: auto;
		margin-bottom: 15px;
		box-shadow: 2px 2px 2px 2px gray;
		border: thick #3b5066 solid;
	
	

}




.styloaboutus {
font-family: 'Rubik', sans-serif;	
	color: #fff;
	font-size: 18px;
	font-weight: bold;	
	padding-left: 5px;
	padding-right: 5px;
}

table {
	margin-left: 300px;
	margin-right: 300px;
	background-color: #3b5066;
	color: white;
	text-align: center;
	border:1px solid black;
	box-shadow: 5px 5px 5px 5px gray;
	padding-top: 150px;




}

table td {
	border:1px solid black;
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 1px;
	padding-right: 1px;
	text-align: center;
	

}

table th {
	text-align: center;
		border:1px solid black;

	
}

.pricing {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	
	padding-top: 5px;
	padding-bottom: 5px;
	font-style: oblique;
	font-size: 30px;
	color: black;
	font-family: 'Inconsolata', monospace;
	font-family: 'Rubik', sans-serif;
}

.desc
{
	margin-left: auto;
	text-align: center;
	padding-bottom: 4px;
	font-size: 12px;
}


.hours {
	width: 350px;
	height: 170px;
	background-color: #11E832;
	margin-right: 400px;
	margin-left: 780px;
	text-align: right;
	margin-top: 20px;
	margin-bottom: 50px;
	box-shadow: 2px 2px 2px gray;
	border: solid 1px black;
}

 .hours p {
	text-align: center;
	 padding-bottom: 2px;
	 padding-top: 2px;
}

.hours h2 {
	font-size: 25px;
	text-align: center;
	border: thin black;
	background-color: #FFF;
}

.hours h3 {
	text-align: center;
	font-size: 18px;
	border: thin black;
	color: blue;

	
	
}


.contact {
	width: 350px;
	height: 170px;
	background-color: #11E832;
	margin-right: 100px;
	margin-left: 120px;
	margin-top: -221px;
	margin-bottom: 50px;
	box-shadow: 2px 2px 2px gray;
	border: solid 1px black;
	text-align: left;
}

 .contact p {
	text-align: center;
	padding-bottom: 10px;
	padding-top: 10px;

}

.contact h2 {
	font-size: 25px;
	text-align: center;
	border: thin black;
	background-color: #FFF;
}

.contact h3 {
	text-align: center;
	font-size: 18px;
	border: thin black;
	color: blue;

	
	
}

.hardware {
	width: 380px;
	height: 205px;
	background-color: #3CA9EB;
	margin-right: auto;
	margin-left: 246px;
	margin-top: 15px;
	margin-bottom: auto;
	box-shadow: 4px 4px 4px gray;
	border: solid 1px black;
	
}

.hardware p {
	padding-bottom: 10px;
	padding-top: 10px;
	color: black;
	font-size: 15px;
		font-family: 'Lato', sans-serif;


}

.hardware h2  {
	color: black;
	font-weight: bold;
	text-align: center;
	background-color: #fff;
	padding-top: 10px;	
	padding-bottom: 10px;
	font-family: 'Open Sans', sans-serif;

}

.software {
	width: 380px;
	height: 150px;
	background-color: #2FE27B;
	margin-right: auto;
	margin-left: 246px;
	margin-top: -20px;
	margin-bottom: 50px;
	box-shadow: 4px 4px 4px gray;
	border: solid 1px black;
	padding-bottom: 20px;
}

.software p {
	padding-bottom: 15px;
	padding-top: 15px;
	color: darkslategray;
	font-size: 15px;
	font-family: 'Lato', sans-serif;




}


.software h2 {
	color: black;
	font-weight: bold;
	text-align: center;
	background-color: #FFFFFF;
		padding-top: 10px;	
	padding-bottom: 10px;
font-family: 'Open Sans', sans-serif;
	
}

.remote {
	width: 450px;
	height: 180px;
	background-color: #4FEBE2;
	margin-right: 120px;
	margin-left: 646px;
	margin-top: -100px;
	margin-bottom: 15px;
	box-shadow: 4px 4px 4px gray;
	border: solid 1px black;
}

.remote p {
	padding-bottom: 10px;
	padding-top: 10px;
	font-family: 'Lato', sans-serif;
	color: darkslategray;
	font-size: 15px;

}

.remote h2 {
	color: black;
	font-weight: bold;
	text-align: center;
		background-color: #fff;
	padding-top: 10px;	
	padding-bottom: 10px;
	
font-family: 'Open Sans', sans-serif;
	
}

.sendit {
	background-color: darkblue;
	color: white;
	border-radius: 5px;
	padding-top: 6px;
	padding-bottom: 6px;
	padding-left: 20px;
	padding-right: 20px;
	

}
.sendit:hover { 
	background-color: darkred;
}

.formitle {
	margin-rigjt: 250px;
	

}

.landingtxt {
	width: 250px;
	height: 210px;
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 20px;
	padding-top: 50px;
	background-color: #5F5B5B;
	margin-right: auto;
	margin-left: 280px;
	margin-top: 20px;
	margin-bottom: 40px;
	box-shadow: 4px 4px 4px #5F5B5B;
}

.landingtxt p {
	color: white;
}

.landingtxt2 {
	width: 250px;
	height: 210px;
	padding-right: 20px;
	padding-left: 20px;
	padding-bottom: 20px;
	padding-top: 50px;
	background-color: #01000B;
	margin-right: auto;
	margin-left: 280px;
	margin-top: 20px;
	margin-bottom: 40px;
	box-shadow: 4px 4px 4px #5F5B5B;
}

.landingtxt2 p {
	color: white;
}



.laptopphoto {
	margin-left: 600px;
margin-right: 150px;
margin-top: -280px;
margin-bottom: -500px;
	width: 380px;
	height: 220px;
	
	
}


	

wrapper {
	text-align: center;
	width: 980px;
	margin-left: auto;
	margin-right: auto;
}


.contactush2 {
	text-align: center;
	font-size: 40px;
	font-family: 'Frank Ruhl Libre', serif;
	color: darkblue;
	
	
}

/* Mail Chimp Form */
	#mc_embed_signup {
		
	background:#fff;
		clear:left; 
		font:14px Helvetica,Arial,sans-serif;  
		width:500px; 
		text-align: center;
		margin-left: 330px;
		margin-right: 580px;
		margin-top: 50px;
		margin-bottom: 50px;	

}
 

	#mc_embed_signup {
	background:#3b5066; 
	color:white;  
	clear:left; font:14px Helvetica,Arial,sans-serif;  width:600px;
}

.describeclass {
	
 background-color:#FFF;
height: 20px;

}
	
.buttonform {
	margin-top: 540px;
	margin-left: 300px;
	
}

.buttoninput {
	background: #13A1CD;
	  border-radius: 4px;
	color: white;
	width: 250px;
}

.buttoninput:hover {
	background-color: #4CAF50; 
  color: white;
}



.buttoninput2 {
	background: #16A10F;
	  border-radius: 4px;
	color: white;
	width: 250px;
}

.buttoninput2:hover {
	background-color: #2506DB; 
  color: white;
}

.buttoninput:hover {
	background-color: #4CAF50; 
  color: white;
}

/* Mailchimp Form End */




/* Social Media Icons */
.socials 
{
	padding-top: 2px;
	padding-bottom: 2px;
	text-align: center;
}


/* Thank You Page */

.featurethanks {
	width: 250px;
	height: 160px;
	font-size: 25px;
	background-color: #000FF3;
	margin: auto;
	margin-bottom: 40px;
	box-shadow: 4px 4px 4px gray;
	border-radius: 1px 0 3px 4px;
	border: solid medium #071508;

	

}


.featurethanks h2 {
	font-family: 'Slabo 27px', serif;
	color: white;
	padding-bottom: 10px;
	padding-top: 10px;
	
}