html {
    height: 100%;    
}

body {
    overflow-y: auto;
    margin: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: rgb(50, 50, 50);
}
.middle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #393939;
    border-radius: 20px;
    padding: 20px 30px;
    box-shadow: 0 6px 20px rgba(56, 125, 255, 0.17);
    margin-bottom: 20px;
}
.form {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
form {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
}
.action-status {
    display: none;
    background: linear-gradient(to right, #11998e, #38ef7d);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


/* Navbar */
.navbar-round {

display: flex;
flex-direction: row;
align-self: center;
align-items: center;
justify-content: center;

width: 100%;
height: 200px;
/* background-color: #111; */
background-color: rgb(48, 48, 48);
border-bottom-left-radius: 100%;
border-bottom-right-radius: 100%;
border-top-left-radius: 100%;
border-top-right-radius: 100%;
position: relative;
top: -110px;
/* left: 80px; */
box-shadow: 0 6px 20px rgba(56, 125, 255, 0.17);
padding-bottom: 10px;

transition: 0.5s; /* 0.5 second transition effect to slide in the sidepanel */
}
.dt-icon {
position: relative;
top: 55px;
left:100px;    
font-size: 50px;  

font-weight: 300;
font-style: normal;
font-family: "Raleway", sans-serif;
font-optical-sizing: auto;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

}
.icon {
  /* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbarItems {
display: flex;
flex-direction: row;
justify-content: center;
position: relative;
left:200px;
margin-top: 100px;
}
.navbarItems a {
padding: 8px 8px 8px 32px;
text-decoration: none;
font-size: 17px;
color: #818181;
display: block;

font-weight:800;
font-style: normal;
font-family: "Raleway", sans-serif;
font-optical-sizing: auto;
}
/* When you mouse over the navigation links, change their color */
.navbarItems a:hover {
color: #f1f1f1;
}
.navbarItems .icon {
display: none;
}
/* Waves */
.waves {
position: absolute;
z-index:-999;
animation: wave-reveal 2s ease forwards; 
}
@keyframes wave-reveal {
0% {
transform: scale(0); /* Start small */
opacity: 0; /* Start invisible */
}
100% {
transform: scale(1); /* Scale to normal size */
opacity: 1; /* Fade in to full opacity */
}
}
/* Footer */
.footer {
display: flex;    
justify-content: center;
flex-direction: column;
align-items: center;
align-self: center;
gap:30px;
border-radius: 20px;

margin-top: auto;

/* position: relative;

top:100px; */

width:1000px;
/* height: 250px; */
background-color:rgb(45, 45, 45);
padding: 30px;
padding-bottom: 30px;
line-height: 1;

margin-bottom: 20px;

}
.footer-2 {
display: flex;    
justify-content: center;
flex-direction: column;
align-items: center;
align-self: center;
gap:30px;

border-radius: 20px;
margin-bottom: 20px;

position: relative;

/* top: 180px; */

width:1000px;
height: 250px;
background-color:rgb(54, 54, 54);
padding: 30px;  
line-height: 1;
}
.footer-group {
display: flex;    
justify-content: center;
flex-direction: row;
align-items: center;
gap:100px;
position: relative;
bottom: 30px;
}
.footer p {
font-weight:200;
font-style: normal;
font-family: "Raleway", sans-serif;
font-optical-sizing: auto;
text-align: center;
font-size:17px;
color: white;
margin-bottom:-10px;
}
.footer-member {
display: flex;    
justify-content: center;
flex-direction: column;
align-items: center;

}
.footer h2  {
position: relative;
left:20px;
}
#footer-terms {
line-height: 1.7;
}


.reusables {


/* BUTTON COLORS */
background-image: linear-gradient(to right, #6a11cb, #2575fc) !important;
background-image: linear-gradient(to right, #4b79a1, #283e51) !important;
background-image: linear-gradient(135deg, #f34079 40%, #fc894d);
/* Soft green */
background-image: linear-gradient(to right, #0d665c, #2b9e6b) !important;
/* Soft pink */
background-image: linear-gradient(to right, #ff758c, #ff7eb3) !important;
/* Soft red */
background-image: linear-gradient(to right, #8b0000, #b22222) !important;
/* Soft silver */
background-image: linear-gradient(to right, #8d8783, #4e4b48) !important;
/* Purple linear background */
border-radius: 20px;
background-color: #4158D0;
background-image: linear-gradient(43deg, #4158D0 0%, #C850C0 46%, #FFCC70 100%);

/* TEXT COLORS */
/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
/* Gold */
background: linear-gradient(to right, #BF953F, #FCF6BA);  
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
/* Silver */
background: linear-gradient(to right, #8d8783, #4e4b48); 
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
/* Green */
background: linear-gradient(to right, #11998e, #38ef7d); 
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
/* Orange */
background: linear-gradient(to right, #994711, #ef8a38); 
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
/* Vibrant sunrise */
background: linear-gradient(45deg, #FFC371, #FF5F6D);  
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
/* Red */
background: linear-gradient(to right, #ff758c, #ff7eb3);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
/* Violet, purple and blue linear-gradient. */
background: linear-gradient(to right, #8f00ff, #6a11cb, #2575fc);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;




/* BACKGROUND COLORS */
background-color: #35374B;
margin: 15% auto; 
padding: 20px;
padding-bottom: 50px;
border: none;
width: 300px; 
border-radius: 10px;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
text-align: center;
/* Body color */
background-color: #34393c;

display:flex;
flex-direction:column;
justify-content:center;
align-items:center;

font-weight:600;
font-style: normal;
font-family: "Raleway", sans-serif;
font-optical-sizing: auto;
text-align: center;



}



/* MEDIAS */

@media screen and (max-width: 1300px) {
.navbarItems a {
display: none;
}
.navbarItems a.icon {
float: right;
display: block;
position: relative;
left: 50px;
font-size:30px;
top:3px;  
color:rgb(205, 205, 205);      
}

.dt-icon {        
font-size: 35px;
position: relative;
left:40px;
}  


}

@media screen and (max-width: 1300px) {

.navbar-round.responsive {
height: 400px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}

.navbar-round.responsive .dt-icon {
left:10px;      
top:80px;
}

.navbar-round.responsive .navbarItems {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;     
left:0px;        

}

.navbar-round.responsive .navbarItems a.icon {

}

.navbar-round.responsive .navbarItems a {
display: block;
right:0px;
}

}



/* 299px */
@media only screen and (max-width: 299px) and (min-width: 250px) and (max-device-height:350px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 0.8rem !important;
  width: 80% !important;
}


}

/* Jiophone 2 */
@media only screen and (max-width: 299px) and (min-width: 240px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 95% !important;
max-width: 95% !important;
gap: 10px;
height: unset !important;

}
.footer p {
font-size: 15px !important;
}
.footer a {
font-size: 15px !important;
}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 40px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1rem !important;
  width: 100% !important;
}
.icon {
  left: 15px !important;
  font-size: 20px !important;
}
.dt-icon {
  font-size: 30px !important;
  left: 30px;
}
.forgot-password {
  text-align: center !important;
}
.middle {
  padding: 40px 20px 80px !important;
  width: 90% !important;
  position: relative;
  bottom: 20px;
}
h2 {
font-size: 30px !important;
}

}
/* 299px */
@media only screen and (max-width: 299px) and (min-width: 250px) and (min-device-height:400px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 0.8rem !important;
  width: 80% !important;
}


}

/* OPTIMIZED for Galaxy S9+  */
@media only screen and (max-width: 329px) and (min-width: 300px) and (min-device-height:600px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 0.8rem !important;
  width: 80% !important;
}


}

/* OPTIMIZED for Samsung Galaxy Z Fold 5 */
@media only screen and (width: 344px) and (height:882px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1rem !important;
  width: 80% !important;
}



}

/* OPTIMIZED for iPhone: (SE, 12 Pro, X), Samsung: (Galaxy S8+, S20 Ultra,), Blackberry (Z30,)   */
@media only screen and (max-width: 399px) and (min-width: 330px) and (min-device-height:600px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 95% !important;
max-width: 95% !important;
gap: 10px;
height: unset !important;

}
.footer p {
font-size: 15px !important;
}
.footer a {
font-size: 15px !important;
}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1rem !important;
  width: 100% !important;
}
.icon {
  left: 15px !important;
  font-size: 20px !important;
}
.dt-icon {
  font-size: 30px !important;
  left: 30px;
}
.forgot-password {
  text-align: center !important;
}
.middle {
  padding: 40px 20px 80px !important;
  width: 90% !important;
}
h2 {
font-size: 30px !important;
}


}

/* 399px and below (small screens, shorter height) */
@media only screen and (max-width: 399px) and (min-width: 300px) and (max-device-height:599px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 30px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1rem !important;
  width: 80% !important;
}


}

/* 330 - Nokia Lumia 520 and iPhone 4*/
@media only screen and (max-width: 330px) and (min-width: 319px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 95% !important;
max-width: 95% !important;
gap: 10px;
height: unset !important;

}
.footer p {
font-size: 15px !important;
}
.footer a {
font-size: 15px !important;
}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1rem !important;
  width: 100% !important;
}
.icon {
  left: 15px !important;
  font-size: 20px !important;
}
.dt-icon {
  font-size: 30px !important;
  left: 30px;
}
.forgot-password {
  text-align: center !important;
}
.middle {
  padding: 40px 20px 80px !important; 
}
h2 {
font-size: 30px !important;
}

}


/* 449px and below (slightly larger screens, shorter height)* iPhone 6/7/8 Plus */
@media only screen and (max-width: 449px) and (min-width: 400px) and (max-device-height:669px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1rem !important;
  width: 80% !important;
}



}

/* * {
outline: 1px solid red;
} */

/* 449 - iPhone: (14 Pro Max, XR), Samsung: (Pixel 7, Galaxy A51/71 ) */ 
@media only screen and (max-width: 449px) and (min-width: 400px) and (min-device-height:670px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 95% !important;
max-width: 95% !important;
gap: 10px;
height: unset !important;

}
.footer p {
font-size: 15px !important;
}
.footer a {
font-size: 15px !important;
}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 10px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1.2rem !important;
  width: 100% !important;
}
.icon {
  left: 15px !important;
  font-size: 20px !important;
}
.dt-icon {
  font-size: 30px !important;
  left: 30px;
}
.forgot-password {
  text-align: center !important;
}
.middle {
  padding: 40px 20px 80px !important;
  width: 90% !important;
}
h2 {
font-size: 30px !important;
}




}


/* OPTIMIZED for Microsoft Duo */
@media only screen and (max-width: 598px) and (min-width: 481px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1rem !important;
  width: 80% !important;
}


}

/* Nokia N9 */
@media only screen and (max-width: 490px) and (min-width: 460px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1rem !important;
  width: 80% !important;
}


}

/* 698px */
@media only screen and (max-width: 698px) and (min-width: 599px) and (min-height:500px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1rem !important;
  width: 80% !important;
}


}

/* 698px 400px */
@media only screen and (max-width: 698px) and (min-width: 599px) and (max-height: 400px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1rem !important;
  width: 80% !important;
}


}


/* 899px - Ipad Air, Asus Zenbook Fold */
@media only screen and (max-width: 899px) and (min-width: 800px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1.5rem !important;
  width: 80% !important;
}
.middle {
padding: 40px 20px 80px !important;
width: 70% !important;
}
.forgot-password {
  font-size: 1.5rem !important;
}

}

/* 1024px - iPad Pro, Microsoft Surface Pro 7 */
@media only screen and (max-width: 1024px) and (min-width: 900px) and (min-height: 700px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 35px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -120px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1.5rem !important;
  width: 50% !important;
}
.middle {
padding: 40px 20px 80px !important;
width: 70% !important;
}
form {
  width: 100% !important;
  max-width: 100% !important;
}
.form {
  width: 100% !important;
  max-width: 100% !important;
}
a, p {
  font-size: 1.5rem !important;
  text-align: center !important;
}
.dt-icon {
  font-size: 40px !important;
}
.icon {
  font-size: 30px !important;
}

}

/* 1024px - Nest Hub */
@media only screen and (max-width: 1024px) and (min-width: 900px) and (max-height: 600px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1.5rem !important;
  width: 80% !important;
}




}

/* Targeting BlackBerry PlayBook in portrait orientation */
@media screen and (min-width: 600px) and (max-width: 600px) and (min-height: 1024px) and (max-height: 1024px) and (orientation: portrait) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1.5rem !important;
  width: 80% !important;
}




}

/* Galaxy Tab S4 - Landscape*/
@media only screen and (max-width: 1200px) and (min-width: 1000px) and (max-height: 800px) and (orientation: landscape) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1.5rem !important;
  width: 80% !important;
}




}

/* 800px - Nexus 7, Blackberry Playbook, Kindle Fire HDX */
@media only screen and (max-width: 800px) and (min-width: 600px) and (max-height: 1280px) and (orientation: portrait) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 25px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -130px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1.5rem !important;
  width: 80% !important;
}
.middle {
    width: 70% !important;
    padding: 40px 20px 80px !important;
}



}

/* 799px -  Ipad, Ipad Mini  */
@media only screen and (max-width: 799px) and (min-width: 699px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 35px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -120px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1.5rem !important;
  width: 50% !important;
}
.middle {
padding: 40px 20px 80px !important;
width: 70% !important;
}
form {
  width: 100% !important;
  max-width: 100% !important;
}
.form {
  width: 100% !important;
  max-width: 100% !important;
}
a, p {
  font-size: 1.5rem !important;
  text-align: center !important;
}
.dt-icon {
  font-size: 40px !important;
}
.icon {
  font-size: 30px !important;
}


}

/* 1300px - Nest Hub Max */
@media only screen and (max-width: 1300px) and (min-width: 1200px) and (max-height: 800px) {
.footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 80% !important;
max-width: 80% !important;
gap: 10px;
height: unset !important;

}
.footer-group {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
align-self: center;
width: 90% !important;
max-width: 90% !important;
gap: 30px;
}
.footer h2 {
font-size: 35px !important;
left: unset !important;

/* Forest Whisper */
background: linear-gradient(to right, #005AA7, #FFFDE4);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.navbar-round {
width: 95% !important;
max-width: 95% !important;
top: -120px;
}
.waves {
width: 100% !important;
top: 20px !important;
}
.navbarItems {
  left: unset !important;
}
select, input {
  font-size: 1.5rem !important;
  width: 50% !important;
}
.middle {
padding: 40px 20px 80px !important;
width: 70% !important;
}
form {
  width: 100% !important;
  max-width: 100% !important;
}
.form {
  width: 100% !important;
  max-width: 100% !important;
}
a, p {
  font-size: 1.5rem !important;
  text-align: center !important;
}
.dt-icon {
  font-size: 40px !important;
}
.icon {
  font-size: 30px !important;
}


}

