*{
 margin: 0px;
padding: 0px;
  border: 0px;}

body{
	font-family: 'Roboto', sans-serif;Background-color:#333;}

.logo {
    width: auto;
    height: 125px;
    padding: 0px 30px;
	margin: 10px auto;

}
 h1{
	margin-left:230px;
	margin-top: -130px;
	 margin-bottom: 20px;
	color:white;
	font-size: 35px;
	 line-height: 2.5rem;
}

/* Add a black background color to the top navigation */
.topnav {
  overflow:hidden;
	margin-bottom: 10px;
	padding:10px;
	float: right;
	
}

/* Style the links inside the navigation bar */
.topnav a {
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
	font-size: 1.2rem;
	font-weight: bold;
	margin-right: 50px;
	
}

/* Change the color of links on hover */
.topnav a:hover {
  background-color: #ddd;
  color: black;
}

/* Add an active class to highlight the current page */
.topnav a.active {
  background-color: #017BFE;
  color: white;
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
}
 .wrapper{
	 width:100vw;
	 display:grid;
grid-template-columns: repeat(2, 1fr);
grid-column-gap: 20px; grid-row-gap: 20px;}
h2{color:white;font-size:2rem; margin-top:30px; margin-bottom:10px; margin-left:auto; margin-right: auto;}
h3{color:white;font-size:2rem; margin-top:30px; margin-bottom:10px; margin-left:auto;margin-right: auto;}
p{margin-top:20px; color:white; font-weight:bold; padding:0 20px; line-height: 1.5rem;}

    

.intro{
  grid-column: span 2;
  background-color:#017BFE;
 margin:10px 20px; padding:10px; border-radius: 30px;
}
.video{float:left; margin:80px 40px 90px 20px;}

.box-1 {
  grid-column: span 1;
  background-color:#0d728e;
 margin-left:20px; padding:10px; border-radius: 30px;
}
.pix{height:200px;padding-left:10px; float: left; margin: 45px 15px 15px 0px; }

.box-2 {
   grid-column: span 1;
	background-color:#5A56D5;
 padding:10px; border-radius: 30px;  margin-right:20px;
}
.box-3 {
   grid-column: span 1;
	background-color:#19846C;
  margin-left:20px; padding:10px; border-radius: 30px; 
}
.box-4 {
   grid-column: span 1;
  background-color:#017BFE;
  margin-right:20px; padding:10px; border-radius: 30px;
}


.div1 { grid-column-start: 1; background-color:white; Padding:50px; margin:0 0 0 50px;}

   
.info{margin:0 auto; color: white;}
.info p{line-height:1.5rem; color:white;}

.header-content h1{
   font-size: 30px;  text-align:right;
}

a.header-btn{
  display: block;
  margin-top: 20px;
  margin-left:250px;
   height: 60px;
   width: 180px;
   font-size: 1.2rem;
   color: #fff;
	font-weight: bold;
   padding: 0 12px;
   /* From https://css.glass */
background: rgba(255, 255, 255, 0.2);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(5px);
-webkit-backdrop-filter: blur(5px);
border: 1px solid rgba(255, 255, 255, 0.3);
   line-height: 60px;
   border-radius: 30px;
  text-align:center;
  text-decoration: none;
}

}