@font-face {

    font-family: comfortaa;

    src: url(../assets/fonts/comfortaa/Comfortaa-VariableFont_wght.ttf);

    font-display: swap

}





@font-face {

    font-family: patrikHand;

    src: url(../assets/fonts/patrikHand/PatrickHand-Regular.ttf);

    font-display: swap

}



@font-face {

    font-family: gluten;

    src: url(../assets/fonts/gluten/Gluten-VariableFont_slnt\,wght.ttf);

    font-display: swap

}





* {

    padding: 0px;

    margin: 0px;

    box-sizing: border-box;

}





:root {

    --main-yellow: #F9C318;

    --main-green: #C5D555;

    --main-red: #DC462C;

    --main-white: #fcfcfc;

    --secondary-blue: #b1e2f3;

    --secondary-purple: #F5EBFB;

}



.text-justify{

    text-align: justify;

}



h1,

h2,

h3,

h4,

h5,

h6,

.h1,

.h2,

.h3,

.h4,

.h5,

.h6 {}



h3, .h3{

    font-family: patrikHand;

}



h2{

    font-family: gluten;

    font-weight: 400 !important;

    color: var(--main-yellow)

}



p,

span,

strong,

em {



    letter-spacing: 1px;

    font-family: comfortaa;

}



a {

    text-decoration: none;

}



a:hover {

    text-decoration: underline;

}

ul{

    word-break: break-word;

}

/* SCROLLBAR */



footer ::-webkit-scrollbar-thumb {

    border-radius: 20px;

}



::-webkit-scrollbar {

    width: 10px;

    background-color: transparent;

    max-height: 100px;

}



::-webkit-scrollbar-thumb {

    background: var(--bs-dark);

}



::-webkit-scrollbar-track {

    background-color: var(--bs-light);

}





/* HEADER */



.link-logo {

    text-decoration: none !important;

}



header.header-top {

    background-color: var(--main-white);

    position: fixed;

    top: 0;

    z-index: 10;

    display: flex;

    align-items: center;

    transition: 0.8s;

    z-index: 1000;

    box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 10px 10px;

}



header.header-top .row {

    width: 100%;

}



@keyframes direction-menu {

    from {flex-direction: column;}

    to {flex-direction: row;}

  }

header.header-top .row .col-12 {

    display: flex;

   

    align-items: center;

    flex-direction: column;

}





h1 img {

    height: 65px;

}



header.header-top .row .col-12 .spinner-border {

    height: 80px;

    width: 80px;

    animation-duration: 1.3s;

    color: #F9C318 !important;

    --bs-spinner-border-width: 0.50em;



}



header ul {

    list-style: none;



}



.ul-nav a {

    color: unset;

    text-decoration: none;

    margin-left: 40px;

}



header ul a li, header .accordion-item a.accordion-header span, .ul-nav .dropdown .harlequin{



    font-size: 30px;

    display: flex;

    align-items: center;

    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25);

}



header ul a li span, header .accordion-item a.accordion-header span, .ul-nav .dropdown .harlequin span{

    font-family: patrikHand;

    

}



header .dropdown-menu .dropdown-item{

    font-size: 20px;

    font-family: 'comfortaa';

    font-weight: 500 !important;



}

/* SIDEBAR */



.hamburger, .sidebar-close{

    color: black;

    font-size: 30px;

}

.offcanvas{

    width: 100% !important;

}

.offcanvas h2 img{

    height: 40px;

}



.dropdown-menu a{

    margin: 0;

}



.offcanvas ul a, .offcanvas .accordion-body ul li{

    margin-bottom: 18px;

}









@media screen and (max-width: 1300px) {



    .ul-nav li, header .accordion-item a.accordion-header span, .ul-nav .dropdown .harlequin span{

        font-size: 25px;

    }

    .ul-nav a, header .accordion-item a.accordion-header{

       margin-left: 30px

    }

    h1 img {

        height: 50px;

    }

    .ul-nav .dropdown-menu a{

        margin: 0;

    }



}



@media screen and (max-width: 992px) {

    header .accordion-body ul li{

        font-size: 18px;

        font-family: "comfortaa";

        font-weight: 500;

    }

    header .dropdown-menu .dropdown-item{

        font-size: 18px;

    }

    /* .ul-nav a, header .accordion-item a.accordion-header{

       margin-left: 0px

    } */



}





@media screen and (max-width: 676px) {



  

    h1 img {

        height: 40px;

    }

}





/* FOOTER */

footer{

    background-color: var(--main-white);

    height: 300px;

}

footer .row{

    background-color: var(--main-white); 

}

footer .logotype{

    height: 50px;

}

.social-container{

    display: flex;

    flex-direction: column;

}

.social-container a i{

    font-size: 70px;

    color: var(--secondary-blue);

    text-shadow: 2px 2px 5px rgba(0,0,0,0.6);

}

.social-container a{

    width: fit-content;

}



.accordion-header {

    display: flex;

    justify-content: center;

    align-items: center;

    text-align: center;

    width: 100%;

}



.accordion-body {

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    text-align: center;

    padding: 10px 0;

    margin: 0;

    width: 100%;

}



.accordion-collapse {

    transition: all 0.3s ease-in-out;

    width: 100%;

}





/* MAIN */

main{

    min-height: 85vh;

    padding-top: 80px;

    background-color: var(--secondary-blue);

}



main.chi-siamo .main-col,main.as-2425 .main-col, main.attività-didattiche .main-col, main.uscite-didattiche .main-col, main.info-documenti .main-col,main.contatti .main-col, main.home .main-col{

    background-color: var(--main-white);

    border-radius: 10px;

}

main .row{

    margin:0

}

h2 span{

    font-family: gluten !important;

}



.as-2425 ul, .uscite-didattiche ul{

    font-family: comfortaa;

}



@media screen and (min-width: 1400px){

    .main-col{

        padding-left: 200px !important;

        padding-right: 200px !important;

    }

}



/* HOME */



.hero{

    background: linear-gradient(transparent, rgba(0,0,0,0.7)), url(../assets/img/hero.jpg);

    min-height: 85vh;

    background-size: cover;

    background-repeat: no-repeat;

    background-position: center;

    position:relative;

    overflow: hidden;

}



.hero-logo{

    height: 300px;

    width: 300px;

    background-color: var(--main-white);

    border-radius: 50%;

    background-size: contain;

    background-repeat: no-repeat;

    position: absolute;

    bottom: -50px;

    left: 90px;

    display: flex;

    justify-content: center;

    align-items: center;

}



.hero-logo img{

    height: 70%;

    padding-bottom:20px

}



.home .row{

    background-color: var(--secondary-blue);

}

.home .row .col-10{

    background-color: var(--main-white);

}

.quote{

    margin-bottom: 230px;

    background-color:rgba(0, 0, 0, 0.5);

    backdrop-filter: blur(1px);

    border-radius:12px

}



@media screen and (max-width:991px){

    .quote{

        margin-bottom: 50px;

   

    }

    .hero{

    

        background-position: 25%;



    }

}

/* CHI SIAMO */







/* AS */





main.as-2425 .frame, main.attività-didattiche .frame{

    background-color: var(--main-white);

    border-radius: 50%;

    height: 200px;

    width: 200px;



    padding: 10px;

    background-size: cover;

    background-repeat: no-repeat;

    border: 10px solid var(--secondary-blue);

}

.lab-1{

    background-image: url(../assets/img/musica.jpg);

}

.lab-2{

    background-image: url(../assets/img/psicomotricità.jpg);

}

.lab-3{

    background-image: url(../assets/img/lettura\ con\ animali.jpg);

}

.lab-4{

    background-image: url(../assets/img/sperimentazioni_artistiche.jpg);  

}

.lab-5{

    background-image: url(../assets/img/manipolazione_travasi.jpg);  

}

.lab-6{

    background-image: url(../assets/img/percorso_sensoriale.jpg);  

}



.lab-7{

    background-image: url(../assets/img/seminiamo\ per\ crescere.jpg);  

}

.lab-8{

    background-image: url(../assets/img/scienze\ e\ matematica.jpg);  

}

.lab-9{

    background-image: url(../assets/img/lingua\ straniera\ -\ inglese.png);  

}

.lab-10{

    background-image: url(../assets/img/musica.jpg);

}

.lab-11{

    background-image: url(../assets/img/educazione\ alimentare.jpg);

}

.lab-12{

    background-image: url(../assets/img/educazione\ civico-stradale.png);

}

.lab-13{

    background-image: url(../assets/img/scuola\ outdoor.jpg);

}

.lab-14{

    background-image: url(../assets/img/abc.jpg);

}

.lab-15{

    background-image: url(../assets/img/coding.jpg);

}

.lab-16{

    background-image: url(../assets/img/IRC\ religione.jpg);

}

.lab-17{

    background-image: url(../assets/img/biblioteca.jpg);

}





/* INFO E DOCUMENTI */





.download-button{

    text-decoration: none !important;

    background-color: var(--main-yellow);

    border:none;

    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.25);

    font-family: comfortaa;

    font-weight: 700;

    color: var(--main-red);

    padding: 0.6rem 1.2rem;

    height: 50px;

    display: flex;

    align-items: center;

}





.download-button:hover, .download-button:active{

    background-color: var(--secondary-blue) !important;

}