/* 190211 - removed :active styling as it doesn't work with Android Firefox */
body {background-color:#E9EAED; margin:0px; padding:0px; border:0px; width:100%}
input {font-family:Arial; font-size:1em}
#header {max-width:1280px; width:100%; background-color:rgb(185,188,198); margin:16px auto; margin-top:0px; display:block}
#logo {width:96px; height:37px; background-image:url('../images/3dthis96x37.png'); background-position: 0px 0px}
:hover#logo{background-position:96px 0px}
#header table {width:100%} 
#body {font-family:Arial; font-size:1em; max-width:1280px; width:100%; margin:8px auto}
#body a{color:black}
h1{font-size:2em; font-family:Arial; font-weight:bold; color:#666666; margin:0px auto; text-shadow: 0px 0px 8px white}
#body h2{font-size:1.5em; font-family:Arial; color:#666666; margin:4px auto;}
#body h2 a{color:#666666; margin:4px auto}
#body h3{font-size:1em; font-family:Arial; color:#555555; margin:4px auto}
#body h3 a{color:#666666; margin:0px auto}
.button {border-radius:8px;}
:hover.button {position:relative; top:-2px; left:2px; cursor:pointer}
#body table {text-align:left; background-color:#D9DCE6; width:100%;}
/* overview and most liked - mobile */
.b49x37 {float:left; width:49px; height:37px; margin:3px; border-width:1px; border-radius:8px; border-style:solid; border-color:#B9BCC6;
 background-image:url("../buttons/main/b49x37.png"); background-clip:content-box;
 box-shadow: 2px 2px 2px black;
 }
:hover.b49x37 {border-color:white}
/*:active.b49x37 {position:relative; left:2px; top:-2px}*/
/* overview and most liked - desktop */
.b128x29 {float:left; width:128px; height:29px; margin:3px; border-width:1px; border-radius:4px; border-style:solid; border-color:#B9BCC6;
 background-image:url("../buttons/main/b128x29.png"); background-clip:content-box;
 box-shadow: 2px 2px 4px black;
 }
:hover.b128x29 {border-color:white; cursor:pointer}
/*:active.b128x29 {position:relative; left:2px; top:-2px}*/

/*login etc - mobile */
.b37x37 {float:left; width:37px; height:37px; margin:3px; border-width:1px; border-radius:8px; border-style:solid; border-color:#B9BCC6; 
 background-image:url("../buttons/main/b37x37.png"); background-clip:content-box;
 box-shadow: 2px 2px 2px black;
 }
:hover.b37x37 {border-color:white; cursor:pointer}
/*:active.b37x37 {position:relative; left:2px; top:-2px}*/
.b32x32 {display:none; width:32px; height:32px; margin:0px 16px}
:hover.b32x32 {position:relative; left:2px; top:-2px; cursor:pointer}
/*:active.b32x32 {position:relative; left:2px; top:-2px; cursor:pointer}*/
.desktop {display:none}

@media only screen and (min-width: 850px) {
 .mobile {display:none}
 .desktop {display:block}
 .b32x32 {width:40px; height:40px}
}

.user {float:right; position:relative; top:16px; font-family:arial; color:white; max-width:64px; overflow:hidden}

#footer {background-color:#B9BCC6; width:100%; max-width:1280px; margin:20px 0px; padding:8px; height:auto; text-align:right; box-sizing:border-box}
#footer a {color:black;}

#dimmer {z-index:3; display:none; position:fixed;
 top:0; bottom:0; left:0; right:0;
 background-color:black;
 opacity:0.5;
}

.popup {
 z-index:4;
 display:none;
 box-sizing:border-box;
 border-radius:8px;
 position: absolute; left:300px; top:58px; width:340px; height:auto;
 background-color: #E9EAED;
 padding:16px; 
 color:#000000; font-family:"Arial"; font-size:1em; 
}
.popup h2{color:#666666; margin:0px;}
.ppcancel {text-align:right; position:relative; top:-32px}
.cancel {border:2px solid #E9EAED; position:relative; top:4px}
.cancel:hover {border:2px dotted red;}