body, html {
    height: 100%
}

body {
    margin: 0;
    font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
    line-height: 1.1em
}

header {
    position: fixed;
    left: 0;
    right: 0;
    z-index: 100;
    letter-spacing: 1px;
}

header .logo {
    color: #000;
    text-decoration: none;
    display: block;
    text-align: center;
    margin-top: 36px
}

header .logo:hover {
    text-decoration: underline
}

header .gradient {
    height: 30px
}

h1 {
    font-weight: 400;
    letter-spacing: 1px
}

.nav0 {
    background: #fff;
    position: absolute;
    text-align: center;
    font-size: 20px;
    letter-spacing: 1.5px;
    margin-top:0%;
    margin-left:43.6%
}
.nav0 > li {
    display: inline-block;
    margin: 0;
    padding: 0;
    position: relative
}

.nav0 > li > a {
    color: #000;
    text-decoration: none;
    display: block;
    padding: 0 10px
}

.nav0 > li.active > a {
    text-decoration: underline
}

.nav0 > li:hover > a {
    text-decoration: underline
}

.nav0 > LI {
    display: inline-block;
    position: relative;
}

.nav_eng {
    background: #ffffff;
    position: absolute;
    text-align: center;
    font-size: 18px;
    letter-spacing: 1.5px;
    margin-top:0%;
    margin-left:45%;
    font-weight: normal;

}

.nav_tot {
    background: #fff;
    margin-left: -2%;
    font-weight: bold;
    font-family: "Courier New", Courier, "Lucida Sans Typewriter", "Lucida Typewriter", monospace;

}

.about_header {
    background: #ffffff;
}

.nav_eng > li {
    display: inline-block;
    margin: 0;
    padding: 0;
    position: relative
}

.nav_eng > li > a {
    color: #000;
    text-decoration: none;
    display: block;
    padding: 0 10px
}

.nav_eng > li.active > a {
    text-decoration: underline
}

.nav_eng > li:hover > a {
    text-decoration: underline
}

.nav_eng > LI {
    display: inline-block;
    position: relative;
}

ul {
    display: block;
    list-style-type: disc;
}

footer.other_footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 5%;

}

footer.about_footer {
    position:absolute;
    width:100%;
    height:5%;   /* Height of the footer */
    margin-top:46%
}

p.about_copyright {
    position: absolute;
    width: 100%;
    font-size: 0.8em;
    text-align: center;
}
p.about_instagram {
    position: absolute;
    width: 100%;
    font-size: 2.8em;
    text-align: center;
    text-overline-color: black;
    margin-top:-2%

}
footer.contact_footer {
    position:absolute;
    width:100%;
    height:5%;   /* Height of the footer */
    margin-top:13%
}
p.contact_instagram {
    position: absolute;
    width: 100%;
    font-size: 2.8em;
    text-align: center;
    text-overline-color: black;
    margin-top:-2%
}
p.contact_copyright {
    position: absolute;
    width: 100%;
    font-size: 0.8em;
    text-align: center;
}
p.copyright {
    position: absolute;
    width: 100%;
    line-height: 40px;
    font-size: 0.8em;
    text-align: center;
    bottom: 0;
    margin-top:100%
}
p.instagram {
    position: absolute;
    width: 100%;
    line-height: 40px;
    font-size: 2.8em;
    text-align: center;
    bottom: 30%;
    margin-top:90%;
    text-overline-color: black;
    color: black;
}
a.ig:link, a.ig:visited,a.ig:hover, a.ig:active  {
    color: black;
}


.center {
    display: block;
    margin-left: 18%;
    margin-top: -7%;
    margin-right: auto;
    width: 60%;
    max-width:100%;
    height: auto;
}

#titolo-img{
    margin-top:5%;
    display: block;
    margin-left: 25%;
    width: 60%;
    max-width:100%;
}

DIV.about_text {
    margin-top: 3%;
    margin-left: 30%;
    margin-right:30%;
    line-height: 144%;
    text-align: justify;
    font-family: 'Osnova Pro';

}

DIV.about_text_projects {
    margin-top: 3%;
    margin-left: 32%;
    margin-right: 32%;
    line-height: 160%;
    text-align: justify;
    font-family: 'Osnova Pro';
}

DIV.contact_text {
    position:absolute;
    margin-top: 32%;
    margin-left: 55%;
    text-align: right;
    font-family: "Century Gothic" !important;
}

img.logo_contact{
    width: 6%;
    margin-left: 77%;
    margin-top: 20%;
}

img {
    width: 100%;
    height: 100%
}

figcaption {
    text-align: center;
}

@font-face {
    font-family: "Century Gothic";
    src: url("../fonts/gothic.eot");
    src: url("../fonts/gothic.eot") format("embedded-opentype"),
    url("../fonts/gothic.ttf") format("truetype"), url("../fonts/gothic.woff")
    format("woff"), url("../fonts/gothic.woff") format("woff"),
    url("../fonts/gothic.svg") format("svg");
    font-weight: normal;
    font-style: normal;
}

@font-face {font-family: "Garamond";
    src: url("../fonts/Garamond.eot");
    src: url("../fonts/Garamond.eot?#iefix") format("embedded-opentype"),
    url("../fonts/Garamond.woff2") format("woff2"),
    url("../fonts/Garamond.woff") format("woff"),
    url("../fonts/Garamond.ttf") format("truetype"),
    url("../fonts/Garamond.svg#Garamond") format("svg");
}

@font-face {font-family: "Osnova Pro";
    src: url("../fonts/OsnovaPro.eot");
    src: url("../fonts/OsnovaPro.eot?#iefix") format("embedded-opentype"),
    url("../fonts/OsnovaPro.woff2") format("woff2"),
    url("../fonts/OsnovaPro.woff") format("woff"),
    url("../fonts/OsnovaPro.ttf") format("truetype"),
    url("../fonts/OsnovaPro.svg#Garamond") format("svg");
}


p.p_center{
    text-align: center;
    line-height: 180%;

}
p.bullet{
    text-align: center;
    font-size: 550%;

}
b.biennale{
    line-height: 220%;
}

a.open_gallery{
    display: inline-block;
    vertical-align: middle;
    font-size: 220%;
    margin-top: -0.3%;
    text-decoration:none;
    cursor: pointer;
}
a.open_link{
    text-decoration:none;
    cursor: pointer;
}

.Modal {
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background-color: black;
    background-color: rgba(0, 0, 0, 0.2);
    -webkit-transition: 0.5s;
    overflow: auto;
    transition: all 0.3s linear;
}
.Modal-content {
    background-color: transparent;
    margin: auto;
    padding: 1%;
    max-width: 60%;
}

.Modal-content-doorscape {
    background-color: transparent;
    margin: auto;
    padding: 1%;
    max-width: 35%;
}
.ModalOpen { overflow: hidden; }
.is-hidden { display: none; }
.is-visuallyHidden { opacity: 0; }


.is-blurred {
    filter: blur(2px);
    -webkit-filter: blur(2px);
}


* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {
    max-width: 1000px;
    position: relative;
    margin: auto;
}

/* Hide the images by default */
.mySlides {
    display: none;
}

.mySlidesDoorscape {
    display: none;
}

/* Next & previous buttons */
.prev, .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    margin-top: -22px;
    padding: 16px;
    color: white;
    font-weight: bold;
    font-size: 18px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
}

.prevDoorscape, .nextDoorscape {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    margin-top: -22px;
    margin-right: -52%;
    margin-left: -52%;
    padding: 16px;
    color: white;
    font-weight: bold;
    font-size: 18px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
}

/* Position the "next button" to the right */
.next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

.nextDoorscape {
    right: 0;
    border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
    background-color: rgba(0,0,0,0.8);
}

.prevDoorscape:hover, .nextDoorscape:hover {
    background-color: rgba(0,0,0,0.8);
}

/* The dots/bullets/indicators */
.dot {
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.dotDoorscape {
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.active, .dot:hover, .dotDoorscape:hover {
    background-color: #717171;
}

@keyframes fade {
    from {opacity: .4}
    to {opacity: 1}
}

.zoom_img img {
    transition: transform 0.25s ease;
    cursor: zoom-in;
}

input[type=checkbox] {
    display: none;
}


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

    #titolo-img{
        visibility: visible;
        width: 90%;
        margin-left: 7%;

    }
    #nav_tot{
        margin-left: -25%;
        font-size: 5px;
    }
    #nav0{
        margin-top:5%;
        font-size: 15px;
    }
    #nav_eng{
        margin-top:5%;
        margin-left:25%;
        font-size: 15px;
        width:310px;
    }

    #img_1{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }

    #img_2{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }

    #img_3{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }

    #img_4{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }

    #img_5{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }

    #img_6{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }

    #img_7{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }
    #img_8{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }
    #img_9{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }
    #img_10{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }
    #img_11{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }
    #img_12{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }
    #img_13{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }
    #img_14{
        width:120%;
        margin-top: 45%;
        margin-left: -45%
    }

    #profile_photo{
        margin-top:50%;
        margin-left:15%;
        width: 70%;
    }

    #about_instagram{
        margin-top: -13%;
        font-size: 250%;
    }
    #about_copyright{
        font-size: 50%;
    }
    #contact_text{
        margin-top:-1%;
        margin-left: 8%;
        margin-right:10%;
        font-size: 67%;
    }

    figcaption {
        font-size: 62%;
    }
    p.instagram{
        font-size: 250%;
    }
    p.copyright{
        font-size: 50%;
    }
    #about_text{
        margin-top:8%;
        margin-left: 10%;
        margin-right:10%;
        font-size: 85%;

    }
    DIV.about_text_projects {
        margin-left: 12%;
        margin-right: 12%;
        font-size: 85%;
    }

    p.p_center{
        line-height:180%;

    }

    img.logo_contact{
        width: 20%;
        margin-left: 68%;
        margin-top: 75%;
    }

    .Modal-content-doorscape {
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:40%;
    }

    .Modal-content{
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:40%;
    }
    input[class=zoomCheckDoorscape]:checked ~ label > img {
        transform: scale(2.2);
        cursor: zoom-out;
        margin-top: 98%;

    }

    input[class=zoomCheck]:checked ~ label > img {
        transform: scale(2.1);
        cursor: zoom-out;
        margin-top: 90%;

    }

    .prev, .next {
        margin-right: -52%;
        margin-left: -52%;
    }
}

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

    #titolo-img{
        visibility: visible;
        width: 80%;
        margin-top: 0%;
        margin-left: 10%;
    }

    #nav_tot{
        margin-left: -20%;
        font-size: 15px;
    }
    #nav0{
        margin-top:5%;
        font-size: 20px;
    }
    #nav_eng{
        margin-top:5%;
        margin-left:34%;
        font-size: 15px;
        width:310px;
    }

    #img_1{
        width:120%;
        margin-top: 25%;
        margin-left: -45%
    }

    #img_2{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }

    #img_3{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }

    #img_4{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }

    #img_5{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }
    #img_6{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }
    #img_7{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }
    #img_8{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }
    #img_9{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }
    #img_10{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }
    #img_11{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }
    #img_12{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }
    #img_13{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }
    #img_14{
        width:100%;
        margin-top: 25%;
        margin-left: -35%
    }

    #profile_photo{
        margin-top:35%;
        margin-left:25%;
        width: 50%;
    }

    #about_footer{
        margin-top:15%;
    }

    #about_instagram{
        margin-top:-7%;
    }

    #contact_footer{
        margin-top:58%;
    }
    p.p_center{
        line-height:200%;

    }

    #about_text{
        margin-top:8%;
        margin-left: 10%;
        margin-right:10%;
        font-size: 85%;

    }
    DIV.about_text_projects {
        margin-left: 12%;
        margin-right: 12%;
        font-size: 85%;
    }

    #contact_instagram{
        margin-top:-5%;
    }
    #contact_text{
        margin-top:1%;
        margin-left: 30%;
        margin-right:7%;
        font-size: 85%;
    }

    img.logo_contact{
        width: 10%;
        margin-top:50%;
        margin-left: 81%;
    }

    .Modal-content-doorscape {
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:40%;
    }

    .Modal-content{
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:40%;
    }
    input[class=zoomCheckDoorscape]:checked ~ label > img {
        transform: scale(2.2);
        cursor: zoom-out;
        margin-top: 98%;

    }

    input[class=zoomCheck]:checked ~ label > img {
        transform: scale(2.1);
        cursor: zoom-out;
        margin-top: 90%;

    }

    .prev, .next {
        margin-right: -52%;
        margin-left: -52%;
    }
}


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

    #titolo-img{
        visibility: visible;
        width: 80%;
        margin-top: 0%;
        margin-left: 10%;
    }

    #nav_tot{
        margin-left: -30%;
        font-size: 15px;
    }
    #nav0{
        margin-top:5%;
        font-size: 20px;
        height:30%;
        width:60%;

    }
    #nav_eng{
        margin-top:5%;
        margin-left:43%;
        font-size: 15px;
        width:60%;
        height:30%;
    }
    figcaption{
        font-size: 70%;
    }

    #img_1{
        width:50%;
        margin-top: 20%;
        margin-left: -15%
    }

    #img_2{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }

    #img_3{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }

    #img_4{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }

    #img_5{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }
    #img_6{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }
    #img_7{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }
    #img_8{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }
    #img_9{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }
    #img_10{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }
    #img_11{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }
    #img_12{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }
    #img_13{
        width:35%;
        margin-top: 20%;
        margin-left: -7%
    }
    #img_14{
        width:50%;
        margin-top: 20%;
        margin-left: -15%
    }

    #profile_photo{
        margin-top:35%;
        margin-left:25%;
        width: 50%;
    }

    #about_footer{
        margin-top:26%;
    }

    #about_instagram{
        margin-top:-7%;
    }
    p.instagram{
        font-size: 180%;
    }
    p.copyright{
        font-size: 50%;
    }
    #contact_footer{
        margin-top:18%;
    }

    #contact_instagram{
        margin-top:-5%;
    }
    #contact_text{
        margin-top:1%;
        margin-left: 48%;
        margin-right:7%;
        font-size: 85%;
    }

    img.logo_contact{
        width: 10%;
        margin-top:20%;
        margin-left: 81%;
    }

    .Modal-content-doorscape {
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:40%;
    }

    .Modal-content{
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:40%;
    }
    input[class=zoomCheckDoorscape]:checked ~ label > img {
        transform: scale(2.2);
        cursor: zoom-out;
        margin-top: 98%;

    }

    input[class=zoomCheck]:checked ~ label > img {
        transform: scale(2.1);
        cursor: zoom-out;
        margin-top: 90%;

    }

    .prev, .next {
        margin-right: -52%;
        margin-left: -52%;
    }
}



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

    #titolo-img{
        visibility: visible;
        width: 80%;
        margin-top: 0%;
        margin-left: 10%;
    }

    #nav_tot{
        margin-left: -25%;
        font-size: 15px;
    }
    #nav0{
        margin-top:1%;
        font-size: 20px;
        height:30%;
        width:60%;

    }
    #nav_eng{
        margin-top:1%;
        margin-left:43%;
        font-size: 15px;
        width:60%;
        height:30%;
    }
    figcaption{
        font-size: 70%;
    }

    #img_1{
        width:50%;
        margin-top: 5%;
        margin-left: -8%
    }

    #img_2{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }

    #img_3{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }

    #img_4{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }
    #img_5{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }
    #img_6{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }
    #img_7{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }
    #img_8{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }
    #img_9{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }
    #img_10{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }
    #img_11{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }
    #img_12{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }
    #img_13{
        width:30%;
        margin-top: 5%;
        margin-left: 2%
    }
    #img_14{
        width:50%;
        margin-top: 5%;
        margin-left: -8%
    }

    #profile_photo{
        margin-top:25%;
        margin-left:37%;
        width: 30%;
    }

    #about_footer{
        margin-top:18%;
    }

    #about_instagram{
        margin-top:-7%;
    }
    p.instagram{
        font-size: 180%;
    }
    p.copyright{
        font-size: 50%;
    }


    #contact_footer{
        margin-top:18%;
    }

    #contact_instagram{
        margin-top:-5%;
    }
    #contact_text{
        margin-top:1%;
        margin-left: 48%;
        margin-right:7%;
        font-size: 85%;
    }

    img.logo_contact{
        width: 10%;
        margin-top:20%;
        margin-left: 81%;
    }

    .Modal-content-doorscape {
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:10%;
    }

    .Modal-content{
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:20%;
    }
    input[class=zoomCheckDoorscape]:checked ~ label > img {
        transform: scale(2.2);
        cursor: zoom-out;
        margin-top: 98%;

    }

    input[class=zoomCheck]:checked ~ label > img {
        transform: scale(2.1);
        cursor: zoom-out;
        margin-top: 90%;

    }

    .prev, .next {
        margin-right: -52%;
        margin-left: -52%;
    }
}

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

    #titolo-img{
        visibility: visible;
        width: 50%;
        margin-top: 0%;
        margin-left: 24%;
    }

    #nav_tot{
        margin-left: -27%;
        font-size: 15px;
    }
    #nav0{
        margin-top:1%;
        font-size: 13px;
        height:30%;
        width:60%;

    }
    #nav_eng{
        margin-top:1%;
        margin-left:43%;
        font-size: 12px;
        width:60%;
        height:30%;
    }
    figcaption{
        font-size: 70%;
    }

    #img_1{
        width:53%;
        margin-top: 3%;
        margin-left: -13%
    }

    #img_2{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }

    #img_3{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }

    #img_4{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }
    #img_5{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }
    #img_6{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }
    #img_7{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }
    #img_8{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }
    #img_9{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }
    #img_10{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }
    #img_11{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }
    #img_12{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }
    #img_13{
        width:34%;
        margin-top: 3%;
        margin-left: -4%
    }
    #img_14{
        width:53%;
        margin-top: 3%;
        margin-left: -13%
    }

    #profile_photo{
        margin-top:20%;
        margin-left:38%;
        width: 23%;
    }


    #about_footer{
        margin-top:18%;
    }

    #about_instagram{
        margin-top:-3%;
    }
    p.instagram{
        font-size: 180%;
    }
    p.copyright{
        font-size: 50%;
    }

    p.about_instagram{
        font-size: 200%;
    }
    p.about_copyright{
        font-size: 50%;
    }

    #contact_footer{
        margin-top:18%;
    }

    #about_text {
        margin-top: 3%;
        margin-left: 24%;
        margin-right:24%;
        font-size: 79%;
    }
    DIV.about_text_projects {
        margin-left: 26%;
        margin-right: 26%;
        font-size: 79%;

    }
    #contact_instagram{
        margin-top:-5%;
    }
    #contact_text{
        margin-top:1%;
        margin-left: 48%;
        margin-right:7%;
        font-size: 73%;
    }

    img.logo_contact{
        width: 7%;
        margin-top:20%;
        margin-left: 77%;
    }
    input[class=zoomCheckDoorscape]:checked ~ label > img {
        transform: scale(2.5);
        cursor: zoom-out;
        margin-top: 98%;

    }

    input[class=zoomCheck]:checked ~ label > img {
        transform: scale(2.5);
        cursor: zoom-out;
        margin: 65%;

    }

    .Modal-content-doorscape {
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:10%;
    }

    .Modal-content{
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:2%;
    }

    .prev, .next {
        margin-right: -1%;
        margin-left: -1%;
    }


}


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

    #titolo-img{
        visibility: visible;
        width: 50%;
        margin-top: 0%;
        margin-left: 25%;
    }

    #nav_tot{
        margin-left: -27%;
        font-size: 15px;
    }
    #nav0{
        margin-top:1%;
        font-size: 15px;
        height:30%;
        width:60%;

    }
    #nav_eng{
        margin-top:1%;
        margin-left:43%;
        font-size: 15px;
        width:60%;
        height:30%;
    }


    #img_1{
        width:70%;
        margin-top: 7%;
        margin-left: -23%;
    }

    #img_2{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;
    }
    #img_3{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;

    }

    #img_4{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;
    }

    #img_5{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;
    }

    #img_6{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;
    }

    #img_7{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;

    }
    #img_8{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;

    }
    #img_9{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;

    }
    #img_10{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;

    }
    #img_11{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;

    }
    #img_12{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;

    }
    #img_13{
        width:35%;
        margin-top: 7%;
        margin-left: -5%;

    }
    #img_14{
        width:70%;
        margin-top: 7%;
        margin-left: -23%;
    }


    #profile_photo{
        margin-top:20%;
        margin-left:36%;
        width: 23%;
    }
    #about_footer{
        margin-top:19%;
    }

    #about_instagram{
        margin-top:-4%;
    }


    #contact_footer{
        margin-top:19%;
    }
    #contact_instagram{
        margin-top:-4%;
    }
    #contact_text{
        margin-top:1%;
        margin-left: 48%;
        margin-right:7%;
        font-size: 95%;
    }

    img.logo_contact{
        width: 10%;
        margin-top:20%;
        margin-left: 81%;
    }
    p.instagram{
        font-size: 280%;
    }
    p.copyright{
        font-size: 70%;
    }
    p.about_instagram{
        font-size: 280%;
    }
    p.about_copyright{
        font-size: 70%;
    }

    input[class=zoomCheckDoorscape]:checked ~ label > img {
        transform: scale(2.5);
        cursor: zoom-out;
        margin-top: 98%;

    }

    input[class=zoomCheck]:checked ~ label > img {
        transform: scale(2.5);
        cursor: zoom-out;
        margin: 65%;

    }

    .Modal-content-doorscape {
        background-color: transparent;
        padding: 1%;
        max-width: 30%;
        margin-top:2%;
    }

    .Modal-content{
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:2%;
    }

    .prev, .next {
        margin-right: -1%;
        margin-left: -1%;
    }


}

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

    #titolo-img{
        visibility: visible;
        width: 40%;
        margin-top: 0%;
        margin-left: 30%;
    }

    #nav_tot{
        margin-left: -25%;
        font-size: 33px;
    }
    #nav0{
        margin-top:0%;
        font-size: 20px;
    }
    #nav_eng{
        margin-top:1%;
        margin-left:43%;
        font-size: 15px;
        width:60%;
        height:10%;
    }

    #img_1{
        width:70%;
        margin-top: -5%;
        margin-left: -22%;
    }

    #img_2{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;
    }
    #img_3{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;

    }

    #img_4{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;
    }

    #img_5{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;
    }

    #img_6{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;
    }

    #img_7{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;

    }
    #img_8{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;

    }
    #img_9{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;

    }
    #img_10{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;

    }
    #img_11{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;

    }
    #img_12{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;

    }
    #img_13{
        width:35%;
        margin-top: -5%;
        margin-left: -4%;

    }
    #img_14{
        width:70%;
        margin-top: -5%;
        margin-left: -22%;
    }

    #profile_photo{
        margin-top:12%;
        margin-left:42%;
        width: 17%;
    }

    #africa_1{
        width: 62% ;
        margin-left: 20%;
    }

    #africa_2{
        width: 62% ;
        margin-left: 20%;
    }

    input[class=zoomCheckDoorscape]:checked ~ label > img {
        transform: scale(2.5);
        cursor: zoom-out;
        margin-top: 98%;

    }

    input[class=zoomCheck]:checked ~ label > img {
        transform: scale(2.5);
        cursor: zoom-out;
        margin: 65%;

    }

    .Modal-content-doorscape {
        background-color: transparent;
        padding: 1%;
        max-width: 30%;
        margin-top:2%;
    }

    .Modal-content{
        background-color: transparent;
        padding: 1%;
        max-width: 50%;
        margin-top:2%;
    }

    .prev, .next {
        margin-right: -1%;
        margin-left: -1%;
    }


    #about_footer{
        margin-top:10%;
    }

    #about_instagram{
        margin-top:-4%;
    }
    #contact_footer{
        margin-top:17%;
    }
    #contact_instagram{
        margin-top:-3%;
    }
    #contact_text{
        margin-top:0%;
        margin-left: 60%;
        margin-right:10%;
        line-height: 144%;
        font-size : 93%;
    }
    img.logo_contact{
        margin-left: 82%;
        margin-top:19%;
        width: 7%;

    }
    figcaption {
        font-size: 86%;
    }
    #about_text {
        margin-top: 3%;
        margin-left: 24%;
        margin-right:24%;
        font-size: 85%;
    }
    DIV.about_text_projects {
        margin-left: 26%;
        margin-right: 26%;
        font-size: 85%;

    }
    p.p_center{
        line-height: 150%;

    }
}

@media screen and (min-width: 1600px) {
    #about_footer{
        margin-top:5%;
    }
    #contact_footer{
        margin-top:20%;
    }
    #about_instagram{
        margin-top:-2%;
    }
    #contact_instagram{
        margin-top:-2%;
    }

    #profile_photo{
        margin-top:12%;
        margin-left:41%;
        width: 18%;
    }

    #about_text {
        margin-top: 3%;

        margin-left: 30%;
        margin-right:30%;
    }

    figcaption {
        font-size: 107%;
    }
    #contact_text{
        margin-top: 0%;
        margin-left: 61%;
        margin-right:15%;
        line-height: 144%;
        font-size : 93%;
    }
    img.logo_contact{
        margin-left: 78%;
        margin-top:22%;
        width: 7%;
    }
    p.p_center{
        line-height: 150%;

    }
}

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

    #titolo-img{
        visibility: visible;
        width: 35%;
        margin-top: 0%;
        margin-left: 33%;
    }

}

.smoothfont {-webkit-font-smoothing:antialiased;-moz-font-smoothing:grayscale;-moz-osx-font-smoothing:grayscale}
.noselect {-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:moz-none;-ms-user-select:none;user-select:none}

DIV.home {
    position:absolute;
    margin-top: 13%;
    margin-left: 42%;
    cursor:pointer;
    font-family: Garamond,Baskerville,Baskerville Old Face,Hoefler Text,Times New Roman,serif;
    font-size: 15px;
}

DIV.profile_photo {
    position:absolute;
    margin-top: 10%;
    margin-left: 42%;
}



a:hover,a:visited { color:#000; }

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

    100% {
        opacity: 1;
    }
}

.fadeIn {
    animation:fadeIn 0.8s forwards;
    animation-timing-function: ease-in-out;
}

img.profile_photo{
    width:17%;
    margin-top: 10%;
    margin-left: 40%;
}

#loadOverlay{display: none;}