body{background-color: black;}

@font-face{font-family: 'Sex'; src: url('./sexballs.woff2') format('woff2');}

#thissite{display: none;}

#nekoimg{position: fixed; left: 7vh; top: 10vh; height: 90vh; width: auto;}

#dev{position: fixed; left: 78vh; top: 6vh; font-family: "Sex"; font-size: 6vh; font-weight: 300; color: white;}

#h2o{position: fixed; left: 78vh; top: 25vh; font-family: "Sex"; font-size: 2.6vh; font-weight: 300; color: white; margin-right: 5vh;}

#you{position: fixed; left: 78vh; top: 35.5vh; font-family: "Sex"; font-size: 2.6vh; font-weight: 300; color: white;}

#arethey{color: blue; transition: color 0.3s;}

#arethey:hover{color: aqua;}

#thehr{display: none;}

#common{position: fixed; left: 78vh; top: 42.5vh; font-family: "Sex"; font-size: 4vh; font-weight: 300; color: white; margin-right: 5vh;}

#popup_button{position: fixed; left: 78vh; top: 60vh; width: 20vw; height: 10vh; border: 1px solid greenyellow; border-radius: 2vh; 
background-color: rgb(70, 70, 70); transition: all 0.3s; cursor: pointer;}

#popup_button:hover{background-color: rgb(100, 100, 100);}

#when{position: absolute; left: 7%; top: -3%; font-family: "Sex"; font-size: 2.6vh; font-weight: 300; color: greenyellow;}

#phonewhen{display: none;}

#popup_toggle:checked + #popup_button + #popup_overlay{display: block;}

#popup_toggle:checked + #popup_button + #popup_overlay + #popup{display: block;}

#popup_overlay{position: fixed; left: 0%; top: 0%; width: 100vw; height: 100vh; background-color: black; opacity: 0.6; display: none; z-index: 1;}

#popup{position: fixed; left: 62vh; top: 20vh; width: 40vw; height: 60vh; background-color: grey; display: none; border-radius: 2vh; z-index: 1;}

#idfk{position: absolute; left: 4%; top: 4%; font-family: "Sex"; font-size: 5vh; font-weight: 300;}

#close{position: absolute; left: 18%; top: 74%; width: 65%; height: 15%; border: 1px solid rgb(70, 70, 70); background-color: greenyellow; border-radius: 1vh;
transition: all 0.3s; cursor: pointer;}

#close:hover{background-color: rgb(151, 238, 20);}

#oksure{position: absolute; left: 3%; top: 10%; font-family: "Sex"; font-size: 2.65vh; font-weight: 300;}

#popup_button2{position: fixed; left: 125vh; top: 60vh; width: 20vw; height: 10vh; border: 1px solid cyan; border-radius: 2vh; 
background-color: rgb(70, 70, 70); transition: all 0.3s; cursor: pointer;}

#popup_button2:hover{background-color: rgb(100, 100, 100);}

#popup_overlay2{position: fixed; left: 0%; top: 0%; width: 100vw; height: 100vh; background-color: black; opacity: 0.6; display: none; z-index: 1;}

#popup2{position: fixed; left: 62vh; top: 20vh; width: 40vw; height: 60vh; background-color: grey; display: none; border-radius: 2vh; z-index: 1;}

#work{position: absolute; left: 7%; top: -3%; font-family: "Sex"; font-size: 2.6vh; font-weight: 300; color: cyan;}

#popup_toggle2:checked + #popup_button2 + #popup_overlay2{display: block;}

#popup_toggle2:checked + #popup_button2 + #popup_overlay2 + #popup2{display: block;}

#maybe{position: absolute; left: 28%; top: 4%; font-family: "Sex"; font-size: 9vh; font-weight: 300;}

#closemaybe{position: absolute; left: 13%; top: 64%; width: 75%; height: 15%; border: 1px solid black; background-color: cyan; border-radius: 1vh;
transition: all 0.3s; cursor: pointer;}

#closemaybe:hover{background-color: rgb(30, 155, 155);}

#okmaybe{position: absolute; left: 3%; top: 10%; font-family: "Sex"; font-size: 2.8vh; font-weight: 300;}

#popup_button3{position: fixed; left: 125vh; top: 76vh; width: 20vw; height: 10vh; border: 1px solid purple; border-radius: 2vh; 
background-color: rgb(70, 70, 70); transition: all 0.3s; cursor: pointer;}

#popup_button3:hover{background-color: rgb(100, 100, 100);}

#popup_overlay3{position: fixed; left: 0%; top: 0%; width: 100vw; height: 100vh; background-color: black; opacity: 0.6; display: none; z-index: 1;}

#will{position: absolute; left: 7%; top: 17%; font-family: "Sex"; font-size: 2.35vh; font-weight: 300; color: purple;}

#popup_toggle3:checked + #popup_button3 + #popup_overlay3{display: block;}

#popup_toggle3:checked + #popup_button3 + #popup_overlay3 + #popup3{display: block;}

#popup3{position: fixed; left: 62vh; top: 20vh; width: 40vw; height: 60vh; background-color: grey; display: none; border-radius: 2vh; z-index: 1;}

#obzerve{position: absolute; left: 4%; top: 3.5%; font-family: "Sex"; font-size: 4vh; font-weight: 300; margin-right: 3vh;}

#closewill{position: absolute; left: 13%; top: 74%; width: 75%; height: 15%; border: 1px solid black; background-color: purple; border-radius: 1vh;
transition: all 0.3s; cursor: pointer;}

#closewill:hover{background-color: rgb(160, 1, 160)}

#okwill{position: absolute; left: 3%; top: -3%; font-family: "Sex"; font-size: 3.7vh; font-weight: 300;}

#popup_button4{position: fixed; left: 78vh; top: 76vh; width: 20vw; height: 10vh; border: 1px solid blue; border-radius: 2vh; 
background-color: rgb(70, 70, 70); transition: all 0.3s; cursor: pointer;}

#popup_button4:hover{background-color: rgb(100, 100, 100);}

#why{position: absolute; left: 7%; top: 4%; font-family: "Sex"; font-size: 3.55vh; font-weight: 300; color: blue;}

#popup_toggle4:checked + #popup_button4 + #popup_overlay4{display: block;}

#popup_toggle4:checked + #popup_button4 + #popup_overlay4 + #popup4{display: block;}

#popup_overlay4{position: fixed; left: 0%; top: 0%; width: 100vw; height: 100vh; background-color: black; opacity: 0.6; display: none; z-index: 1;}

#popup4{position: fixed; left: 62vh; top: 20vh; width: 40vw; height: 60vh; background-color: grey; display: none; border-radius: 2vh; z-index: 1;}

#becauseya{position: absolute; left: 4%; top: 3.5%; font-family: "Sex"; font-size: 7vh; font-weight: 300; margin-right: 3vh;}

#closewell{position: absolute; left: 13%; top: 63%; width: 75%; height: 15%; border: 1px solid black; background-color: blue; border-radius: 1vh;
transition: all 0.3s; cursor: pointer;}

#closewell:hover{background-color: rgb(6, 6, 146)}

#okwell{position: absolute; left: 3%; top: -30%; font-family: "Sex"; font-size: 5.7vh; font-weight: 300;}

#rpoop{position: fixed; left: 79.5vh; top: 90vh; height: 8vh; width: auto;}

#visit{position: fixed; left: 90vh; top: 88vh; font-family: "Sex"; font-size: 3vh; font-weight: 300; color: white;}

#pooman{color: blue; transition: color 0.3s;}

#pooman:hover{color: aqua;}


/*All General Phones*/
@media (max-width: 600px){

body{background-color: black;}

@font-face{font-family: 'Sex'; src: url('./sexballs.woff2') format('woff2');}

#nekoimg{position: fixed; left: 0vh; top: 60vh; height: 32vh; width: auto;}
/*
#thissite{position: fixed; left: 5vh; top: 6vh; font-family: "Sex"; font-size: 3vh; font-weight: 300; color: white; margin-right: 3vh; display: block;}
*/
#dev{position: fixed; left: 2vh; top: 3vh; font-family: "Sex"; font-size: 2.8vh; font-weight: 300; color: white;}

#h2o{position: fixed; left: 2vh; top: 9vh; font-family: "Sex"; font-size: 2.6vh; font-weight: 300; color: white; margin-right: 1vh;}

#you{position: fixed; left: 2vh; top: 22.5vh; font-family: "Sex"; font-size: 2.6vh; font-weight: 300; color: white;}

#arethey{color: blue; transition: color 0.3s;}

#arethey:hover{color: blue;}

#thehr{display: block; position: fixed; left: 2vh; top: 32vh; height: 1px; width: 47vh; background-color: white;}

#common{position: fixed; left: 2vh; top: 33.5vh; font-family: "Sex"; font-size: 2.8vh; font-weight: 300; color: white; margin-right: 1vh;}

#popup_button{position: fixed; left: 2vh; top: 48vh; width: 42vw; height: 10vh; border: 1px solid greenyellow; border-radius: 2vh; 
background-color: rgb(70, 70, 70); transition: all 0.3s; cursor: pointer;}

#popup_button:hover{background-color: rgb(70, 70, 70);}

#when{position: absolute; left: 7%; top: -3%; font-family: "Sex"; font-size: 2vh; font-weight: 300; color: greenyellow; display: none;}

#phonewhen{position: absolute; left: 7%; top: 10%; font-family: "Sex"; font-size: 2vh; font-weight: 300; color: greenyellow; display: block;}

#popup_toggle:checked + #popup_button + #popup_overlay{display: block;}

#popup_toggle:checked + #popup_button + #popup_overlay + #popup{display: block;}

#popup_overlay{position: fixed; left: 0%; top: 0%; width: 100vw; height: 100vh; background-color: black; opacity: 0.6; display: none; z-index: 1;}

#popup{position: fixed; left: 9vh; top: 24vh; width: 67vw; height: 42vh; background-color: grey; display: none; border-radius: 2vh; z-index: 1;}

#idfk{position: absolute; left: 6%; top: 0%; font-family: "Sex"; font-size: 3vh; font-weight: 300; margin-right: 0.4vh;}

#close{position: absolute; left: 7%; top: 76%; width: 85%; height: 17%; border: 1px solid rgb(70, 70, 70); background-color: greenyellow; border-radius: 1vh;
transition: all 0.3s; cursor: pointer;}

#close:hover{background-color: rgb(151, 238, 20);}

#oksure{position: absolute; left: 3%; top: -15%; font-family: "Sex"; font-size: 2.4vh; font-weight: 300;}

#popup_button2{position: fixed; left: 27vh; top: 48vh; width: 42vw; height: 10vh; border: 1px solid cyan; border-radius: 2vh; 
background-color: rgb(70, 70, 70); transition: all 0.3s; cursor: pointer;}

#popup_button2:hover{background-color: rgb(100, 100, 100);}

#popup_overlay2{position: fixed; left: 0%; top: 0%; width: 100vw; height: 100vh; background-color: black; opacity: 0.6; display: none; z-index: 1;}

#popup2{position: fixed; left: 9vh; top: 24vh; width: 67vw; height: 42vh; background-color: grey; display: none; border-radius: 2vh; z-index: 1;}

#work{position: absolute; left: 7%; top: 10%; font-family: "Sex"; font-size: 2vh; font-weight: 300; color: cyan;}

#popup_toggle2:checked + #popup_button2 + #popup_overlay2{display: block;}

#popup_toggle2:checked + #popup_button2 + #popup_overlay2 + #popup2{display: block;}

#maybe{position: absolute; left: 8%; top: 6%; font-family: "Sex"; font-size: 7.5vh; font-weight: 300;}

#closemaybe{position: absolute; left: 7%; top: 70%; width: 85%; height: 22%; border: 1px solid black; background-color: cyan; border-radius: 1vh;
transition: all 0.3s; cursor: pointer;}

#closemaybe:hover{background-color: rgb(30, 155, 155);}

#okmaybe{position: absolute; left: 3%; top: -9%; font-family: "Sex"; font-size: 2.8vh; font-weight: 300;}

#popup_button3{position: fixed; left: 27vh; top: 73vh; width: 42vw; height: 10vh; border: 1px solid purple; border-radius: 2vh; 
background-color: rgb(70, 70, 70); transition: all 0.3s; cursor: pointer;}

#popup_button3:hover{background-color: rgb(100, 100, 100);}

#popup_overlay3{position: fixed; left: 0%; top: 0%; width: 100vw; height: 100vh; background-color: black; opacity: 0.6; display: none; z-index: 1;}

#will{position: absolute; left: 7%; top: 7%; font-family: "Sex"; font-size: 2.45vh; font-weight: 300; color: purple;}

#popup_toggle3:checked + #popup_button3 + #popup_overlay3{display: block;}

#popup_toggle3:checked + #popup_button3 + #popup_overlay3 + #popup3{display: block;}

#popup3{position: fixed; left: 9vh; top: 24vh; width: 67vw; height: 42vh; background-color: grey; display: none; border-radius: 2vh; z-index: 1;}

#obzerve{position: absolute; left: 4%; top: 1%; font-family: "Sex"; font-size: 2.45vh; font-weight: 300; margin-right: 1vh;}

#closewill{position: absolute; left: 7%; top: 71%; width: 85%; height: 22%; border: 1px solid black; background-color: purple; border-radius: 1vh;
transition: all 0.3s; cursor: pointer;}

#closewill:hover{background-color: rgb(160, 1, 160)}

#okwill{position: absolute; left: 14%; top: -16%; font-family: "Sex"; font-size: 3.3vh; font-weight: 300;}

#popup_button4{position: fixed; left: 27vh; top: 60.5vh; width: 42vw; height: 10vh; border: 1px solid blue; border-radius: 2vh; 
background-color: rgb(70, 70, 70); transition: all 0.3s; cursor: pointer;}

#popup_button4:hover{background-color: rgb(100, 100, 100);}

#why{position: absolute; left: 7%; top: 20%; font-family: "Sex"; font-size: 2.2vh; font-weight: 300; color: blue;}

#popup_toggle4:checked + #popup_button4 + #popup_overlay4{display: block;}

#popup_toggle4:checked + #popup_button4 + #popup_overlay4 + #popup4{display: block;}

#popup_overlay4{position: fixed; left: 0%; top: 0%; width: 100vw; height: 100vh; background-color: black; opacity: 0.6; display: none; z-index: 1;}

#popup4{position: fixed; left: 9vh; top: 24vh; width: 67vw; height: 42vh; background-color: grey; display: none; border-radius: 2vh; z-index: 1;}

#becauseya{position: absolute; left: 11%; top: -1%; font-family: "Sex"; font-size: 5vh; font-weight: 300; margin-right: 3vh;}

#closewell{position: absolute; left: 7%; top: 70%; width: 85%; height: 22%; border: 1px solid black; background-color: blue; border-radius: 1vh;
transition: all 0.3s; cursor: pointer;}

#closewell:hover{background-color: rgb(6, 6, 146)}

#okwell{position: absolute; left: 4%; top: 3%; font-family: "Sex"; font-size: 3.5vh; font-weight: 300;}

#rpoop{position: fixed; left: 44.3vh; top: 85.6vh; height: 5.5vh; width: auto;}

#visit{position: fixed; left: 23.5vh; top: 84vh; font-family: "Sex"; font-size: 1.4vh; font-weight: 300; color: white; margin-right: 6vh;}

#pooman{color: blue; transition: color 0.3s;}

#pooman:hover{color: aqua;}

}