@font-face {
    font-family: "caviar_dreamsregular";
    src: url(font/caviardreams.ttf);  
}

@font-face {
    font-family: "dalafloda_roman";
    src: url(font/dalafloda_roman.ttf);
}


*{
    box-sizing: border-box;
    margin: 0;
    padding 0;
}


body {
    font-family: 'caviar_dreamsregular', sans-serif;
    background-color: #6c9a8b!important;
}

.color_body{
    background-color: #fBf7f4!important;
}



/* NAV */




.menu-mobile{
    display: none;
}

#hamburger{
    display: none;
}


/* HOME*/

.inizio{
    height: 100vh;
}

h2 {
    color: #E8998D;
    font-family: 'dalafloda_roman';
    font-size: 120px!important;
    font-weight: 50;
    padding-left: 10%;
    padding-top: 7%;
    
}

h2 span {
    font-style: italic;
}

/*
#cerchio_mail {
      width: 100px;
      height: 100px;
      background: #fBf7f4 ;
      border-radius: 50%;
}
*/

.mail_home {
    transition: transform .2s;
     width: 100px;
      height: 100px;
      border-radius: 50%;
    
	transform: scale(1);
	animation: pulse 2s infinite;
}

@keyframes pulse {
	0% {
		transform: scale(0.95);
		
	}

	70% {
		transform: scale(1.1);
		
	}

	100% {
		transform: scale(0.95);
		
	}
}
    


.mail_home:hover{
    transform: scale(1.5);
}

.text_home {
   font-family: 'caviar_dreamsregular'; 
   font-size: 35px;
   color: #fBf7f4;
   padding: 0 15%!important;
    text-align: justify;    
/*   margin: 50px 10% 0 10%;*/
}

.bold_home {
    font-weight: 800!important;
}

.img_slider{
    width: 80%;
    margin: 0 auto;
    
   
}




.carousel-indicators li{
    border-radius: 50%!important;
    width: 10px!important;
    height: 10px!important;
    background-color: #E8998D!important;
    margin: -10px 10px!important;
   
}



button {
    
    font-size: 20px!important;
    
    
    
}

.btn {
    border-radius: 50%!important;
    height: 150px;
    width: 150px;
    background-color: #E8998D!important;
    display:block!important;
    margin:0px auto!important;;
    text-align:center!important;
    font-family: 'caviar_dreamsregular';
    transition: transform .2s;
    
}

.btn a {
    text-decoration: none!important;
    color: #fBf7f4!important;
}

.btn:hover{
    transform: scale(1.1);
}



.img-mobile-home{
    display: none;
}


.cerchio1{
    position: absolute;
    top: 100px;
    left: 70px;
    height: 700px;
    width: 700px;
    background: #fBf7f4 ;
    border-radius: 50%;
    z-index: -1000;
    
}


#cerchio2{
    position: absolute;
    top: -200px;
    left: 900px;
    height: 350px;
    width: 350px;
    background: #E8998D;
    border-radius: 50%;
    z-index: -1000;
}

#cerchio3{
    position: absolute;
    top: 200px;
    right: 0px;
    height: 400px;
    width: 400px;
    background-image: url(../img/cerchio3.svg);
    background-repeat: no-repeat;
    background-position: right;
     z-index: -1000;
    
    
}


#cerchio4{
    position: absolute;
    top: 1700px;
    left: -300px;
    height: 600px;
    width: 600px;
    border: 10px dotted #E8998D;
    border-radius: 50%;
    
}

#cerchio5{
    position: absolute;
    top: 1850px;
    right: 0px;
    height: 450px;
    width: 450px;
    background-image: url(../img/cerchio5.svg);
    background-repeat: no-repeat;
    background-position: right;
    
}





.about {
    font-family: 'caviar_dreamsregular'; 
   font-size: 35px;
   color: #fBf7f4;
    padding: 0 15%;
    line-height: 170%;
    text-align: justify;
}



#cerchio6{
    height: 700px;
    width: 700px;
    border-radius: 50%;
    position: absolute;
    top: 600px;
    left: -250px;
    z-index: -1000;
    background: #E8998D;
}

#cerchio7{
    height: 500px;
    width: 500px;
    z-index: -1000;
    position: absolute;
    top: 1600px;
    right: 0px;
    background-image: url(../img/cerchio7.svg);
    background-repeat: no-repeat;
    background-position: right;
    
    
}



a {
    text-decoration: none!important;
}


.container-wrap {
    width: 90%;
    margin: 0 auto;
}

.title_about {
    position: relative;
    float: left;
    margin-top: 100px;
    margin-left: 15%;
}

.pic_about {
    position: relative;
    float: right;
    margin-top: 50px;
    margin-right: 15%;
    
}

.pulisci {
    clear: both;
}

h3 {
    color: #EFD3CC;
    font-family: 'dalafloda_roman';
    font-size: 120px!important;
    font-weight: 50;
    
    line-height: 92%!important;
}
    
.bottone {
    margin: 50px auto;
    border-radius: 50%;
    height: 150px;
    width: 150px;
    background: #E8998D;
    text-align: center;
    font-family: 'caviar_dreamsregular';
     color: #fBf7f4!important;
    font-size: 20px;
    position: relative;
    transition: transform .2s;
    
  
}

.bottone:hover{
     transform: scale(1.1);
}

.bottone_text{
    position: absolute;
    top: 25%;
    right: 22%;
}

.bottone_text a {
    color: #fBf7f4!important;
}





/*PORTFOLIO*/

.title_portfolio h3{
    color: #6c9a8b!important;
    text-align: center;
    margin-top: 50px;
}

.flex-container{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    margin: 10% 0 3% 0;
    
}

.flex-row-top{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    margin-top: 10%;
}

.flex-row-bottom{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    margin-bottom: 5%;
}

.flex-row-middle{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
}

.immagine-port{
    height: 100%;
    width: 100%;
}

.title_over{
    font-family: 'dalafloda_roman';
    font-size: 30px;
    color: #fBf7f4;
    text-align: center;
    padding-top: 22.5%;
}

#primo{
    height: 290px;
    width: 480px;
    margin: 5px 5px;
}

.anteprima-1{
    display: none;
    height: 100%;
    width: 100%;
    background-color: #6c9a8b;
    
    
}

#secondo{
    height: 290px;
    width: 480px;
    margin: 5px 5px;
}


#terzo{
    height: 290px;
    width: 480px;
    margin: 5px 5px;
}

#quarto{
    height: 290px;
    width: 480px;
    margin: 5px 5px;
}

#quinto{
    height: 290px;
    width: 480px;
    margin: 5px 5px;
}

#sesto{
    height: 290px;
    width: 480px;
    margin: 5px 5px;
}

#settimo{
    height: 290px;
    width: 480px;
    margin: 5px 5px;
}

#ottavo{
    height: 290px;
    width: 480px;
    margin: 5px 5px;
}

#nono{
    height: 290px;
    width: 480px;
    margin: 5px 5px;
}






    
#primo:hover .anteprima-1{
    display: block;
    
    
}

#primo:hover .immagine-port{
    display: none;
}

#secondo:hover .anteprima-1{
    display: block;
    
}

#secondo:hover .immagine-port{
    display: none;
}


#terzo:hover .anteprima-1{
    display: block;
    
}

#terzo:hover .immagine-port{
    display: none;
}

#quarto:hover .anteprima-1{
    display: block;
    
}


#quarto:hover .immagine-port{
    display: none;
}

#quinto:hover .anteprima-1{
    display: block;
    
}

#quinto:hover .immagine-port{
    display: none;
}
    
#sesto:hover .anteprima-1{
    display: block;
    
}

#sesto:hover .immagine-port{
    display: none;
}

#settimo:hover .anteprima-1{
    display: block;
    
}

#settimo:hover .immagine-port{
    display: none;
}
  
#ottavo:hover .anteprima-1{
    display: block;
    
}

#ottavo:hover .immagine-port{
    display: none;
}
    
#nono:hover .anteprima-1{
    display: block;
    
}

#nono:hover .immagine-port{
    display: none;
}
    
    





/*PORTFOLIO PAGINE*/
.title-mobile{
    display:none;
}

.box{
    position: relative;
    overflow: hidden;
    text-align: center;
    margin: 5px;
    
}

.box::before{
    content: '';
    position: absolute;
    background-color: #6c9a8b;
    width: 400px;
    height: 241px;
    
    top: 0;
    left: 0;
    opacity: 0;
    transition: all 0.4s linear;
}

.box:hover::before{
    opacity: 1;
}

.box img{
    width: 400px;
    height: 241px;
     
    transition: all 0.4s linear;
}

.box:hover img{
    opacity: 0;
    transform: scale(3);
}

.box .box-content{
    width: 100%;
    transform: translateY(-50%) scale(0);
    position: absolute;
    top: 50%;
    left: 0;
    color: #fff;
     transition: all 0.4s linear;
}

.box:hover .box-content{
     transform: translateY(-75%) scale(1);
}


.title_work{
    position: relative;
    float: left;
    width: 50%;
    margin-top: 5%;
    margin-bottom: -100px;
    padding-left: 5%;
    
}


.text_work{
    position: relative;
    float: right;
    width: 50%;
    margin-top: 5%;
    font-family: 'caviar_dreamsregular';
    font-size: 15px;
    line-height: 170%;
    padding-right: 5%;
    padding-left: 10px;
    margin-bottom: -100px;
    text-align: justify;
}

h4 {
    color: #6c9a8b;
    font-family: 'dalafloda_roman';
    font-size: 60px!important;
}

h5 {
    color: #6c9a8b;
    font-family: 'dalafloda_roman';
    font-size: 25px!important;
}

.portfolio-unico{
   background: #6c9a8b;
    margin: 5px 5px!important; 
}



.portfolio-rettangolo{
   
    background: #6c9a8b;
    margin: 5px 5px!important;
}

.portfolio-rettangolo img{
    width: 600px;
    height: 800px;
}

.portfolio-quadrato{
   
   
    margin: 5px 5px!important;
}

.portfolio-quadrato img{
    width: 600px;
    height: 400px;
}

.bottone-portfolio{
    background: #6c9a8b;
}

.bottone_text_portfolio{
    padding-top: 22.5%;
    padding-left: 22.5%;
    text-align: justify;
}

.bottone_text_portfolio a {
    color: #fBf7f4!important;
}

.corsivo{
    font-style: italic;
}


/* FOOTER */

.copyright{
    font-family: 'caviar_dreamsregular';
    font-size: 12px;
    color: #E8998D;
}

#linea1{
    border-bottom: 8px dotted #E8998D;
    width: 33%;
    height: 100%;
    margin-top: 30px;
    
    
    
}

#linea2{
    border-bottom: 8px dotted #E8998D;
    width: 33%;
    height: 100%;
    margin-top: 30px;
    
}


#social{
    width: 33%;
    height: 100%;
    text-align: center;
    
    
}

#social li{
    display: inline-block;
    padding: 0 3%;
    
}

ul{
    margin: 0;
    padding: 0;
    
}



/*prova NAV*/

.logo{
    
    height: 100%;
    width: 10%;
    padding: 10px 20px;
}

nav {
    height: 100%;
    width: 80%;
    text-align: center;
    
}

nav li{
    font-family: 'dalafloda_roman';
    font-size: 25px;
    display: inline-block;
    padding-top: 45px;
    margin: 0 3%;
    color:#fBf7f4;
    
    
}


nav li:hover{
    color:  #EFD3CC;
}

#vuoto{
    display: flex;
    width: 10%;
}

.flex-nav{
    display: flex;
    flex-flow: row wrap;
    height: 10vh;
    
}

.flex-footer{
    display: flex;
    justify-content: space-between;
}

.flex-footer>div{
    flex-direction: row;
    
}

.nav-portfolio li{
    color:  #E8998D;
}



.title_mobile{
    display: none;
}


.title-start{
width: 100%;
margin: 0 auto;
text-align: left;
}



@keyframes fadeInRight {

0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
}

100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
    animation-duration: 1.5s;
    animation-iteration-count: 1;
}





.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    animation-duration: 1.5s;
    animation-iteration-count: 1;
}

@keyframes fadeInLeft {
0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
}
100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
    
}


.fade-in {
animation: fadeIn ease 4s;
    -webkit-animation: fadeIn ease 4s;}

@keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}


         
.fadeInDown {
               -webkit-animation-name: fadeInDown;
                animation-name: fadeInDown;
                animation-duration: 1s;
                animation-iteration-count: 1;
         }

@keyframes fadeInDown {
            0% {
               opacity: 0;
                -webkit-transform: translate3d(0, -100%, 0);
                transform: translate3d(0, -100%, 0);
            }
            100% {
               opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
            }
         }



/*MEDIA QUERIES*/

@media screen and (max-width: 1312px) and (min-width: 993px){
    
    
    .menu-mobile{
        display: none;
    }
    
    
    h2{
        font-size: 90px!important;
        
    }  
    
    
    .cerchio1{
         top: 90px;
    left: 70px;
    height: 500px;
        width: 500px;
}
    #cerchio2{
        top: -210px;
        left: 650px;
    }
    
    
    #cerchio3{
        top: 150px;
        right: 0;
        background-position: right;
       background-image: url(../img/cerchio3-3.svg); 
    }
    
    #cerchio4{
    top: 1400px;
    left: -250px;
    height: 500px;
    width: 500px;
    border: 10px dotted #E8998D;
    border-radius: 50%;
        
    }
    #cerchio5{
    top: 1500px;
    right: 0px;
    height: 450px;
    width: 450px;
    background-image: url(../img/cerchio5-2.svg);
    background-repeat: no-repeat;
        background-position: right; 
    }
    
    .text_home{
        font-size: 30px;
        
        
    }
    
    .mail_home img{
        height: 110px;
        width: 110px;
    }
    
    .btn-mobile-home{
        display: none;
    }
    
    .btn{
        height: 130px;
        width: 130px;
        
    }
    
   .btn a{
       text-align: center;
        font-size: 16px!important; 
    }

/*    menu */
    
    .logo{
    padding: 15px 15px;
}
    
    .logo img{
        width: 90px;
        height: 90px;
    }



nav li{
    
    font-size: 22px!important;
    padding-top: 40px;    
}
    
    
    /*  ABOUT  */
    
    
    h3{
        font-size: 95px!important;
    
    }
    
    
    .pic_about img{
        width: 350px;
        height: 350px;
    }
    
    .about{
        font-size: 28px;
        margin-top: -30px;
    }
    
    
    .bottone{
        height: 130px;
        width: 130px;
        text-align: center;
    }
    
    .bottone_text{
        font-size: 18px;
    }
    
    #cerchio6{
    height: 600px;
    width: 600px;
    
    top: 500px;
    left: -300px;
    
}

#cerchio7{
    height: 500px;
    width: 500px;
   
    top: 1400px;
    right: 0px;
    background-image: url(../img/cerchio7-2.svg);
    background-repeat: no-repeat;
    background-position: right;
    
    
}
    
    
    
    
    
  /* PORTFOLIO   */
    
    
    
    
    #primo{
    height: 237px;
    width: 390px;   
    }
    
    #secondo{
    height: 237px;
    width: 390px;   
    }
    
    #terzo{
    height: 237px;
    width: 390px;   
    }
    
    #quarto{
    height: 237px;
    width: 390px;   
    }
    
    #quinto{
    height: 237px;
    width: 390px;   
    }
    
    #sesto{
    height: 237px;
    width: 390px;   
    }
    
    
    #settimo{
    height: 237px;
    width: 390px;   
    }
    
    #ottavo{
    height: 237px;
    width: 390px;   
    }
    
    #nono{
    height: 237px;
    width: 390px;   
    }
    
    
    
    .portfolio-rettangolo img{
    height: 700px;
    width: 525px;
}
    
    .portfolio-quadrato img{
    height: 350px;
    width: 525px;
}
    
   
    
    
    
    
    
}











@media screen and (max-width: 1160px) and (min-width: 993px){
    
    
    .menu-mobile{
        display: none;
    }
    
    #linea1{
        margin-top: 55px!important;
    }
    
    #linea2{
        margin-top: 55px!important;
    }
    
    #cerchio4{
    top: 1300px;
    left: -180px;
    height: 450px;
    width: 450px;
    border: 7px dotted #E8998D;
    
        
    }
    
    #cerchio5{
    top: 1400px;
    background-image: url(../img/cerchio5-3.svg);
    background-repeat: no-repeat;
        background-position: right; 
    }
    
    
    h2{
        font-size: 95px!important;
        
    }
    
    
  .pic_about img{
        width: 280px!important;
        height: 280px!important;
    }  
    
    h3{
        font-size: 85px!important;
    }
    
    
    
    
    .about{
        padding: 0 10%;
    }
    
    .pic_about{
        margin-top: 80px;
        margin-right: 15%;
    }
    
    .title_about{
        margin-left: 15%;
    }
    
    
    
    
    
    .portfolio-rettangolo img{
        height: 600px;
        width: 450px;
    }
    
    
    .portfolio-quadrato img{
        height: 300px;
        width: 450px;
    }
    
    .text_work{
        font-size: 16px;
        margin-bottom: 0px;
    }
    
    
    
/*   FOOTER */
    
    
    
    #linea1{
    border-bottom: 6px dotted #E8998D;
    width: 30%;
    
    
    
    
}

#linea2{
    border-bottom: 6px dotted #E8998D;
    width: 30%;
    
}


#social{
    width: 40%;
    height: 100%;
    text-align: center;
    padding-top: 35px;
    
}

#social li{
    display: inline-block;
/*    padding: 0 3%;*/
    
} 
    
    #social li a img {
        height: 55px;
        width: 55px;
    }

}
    





@media screen and (max-width: 992px) and (min-width: 689px){
    
    #cerchio2{
        display: none;
    }
    
    
    .cerchio1{
      top: 100px;
      left: 50px;
      height: 470px;
      width: 470px;  
    }
    
    
     #cerchio4{
    top: 1200px;
    left: -200px;
    height: 400px;
    width: 400px;
    border: 7px dotted #E8998D;
    
        
    }
    
    #cerchio5{
    top: 1300px;
    background-image: url(../img/cerchio5-3.svg);
    background-repeat: no-repeat;
        background-position: right; 
    }
    
    #cerchio3{
        top: 200px;
        right: 0;
        background-position: right;
       background-image: url(../img/cerchio3-2.svg); 
    }
    
    nav{
        display: none!important;
    }
    
    
    
    .menu-mobile{
       
        width: 100%;
        height: 100vh;
        text-align: center;
        margin-top: 15%;
    }
    
    
    .menu-mobile li a{
        color: #E8998D;
        
        font-family:'dalafloda_roman';
        font-size: 40px;
        
        
    }
    
    
    .menu-mobile li{
        padding-top: 3%;
    }
    
    #hamburger{
        display: block;
        width: 80%;
        height: 10vh;
        text-align: right;
        padding: 20px;;
        
    }
    
    
    .logo img{
        height: 80px;
        width: 80px;
    }
    
    
    
    h2{
        font-size: 90px!important;
        padding-top: 9%;
        padding-left: 12%;
    }
    
    
    .mail_home{
        margin-top: 65px;
    }
    
    .text_home{
        font-size: 30px;
}
    
    
    
    .btn{
        height: 110px;
        width: 110px;
        
    }
    
   .btn a{
       text-align: center;
        font-size: 14.5px!important; 
    }
    
    h3{
        font-size: 85px!important;
        
    }
    
    .title_about{
        
        
        margin: 100px 0 50px 10%; ;
            
        }
    
    .pic_about{
        margin: 80px 10% 0 0;;
    }
   
    
    .pic_about img{
        height: 240px;
        width: 240px;
            
        }
    
    .about{
        font-size: 25px;
        padding: 0 5%;
    }
    
    
    
    .bottone{
        height: 120px;
        width: 120px;
        text-align: center;
    }
    
    .bottone_text{
        font-size: 16px;
    }
    
    
      #cerchio6{
    height: 400px;
    width: 400px;
    
    top: 400px;
    left: -250px;
    
}
    #cerchio7{
    
   
    top: 1300px;
    right: 0px;
    background-image: url(../img/cerchio7-3.svg);
    background-repeat: no-repeat;
    background-position: right;
    
    
}
    
    

/*   PORTFOLIO  */
    
    
    
   
    
   
    
    .portfolio-rettangolo img{
        height: 500px;
        width: 375px;
    }

    .portfolio-quadrato img{
        height: 250px;
        width: 375px;
    }

    
    .title_work{
        float: none;
        text-align: center;
        margin-bottom: 0;
        width: 100%;
    }
    
    .text_work{
        float: none;
        text-align: center;
        margin-bottom: 0;
        width: 100%;
        text-align: justify;
}
    
    h4{
        font-size: 50px!important;
    }
    
    h5{
        font-size: 25px;
    }
    
    
    
/*  FOOTER  */
    
   #linea1{
    border-bottom: 6px dotted #E8998D;
    width: 25%;
    margin-top: 60px!important;
    
    
    
}

#linea2{
    border-bottom: 6px dotted #E8998D;
    width: 25%;
    margin-top: 60px!important;
    
}


#social{
    width: 50%;
    height: 100%;
    text-align: center;
    padding-top: 35px;
    
}

#social li{
    display: inline-block;
    padding: 0 3%;
    
} 
    
    #social li a img {
        height: 50px;
        width: 50px;
    }

}


@media screen and (max-width: 940px) and (min-width: 806px){
    h2{
        font-size: 75px!important;
        margin-top: 5%!important;
    }
    
    
    mail_home{
        margin-top: 30px!important;
    }
    
    
    .cerchio1{
        left: -100px; 
    }

}



@media screen and (max-width: 805px) and (min-width: 689px){
    
    .img-mobile-home{
        display: block;
        margin-top: -300px;
        
    }
    
    .btn-mobile-home{
        display: block;
        margin-bottom: 20px;
    }
    
    .mobile{
        display: none;
    }
    
    .title-mobile{
        display: block;
        font-size: 30px;
        text-align: center;
        font-family: 'dalafloda_roman';
        color: #fBf7f4;
        margin-bottom: -10px;
        margin-top: 15px;
        background-color: #EFD3CC;
    }
    
    #cerchio2{
        display: none!important;
    }
    
    h2{
        font-size: 80px!important;
        
    }
    
    
    mail_home{
        margin-top: 20px!important;
    }
    
     
    .pic_about{
        display: none;
    }
    
    .title_about{
        float: none!important;
        text-align: center;
        margin: 100px auto 50px auto;
        
    }
    
    h3 {
        font-size: 100px!important;
    }
    
     .cerchio1{
        left: -100px; 
         height: 400px;
         width: 400px;
    }
    
    #cerchio4{
        top: 2800px;
    }
    
    #cerchio5{
        top: 2900px;
    }
    
    
    
}


@media screen and (max-width: 688px) {
    
    .img-mobile-home{
        display: block;
        margin-top: 40%;
    }
    
    .title-mobile{
        display: block;
        font-size: 30px;
        text-align: center;
        font-family: 'dalafloda_roman';
        color: #fBf7f4;
        margin-bottom: -10px;
        margin-top: 15px;
        background-color: #EFD3CC;
        line-height: 35px;
    }
    
    .box-content{
        display: none;
    }
    
    .box{
    position: relative;
    overflow: hidden;
    text-align: center;
    margin: 5px;
    
}

.box::before{
    width: 100%;
    height: 100%;
    transition: none;
}

.box:hover::before{
    opacity: 0;
}

.box img{
  width: 100%;
    height: auto;
    transition: none;
}

.box:hover img{
    opacity: 1;
    transform: none;
}

.box .box-content{
    width: 100%;
    transform: none;
    position: absolute;
    top: 0;
    left: 0;
    
     transition: none;
}

.box:hover .box-content{
     transform: none;
}
    
    
    
    
    #cerchio2{
        display: none!important;
    }
    
    nav{
        display: none!important;
    }
    
    
    
    .menu-mobile{
       
        width: 100%;
        height: 100vh;
        text-align: center;
        margin-top: 20%;
    }
    
    
    .menu-mobile li a{
        color: #E8998D;
        
        font-family:'dalafloda_roman';
        font-size: 50px;
        
        
    }
    
    
    .menu-mobile li{
        padding-top: 3%;
    }
    
    #hamburger{
        display: block;
        width: 75%;
        height: 10vh;
        text-align: right;
        padding: 5px;
        
    }
    
    .mobile{
        display: none;
        
    }
    
    .logo img{
        height: 80px!important;
        
    }
    
    
    .pic_about{
        display: none;
    }
    
    .title_about{
        float: none!important;
        text-align: center;
        margin: 100px auto 50px auto;
        
    }
    
    h2{
        font-size: 70px!important;
        margin-top: 10%!important;
    }
    
    h3 {
        font-size: 90px!important;
    }
    
    .cerchio1{
        height: 500px;
        width: 500px;
        left: -150px;
        top: 120px;
    }
    
    
    #cerchio3{
        background-image: url(../img/cerchio3-4.svg);
        z-index: -1000;
        top: 300px;
    }
    
    #cerchio4{
        top: 2150px;
        left: -150px;
        width: 350px;
        height: 350px;
        border: 7px dotted  #E8998D;
    }
    
    #cerchio5{
        display: none;
    }
    
    .mail_home img{
        height: 90px;
        
    }
    
    .mail_home{
        margin: 50px auto;
        
    }
    
    .text_home{
        font-size: 25px;
        padding: 0 15%!important;
       
        
    }
    
    
    .btn{
        height: 100px;
        width: 100px;
        line-height: 15px!important;
        
    }
    
    .btn a{
       text-align: center;
        font-size: 12.5px!important; 
        
    }

    
    .about{
        font-size: 25px!important;
        padding: 0 5%;
    }
    
    #cerchio6{
    height: 400px;
    width: 400px;
    
    top: 400px;
    left: -250px;
    
}
    #cerchio7{
    
   
    top: 1300px;
    right: 0px;
    background-image: url(../img/cerchio7-4.svg);
    background-repeat: no-repeat;
    background-position: right;
    
    
}
    
    
    
.portfolio-rettangolo img{
    height: 600px;
    width: 450px;
}

    
    .portfolio-quadrato img{
    height: 300px;
    width: 450px;
}
    
    
    
.title_work{
        float: none;
        text-align: center;
        margin-bottom: 0;
        width: 100%;
    }
    
    .text_work{
        float: none;
        text-align: center;
        margin-bottom: 0;
        width: 100%;
        text-align: justify;
        
}
    
    h4{
        font-size: 50px!important;
    }
    
    h5{
        font-size: 25px;
    }
 
    
    .bottone{
        height: 100px;
        width: 100px;
        font-size: 15px;
    }

    
    /*   FOOTER */
    
    
    #linea1{
    display: none;   
}

    #linea2{
    display: none;
    
}


#social{
    width: 1000%;
    height: 100%;
    text-align: center;
    padding-top: 35px;
    
}

#social li{
    display: inline-block;
    padding: 0 3%;
    
} 
    
    #social li a img {
        height: 50px;
        width: 50px;
    }

    
    
}