@import url('https://fonts.googleapis.com/css2?family=Readex+Pro:wght@300;400&display=swap');

body {
  font-family: "Readex Pro" 
}

body#corpse{
  background: rgb(2,0,36);
  background: linear-gradient(0deg, rgba(2,0,36,1) 0%, rgba(68,24,73,1) 35%, rgba(14,95,170,0.9248074229691877) 85%);
  background-attachment: fixed;
  background-size: cover;
}

.header {
  
  text-align: center;
  font-weight: 580;
color: #fff;
text-shadow: 8px 0 0 #000, 0 1px 1px #000, 0 1px 0 #000, 1px 0 0 #000;
font-size: 50px;
}

textarea{
  position: relative;
 
  margin-top: 85px;
  font-family: "Readex Pro" ,Verdana, sans-serif;
  line-height: 1.8; 
  text-align: center;
     
  width: 20%;
  
  border: 2px solid #ccc;
  border-radius: 25px;
  background-color: #f8f8f891;
  font-size: 20px;
  resize: none;
} 



.slider{
  position: relative;
  
  margin-top: 65px;
  width: 20%;
  
  background: #d3d3d3;
  border-radius: 25px;
  outline: none;
  cursor: pointer;
}

.lengthRange,
label {
position: relative;
  font: 1rem "Readex Pro", sans-serif;
  font-weight: 380;
color: rgb(255, 255, 255);
text-shadow: 0px 0 0 #000, 0 0px 0px #000, 0 0px 0 #000, 0px 0 0 #000;
text-align:center;
line-height: -2.0; 
width: 100%;
display:block

}

button {
  cursor: pointer;
  position: relative; 
  
  margin-top: 25px;
  background-color: #3183fd; 
  border: none;
  border-radius: 25px;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 18px;
  font-family: "Readex Pro" ,Verdana, sans-serif;
}

 .button:active{
  transform: scale(0.95);
   box-shadow: -2px 11px 11px -2px rgba(24, 112, 228, 0.24);
}


.checkboxes{
  padding-top: 120px;
  
}
table {
  width: 50%;
  
}
table, td {
  border: 3px solid rgba(243, 243, 243, 0.103);
  border-radius: 10px;
  height: 10px;
}

.container{
  
 
  font-size: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
}

.icon a {
  padding: 0.4rem; }

.icon a:hover {
  color: #cf4dbe;
  transition: all 1.2s ease-in-out; }

  .icon a {
    color: rgb(250, 250, 250);
    position: fixed;
    bottom: 0;
    right: 0;
  }
  a:hover:before{
    transition: width 0.1s ease-in-out;
    content: "My GitHub!";
    font-family: "Readex Pro" ,Verdana, sans-serif;
    line-height: 1.2; 
  
    position: absolute;
    bottom: 1.0px;
    right: 55px;
  }


  @media all and (max-width:480px){
    body {
      font-family: "Readex Pro" 
    }
    
    body#corpse{
    
      background: url(../pictures/lakshmani.jpg);
      background-attachment: fixed;
      background-size: cover;
    }
    
    .header {
      text-align: center;
      font-weight: 580;
    color: #fff;
    text-shadow: 8px 0 0 #000, 0 1px 1px #000, 0 1px 0 #000, 1px 0 0 #000;
    font-size: 23px;

    }
    
    textarea{
      display: flex;
      justify-content: center;
    margin-top: 30px;
      font-family: "Readex Pro" ,Verdana, sans-serif;
      line-height: 1.8; 
      text-align: center;
         
      
      width:100%;
      border: 2px solid #ccc;
      border-radius: 25px;
      background-color: #ffffffa9;
      font-size: 20px;
    } 
    
    
    
    .slider{
      position: relative;
      margin-top: 20px;
      width: 40%;
      
      background: #d3d3d3;
      border-radius: 25px;
      outline: none;
      cursor: pointer;
    }
    
    .lengthRange,
    label {
    position: relative;
      font: 1rem "Readex Pro", sans-serif;
      font-weight: 380;
    color: rgb(255, 255, 255);
    text-shadow: 0px 0 0 #000, 0 0px 0px #000, 0 0px 0 #000, 0px 0 0 #000;
    text-align:center;
    line-height: -2.0; 
    width: 100%;
    display:block
    }
    
    button {
      cursor: pointer;
      position: relative; 
      
      width: 50%; 
      
      background-color: #3183fd; 
      border: none;
      border-radius: 25px;
      color: white;
      text-align: center;
      text-decoration: none;
      display: inline-block;
      font-size: 15px;
      font-family: "Readex Pro" ,Verdana, sans-serif;
    }
    
     .button:active{
      transform: scale(0.95);
       box-shadow: -2px 11px 11px -2px rgba(24, 112, 228, 0.24);
       
    }
    
    
    .checkboxes{
      margin-top: 55px;
      width: 100%;
    }
    table{
      margin-top: -100px;
      width: 100%;
    }
    
    table, td {
      border: 3px solid rgba(243, 243, 243, 0.103);
     
      height: 5px;
    }
    
    .container{
      font-size: 15px;
    }
    
    .icon a {
      padding: 0.4rem; }
    
    .icon a:hover {
      color: #cf4dbe;
      transition: all 1.2s ease-in-out; }
    
      .icon a {
        color: rgb(250, 250, 250);
        position: relative;
        float: right;
        margin-top: 100px;
        
      }
      

  }