@charset "utf-8";
/* CSS Document */

/* Media Queries: Tablet Landscape */


@font-face {font-family: "neuemachina-regular";src: url('neuemachina-regular.otf');}
@font-face {font-family: "UTOPIA_TRIAL-Regular";src: url('UTOPIA_TRIAL-Regular.ttf');}
@font-face {font-family: "Akzidenz-Grotesk-Extended-Medium ";src: url('Akzidenz-Grotesk-Extended-Medium.ttf');}
@font-face {
  font-family: myFirstFont;
  src: url(TRJNDaVinciItalic-Display.ttf);
  
}

/* Media Queries: Tabled Portrait */
img { max-width: 100%; height: auto; }

@media (min-width: 640px) { body {font-size:10pt;} } 
@media (min-width:960px) { body {font-size:1.2rem;} } 
@media (min-width:1100px) { body {font-size:10pt;} }
@media (min-width: 640px) { textb {font-size:0.8rem;} } 
@media (min-width:960px) { textb {font-size:1rem;} } 
@media (min-width:1100px) { textb {font-size:1.2rem;} }
@media (min-width: 375px) { .labox {width: 100%;} }
@media (min-width: 425px) { .labox {width: 50%;} }
@media (min-width: 768px) { .labox {width: 25%;} }
@media (min-width:1024px) { .labox {width: 25%;} }
@media (min-width:1440px) { .labox {width: 25%;} }
@media (min-width:2560px) { .labox {width: 25%;} }

@media (min-width: 375px) { video {width: 100% !important;} }
@media (min-width: 425px) { video {width: 100% !important;} }
@media (min-width: 768px) { video {width:  100%  !important;} }
@media (min-width:1024px) { video {width:  100%  !important;} }
@media (min-width:1440px) { video {width:  100%  !important;} }
@media (min-width:2560px) { video {width: 100% !important;}}


h2{ 
font-family: "Helvetica Neue";

background:white;/*#82FC00;*/
margin: 0px;
font-weight: 400;
    
}


menu2 {
    z-index:2;
    float: left;
    margin: 10px;
}

video {
 
  height: auto !important;

}

@media (min-width: 640px) { .labox2 {max-width: 100%;} }
@media (min-width: 960px) { .labox2 {max-width: 50%;} }
@media (min-width: 640px) { .labox3 {max-width: 100%;} }
@media (min-width: 960px) { .labox3 {max-width: 50%;} }


@media (min-width: 320px) { textl {font-size: 6pt;} }
@media (min-width: 320px) { textr {font-size: 6pt;} }


@media (min-width: 375px) { textl {font-size: 6pt;} }
@media (min-width: 375px) { textr {font-size: 6pt;} }

@media (min-width: 425px) { textl {font-size: 7pt;} }
@media (min-width: 425px) { textr {font-size: 7pt;} }

@media (min-width: 768px) { textl {font-size: 7pt;} }
@media (min-width: 768px) { textr {font-size: 7pt;} }

@media (min-width: 1024px) { textl {font-size: 8pt;} }
@media (min-width: 1024px) { textr {font-size: 8pt;} }

@media (min-width: 1440px) { textl {font-size: 8pt;} }
@media (min-width: 1440px) { textr {font-size: 8pt;} }

@media (min-width: 2560px) { textl {font-size: 8pt;} }
@media (min-width: 2560px) { textr {font-size: 8pt;} }

@media (min-width: 320px) { textl {font-size: 6pt;} }
@media (min-width: 320px) { textr {font-size: 6pt;} }

@media (min-width: 320px) { a {font-size:8pt;} }
@media (min-width: 375px) { a {font-size:8pt;} }
@media (min-width: 425px) { a {font-size:8pt;} }
@media (min-width: 768px) { a {font-size:8pt;} }
@media (min-width: 1024px) { a {font-size:9pt;} }
@media (min-width: 1440px) { a {font-size:12pt;} }
@media (min-width: 2560px) { a {font-size:17pt;} }


@media (min-width: 320px) { h2 {font-size:9pt;} }
@media (min-width: 375px) { h2{font-size:9pt;} }
@media (min-width: 425px) { h2 {font-size:9pt;} }
@media (min-width: 768px) { h2{font-size:9pt} }
@media (min-width: 1024px) { h2 {font-size:9pt;} }
@media (min-width: 1440px) { h2{font-size:1em;} }
@media (min-width: 2560px) { h2{font-size:1.3em;} }

@media (min-width: 320px) { .row {max-width:70%;} }
@media (min-width: 375px) { .row {max-width:70%;} }
@media (min-width: 425px) { .row {max-width:70%;} }
@media (min-width: 768px) { .row {max-width:60%;} }
@media (min-width: 1024px) { .row {max-width:40%;} }
@media (min-width: 1440px) { .row {max-width:30%;} }
@media (min-width: 2560px) { .row {max-width:30%;} }


html{
	scroll-behavior: smooth;
}
#navbar {
	z-index:999;
	float: left;
	width: 100%;
	position: fixed;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	background-color: white;
}

#navbar2 {
    z-index:999;
    position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: red;
  color: white;
  text-align: center;
    width: 100%;
position: fixed;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    
}

menu1 {
    z-index:2;
    float: left;
    margin: 10px;
}

menu3 {
    z-index:2;
    float: right;
    margin: 10px;
   
}

menu2 {
    z-index:2;
    float: right;
    margin: 10px;
   
}
a{
	text-decoration: none;
	color:black;
}
a:hover{
	color:white;
}
menu1 {
	z-index:2;
	float: left;
	margin: 10px;
}
#thebox {
	float: left;
	height: 2vh;
	width: 100%;
	background-color: white;
    margin-top: 50px;
  }

#thebox2{
    height: 1vh;
    float: left;
    width: 100%;
    background-color: white;
  }
  #thebox3{
    height: 1vh;
    float: left;
    width: 100%;
    background-color: black;
  }
body {
	margin: 0px; 
	background-color: white;
	cursor:crosshair;
	overflow-y: scroll;
	
}
.labox {
	float: left;
	background-color: white;
}
.labox2 {
	float: left;
	background-color: white;
}
.labox3 {
	float: left;
    margin:0px;
}
.labox4 {
    float: right;
    max-width: 50%;
}
.labox5 {
    float: left;
    margin-top:0px;
    margin-left:0px;
    max-width: 100%;
    background-color: white;
    width:500px;
    height:300px;

}
.labox6 {
    float: right;
    margin-top:0px;
    margin-left:0px;
    max-width: 100%;
    background-color: white;
    width:520px;
    height:400px;

    }
.inner{
	position: relative;
	margin:10px;
    margin-right: 
}

.inner2{
	position: relative;
	margin:10px;

}
.inner3{
	position: relative;
	
	margin-top: 100px;
    
}

.inner4{
    position: relative;
  
    margin-top: 400px;
   
}
.inner5{
    position: relative;
  
    margin-top: 80px;
   
}
.inner6{
    position: relative;
  float: right;
  margin-right:70px; 
    margin-top: 80px;
   
}



.row {
  justify-content: center;
margin: auto;
  padding:  4px;
 


}

/* Create four equal columns that sits next to each other */
.column {
 
  padding:  6px;
  margin-top: 25px;
  margin-bottom: 30px;
}

.column img {
  margin-top: 25px;
  vertical-align: middle;
  width: 100%;
}

/* Responsive layout - makes a two column-layout instead of four columns */




/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */


textl{
	float: left;
	font-size: 8pt;
	font-family:"Helvetica Neue", Helvetica, Arial, "sans-serif";
}
textz{
	float: left;
	font-size: 18pt;
	font-family:"neuemachina-regular";
}

texth{
    float: left;
    font-size: 50pt;
    font-family:"UTOPIA_TRIAL-Regular" , "neuemachina-regular";
}

textr{
	float: right;
	font-size: 8pt;
	font-family: "Helvetica Neue", Helvetica, Arial, "sans-serif";
}
#footer{
	float: left;
	background-color: white;
	width:100%;
}
textf{
	float: right;
	font-family:"Helvetica Neue", Helvetica, Arial, "sans-serif";
	margin: 10px;
}
textb{
	position: fixed;
	color: white;
	font-family:"Helvetica Neue", Helvetica, Arial, "sans-serif";
	margin: 10px;
	font-size: 8pt;
	top: 100px;
	left:800px;
	max-width: 25vw;
}

texti{
    float:right;
    color: black;
    font-family:"Helvetica Neue", Helvetica, Arial, "sans-serif";
    margin-right:15px;
    font-size: 8pt;
    top:0px;
    left:0px;
    max-width: 25vw;
}

textg{
    position:fixed;
    color: black;
    font-family:"Helvetica Neue", Helvetica, Arial, "sans-serif";
    margin: 10px;
    font-size: 8pt;
    top: 100px;
    left:800px;
    max-width: 25vw;
}

    textk{
    float:bottom;
    color: black;
    font-family:"Helvetica Neue", Helvetica, Arial, "sans-serif";
    margin: 5px;
    font-size: 8pt;
    max-width: 25vw;
}
::-webkit-scrollbar {
    display: none;
}
.static {
  position:absolute;
  background: white;
}

.static:hover {
  opacity:0;
}

mark {
  background-color: white;
  color: black;
}

@media only screen and (min-width: 550px) {
    .gallery {
        display: flex;
        width: 100%;
        flex-flow: row wrap;
        margin-left: -4px;
    }

    .gallery div {
        overflow: hidden;
        margin: 0 0 8px 8px;
        flex: auto;
        height: 250px;
        min-width: 150px;
    }

    .gallery div:nth-child(8n+1) {
        width: 310px;
    }

    .gallery div:nth-child(8n+2) {
        width: 270px;
    }

    .gallery div:nth-child(8n+3) {
        width: 260px;
    }

    .gallery div:nth-child(8n+4) {
        width: 310px;
    }

    .gallery div:nth-child(8n+5) {
        width: 240px;
    }

    .gallery div:nth-child(8n+6) {
        width: 190px;
    }

    .gallery div:nth-child(8n+7) {
        width: 210px;
    }

    .gallery div:nth-child(8n+8) {
        width: 170px;
    }

    .gallery div.wide {
        width: 650px;
    }

    .gallery div.tall {
        width: 650px;
        height: 450px;
    }

    .gallery div.narrow {
        width: 120px;
    }

    .gallery img {
        object-fit: cover;
        width: 100%;
        height: 100%;
    }
}