@viewport { zoom: 1.0; width: device-width; }
p { text-align: justify; }
a:link {color:#333; text-decoration:none;}
a:visited {color:#333;}
a:hover {color:#000;}
a:active {color:#333;}
.right { position: absolute; right: 0px; }
#ad { padding: 5px; width: 100%; overflow: hidden; }
#login { white-space: nowrap; margin-top: 7px; color: #fff; }
#section { margin: 20px; font-size:100%; min-height: 80%; overflow: auto; position: relative; }
#menu-left, #todo { float:left; margin-right: 20px; display:inline-block; }
#popup { background-color:#CCDDFF; padding: 10px; border-radius: 10px; }
#nevnap_table { width: 100%; }
table.shortener { width: 100%; display: table; border: 0px; }
table { border-collapse: collapse; }
table.border { border: 1px solid black; }
table.border tr { border: 1px solid black; }
table.border th { border: 1px solid black; }
table.border td { border: 1px solid black; }
table, td { display: table-cell; vertical-align: top; }
table.noborder, tr, td { border: 0px; padding: 5px; }
table.noborder tr { border: 0px; padding: 5px; }
table.noborder th { border: 0px; padding: 5px; }
table.noborder td { border: 0px; padding: 5px; }
h1 { font-size: 25px; }
h2 { font-size: 22px; }
h3 { font-size: 20px; }
a { color: black; }
html, body {height: 100%;}
#wrap {min-height: 100%;}
#main { overflow:auto; padding-bottom: 180px; }
#m1, #m2, #m3, #m4, #m5, #m6 { padding: 10px; margin: 10px; border: 0px solid #000; border-radius: 10px; float: left; display: inline-block; }
#m1 { background-color: #00827F; }
#m2 { background-color: #F94D00; }
#m3 { background-color: #4166F5; }
#m4 { background-color: #3CD070; }
#m5 { background-color: #CB410B; }
#m6 { background-color: #CB819B; }
#container { overflow: hidden; }
#mainpanel { max-width: 500px; }
#calendar { float: left; overflow: hidden; right: 0px; }
#wordcard { border: 1px solid #000000; float: left; }
#translate { border: 1px solid #000000; float: left; }
#sidepanel { float: right; max-width: 300px; }
#toplist { margin: 10px; }
#newcard { margin: 10px; }
#translate { margin: 10px; }
.tooltip { position: relative; display: inline-block; border-bottom: 1px dotted black; }
.tooltip .tooltiptext { visibility: hidden; width: 500px; background-color: #555; color: #fff; text-align: center; padding: 5px 0; border-radius: 6px; font-size: 20px; bottom: 120px; left: 50%; 
    margin-left: -60px; position: absolute; z-index: 1; top: -5px; right: 105%; margin-left: -60px; opacity: 0; transition: opacity 1s; }
.tooltip:hover .tooltiptext { visibility: visible; opacity: 1; }
.row0 { background:white; }
.row1 {  background:lightgray; }
.w3-padding-8 { padding-top:8px!important; padding-bottom:8px!important; }
.container { position: relative; text-align: center; }
.centered { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }