*{-webkit-tap-highlight-color: transparent}
h1 .paragon,h2{text-transform:uppercase}
.hamburger,.main_nav,nav{position:fixed}
.dropdown,.main_nav{max-height:0;overflow:hidden}
.dropdown a,.main_nav>.nav_item{visibility:hidden}
.nav_item,.nav_item3.active .dropdown li,.paragon_logo{width:fit-content}
:root,footer button{background-color:var(--dk-gray)}
.games_hover,.hamburger{cursor:pointer;border:none}
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}
a,body,button{font-family:var(--fonts)}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
body{line-height:1}
.games_hover,.nav_item,.nav_link,h2,h3,h4,p{line-height:2}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}
table{border-collapse:collapse;border-spacing:0}
:root{--orange:rgb(235, 124, 40);--white:rgb(242,236,230);--lt-gray:rgb(202, 202, 202);--dk-gray:rgb(35, 35, 35);--black:rgb(12, 12, 14);--deep-black:rgb(9, 9, 10);--shadow:rgba(9,9,10,.8);--fonts:'roboto',sans-serif;font-size:7px;font-display:swap;}
:focus-visible{outline:3px solid var(--white)}
a,button{border-radius:0.15rem}
@media only screen and (min-width:275px){
    :root{font-size:12px}}
@media only screen and (min-width:375px){
    :root{font-size:14px}}
::selection{background-color:var(--white);color:var(--black);text-shadow:none}
a::selection,button::selection{color:var(--orange)}
.dropdown .nav_link,img{color:var(--lt-gray)}
a:hover,h2,p{color:var(--white)}
.dropdown .nav_link:hover,a,button,h1 .paragon,h3{color:var(--orange)}
p{font-size:1.3rem;font-weight:300;letter-spacing:1px}
.games_hover,.nav_link,h2{font-size:2rem}
a,button{text-decoration:none;letter-spacing:1.2px;border:none}
h2,h3,h4{letter-spacing:.125rem}
h2{font-weight:700}
.games_hover,.nav_link,h1 .paragon,h3{font-weight:500}
@media screen and (min-width:275px){
    h2{font-size:2.7rem}}
h3{font-size:1.7rem}
svg{pointer-events:none}
nav{width:100%;background-color:var(--black);top:0;box-shadow:0 .15rem .7rem 0.5rem rgba(5,5,6,.85);z-index:100;height:60px;padding:8px 0 0}
.paragon_logo{white-space:nowrap;display:block;height:fit-content;margin:0 auto}
h1{padding-left:10px;white-space:normal;vertical-align:top;display:none;margin-top:5px}
h1 .paragon{font-family:futura-pt,roboto,tahoma,sans-serif;font-style:normal;letter-spacing:.65px;height:fit-content;font-display:swap;}
h1 .h1_p{letter-spacing: -.75px;}
h1 .h1_a1{letter-spacing: 1px;}
h1 .h1_r{letter-spacing: 2px;}
.games_hover,.nav_link,footer button,h1 .escape{color:var(--white)}
h1 .escape{line-height:1;font-family:courier-std,courier,monospace;font-weight:400;font-style:normal;letter-spacing:4.45px;font-display:swap;margin-left: 1.25px;}
.paragon_logo img{width:auto;height:45px;margin-top:4px}
@media screen and (min-width:375){
    h1{line-height:.8;margin-top:8px}}
.nav_item{margin:1rem auto 0}
.nav_item6{margin-bottom:1.5rem}
.height_adj{height:24px}
.games_hover.active,.games_hover:focus-visible,.games_link:hover,.nav_link:focus-visible,.nav_link:hover{color:var(--orange)}
.nav_item svg{width:1.5rem;height:auto;margin-bottom:1px;fill:none;stroke:var(--white);stroke-width:7.5}
.games_hover{background-color:transparent;padding:0}
.main_nav,footer{text-align:center;background-color:var(--black)}
.svg_hover{transition:transform .2s ease-in-out}
.games_hover.active .svg_hover{transform:rotate(-180deg)}
.games_hover.active .svg_hover,.games_hover:focus-visible .svg_hover,.games_hover:hover .svg_hover{stroke:var(--orange)}
.main_nav{top:66px;display:flex;flex-direction:column;width:100%;padding-bottom:0;transition:max-height .3s ease-in-out,padding-bottom .2s ease-in-out;box-shadow:0 .5rem .7rem rgba(5,5,6,.95)}
.main_nav.active{max-height:750px;padding-bottom:5px}
.main_nav.active>.nav_item,.nav_item3.active .dropdown a{visibility:visible}
.hamburger{display:block;left:86%;top:23px;width:35px;background-color:transparent}
.hamburger:focus-visible{outline:white solid 3px;outline-offset:5px}
.ham_bar{display:block;-webkit-transition:transform .3s ease-in-out,opacity .3s ease-in-out,scale .3s ease-in-out,border-color .2s ease-in-out,background-color .2s ease-in-out;transition:transform .3s ease-in-out,opacity .3s ease-in-out,scale .3s ease-in-out,border-color .2s ease-in-out,background-color .2s ease-in-out;border:1px solid var(--white);border-radius:1rem;background-color:var(--white);margin-bottom:5px}
.hamburger.active .ham_bar{border-color:var(--orange);background-color:var(--orange)}
.hamburger.active .ham_bar:nth-child(2){transform:rotate(25deg);opacity:0;scale:0.25}
.hamburger.active .ham_bar:first-child{transform:translateY(7px) rotate(45deg)}
.hamburger.active .ham_bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.dropdown{transition:max-height .3s ease-in-out;padding:0 1rem}
.nav_item3.active .dropdown{max-height:46px;}
.dropdown a{font-size:1.4rem}
.dropdown li{width:0}
.dropdown .nav_item{margin:.5rem auto}
.dropdown .nav_item:last-child{margin-bottom:0}
@media only screen and (min-width:275px){
    nav{height:60px}
    .paragon_logo img{width:auto;height:45px;margin-top:4px}
    h1{display:inline-block}
    h1 .paragon{font-size:27px}
    h1 .escape{font-size:10.75px}
    .main_nav{top:64px}
    .games_hover,.nav_link{font-size:1.3rem}
    .nav_item svg{width:.95rem;margin-bottom:1px}
    .dropdown a{font-size:1.1rem}
    .nav_item3.active .dropdown{max-height:76px}}
@media only screen and (min-width:520px){
    :root{font-size:18px}
    nav{height:75px;padding:8px 0}
    .paragon_logo img{width:auto;height:66px}
    h1{line-height:1;margin-top:4px}
    h1 .paragon{font-size:43px}
    h1 .escape{font-size:18.2px;letter-spacing: 6.15px;}
    .games_hover,.nav_link{font-size:1.1rem}
    .games_hover svg{width:.75rem}
    .main_nav{top:80px}
    .hamburger{left:83%;top:28px;width:50px}
    .dropdown a{font-size:.9rem}
    .nav_item3.active .dropdown{max-height:90px}
    .ham_bar{margin-bottom:8px;border-width:2px}
    .hamburger.active .ham_bar:first-child{transform:translateY(12px) rotate(45deg)}
    .hamburger.active .ham_bar:nth-child(3){transform:translateY(-12px) rotate(-45deg)}}
@media only screen and (min-width:750px){
    :root{font-size:24px}
    h1{line-height:.83;margin-top:8px}
    .nav_link{font-size:.9rem}
    .nav_item svg{width:.75rem;margin-bottom:0}
    .games_hover{font-size:0.9rem}
    .nav_item3.active .dropdown{max-height:120px}}
@media only screen and (min-width:1200px){
    :root{font-size:28px}
    .full_nav{display:grid;grid-template-columns:30% auto;margin:0 10%;height:inherit}
    .paragon_logo{margin:0}
    h1{line-height:.85}
    .main_nav,.main_nav>.nav_item{position:relative;visibility:visible}
    .dropdown,.main_nav,.nav_item3.active .dropdown a{visibility:visible}
    .main_nav{display:block;overflow:visible;display:inline-flex;flex-direction:row;top:-20px;max-height:fit-content;background-color:transparent;margin:.8rem 0 .5rem auto;text-wrap:nowrap;box-shadow:none;justify-content:space-between;place-items:center}
    .main_nav>.nav_item{width:auto;text-align:right;margin-right:0;line-height:1}
    .main_nav .nav_item{margin-top:.4rem;margin-bottom:.4rem}
    .nav_item3 button{line-height:1;margin-bottom:.21rem}
    .dropdown a,.games_hover,.nav_link{font-size:.75rem}
    .nav_item svg{width:.5rem;padding-bottom: 2px;}
    .hamburger{display:none}
    .dropdown{padding-left:0;padding-right:0;overflow:hidden;position:absolute;background-color:var(--black);margin:15px 0 0 -25px;transition:max-height .3s ease-in-out,box-shadow .3s ease-out;border-radius:.35rem}
    .dropdown li{width:auto}
    .dropdown .nav_item{padding:0 1rem .5rem;text-align:left;margin-left:0;line-height:1}
    .nav_item3.active .dropdown{box-shadow:0 1rem .8rem -.5rem rgba(9,9,10,.75);max-height:200px;padding-top:15px;margin-top:0}
    .games_hover.active .svg_hover{transform:rotate(-180deg) translateY(2px)}}
@media only screen and (min-width:2200px){
    :root{font-size:38px}
    nav{height:125px}
    .paragon_logo img{width:auto;height:110px;margin-top:8px}
    h1{margin-top:8px}
    h1 .paragon{font-size:70px}
    h1 .escape{font-size:25px;letter-spacing:12.5px}
    .main_nav{top:-12px;margin-top:.7rem}
    .dropdown{margin-left:-37px}}
@media only screen and (max-height:775px) and (max-width:1199.5px) and (orientation:landscape){
    .main_nav{flex-direction:row;justify-content:space-evenly;position:absolute;height:fit-content}
    .main_nav.active{max-height:3.5rem}
    .main_nav>.nav_item,.nav_item3{height:min-content}
    .nav_item{margin-bottom:10px}
    .nav_item6{margin-bottom:0}
    .games_hover,.nav_link{font-size:.85rem}
    .games_hover .svg_hover{width:.65rem;margin-top:5px}
    .dropdown .nav_item:first-child{margin-top:.5rem}
    .dropdown a{font-size:.75rem}
    .nav_item3.active .dropdown{max-height:6rem}
    .nav_item3 .dropdown{width:100%;position:fixed;overflow:hidden;left:0;background-color:var(--black);box-shadow:0 .5rem .7rem rgba(9,9,10,.95)}.dropdown .nav_item:last-child{padding-bottom:10px}}
.socials {display: grid; grid-template-columns: auto auto auto auto; margin: 1rem auto; width: 80%;}
.socials a{display:inline; margin: 0 auto; cursor:pointer;}
.socials a:focus-visible{outline:none;}
.socials a:focus-visible img{filter:grayscale(100%) brightness(1.75)}
.socials a img{width:60%;height:auto; min-width: 35px; max-width: 90px; margin: 0 auto;}
.socials a:hover img{filter:grayscale(100%) brightness(1.75);}
footer{padding:2% 0 3%; bottom: 0;}
footer .note{margin:1.6rem auto 1rem;font-size: 0.65rem;}
footer button{font:inherit;padding:.3rem .5rem;border:2px solid var(--white);border-radius:.25rem;font-weight:500;letter-spacing:.1rem;font-size:.65rem;opacity:.85;display:block;margin:1rem auto 0}
footer button:hover{color:var(--white);border-color:var(--white);opacity:1;cursor:pointer}
footer button:active{color:var(--orange);background-color:var(--white);border-color:var(--white);opacity:1}
footer button:focus-visible{outline:3px solid var(--orange);color:var(--orange);background-color:var(--white);border-color:var(--white);opacity:1}
