@import url('https://fonts.googleapis.com/css2?family=Sansation:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Sansation:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');

body{
    background-color:black;

}

.content{
    color:white;
    position:relative;
    text-align:center;
    margin:auto;
}

.content-logo{
    width:400px;
    position:relative;
    top:30px;
}

.hiring-btn {
    position: relative;
    top: 70px;
    display: inline-block;
    width: 125px;
    height: 40px;
    line-height: 40px;           /* vertical centering */
    text-align: center;
    color: white;
    font-weight: 700;
    background-color: #1db954;
    border: none;
    font-family: 'Sansation', sans-serif;
    font-size: 18px;
    box-shadow: 0 0 4px #1DB954, 0 0 6px #1DB954;
    border-radius: 5px;
    text-decoration: none;       /* remove underline */
}


.pointerbtn{
    text-align:left;
}

.apply-btn {
    position: relative;
    top: 160px;
    display: inline-block;
    width: 230px;
    height: 60px;
    line-height: 60px;
    color: white;
    font-weight: 500;
    background-color: #42d760;
    font-family: 'Sansation', sans-serif;
    font-size: 21px;
    box-shadow: 0 0 4px #42d760, 0 0 6px #42d760;
    border-radius: 40px;
    text-align: center;
    text-decoration: none;
    border: none;
}

.apply-btn i {
    margin-right: 8px;
    vertical-align: middle;
}

.content-text{
    font-size:45px;
    font-family:'Sansation', sans-serif;
    font-weight:700;
    color:white;
    position:relative;
    top:110px;
}

.content-span{
    font-size:18px;
    font-family:'Sansation', sans-serif;
    color:white;
    position:relative;
    top:130px;
}

.icons-text{
    color:white;
    position:relative;
    top:200px;
    font-size:16px;
    font-family:'Sansation', sans-serif;

}

.content-icons-heart{
    color:#1DB954;
}

.whybecome{
    width:100%;
    position:relative;
    top:250px;
    color:white;
    position:relative;
    text-align:center;
    margin:auto;
}

.whybecome-headline{
    font-size:45px;
    font-family:'Sansation', sans-serif;
    font-weight:700;
    color:white;
    position:relative;
}

.imgpanel{
    text-align:center;
    margin-left:20px;
    display:inline-block;
}

.imgpanel-image{
    width:150px;
}

.imgpanel-text{
    color:white;
    font-family:'Sansation', sans-serif;
    font-weight:700;
    color:white;
    position:relative;
    font-size:25px;
    bottom:20px;
}

.imgpanel-span{
    color:white;
    font-family:'Sansation', sans-serif;
    position:relative;
    font-size:17.5px;
    bottom:30px;
}

.whatyoudo{
    width:100%;
    position:relative;
    top:250px;
    color:white;
    position:relative;
    text-align:center;
    margin:auto;
}

.whatyoudo-list{
    color:white;
    font-size:20px;
    font-family:'Sansation', sans-serif;
    position:relative;
    text-align:center;
    margin-top:20px;
    bottom:40px;
}

.howtoapply{
    width:100%;
    position:relative;
    top:250px;
    color:white;
    position:relative;
    text-align:center;
    margin:auto;
}

.reviewslately{
    width:100%;
    position:relative;
    top:250px;
    color:white;
    position:relative;
    text-align:center;
    margin:auto;
}


.customerpanel{
    width:350px;
    text-align:center;
    margin-left:50px;
    display:inline-block;
    height:500px;
    background-color:white;
    border-radius:15px;
    background-image: url('../img/client1.png');
    background-size:cover;
}
.customerpanel-2{
    width:350px;
    text-align:center;
    margin-left:50px;
    display:inline-block;
    height:500px;
    background-color:white;
    border-radius:15px;
    background-image: url('../img/client2.png');
    background-size:cover;
}
.customerpanel-3{
    width:350px;
    text-align:center;
    margin-left:50px;
    display:inline-block;
    height:500px;
    background-color:white;
    border-radius:15px;
    background-image: url('../img/client3.png');
    background-size:cover;
}
.customerpanel-filter{
    width:350px;
    height:500px;
    background-color:black;
    opacity:0.3;
    z-index:1;
}

.customerpanel-info{
    z-index:2;
    width:350px;
    height:500px;
    position:relative;
    background-color:transparent;
    bottom:500px;
}

.customerpanel-info-stars{
    font-size:18px;
    position:relative;
    top:260px;
}


.customerpanel-info-text{
    position:relative;
    color:white;
    font-weight:500;
    font-size:20px;
    font-family: "Inter", sans-serif;
    width:275px;
    text-align:center;
    margin:auto;
    top:275px;
}

.customerpanel-info-name{
    position:relative;
    color:white;
    font-weight:500;
    font-size:13px;
    font-family: "Inter", sans-serif;
    width:275px;
    text-align:center;
    margin:auto;
    top:300px;
}

.readytostart{
    width:100%;
    height:400px;
    position:relative;
    top:250px;
    color:white;
    position:relative;
    text-align:center;
    margin:auto;

}

.readytostart-text{
    color:white;
    font-size:21px;
    font-family:"Sansation", sans-serif;
    position:relative;
    bottom:40px;
}

.readytostart-text-2{
    color:white;
    font-size:20px;
    font-family:"Sansation", sans-serif;
    position:relative;
    bottom:80px;
}

.readytostart-join {
    position: relative;
    display: inline-block;
    width: 230px;
    height: 60px;
    line-height: 60px;
    color: white;
    font-weight: 500;
    background-color: #42d760;
    font-family: 'Sansation', sans-serif;
    font-size: 21px;
    box-shadow: 0 0 4px #42d760, 0 0 6px #42d760;
    border-radius: 40px;
    text-align: center;
    text-decoration: none;
    border: none;
}


a{
    text-decoration: none;
    color:white;

    width:100px;
    height:100px;
    background-color:white;
}