@media screen and (max-width:800px){ /* phone */
.pageBorder{
width:100%;
border-left:none;
border-right:none;
}
.pageWrap{
width:100%;
}
#menuWrap{
display:block;
}
#pageHead.sticky #logo_title{
/*position:fixed;
left:50%;transform:translateX(-50%);
font-size:3vmax;top:5px;*/
}
#pageMenu{
position:fixed;
top:0;left:0;
display:block;
bottom:auto;
right:auto;
height:100%;
padding-right:2px;
}
#pageMenu>ul{
width:200px;
height:100%;
display:block;
margin:0px;
padding:0;
background:linear-gradient(45deg, var(--primary),var(--comp1));
box-shadow:-8px 0px 12px 0 #000;
}
#pageMenu>ul>li:first-child::before{
position:relative;
display:block;
width:calc(100% + 20px);
color:#EEE;
height:100px;
border:5px;
margin-left:-10px;
content:' ';
background-image:url("imgs/og-thumb.jpg");
background-position:center;
background-repeat:no-repeat;
background-size:contain;
background-color:#FFF;
}
#pageMenu>ul>li{
display:block;
padding:0 10px;
text-align:left;
font-size:85%;
}
#pageMenu a,#pageMenu span{
display:block;
width:auto;
color:#FFF;
padding:10px 5px;
border-bottom:3px solid #FFF;
}
#pageMenu a:active,#pageMenu a:hover{
color:#FFF;
border-bottom:3px solid #FFF;
}
.subMenu>ul{
position:relative;
display:flex;
flex-direction:column;
background:none;
box-shadow:none;
}
.c25p{width:100%;}.c33p{width:100%;}.c50p{width:100%;}.c75p{width:100%;}
#pageBody{
display:block;
letter-spacing:normal;
}
#pageBody h1{
margin-bottom:10px;
font-size:4vh;
padding:5px;
}
#pageFoot .pageWrap{
flex-direction:column;
}
#footMenu{
justify-content:center;
}
.social-icons span{
text-align:center;
}
.social-icons ul{
justify-content:center;
}
.cols,.cols li,.toBlock,.toBreak,.toBreak li,[rel*="toBlock"]{
flex-direction:column;
}
.responsive{
flex-direction:column;
}
table.tblresponsive tr.title{
display:none;
}
table.tblresponsive td{
display:block;
}
table.tblresponsive tr{
border-bottom:1px solid #AAA;
}
table.tblresponsive tr td span.title{
display:inline-block;
font-size:80%;
color:#666;
min-width:60px;
}
.perpendicular{
left:-90px !important;
}
.monitoron,.mobileoff{
display:none;
}
.mobileon{
display:inline-block;
}
fieldset>ul>li{
flex-direction:column;
align-items:flex-start;
padding:5px 5px;
margin:0;
}
fieldset>ul>li>span,
fieldset>ul>li>label>span{
flex:1 1 100%;
padding:0;
font-size:80%;
min-width:0;
width:100%;
}
fieldset>ul>li>div,
fieldset>ul>li>label>div{
flex:1 1 100%;
width:100%;
padding:0;
}


/*app menu*/
#app_menu,#back_menu{
font-size:200%;
position:fixed;
left:0;top:0;
z-index:1750;
display:table-cell;
width:30px;
color:#493E25;
vertical-align:top;
padding:18px 25px;
}
div#pageMenu.checked{
display:block;
left:0;
/*animation: slide-in 0.5s ease;animation-fill-mode: forwards;
-webkit-animation: slide-in 0.5s ease;-webkit-animation-fill-mode: forwards;
-moz-animation: slide-in 0.5s ease;-moz-animation-fill-mode: forwards;*/
}
#pageMenu{
position:fixed;
transition:left 0.5s ease;-webkit-transition:left 0.5s ease;
left:-100vw;
height:100%;
z-index:1500;
width:100vw;
background:rgb(0,0,0,0);
box-shadow:none;
/*animation: slide-out 0.5s ease;animation-fill-mode: forwards;
-webkit-animation: slide-out 0.5s ease;-webkit-animation-fill-mode: forwards;
-moz-animation: slide-out 0.5s ease;-moz-animation-fill-mode: forwards;*/
}

/*site specific*/
#headTop{
background-size:cover;
animation:sunrise 5s linear forwards;
}
@keyframes sunrise{
	0% {top:90%;filter:brightness(10%) hue-rotate(0deg);}
	100% {top:-140%;width:140vw;height:140vw;filter:brightness(150%) hue-rotate(-25deg);}
}
#pageMenu #dashboard-member>a{
display:none;
}
}
@media screen and (max-device-width:800px) and (orientation:portrait) { /* phone - portait only */
#pageHead{
height:10vmax;
}
#pageHead #logo {
height:10vmax;
}
#pageHead #logo a {
height:10vmax;
}
}