/*-----------------------------[ About ]--------------------------------
/*-----------------------------[ About ]--------------------------------
 * Template Name         : Arwa - Personal Portfolio
 * Theme Author Name     : Mo Designer
 * Created Date          : 01 /08/ 2021
 * Type                  : HTML Template
 * Tags                  : Portfolio, Multipurpose, Resume, Cv 
 * Version               : 1.0

----------------------------------------------------------------------*/
                                    /*---------------------------[Table of contents]------------------------
-01.Google Font
-02.General style
-03.Hedaer Section
-04.Home Section
-05.About Section
-06.Works Section
-07.Blog Section
-08.Blog Single Section
-09.Contact Section
-10.Responsive Media Query
------------------------------------------------------------------- --*/
                                    /* ----------------------------{ 01.Google Font }-------------------- */
                                    
                                    @import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700&display=swap');
                                    @import url('https://fonts.googleapis.com/css2?family=Raleway+Decorative:wght@400;700&display=swap');
                                    @import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;700&display=swap');
                                    /*Carousel custom */
                                    
                                    .carousel-fade .active.carousel-item-start,
                                    .carousel-fade .active.carousel-item-end {
                                        transition: opacity 5s 0s;
                                    }
                                    
                                    .contenitore {
                                        overflow: hidden;
                                    }
                                    
                                    .carousel-item {
                                        animation: zoom 5s alternate;
                                    }
                                    
                                    @keyframes zoom {
                                        to {
                                            transform: scale(1.06);
                                        }
                                        form {
                                            transform: scale(1);
                                        }
                                    }
                                    /* ----------------------d-----{  02.General style }------------------ */
                                    
                                    .rounded {
                                        max-width: 40px;
                                    }
                                    
                                    .whatsapp-button {
                                        position: fixed;
                                        bottom: 50px ;
                                        left: 50px;
                                        width: 150px;
                                        height: 45px;
                                        border-radius: 20px;
                                      	color: white;
                                        float: right;
                                        border: white 1px solid;
                                        background-color: #eed677 !important;
                                        padding-top: 5px;
                                        cursor: pointer;
                                    }

									@media screen and (max-width: 600px) {
										.whatsapp-button{
											width: 45px;
											left: 20px;
										}
									}
                                    
                                    .portolio-line {
                                        display: block;
                                        width: 300px;
                                        height: 2px;
                                        border-top: 5px solid #333333;
                                        margin: 0 auto;
                                    }
                                    
                                    * {
                                        margin: 0;
                                        padding: 0;
                                        box-sizing: border-box;
                                        list-style: none;
                                        text-decoration: none;
                                    }
                                    
                                    html {
                                        scroll-behavior: smooth;
                                        font-size: 16px;
                                    }
                                    
                                    body {
                                        line-height: 1.6;
                                        font-size: 16px;
                                        position: relative;
                                        background: #FFFBFB;
                                        color: #000000;
                                        font-family: 'Raleway', sans-serif;
                                        -webkit-text-size-adjust: none;
                                        -webkit-font-smoothing: subpixel-antialiased;
                                    }
                                    
                                    img {
                                        max-width: 100%;
                                        height: auto;
                                    }
                                    
                                    a {
                                        color: #FFFFFF;
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    
                                    a:hover {
                                        text-decoration: none;
                                        color: #888888;
                                    }
                                    
                                    textarea,
                                    textarea:focus,
                                    input,
                                    input:focus,
                                    button,
                                    button:focus {
                                        outline: none;
                                        resize: inherit;
                                    }
                                    /*
 .btn{
  background: #FFFFFF;
  color: #111111;
  padding: 10px 20px;
  border-radius: 0;
  -webkit-transition: 0.5s ease-in-out;
          transition: 0.5s ease-in-out;
  }
.btn:focus{
  box-shadow: none;
}
.btn:hover{
  background:#BBBBBB;
}
*/
                                    
                                    .sticky {
                                        background: #262626;
                                        -webkit-box-shadow: 0 10px 10px -10px rgba(80, 76, 76, 0.35);
                                        box-shadow: 0 10px 10px -10px rgba(80, 76, 76, 0.35);
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    
                                    .overlay {
                                        width: 100%;
                                        height: 100%;
                                        background-color: rgba(10, 10, 10, 0.6);
                                        position: fixed;
                                        display: none;
                                    }
                                    
                                    .section-title {
                                        text-align: center;
                                        color: white;
                                    }
                                    
                                    .section-title .sub-title {
                                        display: block;
                                        color: #FFFFFF;
                                    }
                                    
                                    .section-title .title {
                                        display: inline-block;
                                        padding: 0px 20px;
                                        position: relative;
                                    }
                                    
                                    .section-title .title::after {
                                        content: "";
                                        position: absolute;
                                        bottom: 0;
                                        height: 1px;
                                        width: 50%;
                                        margin: 0 auto;
                                        background: #888888;
                                        left: 0;
                                        right: 0;
                                    }
                                    
                                    h1,
                                    h2,
                                    h3,
                                    h4,
                                    h5,
                                    h6 {
                                        font-family: 'Raleway', sans-serif;
                                        font-weight: 200;
                                        line-height: 1.5;
                                    }
                                    
                                    h1,
                                    .h1 {
                                        font-size: 5rem;
                                    }
                                    
                                    h2,
                                    .h2 {
                                        font-size: 3.0rem;
                                    }
                                    
                                    h3,
                                    .h3 {
                                        font-size: 3.2rem;
                                    }
                                    
                                    h4,
                                    .h4 {
                                        font-size: 2.133rem;
                                    }
                                    
                                    h5,
                                    .h5 {
                                        font-size: 1.467rem;
                                    }
                                    
                                    h6,
                                    .h6 {
                                        font-size: 1.2rem;
                                    }
                                    
                                    p {
                                        font-size: 20px;
                                    }
                                    
                                    .margin-b {
                                        margin-bottom: 100px;
                                    }
                                    /* custom scroll bar */
                                    
                                     ::-webkit-scrollbar {
                                        width: 8px;
                                        border-radius: 10px;
                                    }
                                    
                                     ::-webkit-scrollbar-track {
                                        background: #333333;
                                    }
                                    
                                     ::-webkit-scrollbar-thumb {
                                        border-radius: 10px;
                                        background: #555555;
                                    }
                                    
                                     ::-webkit-scrollbar-thumb:hover {
                                        background: #BBBBBB;
                                    }
                                    /* custom selection */
                                    
                                     ::-moz-selection {
                                        background: #888888;
                                        color: #fff;
                                    }
                                    
                                     ::selection {
                                        background: #888888;
                                        color: #fff;
                                    }
                                    
                                    .preloader {
                                        position: fixed;
                                        left: 0;
                                        right: 0;
                                        bottom: 0;
                                        top: 0;
                                        z-index: 200;
                                        cursor: pointer;
										background-image: url("../../immagini/sfondo-cristal.png");
										background-repeat: no-repeat;
										background-size: cover;
                                    }
                                    
                                    .preloader .loader {
                                        width: 50vw;
                                        height: 50vh;
                                        left: 50%;
                                        top: 50%;
                                        transform: translate(-50%, -50%);
                                        position: absolute;
                                        text-align: center;
                                        align-items: center;
                                    }
                                    
                                    .preloader .preload-btn {
                                        width: 100%;
                                        position: absolute;
                                        bottom: 30%;
                                        color: white;
                                    }
                                    
                                    .myVideo {
                                        position: fixed;
                                        right: 0;
                                        bottom: 0;
                                        min-width: 100vw;
                                        min-height: 100vh;
                                    }
                                    
                                    .preloader .loader-content {
                                        width: 300%;
                                        position: absolute;
                                        left: 1%;
                                        bottom: 20%;
                                        -webkit-animation: arwa_animation1 1.5s forwards;
                                        animation: arwa_animation1 1.5s forwards;
                                        -webkit-animation-delay: 1s;
                                        animation-delay: 1s;
                                        opacity: 0;
                                    }
                                    
                                    .preloader .loader-content::after {
                                        content: "";
                                        -webkit-animation: arwa_animation2 1s forwards;
                                        animation: arwa_animation2 1s forwards;
                                        -webkit-animation-delay: 1.5s;
                                        animation-delay: 1.5s;
                                        opacity: 0;
                                    }
                                    /*-------------------------------- 001 Hedaer servizio ------------------------------- */
                                    
                                    .section-head {
                                        width: 100vw;
                                        height: 40vh;
                                        padding: 75px 0 0 100px;
                                    }
                                    /*425*/
                                    
                                    @media screen and (max-width: 600px) {
                                        .section-head {
                                            padding: 10px 0 0 20px;
                                        }
										.loader-content{
											width: 500%;
											position: relative;
											bottom: 10vw;
										}
										.btn-entra{
											position: relative;
											top: 30px;
										}
                                    }
                                    /* ---------------------------{  03.Hedaer Section }------------------ */
                                    
                                    header {
                                        width: 100%;
                                        position: fixed;
                                        top: 0;
                                        left: 0;
                                        right: 0;
                                        z-index: 100;
                                    }
                                    
                                    .logo-section {
                                        position: absolute;
                                        top: 100px;
                                        margin: 0 auto;
                                        z-index: 110;
                                    }
                                    
                                    .logo {
                                        margin: 0 auto;
                                        width: 100vw;
                                        display: flex;
                                        justify-content: center
                                    }
                                    
                                    .logo-section a {
                                        color: #FFFFFF;
                                        font-family: 'Raleway Decorative', cursive;
                                    }
                                    
                                    .slide-title {
                                        text-align: center;
                                        position: absolute;
                                        top: 300px;
                                        ;
                                        width: 100%;
                                        height: auto;
                                        z-index: 102;
                                        color: white;
                                    }
                                    
                                    .tit1 {
                                        text-transform: lowercase;
                                    }
                                    
                                    .tit2 {
                                        margin: 0 auto;
                                        width: 75%;
                                        font-size: 80px;
                                        font-weight: 400;
                                        border-bottom: 1px solid white;
                                        border-top: 1px solid white;
                                    }
                                    
                                    .button-title {
                                        font-size: 40px;
                                        font-weight: 300;
                                        margin: 30px auto 0;
                                        width: 150px;
                                        left: 50%;
                                        transform: rotate(-90deg);
                                    }
                                    
                                    .button-title:hover {
                                        font-size: 60px;
                                    }
                                    
                                    .toggle-btn {
                                        position: absolute;
                                        top: 0;
                                        right: 0;
                                        width: 50px;
                                        margin: 50px 60px;
                                        cursor: pointer;
                                        color: #BBBBBB;
                                    }
                                    
                                    .toggle-btn span {
                                        color: #BBBBBB;
                                        height: 2px;
                                        width: 100%;
                                        background: #FFFFFF;
                                        display: block;
                                        margin: 8px auto;
                                        -webkit-transition: 0.5s ease-in-out;
                                        transition: 0.5s ease-in-out;
                                    }
                                    
                                    .toggle-btn:hover.toggle-btn .span2 {
                                        width: 80%;
                                        background: #333333;
                                    }
                                    
                                    .toggle-btn:hover.toggle-btn .span1 {
                                        background: #333333;
                                    }
                                    
                                    .toggle-btn:hover.toggle-btn .span3 {
                                        background: #333333;
                                    }
                                    
                                    #menu {
                                        position: relative;
                                        top: 150px;
                                    }
                                    /* ---------------------------{  04.Home Section }------------------ */
                                    
                                    .home-container {
                                        width: 100%;
                                        padding-right: 15px;
                                        padding-left: 15px;
                                        margin-right: auto;
                                        margin-left: auto;
                                    }
                                    
                                    .home-img {
                                        height: 100vh;
                                        width: 100%;
                                        background-position: center;
                                        background-size: cover;
                                        background-repeat: no-repeat;
                                    }
                                    
                                    .home-content {
                                        height: 100vh;
                                        position: relative;
                                    }
                                    
                                    .home-content-inner {
                                        position: absolute;
                                        top: 30%;
                                        left: 15%;
                                    }
                                    
                                    .nav-menu {
                                        position: fixed;
                                        left: 0;
                                        right: 0;
                                        bottom: 0;
                                        top: 0;
                                        width: 100%;
                                        height: 100vh;
                                        background: #333333;
                                        padding: 80px 0;
                                        z-index: 110;
                                        overflow: scroll;
                                        opacity: 0;
                                        -ms-transform: translateY(100%);
                                        -webkit-transform: translateY(100%);
                                        -o-transform: translateY(100%);
                                        transform: translateY(100%);
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    
                                    .nav-menu-show {
                                        -ms-transform: translateY(0%);
                                        -webkit-transform: translateY(0%);
                                        -o-transform: translateY(0%);
                                        transform: translateY(0%);
                                        opacity: 1;
                                    }
                                    
                                    .nav-list,
                                    .nav-content-link {
                                        margin-top: 20px;
                                    }
                                    
                                    .nav-list li a {
                                        color: #888888;
                                        display: inline-block;
                                        font-family: 'Raleway', serif;
                                        -webkit-transition: 0.38s ease-in-out;
                                        transition: 0.38s ease-in-out;
                                    }
                                    
                                    .nav-list li a:hover {
                                        color: #FFFFFF;
                                    }
                                    
                                    .nav-content-link {
                                        height: 100%;
                                        text-align: center;
                                        display: flex;
                                        justify-content: center;
                                        align-items: center;
                                    }
                                    
                                    .nav-content-link .nav-link-phone,
                                    .nav-content-link .nav-link-mail {
                                        display: block;
                                    }
                                    
                                    .nav-socail-media {
                                        margin-top: 20px;
                                    }
                                    
                                    .nav-socail-media li {
                                        display: inline-block;
                                        padding: 15px;
                                    }
                                    
                                    .nav-socail-media li a {
                                        color: #888888;
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    
                                    .nav-socail-media li a:hover {
                                        color: #FFFFFF;
                                    }
                                    
                                    .btn-close {
                                        width: 40px;
                                        height: 40px;
                                        position: absolute;
                                        top: 40px;
                                        right: 50px;
                                        cursor: pointer;
                                        -webkit-transition: 0.5s ease-in-out;
                                        transition: 0.5s ease-in-out;
                                    }
                                    
                                    .btn-close:hover {
                                        -webkit-transform: rotate(360deg);
                                        transform: rotate(360deg);
                                    }
                                    
                                    .btn-close:hover.btn-close span {
                                        background: #FFFFFF;
                                    }
                                    
                                    .btn-close span {
                                        height: 3px;
                                        width: 90%;
                                        background: #888888;
                                        display: block;
                                        margin: 7px auto;
                                        -webkit-transition: 0.5s ease-in-out;
                                        transition: 0.5s ease-in-out;
                                    }
                                    
                                    .btn-close .span1 {
                                        -webkit-transform: rotate(45deg) translateY(6px) translateX(5px);
                                        transform: rotate(45deg) translateY(6px) translateX(5px);
                                    }
                                    
                                    .btn-close .span2 {
                                        -webkit-transform: rotate(-45deg) translateY(-1px) translateX(1px);
                                        transform: rotate(-45deg) translateY(-1px) translateX(1px);
                                    }
                                    /* Home Animation */
                                    
                                    @keyframes arwa_animation1 {
                                        0% {
                                            transform: translateY(2rem);
                                        }
                                        100% {
                                            transform: translateY(0rem);
                                            opacity: 1;
                                        }
                                    }
                                    
                                    @keyframes arwa_animation2 {
                                        0% {
                                            transform: scale(2);
                                        }
                                        100% {
                                            transform: scale(1);
                                            opacity: 1;
                                        }
                                    }
                                    
                                    @keyframes arwa_animation4 {
                                        0% {
                                            transform: scale(1);
                                            opacity: 1;
                                        }
                                        100% {
                                            transform: scale(2);
                                            opacity: 1;
                                        }
                                    }
                                    /*class sbarra + animation*/
                                    
                                    .sbarra {
                                        margin: auto;
                                        width: 100px;
                                        height: 3px;
                                        background-color: #E1C16E;
                                        animation: allunga infinite 3s linear alternate;
                                    }
                                    
                                    .sbarra-v2 {
                                        width: 100px;
                                        height: 3px;
                                        background-color: #E1C16E;
                                        animation: allunga infinite 3s linear alternate;
                                    }
                                    
                                    @keyframes allunga {
                                        from {
                                            width: 100px;
                                        }
                                        to {
                                            width: 300px;
                                        }
                                    }
                                    /* ---------------------------{  05.About Section }------------------ */
                                    
                                    .about-section {
                                        width: 100%;
                                        min-height: 980px;
                                        overflow: hidden;
                                    }
                                    
                                                                        
                                    .aboutus_img_logo {
                                        margin-right: 30px;
                                        width: 50%;
                                        padding-right: 50px;
                                    }
                                    
                                    .about-p {
                                        height: auto;
                                    }
                                    
                                    .cube {
                                        position: relative;
                                        top: 10vh;
                                        left: 30vw;
                                        width: 10px;
                                        height: 10px;
                                        border: solid 1px black;
                                        z-index: 999;
                                        background: url("../../img/house.jpg") cover;
                                        transform-origin: top left;
                                        transform: scale(0) rotate(0deg) translate(-50%, -50%);
                                        animation: cube 12s ease-in forwards infinite;
                                    }
                                    
                                    .cube:nth-child(2n) {
                                        border-color: #bd9189;
                                    }
                                    
                                    .cube:nth-child(2) {
                                        animation-delay: 1s;
                                        left: 15vw;
                                        top: 40vh;
                                    }
                                    
                                    .cube:nth-child(3) {
                                        animation-delay: 4s;
                                        left: 75vw;
                                        top: 5vh;
                                    }
                                    
                                    .cube:nth-child(4) {
                                        animation-delay: 6s;
                                        left: 10vw;
                                        top: 20vh;
                                    }
                                    
                                    .cube:nth-child(5) {
                                        animation-delay: 8s;
                                        left: 10vw;
                                        top: 85vh;
                                    }
                                    
                                    .cube:nth-child(6) {
                                        animation-delay: 10s;
                                        left: 50vw;
                                        top: 10vh;
                                    }
                                    
                                    .cube:nth-child(7) {
                                        animation-delay: 12s;
                                        left: 70vw;
                                        top: 85vh;
                                    }
                                    
                                    .cube:nth-child(8) {
                                        animation-delay: 14s;
                                        left: 35vw;
                                        top: 85vh;
                                    }
                                    
                                    @keyframes cube {
                                        from {
                                            transform: scale(0) rotate(0deg) translate(-50%, -50%);
                                            opacity: 1;
                                        }
                                        to {
                                            transform: scale(20) rotate(960deg) translate(-50%, -50%);
                                            opacity: 0;
                                        }
                                    }
                                    
                                    .about {
                                        margin-top: 100px;
                                        margin-bottom: 50px;
                                    }
                                    
                                    .about-content .question {
                                        color: #FFFFFF;
                                    }
                                    
                                    @media screen and (max-width:1000px) {
                                        .appuntamento {
                                            padding-top: 50px;
                                        }
                                    }
                                    
                                    .about-list li {
                                        padding: 5px 0;
                                    }
                                    
                                    .about-list .list-item-title {
                                        color: #FFFFFF;
                                        font-weight: 500;
                                    }
                                    
                                    .about-intro h5 {
                                        color: #FFFFFF;
                                    }
                                    
                                    .statistic-item {
                                        margin: 15px 0;
                                        padding: 25px 10px;
                                        text-align: center;
                                        border: 1px solid #ffffff11;
                                    }
                                    
                                    .statistic-item span {
                                        display: block;
                                        margin-bottom: 5px;
                                        font-family: 'Raleway', serif;
                                    }
                                    
                                    .statistic-item .stat-value {
                                        color: #FFFFFF;
                                        font-weight: 600;
                                        font-size: 1.4rem;
                                    }
                                    
                                    .statistic-item .stat-title {
                                        font-weight: 400;
                                    }
                                    
                                    .more-about {
                                        position: fixed;
                                        background: #333333;
                                        height: 100vh;
                                        overflow: auto;
                                        padding: 60px 0;
                                        top: 0;
                                        right: 0;
                                        left: 0;
                                        bottom: 0;
                                        z-index: 120;
                                        opacity: 0;
                                        -ms-transform: translateY(-100%);
                                        -webkit-transform: translateY(-100%);
                                        -o-transform: translateY(-100%);
                                        transform: translateY(-100%);
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    
                                    .about-btn {
                                        margin-top: 20px;
                                    }
                                    
                                    .about-btn-close {
                                        width: 30px;
                                        height: 30px;
                                        position: absolute;
                                        top: 10px;
                                        right: 10px;
                                        font-size: 1.5rem;
                                        cursor: pointer;
                                    }
                                    
                                    .more-about-show {
                                        -ms-transform: translateY(0%);
                                        -webkit-transform: translateY(0%);
                                        -o-transform: translateY(0%);
                                        transform: translateY(0%);
                                        opacity: 1;
                                    }
                                    
                                    .skills-item {
                                        margin-top: 50px;
                                    }
                                    
                                    .skills-data {
                                        margin: 40px 0;
                                        background: #e4e2dd;
                                        color: #FFFFFF;
                                        height: 5px;
                                        position: relative;
                                        border-radius: 50px;
                                        font-family: 'Raleway', serif;
                                    }
                                    
                                    .skills-name {
                                        position: absolute;
                                        left: 0;
                                        top: -30px;
                                        font-weight: 500;
                                    }
                                    
                                    .skills-progress {
                                        position: absolute;
                                        right: 0;
                                        top: -30px;
                                        font-weight: 500;
                                    }
                                    
                                    .skills-bar {
                                        position: absolute;
                                        left: 0;
                                        top: 0;
                                        bottom: 0;
                                        right: 0;
                                        background: #817e7e;
                                        border-radius: 50px;
                                    }
                                    
                                    .skills-1 {
                                        width: 80%;
                                    }
                                    
                                    .skills-2 {
                                        width: 90%;
                                    }
                                    
                                    .skills-3 {
                                        width: 60%;
                                    }
                                    
                                    .skills-4 {
                                        width: 50%;
                                    }
                                    
                                    .skills-5 {
                                        width: 90%;
                                    }
                                    
                                    .skills-6 {
                                        width: 60%;
                                    }
                                    /* 6. services */
                                    
                                    .servizi-section,
                                    .swiper-section {
                                        width: 100vw;
                                        min-height: 100vh;
                                    }
                                    .recensioni-section{
                                        width: 100vw;
                                        min-height: 50vh;
                                    }
                                    .swiper-section {
                                        animation: scala-home 5s ease-out 0s alternate infinite none running;
                                    }
                                    
                                    @keyframes scala-home {
                                        0% {
                                            transform: scale(1.0);
                                        }
                                        100% {
                                            transform: scale(1.05);
                                        }
                                    }
                                    
                                    .box-part {
                                        padding-top: 100px;
                                    }
                                    
                                    .box-servizio {
                                        width: 300px;
                                        height: 300px;
                                        border-radius: 40px;
                                        /*background-color: rgba(255, 255, 255, 0.767);*/
                                        position: absolute;
                                        background-size: contain !important;
                                        background-repeat: no-repeat !important;
                                    }
                                    
                                    .box-servizio:hover {
                                        animation: scale 1s forwards alternate;
                                        z-index: 10;
                                    }
                                    
                                    .dropdown-box {
                                        border-radius: 40px;
                                        background-color: #2f2f2fb9;
                                        width: 100%;
                                        height: 0%;
                                        color: white;
                                        display: none;
                                        padding-top: 0;
                                    }
                                    
                                    .box-servizio:hover .dropdown-box {
                                        display: block;
                                        animation: topDown 1s forwards alternate;
                                    }
                                    
                                    @media screen and (max-width: 1024px) {
                                        .box-servizio {
                                            position: static;
                                            margin: 50px auto auto auto;
                                        }
                                        .recensioni-section {
                                            padding: 0 0 50px 0;
                                        }
                                    }
                                    
                                    @keyframes scale {
                                        from {
                                            transform: scale(1);
                                        }
                                        to {
                                            transform: scale(1.25);
                                        }
                                    }
                                    
                                    @keyframes topDown {
                                        from {
                                            height: 0%;
                                            padding-top: 0;
                                        }
                                        to {
                                            height: 100%;
                                            padding-top: 125px;
                                        }
                                    }
                                    
                                    .box-servizio:nth-child(1) {
                                        background: url("../../img/miniatura_acquisto.jpg");
                                        left: 15vw;
                                        top: 5vh;
                                    }
                                    
                                    .box-servizio:nth-child(2) {
                                        background: url("../../img/miniatura_vendita.jpg");
                                        left: 30vw;
                                        top: 30vh;
                                    }
                                    
                                    .box-servizio:nth-child(3) {
                                        background: url("../../img/miniatura_homestaging.jpg");
                                        left: 40vw;
                                        top: 10vh;
                                    }
                                    
                                    .box-servizio:nth-child(4) {
                                        background: url("../../img/miniatura_collaborazioni.jpg");
                                        left: 60vw;
                                        top: 30vh;
                                    }
                                    
                                    .box-servizio:nth-child(5) {
                                        background: url("../../img/miniatura_affitto.jpg");
                                        left: 50vw;
                                        top: 20vh;
                                    }
                                    
                                    .box-servizio:nth-child(6) {
                                        background: url("../../img/miniatura_consulenza.jpg");
                                        left: 70vw;
                                        top: 5vh;
                                    }
                                    /*recensioni */
                                    
                                    .box-recensione {
                                        height: 220px;
                                    }
                                    /*footer*/
                                    
                                    .footer-bg {
                                        background-color: #eed677 !important;
                                        min-height: 40vh;
                                        padding: 20px 100px 0 100px;
                                        font-size: 16px !important;
                                    }
                                    
                                    @keyframes bitleft {
                                        from {
                                            margin-left: 0px;
                                        }
                                        to {
                                            margin-left: 20px;
                                        }
                                    }
                                    
                                    .list-group-item:hover {
                                        animation: bitleft 0.3s 1 forwards alternate;
                                    }
                                    /*--------------------------------------------*/
                                    
                                    .why {
                                        width: 300px;
                                        border-bottom: 7px solid white;
                                        margin: 0 auto;
                                    }
                                    
                                    .footer-bg .list-group-item {
                                        background-color: transparent;
                                        border-color: transparent;
                                    }
                                    
                                    #feature-top {
                                        margin-top: -120px;
                                        z-index: 999;
                                        position: relative;
                                    }
                                    
                                    .services-area {
                                        background: #333333;
                                        background-size: cover;
                                        background-repeat: no-repeat;
                                        width: 100%;
                                        height: 980px;
                                        margin: auto auto;
                                    }
                                    
                                    .services-two .s-single-services {
                                        border-radius: 0 0 0 0;
                                    }
                                    
                                    .services-two .s-single-services .btn2 {
                                        display: inline-block;
                                        color: #faa292;
                                    }
                                    
                                    .services-area.gray-bg {
                                        position: relative;
                                        z-index: 1;
                                        overflow: hidden;
                                    }
                                    
                                    .single-services {
                                        background: #fff;
                                        box-shadow: 0px 5px 17px 0px rgba(0, 0, 0, 0.07);
                                        position: relative;
                                    }
                                    
                                    .single-services::before {
                                        content: "";
                                        height: 100%;
                                        width: 100%;
                                        position: absolute;
                                        left: 5px;
                                        top: 5px;
                                        background: #faa292;
                                        z-index: -1;
                                        transition: .3s;
                                        opacity: 0;
                                    }
                                    
                                    .service-t h2 {
                                        top: 55px;
                                    }
                                    
                                    .services-thumb img {
                                        width: 100%;
                                    }
                                    
                                    .services-content span {
                                        display: block;
                                        height: 2px;
                                        width: 150px;
                                        background: #faa292;
                                        transition: .3s;
                                        margin-bottom: 55px;
                                    }
                                    
                                    .services-content {
                                        padding: 60px 40px;
                                        padding-bottom: 55px;
                                    }
                                    
                                    .services-content small {
                                        font-size: 14px;
                                        text-transform: uppercase;
                                        letter-spacing: 2px;
                                        display: block;
                                        margin-bottom: 20px;
                                    }
                                    
                                    .services-content h4 {
                                        font-size: 24px;
                                        margin-bottom: 23px;
                                    }
                                    
                                    .services-content h4:hover a {
                                        color: #faa292;
                                    }
                                    
                                    .services-content p {
                                        margin-bottom: 0;
                                    }
                                    
                                    .single-services:hover .services-content span {
                                        background: #faa292;
                                    }
                                    
                                    .single-services:hover::before {
                                        opacity: 1;
                                    }
                                    
                                    .services-active .slick-dots {
                                        text-align: center;
                                        position: absolute;
                                        left: 0;
                                        right: 0;
                                        bottom: -40px;
                                        line-height: 1;
                                    }
                                    
                                    .services-active .slick-dots li {
                                        display: inline-block;
                                        margin: 0 5px;
                                    }
                                    
                                    .services-active .slick-dots li button {
                                        text-indent: -99999px;
                                        border: none;
                                        padding: 0;
                                        height: 5px;
                                        width: 20px;
                                        background: #faa292;
                                        border-radius: 50px;
                                        z-index: 1;
                                        cursor: pointer;
                                        transition: .3s;
                                    }
                                    
                                    .services-active .slick-dots li.slick-active button {
                                        width: 50px;
                                        background: #faa292;
                                    }
                                    
                                    .services-active .slick-track {
                                        padding-bottom: 10px;
                                    }
                                    
                                    .services-icon i {
                                        font-size: 48px;
                                        border-radius: 50%;
                                        color: #f5f5f5;
                                        text-align: center;
                                    }
                                    
                                    .services-two .services-icon {
                                        display: inline-block;
                                        width: 900px;
                                        height: 90px;
                                        background: #FFFFFF 0% 0% no-repeat padding-box;
                                        text-align: center;
                                        border-radius: 50%;
                                        padding: 25px;
                                        margin-bottom: 30px;
                                    }
                                    
                                    .services-two .services-icon img {
                                        width: 100%;
                                    }
                                    
                                    .services-two .brline {
                                        margin-top: 15px;
                                        margin-bottom: 25px;
                                    }
                                    
                                    .services-two ul li {
                                        margin-bottom: 25px;
                                    }
                                    
                                    .services-two ul li::before {
                                        font-family: "Font Awesome 5 Pro";
                                        content: "";
                                        margin-right: 10px;
                                        color: #faa292;
                                    }
                                    
                                    .services-icon .glyph-icon::before {
                                        font-size: 48px;
                                        color: #3763eb;
                                        margin-left: 0;
                                    }
                                    
                                    .services-icon2 {
                                        position: absolute;
                                        right: 5%;
                                        top: 0;
                                    }
                                    
                                    .services-icon2 .glyph-icon::before {
                                        font-size: 120px;
                                        color: #8ca8ff29;
                                        margin-left: 0;
                                    }
                                    
                                    .services-two .second-services-content {
                                        float: left;
                                        width: 100%;
                                    }
                                    
                                    .services-two .s-single-services {
                                        transition: .3s;
                                        padding: 45px;
                                        border: none;
                                        margin-bottom: 30px;
                                        border-radius: 0;
                                    }
                                    
                                    .services-two .s-single-services {
                                        float: left;
                                        width: 100%;
                                    }
                                    
                                    .services-three .services-icon {
                                        display: inline-block;
                                        width: 90px;
                                        height: 90px;
                                        background: #FFFFFF 0% 0% no-repeat padding-box;
                                        text-align: center;
                                        border-radius: 50%;
                                        padding: 25px;
                                        margin-bottom: 30px;
                                        box-shadow: 0px 16px 32px #00000014;
                                    }
                                    
                                    .services-three .services-icon img {
                                        width: 100%;
                                    }
                                    
                                    .services-three .brline {
                                        margin-top: 15px;
                                        margin-bottom: 25px;
                                    }
                                    
                                    .services-three ul li {
                                        margin-bottom: 25px;
                                    }
                                    
                                    .services-three ul li::before {
                                        font-family: "Font Awesome 5 Pro";
                                        content: "";
                                        margin-right: 10px;
                                        color: #faa292;
                                    }
                                    
                                    .services-three .second-services-content {
                                        float: left;
                                        width: 100%;
                                    }
                                    
                                    .services-three .s-single-services {
                                        transition: .3s;
                                        padding: 40px 40px 25px;
                                        border: none;
                                        margin-bottom: 30px;
                                        border-radius: 0;
                                        border: 2px solid #F0F0F0;
                                    }
                                    
                                    .services-three .s-single-services {
                                        float: left;
                                        width: 100%;
                                    }
                                    
                                    .services-three .s-single-services.active {
                                        background: #fff;
                                        margin-top: 0;
                                        position: relative;
                                        z-index: 1;
                                        left: 0;
                                    }
                                    
                                    .services-three .s-single-services.active .services-icon {
                                        background: #fff 0% 0% no-repeat padding-box;
                                        width: 90px;
                                        height: 90px;
                                    }
                                    
                                    .services-three .s-single-services.active a.ss-btn {
                                        display: none;
                                    }
                                    
                                    .second-services-content h5 {
                                        font-weight: 700;
                                        transition: .3s;
                                        letter-spacing: 0;
                                        font-size: 22px;
                                        color: #181E23;
                                    }
                                    
                                    .second-services-content p {
                                        margin-bottom: 0;
                                    }
                                    
                                    .second-services-content a {
                                        /*font-size: 14px;
	font-weight: 500;
	color: #444d69;
	position: relative;
	transition: .5s;*/
                                    }
                                    
                                    .second-services-content a::after {
                                        left: -40px;
                                        right: unset;
                                        opacity: 0;
                                    }
                                    
                                    .s-single-services {
                                        transition: .3s;
                                        padding: 30px;
                                        border: 5px solid #f5f8fa;
                                    }
                                    
                                    .s-single-services a.ss-btn {
                                        display: none;
                                    }
                                    
                                    .s-single-services .active-icon {
                                        display: none;
                                    }
                                    
                                    .s-single-services .d-active-icon {
                                        display: block;
                                    }
                                    
                                    .s-single-services:hover {
                                        background: #fff;
                                    }
                                    
                                    .s-single-services:hover .second-services-content h5 {
                                        color: #fff;
                                    }
                                    
                                    .s-single-services:hover .second-services-content a {
                                        color: #faa292;
                                    }
                                    
                                    .s-single-services.active {
                                        background: #fff;
                                        margin-top: -160px;
                                        position: absolute;
                                        z-index: 1;
                                        left: 0;
                                    }
                                    
                                    .s-single-services.active a.ss-btn {
                                        display: inline-block;
                                    }
                                    
                                    .s-single-services.active .services-icon {
                                        background: #faa292 0% 0% no-repeat padding-box;
                                        width: 160px;
                                        height: 160px;
                                        padding: 10%;
                                    }
                                    
                                    .s-single-services.active .second-services-content h5 {}
                                    
                                    .s-single-services.active .second-services-content a,
                                    #feature-top .s-single-services.active .btn2,
                                    .s-single-services.active .services-icon .glyph-icon::before {}
                                    
                                    .s-single-services.active .second-services-content p {}
                                    
                                    .s-single-services.active .active-icon {
                                        display: block;
                                    }
                                    
                                    .s-single-services.active .d-active-icon {
                                        display: none;
                                    }
                                    
                                    .services-bg {
                                        background-position: center;
                                        background-size: cover;
                                    }
                                    
                                    .services-active2 {
                                        padding-top: 50px;
                                        padding-bottom: 300px;
                                    }
                                    
                                    .services-active2 .slick-arrow {
                                        position: absolute;
                                        top: 50%;
                                        left: -60px;
                                        border: none;
                                        background: none;
                                        padding: 0;
                                        font-size: 24px;
                                        color: #faa292;
                                        z-index: 9;
                                        cursor: pointer;
                                        transition: .3s;
                                    }
                                    
                                    .services-active2 .slick-next {
                                        left: inherit;
                                        right: -60px;
                                    }
                                    
                                    .services-active2 .slider-nav .slick-list.draggable {
                                        width: 1100px;
                                        float: right;
                                    }
                                    
                                    .services-item {
                                        background: #fff;
                                        margin: 22px 15px;
                                        box-shadow: 3px 4px 15px #0000001A;
                                        text-align: center;
                                        border-radius: 10px;
                                    }
                                    
                                    .services-active2 .slider-nav {
                                        position: absolute;
                                        bottom: 0px;
                                    }
                                    
                                    .services-active2 li {
                                        display: flex;
                                        margin-bottom: 10px;
                                    }
                                    
                                    .services-item h3 {
                                        font-size: 20px;
                                    }
                                    
                                    .services-item .glyph-icon:before {
                                        font-size: 60px;
                                    }
                                    
                                    .services-active2 li .icon {
                                        padding-right: 10px;
                                    }
                                    
                                    .services-item.slick-slide.slick-current.slick-active {
                                        background: #3763eb;
                                    }
                                    
                                    .services-item.slick-slide.slick-current.slick-active .glyph-icon:before {
                                        color: #fff;
                                    }
                                    
                                    .services-item.slick-slide.slick-current.slick-active h3 {
                                        color: #fff;
                                    }
                                    
                                    .services-box .services-content2 {
                                        padding-top: 10px;
                                        transition: .3s;
                                    }
                                    
                                    .services-content2 h5 {
                                        font-family: 'Raleway', sans-serif;
                                        font-size: 30px;
                                        margin-bottom: 15px;
                                        color: #262626;
                                    }
                                    
                                    .services-content2 p {
                                        color: #262626;
                                    }
                                    
                                    .services-box .services-content2:hover {
                                        background: #ffffff21;
                                        box-shadow: 0px 16px 32px #6666660F;
                                    }
                                    
                                    .services-box .ss-btn2 {
                                        width: 60px;
                                        height: 60px;
                                        background: #faa292 0% 0% no-repeat padding-box;
                                        box-shadow: 0px 16px 32px #faa29233;
                                        display: none;
                                        color: #fff;
                                        line-height: 60px;
                                        font-size: 31px;
                                        border-radius: 50%;
                                        position: absolute;
                                        left: 42%;
                                        bottom: -25px;
                                        transition: .3s;
                                    }
                                    
                                    .services-box .services-content2:hover .ss-btn2 {
                                        display: inline-block;
                                    }
                                    
                                    .services-02 ul {
                                        display: flex;
                                        border: 2px solid #F5F5F5;
                                    }
                                    
                                    .services-02 ul li {
                                        padding: 30px;
                                        border-right: 2px solid #F5F5F5;
                                        background: #fff;
                                        transition: .2s;
                                    }
                                    
                                    .services-02 ul li:last-child {
                                        border: none;
                                    }
                                    
                                    .services-icon-02 {
                                        margin-bottom: 30px;
                                    }
                                    
                                    .services-content-02 h5 {
                                        font-size: 24px;
                                        margin-bottom: 20px;
                                    }
                                    
                                    .services-content-02 {
                                        font-size: 14px;
                                    }
                                    
                                    .services-content-02 .ss-btn2 {
                                        margin-top: 20px;
                                        display: block;
                                    }
                                    
                                    .services-content-02 .ss-btn2 i {
                                        width: 40px;
                                        height: 40px;
                                        border: 2px solid #E6E6E6;
                                        border-radius: 50%;
                                        line-height: 35px;
                                        text-align: center;
                                        color: #62605c;
                                    }
                                    
                                    .services-content-02 .ss-btn2 span {
                                        color: #faa292;
                                        margin-left: -10px;
                                        font-weight: 600;
                                        opacity: 0;
                                        transition: all 0.5s ease 0s;
                                    }
                                    
                                    .services-02 ul li:hover {
                                        border: none;
                                        box-shadow: 0px 16px 32px #0000000A;
                                        transform: scale(1.08);
                                        transition: .2s;
                                    }
                                    
                                    .services-02 ul li:hover .ss-btn2 span {
                                        margin-left: 5px;
                                        opacity: 1;
                                        transition: .2s;
                                    }
                                    
                                    .services-box-03 {
                                        background: #fff;
                                        padding: 50px;
                                    }
                                    
                                    .services-box-04 {
                                        border-radius: 3px;
                                        background-color: rgb(255, 255, 255);
                                        box-shadow: 0px 8px 38px 0px rgba(40, 40, 40, 0.04);
                                        padding: 45px;
                                    }
                                    
                                    .services-icon-04 {
                                        display: flex;
                                        margin-bottom: 30px;
                                    }
                                    
                                    .services-icon-04 img {
                                        margin-right: 15px;
                                    }
                                    
                                    .services-icon-04 h4 {
                                        padding: 15px 0 0;
                                    }
                                    
                                    .services-box-04 .services-content-02 li {
                                        font-weight: 500;
                                        font-size: 16px;
                                        margin-top: 10px;
                                        color: #181e23;
                                    }
                                    
                                    .services-box-04 .services-content-02 li::before {
                                        font-family: "Font Awesome 5 Pro";
                                        content: "";
                                        margin-right: 10px;
                                        color: #faa292;
                                    }
                                    
                                    .services-box-04 .services-content-02 .blue li::before {
                                        color: #4cc3c1;
                                    }
                                    
                                    .services-box-04 .services-content-02 .green li::before {
                                        color: #2db065;
                                    }
                                    
                                    .services-05 h2 {
                                        color: #fff;
                                    }
                                    
                                    .services-05::before {
                                        content: "";
                                        background: #181e23;
                                        position: absolute;
                                        top: 0;
                                        width: 100%;
                                        height: 529px;
                                    }
                                    
                                    .services-content-05 {
                                        background-color: rgb(255, 255, 255);
                                        box-shadow: 0px 8px 38px 0px rgba(40, 40, 40, 0.04);
                                        padding: 30px;
                                        margin-bottom: 50px;
                                    }
                                    
                                    .services-content-05 span {
                                        color: #faa292;
                                        font-size: 15px;
                                        font-weight: 500;
                                        margin-bottom: 10px;
                                        display: block;
                                    }
                                    
                                    .services-text05 p {
                                        font-size: 20px;
                                    }
                                    
                                    .services-text05 a {
                                        font-size: 20px;
                                        color: #faa292;
                                        font-weight: 500;
                                        text-decoration: underline;
                                    }
                                    
                                    .services-07 .section-title h2 {
                                        color: #fff;
                                    }
                                    
                                    .services-box07 .sr-contner {
                                        display: flex;
                                    }
                                    
                                    .services-box07 .sr-contner .icon {
                                        width: 100px;
                                        margin-right: 30px;
                                    }
                                    
                                    .services-box07 .sr-contner .text h5 {
                                        color: #fff;
                                        font-size: 18px;
                                    }
                                    
                                    .services-box07 .sr-contner .text p {
                                        color: #9aa4a9;
                                        margin-top: 20px;
                                    }
                                    
                                    .services-07 .user-box {
                                        display: flex;
                                    }
                                    
                                    .services-07 .user-box .text {
                                        padding-top: 10px;
                                        padding-left: 15px;
                                    }
                                    
                                    .services-07 .user-box .text h2 {
                                        font-size: 24px;
                                        font-weight: 500;
                                        font-family: 'Playfair Display', serif;
                                        color: #fff;
                                        margin-bottom: 5px;
                                    }
                                    
                                    .services-07 .user-box .text h3 {
                                        font-size: 14px;
                                        font-family: 'Playfair Display', serif;
                                        color: #9a9fa2;
                                    }
                                    
                                    .services-08-item {
                                        text-align: center;
                                    }
                                    
                                    .services-08-item {
                                        text-align: center;
                                        padding: 30px 15px;
                                    }
                                    
                                    .services-08 .services-08-item--wrapper {
                                        border-bottom: 2px solid #f5f5f5;
                                    }
                                    
                                    .services-08 .services-08-item--wrapper:nth-child(3) {
                                        border-bottom: none;
                                    }
                                    
                                    .services-08-item--wrapper>div {
                                        border-right: 2px solid #f5f5f5;
                                    }
                                    
                                    .services-08-item--wrapper>div:nth-child(3) {
                                        border-right: none;
                                    }
                                    
                                    .services-08-thumb {
                                        margin-bottom: 30px;
                                    }
                                    
                                    .services-08-content h3 {
                                        margin-bottom: 20px;
                                        font-size: 24px;
                                    }
                                    
                                    .services-08-content,
                                    .services-08-thumb {
                                        position: relative;
                                        z-index: 1;
                                    }
                                    
                                    .services-08-item:before {
                                        position: absolute;
                                        content: '';
                                        left: 0px;
                                        top: 0px;
                                        width: 100%;
                                        height: 100%;
                                        -webkit-transition: .3s;
                                        -o-transition: .3s;
                                        transition: .3s;
                                        z-index: 1;
                                    }
                                    
                                    .services-08-item:hover::before {
                                        background-color: #fff;
                                        width: calc(100% + 20px);
                                        height: calc(100% + 20px);
                                        top: -10px;
                                        left: -10px;
                                        background-color: #fff;
                                        -webkit-box-shadow: 0px 30px 40px 0px rgba(32, 85, 125, 0.06);
                                        box-shadow: 0px 30px 40px 0px rgba(32, 85, 125, 0.06);
                                    }
                                    
                                    .services-09::before {
                                        display: none;
                                    }
                                    
                                    .services-09 p,
                                    .services-09 .section-title h5 {
                                        color: #fff;
                                    }
                                    
                                    .services-item {
                                        text-align: center;
                                        padding: 15px 0;
                                        margin: 15px 0;
                                        position: relative;
                                        cursor: pointer;
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    
                                    .services-item:hover.services-item::before {
                                        border-bottom: 1px solid #FFFFFF;
                                        border-left: 1px solid #FFFFFF;
                                    }
                                    
                                    .services-item:hover.services-item::after {
                                        border-top: 1px solid #FFFFFF;
                                        border-right: 1px solid #FFFFFF;
                                    }
                                    
                                    .services-item::after {
                                        content: "";
                                        height: 30px;
                                        width: 30px;
                                        position: absolute;
                                        display: block;
                                        top: 0;
                                        right: 0;
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    
                                    .services-item::before {
                                        content: "";
                                        height: 30px;
                                        width: 30px;
                                        position: absolute;
                                        display: block;
                                        bottom: 0;
                                        left: 0;
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    
                                    .services-item-title {
                                        font-family: 'Raleway', serif;
                                        font-weight: 500;
                                    }
                                    /*-----------------instagram-------------------------*/
                                    
                                    .instagram {
                                        background: #333333;
                                    }
                                    
                                    .insta-list {
                                        width: auto;
                                        max-width: 100%;
                                        height: auto;
                                        margin: 0;
                                        padding: 0;
                                    }
                                    
                                    .insta {
                                        max-height: 200px;
                                        background: #333333;
                                        margin: 0 auto;
                                        text-align: center;
                                    }
                                    
                                    .insta-img {
                                        max-width: 100%;
                                    }
                                    
                                    .insta-list:hover {
                                        transform: scale(1.1);
                                        cursor: pointer;
                                        transition: all .8s ease-in-out;
                                    }
                                    
                                    .insta-title {
                                        width: 100%;
                                        background: #333333;
                                        color: #fffbfb;
                                        font-weight: 400;
                                    }
                                    /* ---------------------------{  06.Works Section }------------------ */
                                    
                                    .works {
                                        margin-top: 100px;
                                        margin-bottom: 50px;
                                    }
                                    
                                    .work-info {
                                        display: flex;
                                        height: 100%;
                                        padding: 0 30px;
                                        align-items: center;
                                        justify-content: center;
                                    }
                                    
                                    .work-info .work-info-inner {
                                        display: inline-block;
                                        text-align: center;
                                    }
                                    
                                    .work-info .explore-proj {
                                        text-align: left;
                                        color: #888888;
                                        cursor: pointer;
                                        -webkit-transition: 0.5s ease-in-out;
                                        transition: 0.5s ease-in-out;
                                    }
                                    
                                    .work-info .explore-proj:hover {
                                        color: #FFFFFF;
                                    }
                                    
                                    .work-info .work-title {
                                        font-weight: 400;
                                    }
                                    
                                    .works-details-item {
                                        position: fixed;
                                        background: #333333;
                                        height: 100vh;
                                        overflow: auto;
                                        padding: 60px 0;
                                        top: 0;
                                        right: 0;
                                        left: 0;
                                        bottom: 0;
                                        z-index: 130;
                                        opacity: 0;
                                        -ms-transform: translateY(-100%);
                                        -webkit-transform: translateY(-100%);
                                        -o-transform: translateY(-100%);
                                        transform: translateY(-100%);
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    
                                    .works-btn-close {
                                        width: 30px;
                                        height: 30px;
                                        position: absolute;
                                        top: 10px;
                                        right: 10px;
                                        font-size: 1.5rem;
                                        cursor: pointer;
                                    }
                                    
                                    .works-details-show {
                                        -ms-transform: translateY(0%);
                                        -webkit-transform: translateY(0%);
                                        -o-transform: translateY(0%);
                                        transform: translateY(0%);
                                        opacity: 1;
                                    }
                                    
                                    .works-info {
                                        height: 100vh;
                                        display: flex;
                                        justify-content: center;
                                        align-items: center;
                                        font-family: 'Raleway', serif;
                                    }
                                    
                                    .works-info-list li {
                                        margin-bottom: 20px;
                                    }
                                    
                                    .works-info-list .works-item-title {
                                        color: #FFFFFF;
                                        font-weight: 600;
                                    }
                                    /* ---------------------------{  07.Blog Section }------------------ */
                                    
                                    .blog {
                                        margin-top: 100px;
                                        margin-bottom: 50px;
                                    }
                                    
                                    .blog-img {
                                        position: relative;
                                    }
                                    
                                    .blog-img .blog-category {
                                        position: absolute;
                                        display: block;
                                        color: #FFFFFF;
                                        background: #5a565698;
                                        top: 0;
                                        left: 0;
                                        padding: 10px 20px;
                                        font-family: 'Raleway', serif;
                                        font-weight: 400;
                                    }
                                    
                                    .blog-info {
                                        padding-top: 15px;
                                    }
                                    
                                    .blog-date-author {
                                        color: #888888;
                                        font-family: 'Raleway', serif;
                                    }
                                    
                                    .Blog-more {
                                        position: relative;
                                        display: inline-block;
                                        margin-top: 10px;
                                        padding: 5px 0;
                                        color: #FFFFFF;
                                        font-family: 'Raleway', serif;
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    
                                    .Blog-more:hover.Blog-more::before {
                                        width: 100%;
                                    }
                                    
                                    .Blog-more::before {
                                        content: "";
                                        position: absolute;
                                        height: 1px;
                                        width: 70%;
                                        background: #BBBBBB;
                                        bottom: 0;
                                        -webkit-transition: 0.8s ease-in-out;
                                        transition: 0.8s ease-in-out;
                                    }
                                    /* ---------------------------{  08.Blog Single Section }------------------ */
                                    
                                    .blog-single {
                                        margin-top: 100px;
                                        margin-bottom: 50px;
                                    }
                                    
                                    .blog-single-title {
                                        margin: 20px 0;
                                        color: #FFFFFF;
                                    }
                                    
                                    .Back-blog i {
                                        padding-right: 10px;
                                    }
                                    /* ---------------------------{  09.Contact Section }------------------ */
                                    
                                    .contatti {
                                        background: #333333;
                                        width: 100%;
                                        margin-top: 100px;
                                        background-size: cover;
                                        background-position: center;
                                        z-index: 1;
                                        height: auto;
                                        padding-top: 70px;
                                        padding-bottom: 70px;
                                    }
                                    
                                    .cont-line {
                                        display: block;
                                        width: 300px;
                                        height: 2px;
                                        border-top: 5px solid #fffbfb;
                                        margin: 0 auto;
                                    }
                                    
                                    .contatti-container {
                                        margin: 0 auto;
                                    }
                                    
                                    .form-title {
                                        color: #fffbfb;
                                    }
                                    
                                    .contact-field label {
                                        display: block;
                                        font-size: 16px;
                                        font-weight: 500;
                                        text-transform: uppercase;
                                        color: #181E23;
                                        margin-bottom: 20px;
                                        cursor: unset;
                                    }
                                    
                                    .contact-field {
                                        padding-right: 15px;
                                    }
                                    
                                    .contact-field input {
                                        width: 100%;
                                        border: none;
                                        background-color: rgb(255, 255, 255);
                                        box-shadow: 2.5px 4.33px 15px 0px rgba(0, 0, 0, 0.15);
                                        padding: 15px 15px;
                                        transition: .3s;
                                    }
                                    
                                    .contact-field select {
                                        width: 100%;
                                        border: none;
                                        background-color: rgb(255, 255, 255);
                                        box-shadow: 2.5px 4.33px 15px 0px rgba(0, 0, 0, 0.15);
                                        padding: 15px 15px;
                                        transition: .3s;
                                        border-radius: 10px;
                                    }
                                    
                                    .contact-field.c-name::after {
                                        content: "\f007";
                                    }
                                    
                                    .contact-field::after {
                                        position: absolute;
                                        font-family: "Font Awesome 5 Pro";
                                        display: inline-block;
                                        font-size: 14px;
                                        text-align: center;
                                        right: 25px;
                                        color: #faa292;
                                        bottom: 22px;
                                        display: none;
                                    }
                                    
                                    .contact-field.c-email::after {
                                        content: "\f0e0";
                                    }
                                    
                                    .contact-field.c-subject::after {
                                        content: "\f249";
                                    }
                                    
                                    .contact-field.c-message::after {
                                        content: "\f303";
                                        font-weight: 700;
                                        top: 20px;
                                        bottom: unset;
                                    }
                                    
                                    .contact-field input::placeholder {
                                        color: #9e9e9e;
                                    }
                                    
                                    .contact-field textarea {
                                        width: 100%;
                                        border: none;
                                        padding: 25px 30px;
                                        transition: .3s;
                                        background-color: rgb(255, 255, 255);
                                        box-shadow: 2.5px 4.33px 15px 0px rgba(0, 0, 0, 0.15);
                                        height: 100px;
                                    }
                                    
                                    .contact-bg-an-01 {
                                        position: absolute;
                                        left: 9.8%;
                                        top: 25%;
                                        animation: alltuchtopdown 3s infinite;
                                        -webkit-animation: alltuchtopdown 3s infinite;
                                        animation-delay: 0s;
                                        -webkit-animation-delay: 1s;
                                    }
                                    
                                    .contact-bg-an-02 {
                                        position: absolute;
                                        right: 3%;
                                        bottom: 7%;
                                        animation: alltuchtopdown 5s infinite;
                                        -webkit-animation: alltuchtopdown 5s infinite;
                                        animation-delay: 0s;
                                        -webkit-animation-delay: 3s;
                                    }
                                    
                                    .contact-bg-an-03 {
                                        position: absolute;
                                        right: 5%;
                                        bottom: 10%;
                                        animation: alltuchtopdown 5s infinite;
                                        -webkit-animation: alltuchtopdown 5s infinite;
                                        animation-delay: 0s;
                                        -webkit-animation-delay: 3s;
                                    }
                                    
                                    @media screen and (max-width:1000px) {
                                        .contact-bg-an-03 {
                                            display: none;
                                        }
                                        .contact-bg-an-04 {
                                            display: none;
                                        }
                                    }
                                    
                                    @media screen and (max-width:1400px) {
                                        .contact-bg-an-03 {
                                            width: 300px;
                                            position: absolute;
                                            right: 0;
                                            bottom: 10%;
                                            animation: alltuchtopdown 5s infinite;
                                            -webkit-animation: alltuchtopdown 5s infinite;
                                            animation-delay: 0s;
                                            -webkit-animation-delay: 3s;
                                        }
                                        .contact-bg-an-04 {
                                            width: 300px;
                                            position: absolute;
                                            left: 5%;
                                            bottom: 10%;
                                            animation: alltuchtopdown 5s infinite;
                                            -webkit-animation: alltuchtopdown 5s infinite;
                                            animation-delay: 0s;
                                            -webkit-animation-delay: 3s;
                                        }
                                    }
                                    
                                    .contact-bg-an-04 {
                                        position: absolute;
                                        left: 5%;
                                        bottom: 10%;
                                        animation: alltuchtopdown 5s infinite;
                                        -webkit-animation: alltuchtopdown 5s infinite;
                                        animation-delay: 0s;
                                        -webkit-animation-delay: 3s;
                                    }
                                    
                                    .contact-img {
                                        position: absolute;
                                        bottom: 0;
                                        right: 170px;
                                        z-index: -1;
                                    }
                                    
                                    @keyframes alltuchtopdown {
                                        0% {
                                            -webkit-transform: rotateX(0deg) translateY(0px);
                                            -moz-transform: rotateX(0deg) translateY(0px);
                                            -ms-transform: rotateX(0deg) translateY(0px);
                                            -o-transform: rotateX(0deg) translateY(0px);
                                            transform: rotateX(0deg) translateY(0px);
                                        }
                                        50% {
                                            -webkit-transform: rotateX(0deg) translateY(-20px);
                                            -moz-transform: rotateX(0deg) translateY(-20px);
                                            -ms-transform: rotateX(0deg) translateY(-20px);
                                            -o-transform: rotateX(0deg) translateY(-20px);
                                            transform: rotateX(0deg) translateY(-20px);
                                        }
                                        100% {
                                            -webkit-transform: rotateX(0deg) translateY(0px);
                                            -moz-transform: rotateX(0deg) translateY(0px);
                                            -ms-transform: rotateX(0deg) translateY(0px);
                                            -o-transform: rotateX(0deg) translateY(0px);
                                            transform: rotateX(0deg) translateY(0px);
                                        }
                                    }
                                    
                                    @-webkit-keyframes alltuchtopdown {
                                        0% {
                                            -webkit-transform: rotateX(0deg) translateY(0px);
                                            -moz-transform: rotateX(0deg) translateY(0px);
                                            -ms-transform: rotateX(0deg) translateY(0px);
                                            -o-transform: rotateX(0deg) translateY(0px);
                                            transform: rotateX(0deg) translateY(0px);
                                        }
                                        50% {
                                            -webkit-transform: rotateX(0deg) translateY(-20px);
                                            -moz-transform: rotateX(0deg) translateY(-20px);
                                            -ms-transform: rotateX(0deg) translateY(-20px);
                                            -o-transform: rotateX(0deg) translateY(-20px);
                                            transform: rotateX(0deg) translateY(-20px);
                                        }
                                        100% {
                                            -webkit-transform: rotateX(0deg) translateY(0px);
                                            -moz-transform: rotateX(0deg) translateY(0px);
                                            -ms-transform: rotateX(0deg) translateY(0px);
                                            -o-transform: rotateX(0deg) translateY(0px);
                                            transform: rotateX(0deg) translateY(0px);
                                        }
                                    }
                                    
                                    .img,
                                    img {
                                        max-width: 100%;
                                        transition: all 0.3s ease-out 0s;
                                    }
                                    /*------------{NESLETTER}---------------------------*/
                                    
                                    .newsletter {
                                        width: 100%;
                                        height: auto;
                                        padding: 200px 0;
                                        align-items: center;
                                        background-image: url("../../immagini/instagram/AdobeStock_197910852.jpeg");
                                        background-size: cover;
                                    }
                                    
                                    .newsletter-form h3 {
                                        font-weight: bold;
                                    }
                                    /*------------{FOOTER}---------------------------*/
                                    
                                    .footer {
                                        width: 100%;
                                        height: auto;
                                        background: #fff5f4;
                                    }
                                    
                                    .footer-img {
                                        width: 100%;
                                    }
                                    /* ---------------------------{  -10.Responsive Media Query }------------------ */
                                    
                                    @media screen and (max-width:992px) {
                                        .home-img {
                                            display: none;
                                        }
                                        .home {
                                            background-image: url(http://via.placeholder.com/640x962.jpg);
                                            background-position: center;
                                            background-size: cover;
                                            background-repeat: no-repeat;
                                        }
                                        .home-content-inner {
                                            top: 50%;
                                            left: 10%;
                                        }
                                        .overlay {
                                            display: block;
                                        }
                                        .nav-list {
                                            text-align: center;
                                        }
                                        .about-img {
                                            margin-bottom: 20px;
                                        }
                                        .works-info {
                                            height: auto;
                                            margin-top: 20px;
                                            display: block;
                                        }
                                    }
                                    
                                    @media screen and (max-width:767px) {
                                        .work-info {
                                            margin-top: 20px;
                                            display: block;
                                            height: auto;
                                            padding: 0px;
                                        }
                                        .work-info .work-info-inner {
                                            text-align: initial;
                                            display: block;
                                        }
                                    }
                                    
                                    @media screen and (max-width:550px) {
                                        h1,
                                        .h1 {
                                            font-size: 2.7rem;
                                        }
                                        h2,
                                        .h2 {
                                            font-size: 2.3rem;
                                        }
                                        h3,
                                        .h3 {
                                            font-size: 2.2rem;
                                        }
                                        h4,
                                        .h4 {
                                            font-size: 2rem;
                                        }
                                        h5,
                                        .h5 {
                                            font-size: 1.3rem;
                                        }
                                        h6,
                                        .h6 {
                                            font-size: 1.1rem;
                                        }
                                        .section-title {
                                            margin-bottom: 60px;
                                        }
                                        .btn-close {
                                            top: 15px;
                                            right: 15px;
                                        }
                                    }
                                    
                                    @media screen and (max-width:460px) {
                                        header .logo-section {
                                            margin: 15px 15px;
                                        }
                                        .toggle-btn {
                                            margin: 15px 15px;
                                        }
                                        .work-info .work-info-inner {
                                            text-align: center;
                                        }
                                        .works-info-title {
                                            text-align: center;
                                        }
                                        .margin-b {
                                            margin-bottom: 60px;
                                        }
                                    }
                                    
                                    @media screen and (max-width:380px) {
                                        header {
                                            height: 60px;
                                        }
                                        h1,
                                        .h1 {
                                            font-size: 2.3rem;
                                        }
                                        h2,
                                        .h2 {
                                            font-size: 2rem;
                                        }
                                        h3,
                                        .h3 {
                                            font-size: 1.8rem;
                                        }
                                        h4,
                                        .h4 {
                                            font-size: 1.6rem;
                                        }
                                        h5,
                                        .h5 {
                                            font-size: 1.2rem;
                                        }
                                        h6,
                                        .h6 {
                                            font-size: 1rem;
                                        }
                                        .home-content-inner {
                                            top: 60%;
                                            left: 10%;
                                        }
                                        .preloader .loader {
                                            font-size: 2.5rem;
                                        }
                                        .blog-img .blog-category {
                                            font-size: 0.8rem;
                                            padding: 10px 5px;
                                        }
                                    }
                                    
                                    @media screen and (max-width:300px) {
                                        h1,
                                        .h1 {
                                            font-size: 2rem;
                                        }
                                        h2,
                                        .h2 {
                                            font-size: 1.5rem;
                                        }
                                        h3,
                                        .h3 {
                                            font-size: 1.3rem;
                                        }
                                        h4,
                                        .h4 {
                                            font-size: 1.2rem;
                                        }
                                        h5,
                                        .h5 {
                                            font-size: 1.1rem;
                                        }
                                        h6,
                                        .h6 {
                                            font-size: 1rem;
                                        }
                                        .section-title {
                                            margin-bottom: 40px;
                                        }
                                        .toggle-btn {
                                            width: 40px;
                                        }
                                        .toggle-btn span {
                                            height: 1px;
                                            margin: 5px auto;
                                        }
                                        .skills-name {
                                            font-weight: 400;
                                        }
                                        .btn-close {
                                            width: 30px;
                                            height: 30px;
                                        }
                                        .preloader .loader {
                                            font-size: 2rem;
                                        }
                                        @media screen and (max-width:215px) {
                                            html {
                                                font-size: 14px;
                                            }
                                            body {
                                                line-height: 1.3;
                                                font-size: 14px;
                                            }
                                            .toggle-btn {
                                                width: 30px;
                                            }
                                            .toggle-btn span {
                                                margin: 4px auto;
                                            }
                                            .preloader .loader {
                                                font-size: 1.8rem;
                                            }
                                        }