@media only screen and (max-width:1024px){#menu{left:0px;top:0px;display:flex;flex-direction:column;background-color:white;width:calc(100vw);height:calc(100vh);justify-content:center;font-size:24px;opacity:0;pointer-events:none;-moz-transform:translate(-50px,0px);-webkit-transform:translate(-50px,0px);-o-transform:translate(-50px,0px);-ms-transform:translate(-50px,0px);transform:translate(-50px,0px);transition:all 0.5s ease;z-index:9999;}
#menu.slideIn{opacity:1;pointer-events:auto;-moz-transform:translate(0px,0px);-webkit-transform:translate(0px,0px);-o-transform:translate(0px,0px);-ms-transform:translate(0px,0px);transform:translate(0px,0px);}
#menu .langMenu,#menu .item{margin-bottom:10px;margin-top:10px;}
#menu .item.project{padding-bottom:6px;margin-top:30px;}
#mobileMenuOpener{position:fixed;left:20px;top:36px;width:30px;height:30px;background-image:url(../img/hamburger.png);background-repeat:no-repeat;background-size:contain;background-position:50% 50%;cursor:pointer;z-index:10000;}
.modal-body{position:relative;padding:15px 20px;}
.modal .menu{padding:16px 0px;position:sticky;top:70px;}
.modal-body article p{font-size:16px;}
.modal-body article .title{font-size:20px;padding-top:140px;}
#intro .header{top:20px;right:auto;text-align:center;width:100%;padding:0px 30px 0px 20px;}
#intro .logo,#modalPageWelcome .logo{width:250px;background-position:100% 0%;}
blockquote{font-size:16px;}
.modal .menu .item{width:20%;text-align:center;}
#intro,#county{top:40px;}
#county .head{padding-right:40px;margin-right:0px;width:calc(100vw);backdrop-filter:blur(2px);padding-top:40px;background-color:rgba(255,255,255,0.3);}
#county .head .info{font-size:16px;width:calc(100vw - 0px);padding-left:20px;padding-right:24px;}
#county .body{display:none;}
#county .footer .filter{display:none;}
#county .footer .add{width:100%;}
#county .head .title{display:flex;flex-direction:column;}
#county .head .title .recordTitle{font-size:20px;}
#county .close{z-index:1;margin-top:42px;margin-right:12px;}
#player .status{left:auto;right:0px;bottom:auto;height:calc(100vh - 300px);width:40px;padding-left:20px;top:170px;}
#player .status .rail{margin-left:-20px;}
#player .status .time{bottom:-30px;left:-34px;}
#player .status .cues{display:none;}
#player .transcript{left:0px;top:160px;width:calc(100vw - 50px);height:calc(100vh - 220px);}
.modal button.close{width:20px;height:20px;}
#recorder .modal-header{padding-right:20px;align-items:flex-start;justify-content:flex-end;}
#recorder .modal-title{font-size:20px;padding-left:50px;max-width:85%;}
#recorder button.close{margin-top:4px;}
.stage .label{font-size:16px;}
.stage .selector.town{flex-direction:column;}
.stage .selector.town .item{margin-bottom:10px;}
#recorder .modal-body{padding:15px 0px;}
.stage .selector{margin-bottom:30px;}
.stage.slideIn.recordText,.stage.slideIn.form{padding:10px 20px 20px 20px;}
.stage.record .action{flex-direction:column;}
.stage.record .action .finish{margin-right:0px;margin-bottom:20px;}
.stage.form{flex-direction:column;}
.stage.form .input{width:100%;}
#recorder .modal-dialog{margin-left:0px;margin-right:0px;}
#intro{top:0px;}
.modal-header{padding-top:25px;position:sticky;top:8px;background-color:white;z-index:1;}
#county .footer{bottom:auto;top:calc(100vh - 130px);}
#county{height:calc(100vh - 0px);top:0px;}
#recorder,#recorder .modal-content{background-color:white;}
#county .playerControl{margin-top:0px;}
#county .footer .add .button:before{background-size:95%;}
#badge,#badge2{display:none;}}
@media only screen and (max-width:1400px){}
@media only screen and (max-width:767px){}
@media only screen and (max-width:1023px){}
@media (min-width:1600px){}
@media (min-width:2000px){}
@supports (-webkit-touch-callout:none){.modal-backdrop{background-color:rgba(255,255,255,0.9);}
#county{top:0px;padding-top:20px;height:calc(100vh - 100px);}
#county .footer .add .button{background-color:rgba(255,255,255,0.7);}}