.titanic{float: none;}

.warp-effect {position: fixed;width: 100%;height: 100%;background: radial-gradient(circle, rgba(255,255,255,0.1) 10%, rgba(0,0,0,1) 70%);opacity: 1;z-index: 100;}
#sfondo{position: fixed;width: 100%;height: 100%;z-index: 0;}

html,body{margin: 0;padding: 0;width: 100%;height: 100%;margin: 0;padding: 0;overflow: hidden;}
#main-content{padding: 0 10vh 0 10vh;display: flex;flex-direction: column;width: 100%;height: 100%;position: relative;max-height: 100vh;overflow: scroll;overflow-x: hidden;}
.box{flex-shrink: 0;min-height: 150vh;width: 100%;text-align: center;margin-bottom: 10vh;position: relative}
*{color: #faf4ff;font-family: 'Orbitron';}
.titolo{font-size: 8vh;}
.testigen{font-size: 3vh;}
.testigen2{font-size: 2.6vh;}
.testigen3{font-size: 4vh;}
.sarapatore{position: relative;margin: 10vh;}
.bottone{background-color: #a649ff;}
#navbar{padding: 1vh;position: fixed;top: 0;left: 0;width: 100%;}
#piedini{margin-top: 5vh;}
.navbartitolo{font-size: 3vh;}
.navbartesti {transition: color 0.5s ease-in-out, text-shadow 1s ease-in-out;cursor: pointer;}
.point{cursor: pointer;}
.navbartesti:hover {color: #a649ff;text-shadow: 0px 0px 25px rgba(166, 73, 255, 0.8);}
.sfondocensuraviola{background: rgba(81, 54, 128, 0.3);backdrop-filter: blur(10vh);}
#navbarpopup {opacity: 0;visibility: hidden;transition: opacity 0.3s ease, visibility 0.3s ease;}
#navbarpopup.show {opacity: 1;visibility: visible;}
.imgio{border: rgba(81, 54, 128, 0.9) solid 0.5vh;width: 35vh;height: fit-content;}
.img404{position: absolute;bottom: 0;left: 40px;height: 35vh;width: fit-content;}
.videoprogetti {width: 90vh;max-height: 80vh;height: fit-content;transition: transform 0.5s ease-in-out;}
.videoprogetti:hover {transform: scale(1.05);}
.imgcertificati{max-height: 50vh;width: fit-content;}
.modalcertificazioni{z-index: 99;}
.modalcertificazionidivinterno{overflow-y: scroll;max-height: 85vh;}

.readrecv{max-height: 90vh;overflow-y: auto;}
.imgcv{height: fit-content;width: 100%;}

.showcvdiv{max-height: 25vh;overflow: hidden;}
.showcv{height: 100%;width: fit-content;}
.cv-item{margin-bottom: 65px;transform: scale(1);transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;transform-origin: center;z-index: 1;border-radius: 5%;}
.cv-item:hover {transform: scale(1.2);box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.3);z-index: 2;}

.slider-container{overflow: hidden;}
.slider{display: flex;justify-content: center;align-items: center;transition: transform 0.5s ease-in-out;}
.slide{max-width: 250px;min-width: 250px;margin: 0 10px;padding: 15px;border-radius: 10px;text-align: center;opacity: 0.4;transform: scale(0.9);transition: opacity 0.5s, transform 0.5s;min-height: 50vh;max-height: 50vh;}
.slide.active{opacity: 1;transform: scale(1);border: 2px solid #7d15db;box-shadow: 0 0 15px #7d15db;overflow-y:auto;}
.title{font-size: 18px;font-weight: bold;margin-bottom: 10px;}
.skill{background-color: #bf7bff;padding: 5px;border-radius: 5px;margin: 3px 0;font-size: 14px;}
.nav-button{position: absolute;top: 50%;transform: translateY(-50%);background: #7d15db;border: none;color: white;padding: 1vh;cursor: pointer;z-index: 99;font-size: 5vh;transition: background 0.3s;}
.prev{left: 0px;}
.next{right: 0px;}

#progetti{display: flex;}

.social-btn {@apply bg-gray-700 hover:bg-gray-600 text-white font-bold py-2 px-4 rounded text-center block;display: inline-flex;align-items: center;transition: color 0.5s;}
.social-btn:hover{color: #9225f8 !important;}
.social-btn:hover svg {fill: #9225f8 !important;}
.imgsocial{width: 5vh;height: fit-content;margin-right: 8px;}
.contattibox{width: 100%;margin-left: 5vh;}
.forminput{min-height: 100px;}
.contattimibox{display: flex;}
@media (max-width: 500px) {.contattimibox{display: block;}}

@media (max-width: 9000px) {
    .iframe{height: 100%;}
}
@media (max-width: 500px) {
    .iframe{height: auto;}
    .img404{height: 20vh;}
    .box{margin-bottom: 20vh;margin-bottom: 30vh;}
    #main-content{padding: 5vh 5vh 0 5vh;}

    .sarapatore,.sarapatore2{margin: 3vh;}
    .titolo{font-size: 6vh;}
}

::-webkit-scrollbar {width: 12px;height: 12px;}
::-webkit-scrollbar-track {background-color: rgb(35,21,60);border-radius: 10px;}
::-webkit-scrollbar-thumb {background-color: rgb(35,21,60);border-radius: 10px;border: 3px solid rgba(0, 0, 0, 0.2);}
::-webkit-scrollbar-thumb:hover {background-color: rgb(25,15,50);}