*{
  margin: 0;
  padding: 0;
}
body {
  font-family: "Roboto", sans-serif;
  padding-top: 80px;
  
}
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.header {
  height: 80px;
  display: flex;
  flex-wrap: wrap;  
  color:#fff;
  background-color: rgba(23, 2, 118, 0.9);
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  z-index: 1;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.85) 0%,
         rgba(30, 58, 138, 0.8) 25%, rgba(5, 150, 105, 0.75) 50%,
          rgba(217, 119, 6, 0.7) 75%, rgba(10, 0, 16, 0.85) 100%);
}

.headerleft {
  display: flex;
  flex: 30%;
  
  align-items: center;
  justify-content: flex-start;
}
.div-logo {
  display: flex;
        
        border-radius: 5px;
        height: 50px;
        width: 50px;
        margin-left: 20px;
        margin-right: 10px;
        justify-content: center;
        align-items: center;
        background: #3F5EFB;
        background: radial-gradient(circle, rgba(63, 94, 251, 1) 0%, rgba(70, 252, 210, 1) 100%);
        box-shadow: 0 6px 20px 0 rgba(60, 187, 86, 0.2), 0 6px 20px 0 rgba(12, 46, 196, 0.19);
}
.material-symbols-outlined {
        font-size: 30px;
        color: white;
      }
.div-indiamarkes {
  display: flex;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 30px;
  font-weight: 600;
        
}
.india{
        
  --tw-text-opacity: 1;
  color: rgba(147, 197, 253, var(--tw-text-opacity));

}
.markets {      
  --tw-text-opacity: 1;
  color: rgba(110, 231, 183, var(--tw-text-opacity));
}
.dotcom {
  --tw-text-opacity: 1;
  color: rgba(0,0,0,(--tw-text-opacity));  
}
.headerright {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-right: 50px;
  
}
.homebtn {
  align-content: center;
  justify-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 20px;
  padding-right: 20px;
  border: none;
  border-radius: 10px;
  background-color: rgba(244, 124, 72, 0.784);
  font-weight: 500;
  color: #fff;
  cursor: pointer;
}
.homebtn:hover {
  box-shadow: rgba(0, 0, 0, 0.25) 0 8px 15px;
  transform: translateY(-2px);
  background-image: linear-gradient(-180deg, rgb(244, 124, 72, 0.784) 0%, rgba(193, 69, 15, 0.784) 100%);
  
}
.homebtn:active {
  background-color: rgba(3, 30, 16, 0.685);
  box-shadow: none;
  transform: translateY(0);
}



.contactus{
  margin-top: 80px;
  padding-top: 50px;
  width: 90%;
  background-color: #ffff;
  border-radius: 30px;
  justify-self: center;
  box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}
.contactus-heading {
  display: flex;
  justify-content: center;
  
}
.contact-heading {
  display: flex;
  justify-content: center;
  align-items: center;
  
}
.contact-para {
  padding-left: 59px;
  font-size: 20px;
  font-weight: 500;

}
.contact-form {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding-top: 50px;
  padding-bottom: 50px;
  
}
.form-group {
  display: flex;

  flex-direction: row;
  width: 100%;
  margin-bottom: 10px;
  align-items: center;
  
}

.lable-div {
  display: flex;
  justify-content: end;
  width: 40%;
  text-align: right;
  font-weight: bold;
  
}
.input-div {
  display: flex;
  width: 50%;
  justify-content: start;
  margin-left: 5px;
  

}
.input-div input {
  height: 40px;
  width: 300px;
  border-radius: 5px;
  
  border-style: solid;
  border-color: rgb(208, 204, 204);
}
textarea {
  width: 300px;
  border-radius: 5px;
  border-color: rgb(208, 204, 204);
}
.contact-form button {
  align-content: center;
  justify-items: center;
  padding-top: 14px;
  padding-bottom: 14px;
  padding-left: 24px;
  padding-right: 24px;
  border: none;
  border-radius: 10px;
  background-color: rgba(236, 85, 21, 0.784);
  font-weight: 500;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
}
.contact-form button:hover {
  box-shadow: rgba(0, 0, 0, 0.25) 0 8px 15px;
  transform: translateY(-2px);
  background-image: linear-gradient(-180deg, rgb(244, 124, 72, 0.784) 0%, rgba(193, 69, 15, 0.784) 100%);
  
}
.contact-form button:active {
  background-color: rgba(3, 30, 16, 0.685);
  box-shadow: none;
  transform: translateY(0);
}
.thanks {
  margin-top: 20px;
  text-align: center;
  font-weight: 500;
  color: red;
}

.footer {
  margin-top: 150px;
  display: flex;
  height: 100px;
  width: 100%;
  justify-content: center;
  align-items: center;
  background-color: rgba(213, 212, 210, 0.6);
  
}
.footer-rights {
  
  margin-left: 20px;
  color: rgb(71, 70, 70);
}

@media (max-width: 499px) {
   .div-logo {
      height: 40px;
      width: 40px;
      margin-left: 10px;
    }
    .div-indiamarkes {
      font-size: 26px;
      font-weight: 600;
    }

    .headerright {
      margin-right: 5px;
      margin-left: 5px;
    }
    .homebtn {
      padding-left: 10px;
      padding-right: 10px;
    }

 
}

