:root {

  --content-color: #ffffff;       
  --header-bg-color:  #81f499ff;          
  --footer-bg-color: #115e59;     
  --primary-fonts: "Roboto", sans-serif;
  --select-focus-border: 1px solid #0ea5e9; 
  --main-section-bg-color: #99c5b5ff; 
  --next-button-bg:  #afece7ff;        
  --prev-button-bg: transparent;    
  --padding: 10px;

}
/* ? second section from the main */
.second-section h1{
    margin:10px 0;
}
.second-section #exams-type{
    margin-bottom: 10px;
}
.second-section p{
    margin:5px 0;
}
.second-section #exams-type label{
    display: block; 
    margin:5px 0;
}
.second-section #exams-type select{
    width: 100%;
    outline:none;
    border-radius: 6px;
    padding:var(--padding);
    outline:none;
}
.second-section #exams-type select:focus{
    border:var(--select-focus-border)
}


.second-section #gender-section, #course-section {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.second-section #details-flex label{
    display:block;
    margin-bottom:5px;
    color:black;
}
.second-section #details-flex select{
    outline:none;
    width:100%;
    padding:var(--padding);
    border-radius: 6px;

}
.second-section #details-flex select:focus{
    border: var(--select-focus-border);
}
.second-section .telephone-number-section label{
    display:block;
    margin-bottom:5px;
    color:black;
    margin-top:7px;
}
.second-section .telephone-number-section input{
    outline:none;
    width:100%;
    padding:var(--padding);
    border-radius: 10px;
    border:none;

}
.second-section .telephone-number-section input:focus{
    border:var(--select-focus-border)
}
.second-section-buttons{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    margin-top:10px;
}
.second-section-buttons .next-btn{
    padding:10px;
    outline:none;
    background-color: var(--next-button-bg);
    width: 10%;
    border:none;
    cursor: pointer;
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}
.second-section-buttons .next-btn:hover{
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
}
.second-section-buttons .previous-btn{
    width: 10%;
    border:none;
    padding:10px;
    outline:none;
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear;
    cursor: pointer;
}
.second-section-buttons .previous-btn:hover{
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
}