        @font-face {
            font-family: "Unageo";
            src:
            url("./font/Unageo-Regular.ttf");
            font-style: normal;
            font-weight: normal;
        }
        @font-face {
            font-family: "UnageoRegular";
            src:
            url("./font/Unageo-Regular.ttf");
            font-style: normal;
            font-weight: normal;
        }
        @font-face {
            font-family: "UnageoBlack";
            src:
            url("./font/Unageo-Black.ttf");
            font-style: normal;
            font-weight: bolder;
        }
        @font-face {
            font-family: "UnageoBlackItalic";
            src:
            url("./font/Unageo-Black-Italic.ttf");
            font-style: italic;
            font-weight: bolder;
        }
        @font-face {
            font-family: "UnageoItalic";
            src:
            url("./font/Unageo-Regular-Italic.ttf");
            font-style: italic;
            font-weight: normal;
        }
        @font-face {
            font-family: "UnageoBold";
            src:
            url("./font/Unageo-Bold.ttf");
            font-style: normal;
            font-weight: bold;
        }
        @keyframes move {
            0% {transform:translate(0,0);} 
            100% {transform:translate(-50%,0);}
          }
        @keyframes appearance {
            0% {
                opacity:0;
            }
            10% {
                opacity:0;
            }
            50% {
                opacity: 0.7;
                }
            100% {
                opacity: 1;
            }
        }
        @keyframes loading {
            0% {
                opacity:1;
            }
            10% {
                opacity:1;
            }
            90% {
                opacity: 0;
                display: block;
            }
            100% {
                opacity: 0;
                display: none;
            }
        }
        @keyframes scroll {
            0% {
                opacity: 0;
            }
            20% {
                opacity: 0.2;
            }
            50%{
                opacity: 1;
            }
        }
        @keyframes zoom {
            0% {
                scale: 1;
            }
            100%{
                scale: 1.05;
            }
        }
        .frame_left, .frame_right, .plan {
            animation: scroll linear;
            animation-delay: 1s;
            animation-timeline: view();
            animation-range-start: 10vw contain;
            animation-fill-mode: forwards;
        }
        .slideshow div {
          animation: slideshow__fade 15s linear infinite 0s;
          animation-fill-mode: both;
          /*backface-visibility: hidden;*/
        }
                
        .slideshow div:nth-of-type(1) {
          animation-delay: 3s;
        }
        
        .slideshow div:nth-of-type(2) {
          animation-delay: 8s;
        }
        
        .slideshow div:nth-of-type(3) {
          animation-delay: 13s;
        }
        
        @keyframes slideshow__fade {  
          0% {
            opacity: 0;
            animation-timing-function: ease-in;
          }
          3.00% {
           opacity: 1;
           animation-timing-function: ease-in;
          }
          37.00% {
            opacity: 1;
          }
          40.01% {
            opacity: 0;
          }
          100% {
            opacity: 0;
          }
        }
        :root { /* color scheme */
            --bg-color: #001419;
            --text-color: #fffc00 ;
            --text-white: white ;
            --div-color-1: #cfc01f ;
            --div-color-2: #1f3829 ;
            --div-color-3: #30b07e ;
            --div-color-4: #FFBF29;
            --div-color-5: #4a6c58 ;
        }      
        .loading{
            position: fixed;
            animation: 1s ease-in-out 1s 1 loading;
            animation-direction: alternate;
            animation-fill-mode: both;
            background-color: var(--bg-color);
            margin: auto;
            width: 100vw;
            height: 100vh;
            padding: 0;
            top: 0;
            overflow-y: hidden;
            z-index: 20; 
        }
            
            /* Show the tooltip text when you mouse over the tooltip container */
        polygon:hover .title {
              visibility: visible;
        }
        h4{
            animation: appearance 5s linear 3s infinite;
            animation-timing-function: ease-out;
            position: absolute;
            opacity: 0;
            margin: 0;
            right: 7vw;
            bottom: 7vw;
            font-size: 4vw;
            font-family: "UnageoBlackItalic", serif;
            font-weight: 900; 
            font-style: italic;
            white-space: pre;
            text-transform: uppercase;
            text-align: right;
            color: var(--text-color);
            z-index:6;
        }    
        h5{
            position: relative;
            margin-top: 0;
            margin-bottom: 0;
            margin-left: auto;
            margin-right: auto;
            font-size: 4vw;
            font-family: "UnageoBlackItalic", sans-serif;
            font-style: italic;
            text-transform: uppercase;
            text-align: center;
            color: var(--text-color);
        }    
        a:link {
            color: var(--text-white);
            text-decoration: none;
          }
        a:visited {
            color: var(--text-white);
          }
        a:hover {
            color: var(--text-white);
          }
        a:active {
            color: var(--text-white);
        }
        
        thead > tr:hover{
        background: var(--div-color-2);
        }

        .tablebg{
            background-color: var(--div-color-1);
            z-index: 2;
        }
        .gallery {
            background: #EEE;
        }
        
        .gallery-cell {
        max-width: 100vw;
        margin-right: 0px;
        counter-increment: gallery-cell;            
        }
        
        /* cell number */
        .gallery-cell:before {
        display: block;
        text-align: center;
        content: counter(gallery-cell);
        font-size: 80px;
        color: white;
        }
        #scroll_anim1 {
        opacity: 0;
        }
        #scroll_anim2 {
        opacity: 0;
        }
        #scroll_anim3 {
        opacity: 0;
        }
        /*.scroll_anim.animate{
        animation: 1s ease-in-out 2s 1 appearance;
        animation-fill-mode: both;
        }*/
        .add-anim {
        animation: 1s ease-in-out 0.2s 1 appearance;
        animation-fill-mode: both;
        }
        .zoom {
        animation: 11s linear 3s infinite zoom;
        animation-fill-mode: both;
        animation-direction: alternate;
        }
        button:hover {
        background-color:var(--bg-color);
        color:var(--text-color);
        }
        .polygon_highlight {
        fill: var(--text-color);
        opacity: 0.7;
        }
        .demo{
            margin-bottom: 5vw;
        }
@media (max-width: 650px)
        {
        
        body {
            font-family: "Unageo", serif;
            font-weight: 400;
            color: var(--text-white);
            margin: auto;
            padding: 0;
            text-align: center;
            background-color: var(--bg-color);
            overflow-x: hidden;
            overflow-y: scroll;
        }
        section{
            position: relative;
        }
        .sticky_top{
            position: sticky;
            top: 0;
            height: 8vh;
            width: 100vw;
            z-index: 6;
            background-color: inherit;
        }
        nav{
            position: relative;         
            height: 4vh;
            width: 100%;
            right: 0;
            top: 0;
            z-index: 7;
            line-height: 4vh;
            text-align: right;
            vertical-align: middle;
        }
        a{
            padding-left: 1vw;
        }
        .logo{
            position: absolute;
            left: 0;
            top: 1vh;
            height: 3vh;
        }
        .logo_gp{
            position: relative;
            height: 2vh;
            top: 0.6vh;

        }
        .logo_snob{
            position: relative;
            margin-top: 10vh;
            margin-left: auto;
            margin-right: auto;
            height: 14vh;
        }
        .nav{
            position: fixed;
            opacity: 0;
            animation: 1s ease-in-out 5s 1 appearance;
            animation-fill-mode: forwards;
            height: 4vh;
            padding: 2vh;
            width: calc(100vw - 4vh);
            z-index: 7;
            font-size: 1.4vh;
            text-align: right;
            font-family: "UnageoBold", serif;
            font-weight: 900;
            color: var(--text-white);
            text-transform: uppercase;
        }
        a:link {
            color: var(--text-white);
            text-decoration: none;
          }
        a:visited {
            color: var(--text-white);
          }
        a:hover {
            color: var(--text-white);
            opacity: 0.5;
          }
        a:active {
            color: var(--text-white);
        }

        main {
            width: 100vw;
            scroll-snap-type: y mandatory;
            scroll-behavior: smooth;
            height: 100vh;
            overflow-y: scroll;
        }

        main > section {
            scroll-snap-align: start;
        }
        header {
            height: 100%;
            padding: 20px;
            text-align: center;
        }
        h1 {
            margin: 0;
            font-size: 10vw;
            font-family: "UnageoBlackItalic";
            font-weight: bold; 
            font-style: italic;
            color: var(--text-white);
            text-transform: uppercase;
            white-space: pre;
            line-height: 10vw;
        }
        h2{
            font-size: 4vw;
            font-family: "Unageo", serif;
            font-weight: bold; 
            font-style: italic;
            padding-bottom: 1vh;
            color: var(--text-white);
            text-transform: uppercase;
            white-space: pre;
            margin: 0;
        }
        h3 {
            font-size: 2.5vh;
            padding-left: 3.5vw;
            margin-top: 0;
        }
        h4{
            font-size: 5vh;
            bottom: 20vw;
        }
        h5{
            font-size: 3vh;
        }
        /* p{
            padding-left: 3.5vw;
            padding-bottom: 3vh;
        }  */       
        .landing {
            animation: 4s ease-in-out 1s 1 appearance;
            animation-fill-mode: both;
            background-color: var(--bg-color);
            margin: auto;
            width: 100vw;
            height: 100vh;
            padding: 0;
            top: 0;
            overflow-y: hidden;
            z-index: 2;       
        }
        .map {
            margin: auto;  
            opacity: 1;
            top: 0;
            left: 0;
            background-color: var(--div-color-2);
        }
        .plan {
            position: relative;
            width: 100vw;
            
        }
        .plan_img {
            position: relative;
            width: 100vw;
            
        }

        .svg, .svg:hover, .svg.hover {
            display: none;
        }
        .svg_height{
            width: 100vw;

            position: absolute;
            margin: 0;
            top: 0;
            left: 0;
        }
        .pic_100 {
            position: absolute;
            display: flex;
            top: 50%;
            transform: translate(0, -50%);
            max-height: 100vw;
            max-width: 100vw;
            z-index: 2;
            background-color: var(--bg-color)
        }

        .pic{
            position: relative;
            max-height: 100vw;
            max-width: 100vw;
            z-index: 0;
            
        }
        .picc{
            position: absolute;
            height: inherit;
            width: 100vw;
            margin: auto;
            z-index: 0;
            opacity: 0;
            overflow:hidden ;
        }
        .picc > img {
            animation: 30000ms linear 0ms infinite alternate none running move;
            left: 0;
            height: 100vh;
        }
        
        .frame_left, .frame_right{
            width: 100vw;
            overflow: hidden;
        }

        .pic_60, .pic_60_right {
            width: 100vw;
             
        }
        
        .svg:hover,
        .svg.hover,
        .svg_height:hover,
        .svg_height.hover {
            position: absolute;
            top: 0;
            left: 0;
            opacity: .9;
            pointer-events: visible;
        }

        polygon {
            opacity: 0;
            position: absolute;
            top: 0;
            left: 0;
            fill: var(--text-color);
            stroke: #646464;
            z-index: 12;
        }
    
        polygon:hover {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
        }
        .wrapper1 {
            background-color: var(--div-color-1);
        }
        .wrapper2 {
            background-color: var(--div-color-2);
        }
        .wrapper3 {
            background-color: var(--div-color-3);
        }
        .wrapper4 {
            background-color: var(--bg-color);
            
        }
    
        .text-right, .text-left, .text-contact {
            position: relative;
            display:inline-block;
            max-width:60%;
            /* margin-left: 5vw; */
            margin-right:auto;
            margin-top: 5vh;
            margin-bottom: 5vw;
            text-align:left;
            vertical-align:middle;
            font-size: 2.2vh;
            line-height: 3.2vh;
        }
        .text-contact {
            margin-top: 1vh;
            
        }
        .footer{
            position: relative;
            display:inline-block;
            margin-right:auto;
            margin-top: 5vh;
            margin-bottom: 5vw;
            text-align:left;
            vertical-align:middle;
            font-size: 1.8vh;
            line-height: 2.5vh;
        }        
        .slideshow{
            height: 100vh;
            width: 100vw;
            position: absolute;
            top: 0;
            overflow: hidden;
            z-index: 5;
        }
        .slideshow img:not(:first-child) {
          position: absolute;
          top: 22vw;
          left: 0px;
        }
        table {
            position: relative;
            width: 80%;
            margin: auto;
            font-size:1.5vh;
            text-align: center;
            border-collapse: collapse;

        }
        thead{
            text-transform: uppercase;
            font-size:1.5vh;
            padding-top: 1.5vh;
            padding-bottom: 0.75vh;
            text-align: center;
            font-weight: 600;
        }
        tr :nth-child(1) {
            text-align: left;
        }
        tr :nth-child(4) {
            text-align: right;
        }
       
        th,td {
            border:0px;
            border-bottom: 1px solid white;
            padding-top: 1.5vh;
            padding-bottom: 0.75vh;

        }
        .contact-container{
            display: flex;
            padding-left: 15vw;
            padding-right: 15vw;
        }
        .contact-left {
            display: inline-block;
            flex-direction: column;
            align-items: start;
            gap: 10px;
        }
        .contact-left-title{
            font-size:1.2vh;
            
        }
        .contact-inputs {
            height: 4vh;
            width: 70vw;
            background-color:var(--bg-color-);
            color:var(--text-white);
            resize: vertical;
        }
        input { 
            background-color: var(--bg-color);
            border: none;
            border-top: 1px solid white;
            color: white;
            font-size:1.8vh;
            font-family: 'Unageo';
            -webkit-appearance: none;
            appearance: auto;
            border-radius: 0;
       }
        input::placeholder{
            color:white;
        }
        textarea{
            width: 70vw;
            padding-top: 1.1vh;
            background-color:var(--bg-colorr-);
            color:var(text);
            border:none;
            border-bottom: 2px solid white;
            margin-bottom: 3vh;
            border-top: 1px solid white;
            border-bottom: 1px solid white;
            font-size:1.8vh;
            font-family: 'Unageo';
            -webkit-appearance: none;
            appearance: auto;
            border-radius: 0;
        }
        textarea::placeholder{
            color:white;
        }
        button {
            width:22vh;
            height:4vh;
            background-color:var(--text-color);
            color:var(--bg-color);
            text-transform: uppercase;
            text-align: center;
            line-height: 4vh;
            vertical-align: middle;
            font-size:2.0vh;
            font-weight: 600;
            border:none;
            border-radius:2.0vh;
            font-family: "UnageoItalic";
            }    
        .tooltip {
            position: absolute;
            background-color: var(--div-color-2);
            color: white;
            max-width: 12vh;
            line-break: strict;
            padding: 5px 10px;
            font-size: 14px;
            pointer-events: none; /* Prevents tooltip from blocking hover */
            visibility: hidden; /* Hidden by default */
            z-index: 10;
            }
        .social, .social > img {
            display: inline-flex;
            /* position: relative; */
            width: 10vw;
            height: 10vw;
            padding-left: 2vw;
            align-items: center; 
            margin-right: auto;
            justify-content: center;
            vertical-align: middle;

            }
        .soc_pos{
            margin-top: 5vh;
            margin-bottom: 0;
            }
        .soc_pos > a{
            padding: 0;
            display: inline;
            }
        .inic_polygon {
            opacity: .9;
            }
            
    }
@media (min-width: 650px)
        {    
            body {
            font-family: "Unageo", serif;
            color: var(--text-white);
            width: calc(100vw - 17px);
            text-align: center;
            background-color: var(--bg-color);
            margin: 0;
            overflow-x: hidden;
            overflow-y: scroll;
            height: 100vh;
        }
        main {
            position: relative;
            width: 100vw;
            scroll-snap-type: y mandatory;
            scroll-behavior: smooth;
            height: 100vh;
            overflow-y: scroll;
        }
        .sticky_top{
            position: sticky;
            top: 0;
            height: 8vw;
            width: 100vw;
            z-index: 6;
            background-color: inherit;
        }

        main > section {
            scroll-snap-align: start;
        }
        section{
            position: relative;
            width: 100vw;
        }
        
        header {
            height: 100%;
            padding: 20px;
            text-align: center;
        }
        h1 {
            margin: 0;
            font-size: 5vw;
            font-family: "UnageoBlackItalic";
            font-weight: bold; 
            font-style: italic;
            color: var(--text-white);
            text-transform: uppercase;
            white-space: pre;
            /* line-height: 5vw; */
        }
        h2{
            margin: 0;
            font-size: 1.8vw;
            font-family: "Unageo", serif;
            font-style: italic;
            color: var(--text-white);
            text-transform: uppercase;
            white-space: pre;
        }
        h3{
            font-size: 2vw;
            padding-bottom: 3vw;
            margin: auto;
            font-family: "Unageo";
        }
        h4{
            position: absolute;
            margin: 0;
            right: 7vw;
            bottom: 7vw;
            font-size: 4vw;
            font-family: "UnageoBlackItalic", serif;
            font-style: italic;
            white-space: pre;
            text-transform: uppercase;
            text-align: right;
            color: var(--text-color);
            z-index:6;
        }    
        h5{
            position: relative;
            margin-top: 0;
            margin-bottom: 0;
            margin-left: auto;
            margin-right: auto;
            font-size: 4vw;
            font-family: "UnageoBlackItalic", sans-serif;
            font-style: italic;
            text-transform: uppercase;
            text-align: center;
            color: var(--text-color);
        }   

        p{
            font-size: 1.5vw;
            padding-left: 0vw;
        }
        nav{
            position: relative;         
            height: 2vw;
            width: 100%;
            right: 0;
            /*padding-top: 1.4vh;*/
            z-index: 7;
            line-height: 4vh;
            text-align: right;
            vertical-align: middle;
        }
        a{
            padding-left: 4vw;
        }
        .logo{
            position: absolute;
            left: 0;
            top: -0.8vw;
            height: 4vw;
        }
        .logo_gp{
            position: relative;
            vertical-align: middle;
            height: 1.2vw;
            padding-left: 0;
        }
        .logo_snob{
            position: absolute;
            left: 12vw;
            top: 9vw;
            height: 8vw;
        }
        .nav{
            position: fixed;
            opacity: 0;
            animation: 1s ease-in-out 5s 1 appearance;
            animation-fill-mode: forwards;
            height: 2vw;
            padding: 3vw;
            width: calc(100vw - 10vh);
            z-index: 7;
            font-size: 1.4vw;
            text-align: right;
            font-family: "UnageoBold", serif;
            font-weight: 900;
            color: var(--text-white);
            text-transform: uppercase;
        }

        .nav a {
            text-decoration: none;
            font-weight: 600;
        }
        .nav a:hover {
            color: var(--text-white);
            opacity: 0.5;
        }
        .landing {
            animation: 2s ease-in-out 1s 1 appearance;
            animation-fill-mode: both;
            background-color: var(--bg-color);
            margin: auto;
            width: 100vw;
            height: 100vh;
            padding: 0;
            top: 0;
            z-index: 2;      
        }
        .map {
            position: relative;
            width: 100vw;
            max-height: 220vw;
            top: 0;
            background-color: var(--div-color-2);
        }
        .plan {
            position: relative;
            width: 45vw;
            height: 32.14vw;
            margin-top: 2vw;
            left: 10vw;
            overflow: hidden;
        }
        .svg, .svg:hover, .svg.hover {
            max-width: 100vw;
            position: absolute;
            top: 0;
        }
        .pic_100 {
            position: absolute;
            display: flex;
            top: 50vh;
            left: 50%;
            transform: translate(-50%, -50%);
            max-height: 100vh;
            max-width: 100vw;
        }
        .pic{
            width: 100vw; 
            height: inherit;           
        }
        .picc{
            position: absolute;
            top: 50%;
            transform: translate(0%,-50%);
            max-height: 100vw;
            max-width: 100vw;
            z-index: 2;
            margin: auto;
            opacity: 0;
            overflow:hidden ;
            
        }
        .frame_left{
            position: relative;
            left: 10vw;
            width: 45vw;
            height: 32.14vw;
            margin-top: 5vh;
            margin-bottom: 5vw;
            overflow: hidden;
        }
        .frame_right{
            position: relative;
            width: 45vw;
            height: 32.14vw;
            left:50vw;
            margin-top: 2vw;
            margin-bottom: 2vw;
            overflow: hidden;
        }
        .pic_60 {
            position: absolute;
            top: 0;
            left: 0;
            width: 45vw;
            height: 32.9vw;
        }
        .pic_60_right{
            position: relative;
            width: inherit;
        }
        
        .svg {
            position: absolute;
            top: 0;
            left: 0;
            /*margin-bottom: -50%;*/
            /*width: 100vw;*/
            
        }
        .svg_height {
            display: none;
            
        }
        .svg:hover,
        .svg.hover {
            position: absolute;
            top: 0;
            left: 0;
            opacity: .9;
            pointer-events: visible;
        }

        polygon {
            opacity: 1;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 12;
            /*display: none;*/
            fill: none;
            border-width: 5px;
            border-color:  var(--div-color-4);
        }
        polygon:hover {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            fill: var(--text-color);
        }
        .wrapper1 {
            width: 100vw; 
            height: 60vw;
            padding-bottom: 6vw;
            background-color:var(--div-color-1) ;
        }
        .wrapper2 {
            /* height: 150vh;
            width: 100vw; */
            background-color:var(--div-color-2) ;
        }
        .wrapper3 {
            /* height: 100vh;
            width: 100vw; */
            background-color:var(--div-color-3) ;
        }
        .wrapper4 {
            height: 100vh;
            width: 100vw;
            background-color:var(--bg-color);
        }
        .footer {
            font-size: 1.2vw;
            padding-top: 3.2vh
        }
        .text-right {
            position: absolute;
            left: 65vw;
            top: 0vw;
            max-width: 30vw;
            top: 10vw;
            margin-bottom: 5vw;
            text-align:left;
            vertical-align:top;
        }
        .text-right p{
            padding-left: 0;
        }
        .text-left {
            position: absolute;
            left: 10vw;
            /*display:inline-block;*/
            max-width:30vw;
            margin-left: 0;
            top: 10vw;
            margin-bottom: 5vw;
            text-align:justify;
        }
        .text-left p{
            padding-left: 5vw;
        }
        .text-left_40 {
            position: absolute;
            left: 5vw;
            top:0;
            width: 35vw;
            /*display:inline-block;*/
            margin-bottom: 5vw;
            text-align:left;
        }
        .text-contact {
            position: absolute;
            left: 10vw;
            max-width:30vw;
            margin-left: 0;
            top: 18vw;
            margin-bottom: 5vw;
            text-align:left;
        }
/*         .text-contact > p{
            font-size: 1.2vw;
            padding-top: 3.2vh;
        } */

        .slideshow img{
            width: 100vw;
            top: 0vw;

        }

        table {
            position: relative;
            width: 80%;
            margin: auto;
            font-size:1.5vw;
            top: 5vw;
            padding-bottom: 5px;
            text-align: center;
            border-collapse: collapse;

        }
        thead{
            text-transform: uppercase;
            font-size:1.8vw;
            top: 5vw;
            padding-bottom: 5px;
            text-align: center;
            font-weight: 600;
        }
        tr :nth-child(1) {
            text-align: center;
        }
       
        th,td {
            border:0px;
            border-bottom: 1px solid white;
            width: 20vw;
            padding-top: 15px;
            padding-bottom: 5px;

        }
        .contact-container{
            position: absolute;
            width: 40vw;    
            right: 10vw;
            top: 9vw;
            border-radius: 0;
            margin-bottom: 5vw;
            justify-content: space-evenly;
            text-transform: uppercase;
            font-size:3vw;
            font-family: 'UnageoItalic';
        }
        .contact-left {
            display: flex;
            flex-direction: column;
            align-items: start;
            /*gap: 10px;*/
        }
        .contact-left-title{
            font-size:1.5vh;
            
        }
        .contact-inputs {
            -webkit-appearance: none;
            appearance: auto;
            border-radius: 0;
            height: 6vh;
            width: 40vw;
            background-color:var(--bg-color-);
            color:var(--text-white);
            font-family: 'Unageo';
            resize: vertical;
        }
       input { 
            background-color: var(--bg-color);
            border: none;
            border-top: 1px solid white;
            color: white;
            font-size:2.0vh;
            font-family: 'Unageo';
       }
        button {
            position: relative;
            margin-top: 5vw;
            margin-left: auto;
            margin-right: auto;
            width:20vw;
            height:3vw;
            background-color:var(--text-color);
            color:var(--bg-color);
            font-size:1.5vw;
            font-weight: bold;
            font-style: italic;
            border:none;
            border-radius:1.5vw;
            font-family: "UnageoItalic";      
        }
        .social, .social > img {
            display: inline-block;
            padding-left: 1vw;
            width: 3vw;
            height: 3vw;
            line-height: 1.5vw;
            display: inline-block;
            vertical-align: middle;
        }        
        input::placeholder{
            color:white;
            padding-bottom: 3vw;
            font-family: 'Unageo';
            vertical-align: text-top;
        }
        textarea{
            height: 9vh;
            width: 40vw;
            padding-top: 2vh;
            background-color:var(--bg-color);
            color:var(--text-white);
            border:none;
            border-top: 1px solid white;
            border-bottom: 1px solid white;
            font-size:2.0vh;
            font-family: 'Unageo';
            -webkit-appearance: none;
            appearance: auto;
            border-radius: 0;
        }
        textarea::placeholder{
            color:white;
            font-family: 'Unageo';
        }
        .tooltip {
            position: absolute;
            background-color: var(--div-color-2);
            color: white;
            max-width: 12vw;
            line-break: strict;
            padding: 5px 10px;
            font-size: 14px;
            pointer-events: none; /* Prevents tooltip from blocking hover */
            visibility: hidden; /* Hidden by default */
            z-index: 10;
        }
        .soc_pos{
            margin-top: 5vh;
            margin-bottom: 0;
            }
        .inic_polygon {
            fill: var(--text-color);
            opacity: .9;
        }
        }
@media (min-width: 1300px)
{    
    body {
    font-family: "Unageo", serif;
    color: var(--text-white);
    width: calc(100vw - 17px);
    text-align: center;
    background-color: var(--bg-color);
    margin: 0;
    overflow-x: hidden;
    overflow-y: scroll;
    height: 100vh;
}
main {
    position: relative;
    width: 100vw;
    scroll-snap-type: y mandatory;
    scroll-behavior: smooth;
    height: 100vh;
    overflow-y: scroll;
}
.sticky_top{
    position: sticky;
    top: 0;
    height: 4vw;
    width: 100vw;
    z-index: 6;
    background-color: inherit;
}

main > section {
    scroll-snap-align: start;
}
section{
    position: relative;  
}

header {
    height: 100%;
    padding: 20px;
    text-align: center;
}
h1 {
    margin: 0;
    font-size: 4vw;
    font-family: "UnageoBlackItalic";
    font-weight: bold; 
    font-style: italic;
    color: var(--text-white);
    text-transform: uppercase;
    white-space: pre;
    line-height: 4vw;
}
h2{
    margin: 0;
    font-size: 1.5vw;
    font-family: "Unageo", serif;
    font-style: italic;
    color: var(--text-white);
    text-transform: uppercase;
    white-space: pre;
}
h3{
    font-size: 1.8vw;
    padding-bottom: 3vw;
    margin: auto;
    font-family: "Unageo";
}h4{
    position: absolute;
    margin: 0;
    right: 7vw;
    bottom: 7vw;
    font-size: 4vw;
    font-family: "UnageoBlackItalic", serif;
    font-weight: 900; 
    font-style: italic;
    white-space: pre;
    text-transform: uppercase;
    text-align: right;
    color: var(--text-color);
    z-index:6;
}    
h5{
    position: relative;
    margin-top: 0;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    font-size: 3vw;
    font-family: "UnageoBlackItalic", sans-serif;
    font-style: italic;
    text-transform: uppercase;
    text-align: center;
    color: var(--text-color);
}   

p{
    font-size: 1.0vw;
    padding-left: 2vw;
}
nav{
    position: relative;         
    height: 2vw;
    width: 100%;
    right: 0;
    /*padding-top: 1.4vh;*/
    z-index: 7;
    line-height: 4vh;
    text-align: right;
    vertical-align: middle;
}
a{
    padding-left: 8vw;
}
.logo{
    position: absolute;
    left: 0;
    top: -0.3vw;
    height: 2.5vw;
}
.logo_gp{
    position: relative;
    vertical-align: middle;
    height: 1vw;
    padding-left: 0.2vw;
}
.logo_snob{
    position: absolute;
    left: 12vw;
    top: 9vw;
    height: 8vw;
}
.nav{
    position: fixed;
    opacity: 0;
    animation: 1s ease-in-out 5s 1 appearance;
    animation-fill-mode: forwards;
    height: 2vw;
    padding: 1vw;
    width: calc(100vw - 10vh);
    z-index: 7;
    font-size: 1.0vw;
    text-align: right;
    font-family: "UnageoBold", serif;
    font-weight: 900;
    color: var(--text-white);
    text-transform: uppercase;
}

.nav a {
    text-decoration: none;
    font-weight: 600;
}
.nav a:hover {
    color: var(--text-white);
    opacity: 0.5;
}

.svg {
    position: absolute;
    top: 0;
    left: 0;
}
.svg_height {
    display: none;
    
}
.svg:hover,
.svg.hover {
    position: absolute;
    top: 0;
    left: 0;
    opacity: .9;
    pointer-events: visible;
}

polygon {
    opacity: 1;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 12;
    /*display: none;*/
    fill: none;
    border-width: 5px;
    border-color:  var(--div-color-4);
}
polygon:hover {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    fill: var(--text-color);
}
.wrapper1 {
    width: 100vw;
    height: auto;
    padding-bottom: 6vw;
    background-color:var(--div-color-1) ;
}
.wrapper2 {
    width: 100vw;
    background-color:var(--div-color-2) ;
}
.wrapper3 {
    /* height: 100vh; */
    width: 100vw;
    background-color:var(--div-color-3) ;
}
.wrapper4 {
    width: 100vw;
    /* height: 100vh; */
    background-color:var(--bg-color);
}
.text-right {
    position: absolute;
    left: 65vw;
    top: 0vw;
    max-width: 30vw;
    top: 10vw;
    margin-bottom: 5vw;
    text-align:left;
    vertical-align:top;
}
.text-left {
    position: absolute;
    left: 10vw;
    top:0;
    /*display:inline-block;*/
    max-width:30vw;
    margin-left: 0;
    top: 10vw;
    margin-bottom: 5vw;
    text-align:left;
}
.text-left p{
    padding-left: 4vw;
}
.text-left_40 {
    position: absolute;
    left: 5vw;
    top:0;
    width: 35vw;
    /*display:inline-block;*/
    margin-bottom: 5vw;
    text-align:left;
}
.text-contact {
    position: absolute;
    left: 10vw;
    /*display:inline-block;*/
    max-width:30vw;
    margin-left: 0;
    top: 18vw;
    margin-bottom: 5vw;
    text-align:left;
}
.slideshow img{
    width: 100vw;
    top: 0vw;

}

table {
    position: relative;
    width: 60%;
    margin: auto;
    font-size:1.0vw;
    top: 5vw;
    padding-bottom: 5px;
    text-align: center;
    border-collapse: collapse;
}
thead{
    text-transform: uppercase;
    font-size:1.2vw;
    top: 5vw;
    padding-bottom: 5px;
    text-align: center;
    font-weight: 600;
}
/* tr :nth-child(1) {
    text-align: left;
} */

tr:hover:not(.tablebg){
    background: var(--div-color-5);
    z-index: 1;
       }

th,td {
    border:0px;
    border-bottom: 1px solid white;
    width: 20vw;
    padding-top: 15px;
    padding-bottom: 5px;

}
.contact-container{
    position: absolute;
    width: 40vw;    
    right: 10vw;
    top: 9vw;
    border-radius: 0;
    margin-bottom: 5vw;
    justify-content: space-evenly;
    text-transform: uppercase;
    font-size:3vw;
    font-family: 'UnageoItalic';
}
.contact-left {
    display: flex;
    flex-direction: column;
    align-items: start;
}
.contact-left-title{
    font-size:1.5vh;
    
}
.contact-inputs {
    -webkit-appearance: none;
    appearance: auto;
    border-radius: 0;
    height: 6vh;
    width: 40vw;
    background-color:var(--bg-color-);
    color:var(--text-white);
    font-family: 'Unageo';
    resize: vertical;
}
input { 
    background-color: var(--bg-color);
    border: none;
    border-top: 1px solid white;
    color: white;
    font-size:2.0vh;
    font-family: 'Unageo';
}
button {
    position: relative;
    margin-top: 3vw;
    margin-left: auto;
    margin-right: auto;
    width:20vw;
    height:3vw;
    background-color:var(--text-color);
    color:var(--bg-color);
    font-size:1.5vw;
    font-weight: bold;
    font-style: italic;
    border:none;
    border-radius:1.5vw;
    font-family: "UnageoItalic";      
}
.social, .social > img {
    display: inline-block;
    padding-left: 1vw;
    width: 2vw;
    height: 2vw;
    line-height: 1.5vw;
    display: inline-block;
    vertical-align: middle;
}
.footer {
    font-size: 0.8vw;
    padding-top: 3.2vh
}
.inic_polygon {
    fill: var(--text-color);
    opacity: .9;
}
}