@import url('https://fonts.googleapis.com/css2?family=Akshar:wght@300&family=IBM+Plex+Sans+Arabic:wght@400;700&family=IBM+Plex+Sans:wght@400;500;600;700&family=Lato:wght@700&family=Montserrat:wght@600&family=Nunito:wght@300&family=Open+Sans:wght@300&family=PT+Sans&family=Roboto:wght@300&family=Source+Sans+Pro:wght@300&family=Ubuntu:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Akshar:wght@300&family=IBM+Plex+Sans+Arabic:wght@400;700&family=IBM+Plex+Sans:wght@400;500;600;700&family=Lato:wght@700&family=Montserrat:wght@600&family=Nunito+Sans:wght@900&family=Nunito:ital,wght@0,300;0,700;1,800&family=Open+Sans:wght@300&family=PT+Sans&family=Roboto:wght@300&family=Source+Sans+Pro:wght@300&family=Ubuntu:wght@300&display=swap');
*{
    margin: 0px;
    padding: 0px;
    font-family: 'Nunito', sans-serif;
    background-color: #f5f2fa;
}
#container{
    width: 24%;
    margin: auto;
    /* height: 400px;    */
    padding: 60px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    
}
#imgdiv{
    width: 14%;
    margin: auto;
    margin-top: 60px;
    margin-bottom: 30px;
}
#topSection{
    margin-bottom: 20px;
}
#topSection>p{
    color: #283542;
    font-size: 24px;
    font-weight: bold;
    line-height: 32px;
    font-family: 'Nunito Sans', sans-serif;   
}
#topSection>p+p{
    font-family: 'Nunito', sans-serif;
    font-size: 14px;
    font-weight: 200;
    color: #4b5359;
}
#clogo{
    display: flex;
    align-items: center;
}
#flogo{
    display: flex;
    align-items: center;
}
#elogo{
    display: flex;
    align-items: center;
}
#plogo{
    display: flex;
    align-items: center;
}
span{
    cursor: pointer;
    color: #9bb4e4;
    text-decoration: underline;
}
#clogo>img{
    width: 6%;
    margin-right: 4px;
}
#clogo>img+p{
    font-weight: bold;
}
#clogo{
    margin-bottom: 6px;
}
#companyName>div+input{
    padding: 7px 205px 7px 4px;
    border: 1px solid #c0cad4;
}
#companyName{
    margin-bottom: 15px;
}
#flogo>img{
    width: 7%;
    height: 7%;
    margin-right: 4px;
}
#flogo>img+p{
    font-weight: bold;
}
#name{
    display: flex;
    gap: 14px;
    
}
#name>:nth-child(1){
    padding: 7px 13px 7px 4px;
    border: 1px solid #c0cad4;
}
#name>:nth-child(2){
    padding: 7px 13px 7px 4px;
    border: 1px solid #c0cad4;
}
#flogo{
    margin-bottom: 6px;
}
#fullName{
    margin-bottom: 15px;
}
#elogo>img{
    width: 6%;
    margin-right: 4px;
}
#elogo>img+p{
    font-weight: bold;
}
#elogo{
    margin-bottom: 6px;
}
#email>div+input{
    padding: 7px 205px 7px 4px;
    border: 1px solid #c0cad4;
}
#email{
    margin-bottom: 15px;
}
#plogo>img{
    width: 6%;
    margin-right: 4px;
}
#plogo>img+p{
    font-weight: bold;
}
#plogo{
    margin-bottom: 6px;
}
#phone{
    margin-bottom: 15px;
}
#passlogo{
    display: flex;
    margin-bottom: 6px;
}
#passlogo>img{
    width: 6%;
    margin-right: 4px;
}
#passlogo>img+p{
    font-weight: bold;
}
#passlogo+input{
    padding: 7px 205px 7px 4px;
    border: 1px solid #c0cad4;
}
#condition{
    margin-bottom: 15px;
}
#password{
    margin-bottom: 10px;
}
#condition>div{
    display: flex;
    align-items: center;
}
#condition>div>img{
    width: 6%;
}
#condition>div>img+p{
    font-size: 14px;
}
#privacy>p{
    font-size: 12.5px;
    font-weight: 500;
    color: #4d6072;
}
#privacy{
    margin-bottom: 13px;
}
#btn>button{
    background-color: #8cccf1;
    padding: 12px 125px 12px 125px;
    color: white;
    cursor: pointer;
    letter-spacing: 0.1px;
    font-weight: bold;
    border: 1px solid rgb(149, 149, 219);
    border-radius: 3px;
    
}
#plogo+div{
    display: flex;
}
#plogo+div>select{
    width: 70px;
    padding: 7px 0px 7px 0px;
    border: 1px solid #c0cad4;
    border-right: 1px solid white;
}
#plogo+div>select+input{
    padding: 7px 133px 7px 4px;
    border: 1px solid #c0cad4;
}
hr{
    margin-top: -17%;
    width: 100%;
    height: 15px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    padding: 0 59px 0 59px;
    margin-left: -59px;
    margin-bottom: 45px;
    background: linear-gradient(-90deg, #31bd95 0%, #7dd47a 22%, #7cccfa 42%, #1999e3 57%, #ca8bdb 78%, #7148bd 100%);
    background-image: linear-gradient(-90deg, rgb(49, 189, 149) 0%, rgb(125, 212, 122) 22%, rgb(124, 204, 250) 42%, rgb(25, 153, 227) 57%, rgb(202, 139, 219) 78%, rgb(113, 72, 189) 100%);
}
