body {  }
body > .wrap {  }






#headerLAYOUT {  }
#headerLAYOUT > .wrap {  }






#footerLAYOUT {  }
#footerLAYOUT .wrap {  }






#contentLAYOUT {  }
#contentLAYOUT > .wrap { position: relative;  }





#contentLAYOUT section.logo { position: absolute; top: 40px; width: 40%; z-index: 2; }
#contentLAYOUT section.logo > .wrap {  }
#contentLAYOUT section.logo img { width: 100%; }

#contentLAYOUT section.gallery { margin-left: 20%; width: 80%; position: relative; mix-blend-mode: multiply; }
#contentLAYOUT section.gallery > .wrap {  }
#contentLAYOUT section.gallery ul li { display: none; }
#contentLAYOUT section.gallery ul li img { width: 100%; filter: grayscale(1); }
#contentLAYOUT section.gallery ul li:first-child { display: block; }

#contentLAYOUT section.intro { margin: -144px 0px 80px 50%; width: 50%; z-index: 2; }
#contentLAYOUT section.intro > .wrap { padding-right: 80px; }
#contentLAYOUT section.intro span { font-size: 40px; line-height: 48px; position: relative; }
#contentLAYOUT section.intro span a { color: #ffffff; text-decoration: underline; }

#contentLAYOUT section.contacts {  }
#contentLAYOUT section.contacts > .wrap { padding: 80px 0px 80px 0px; }
#contentLAYOUT section.contacts ul {  }
#contentLAYOUT section.contacts ul li { display: inline-block; margin-right: 64px; font-size: 24px; /*border: 1px solid transparent; padding: 8px 16px; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; -khtml-border-radius: 8px;*/ }
#contentLAYOUT section.contacts ul li img { width: 40px; height: 40px; margin-right: 8px; vertical-align: middle; }
#contentLAYOUT section.contacts ul li:hover { /*border: 1px solid #ffffff;*/ }
#contentLAYOUT section.contacts ul li:hover a { color: #ffffff; text-decoration: underline; }
#contentLAYOUT section.contacts ul li:last-child { margin-right: 0px; }

#contentLAYOUT section.lospazio {  }
#contentLAYOUT section.lospazio > .wrap { padding: 40px 0 0px 0; }
#contentLAYOUT section.lospazio .column.left { width: 75%; columns: 3; }
#contentLAYOUT section.lospazio .column.right { width: 25%; margin-top: -80px; }

#contentLAYOUT section.social {  }
#contentLAYOUT section.social > .wrap { padding: 80px 0px 80px 0px; }
#contentLAYOUT section.social ul {  }
#contentLAYOUT section.social ul li { display: inline-block; margin-right: 64px; font-size: 24px; }
#contentLAYOUT section.social ul li img { width: 40px; height: 40px; margin-right: 8px; vertical-align: middle; }
#contentLAYOUT section.social ul li:hover { text-decoration: underline; }
#contentLAYOUT section.social ul li:last-child { margin-right: 0px; }


#contentLAYOUT section.line {  }
#contentLAYOUT section.line > .wrap { padding: 32px 0px 32px 0px; }













@media screen and (max-width: 1919px) /* 1920px -> 1680px */ {

}

@media screen and (max-width: 1679px) /* 1680px -> 1440px */ {

}

@media screen and (max-width: 1439px) /* 1440px -> 1366px */ {

}

@media screen and (max-width: 1365px) /* 1366px -> 1024px */ {

}

@media screen and (max-width: 1023px) /*1024 --> 768*/ {

}

@media screen and (max-width: 767px) /*768 --> 667*/ {

    #contentLAYOUT section.logo { top: 80px; width: 33.33%; }
    #contentLAYOUT section.logo img { width: 100%; }

    #contentLAYOUT section.gallery { margin: 0px 0px 0px 80px; width: calc(100% - 56px); }


    #contentLAYOUT section.intro { margin: 40px 0px 40px 0px; width: auto; z-index: 2; }
    #contentLAYOUT section.intro > .wrap { padding-right: 0px; }
    #contentLAYOUT section.intro span { font-size: 24px; line-height: 32px; }
    #contentLAYOUT section.intro span a {  }


    #contentLAYOUT section.contacts > .wrap { padding: 40px 0px 40px 0px; }
    #contentLAYOUT section.contacts ul li { display: block; margin: 8px 0px 8px 0; }
    #contentLAYOUT section.contacts ul li img { width: 32px; height: 32px; }

    #contentLAYOUT section.lospazio {  }
    #contentLAYOUT section.lospazio > .wrap {  }

    #contentLAYOUT section.social > .wrap { padding: 40px 0px 40px 0px; }
    #contentLAYOUT section.social ul li { font-size: 16px; }
    #contentLAYOUT section.social ul li img { width: 32px; height: 32px; }

    #contentLAYOUT section.lospazio .column.left { width: 100%; columns: 2; column-gap: 20px; margin: 32px 0 0 0; font-size: 12px; }
    #contentLAYOUT section.lospazio .column.right { width: 100%; margin-top: 0px; }

}

@media screen and (max-width: 666px) /*667 --> 414*/ {

}

@media screen and (max-width: 413px) /*414 --> 375*/ {

}

@media screen and (max-width: 374px) /*375 --> ___*/ {

}