*{
    margin: 0;
    padding: 0;
    font-family: Bebas;
    font-size: 28;
}

header{
    background-image:linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)), url(../wallpaper5.jfif);
    height: 100vh;
    background-size: cover;
    background-position: center;
    background-repeat; repeat;

}

ul{
    float: right;
    list-style-type: none;
    margin-top: 40px;
}

ul li{
     display: inline-block;
}

ul li a{
     text-decoration:none;
     color: #fff;  
     padding: 5px 20px;
     border: 1px solid transparent;
     transition: 0.5s ease;
     font-size: 28px;
}

ul li a:hover{
     background-color: #fff;
     color: #000;
}

ul li.active a{
     background-color: #fff;
     color: #000;

}

.logo img{
     float: left;
     width: 150px;
     height: auto;
}

.main{
    max-width: 1200px;
    margin: auto;
}

.title{
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.title h1{
    color: #fff;
    font-size:90px;
    font-family:Afternoon in Stereo Personal Us;

    
}

.button{
    position: absolute;
    top: 64%;
    left: 50%;
    transform: translate(-50%,-50%);

}

.btn{
    border: 1px solid #fff;
    padding: 10px 20px;
    color: #fff;
    text-decoration: none;
    transition: 0.5s ease;
}

.btn:hover{
    background-color: #fff;
    color: #000;
}

p{
    color: white;
    text-align: center;
    font-size: 35px; 
    font-family: century gothic;
    
}

.tabtitle{
    font-family: Century Gothic;
    color: #dc2d5e;
    text-align: center;
}
.tabContainer{
    width: 86%;
    height: 1010px;
}

.tabContainer .buttonContainer{
    height: 7%;
}
.tabContainer .buttonContainer button{
    width: 25%;
    height: 100%;
    float: left;
    border: none;
    outline:none;
    cursor: pointer;
    padding: 10px;
    font-family: century gothic;
    font-size: 20px;
    background-color: #eee;
}
.tabContainer .buttonContainer button:hover{
    background-color: #d7d4d4;
}
.tabContainer .tabPanel{
    height: 85%;
    background-color: gray;
    color: white;
    text-align: center;
    padding-top: 30px;
    box-sizing: border-box;
    font-family: sans-serif;
    font-size: 22px;
    display: none;

}

.tabPanel .box{
    
 width: 22.5%;
 float: left;
 padding: 7px;
 padding-left: 10px;  
 display: block;
 
}

.tabPanel img{
    width: 100%;
    border-radius: 3px;
    margin-left: 25px;

}

.tabPanel4 h2{
    font-size: 53px;
    margin-left: auto;
    margin-right: auto;
    font-family:century gothic; 
}

.tabPanel4 h3{
    font-size: 33px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-family:bebas; 
  
}

.tabPanel4 h4{
    font-size: 30px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-left: 30px;
    font-family:bebas; 
}

.tabContainer .tabPanel4{
    width: 100%;
    height: 7800px; 
    position: relative;

}

.tabPanel4 video{
    position: absolute;
    left: 50%;
    transform:translateX(-50%);
    

}