body {
   width: 100%;
   height: fit-content;
   background: linear-gradient(rgba(0, 0, 0, 0.75),
         rgba(0, 0, 0, 0.75)), url(../img/ctimbg.jpg);
   background-size: cover;
   background-position: center;
   background-attachment: fixed;
}



main{
   width: 100%;
   max-width: 1200px;
   margin-inline: auto;
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: flex-start;
   gap: 45px;


}

#info {
   font-family: 'Roboto', sans-serif;
   color: white;
   padding: 30px;
   max-width: 700px;
}

.subtitle-section h2 {
   font-size: 26px;
   line-height: 1.7;
   color: rgb(234, 233, 233);
}
.subtitle-section:not(:first-of-type){
   margin-top: 30px;
}

.subtitle-section p {
   font-size: 16px;
   line-height: 1.7;
   margin-top: 15px;
   color: rgb(199, 199, 199);
   text-align: justify;
}

#news{
   padding: 30px;
   font-family: 'Roboto', sans-serif;
   color: white;
   padding: 30px;
   max-width: 700px;
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
   align-items: flex-start;
}

#news h3{
   color: rgb(224, 224, 224);
   font-size: 26px;
}
#news h3 svg{
   height: 25px;
   width: auto;
   margin-left: 10px;
}
#news a{
   display: block;
   margin-top: 10px;
   text-decoration: none;
   color: rgb(225, 225, 225);
   font-size: 14px;
   line-height: 1.7;
}
#news a.first{
   margin-top: 30px;
}
#news a:hover{
   color: rgb(0, 221, 255);
}

.padding-container{
   width: 100%;
   padding: 20px;
   margin-top: 60px;
}
.video-container {
   position: relative;
   width: 100%;
   max-width: 800px;

   height: auto;
   aspect-ratio: 16/9;
   margin-inline: auto;
   background: linear-gradient(135deg, #1e1e1e, #222);
   border-radius: 15px;
   overflow: hidden;
   transform: perspective(1000px) rotateY(2deg);

}

video {
   width: 100%;
   height: 100%;

   border-radius: 10px;
}


@media (max-width: 1100px){
   main{
      flex-direction: column;
      max-width: 800px;
   }
}