@font-face {
    font-family: 'bitter';
    src: url('fonts/bitter-variablefont_wght-webfont.woff2') format('woff2'),
         url('fonts/bitter-variablefont_wght-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'metrophobic';
    src: url('fonts/metrophobic-regular-webfont.woff2') format('woff2'),
         url('fonts/metrophobic-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}





html {cursor: url(cursor.cur), auto;}

body{
background-color: rgb(255,255,255); background-image: url(img/background.jpg); background-repeat: repeat; background-attachment: fixed; background-position: top left;
color: rgb(000,000,000); 
font-family: 'bitter', Georgia;
font-size: 12px;
margin-top: 0px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
}

body.sidebar {background-color: rgb(255,255,255); background-image: none; color: rgb(150,150,150); margin-left: 5px; font-family: 'metrophobic', Arial; font-size: 10px;}

::-webkit-scrollbar {width: 10px;}
::-webkit-scrollbar-track {background: rgb(000,000,000);}
::-webkit-scrollbar-thumb {background: rgb(000,000,000); border: 1px solid rgb(255,255,255)}
::-webkit-scrollbar-thumb:hover {background: rgb(255,255,255);}

div.page {display: grid; align: left; width: 1100px; height:100vh; grid-template-areas: "left main right"; flex: 1; margin-right: auto; margin-left: 0; background-color: rgb(255,255,255); border-right: 1px solid rgb(200,200,200);}
aside.sidebar {width: 120px; height: auto; display: block; font-size: 11px;  padding: 0px; grid-area: left; background-color: rgb(255,255,255); border-right: 1px solid rgb(190,190,190);}
iframe.sidebar {width: 120px; height:100%; border: none; overflow: hidden; margin: 0; padding: 0; display: block; box-sizing: border-box; }
main.main {width: 965px; grid-area: main; font-size: 13px; padding: 0px; margin-top: 10px; margin-left: 15px; margin-right: 5px;}

font.header {font-weight: bold; font-size: 14px; color: rgb(110,110,110);}

a.sidebar:link {color: rgb(150,150,150); text-decoration: none; font-family: 'metrophobic'; cursor: url(cursor.cur), auto;}
a.sidebar:visited {color: rgb(150,150,150); text-decoration: none; font-family: 'metrophobic'; cursor: url(cursor.cur), auto;}
a.sidebar:hover {color: rgb(170,170,170); text-decoration: none; font-family: 'metrophobic'; cursor: url(cursor.cur), auto;}
a.sidebar:active {color: rgb(170,170,170); text-decoration: none; font-family: 'metrophobic'; cursor: url(cursor.cur), auto;}

a:link {color: rgb(130,130,130); text-decoration: none; cursor: url(cursor.cur), auto;}
a:visited {color: rgb(130,130,130); text-decoration: none; cursor: url(cursor.cur), auto;}
a:hover {color: rgb(110,110,110); text-decoration: underline; cursor: url(cursor.cur), auto;}
a:active {color: rgb(110,110,110); text-decoration: underline; cursor: url(cursor.cur), auto;}

hr {border-top: 1px solid rgb(000,000,000); width: 100%; border-bottom: 0px; border-right: 0px; border-left: 0px; margin-top: 0px; margin-left: 0px; margin-bottom: 1px;}

img.list {margin-left: 9px; margin-right: 3px; vertical-align: +2px; height: 4px; width: 4px;}

main.password {width: 965px; text-align: left;}
form {margin-top: 0px;}
input.password::placeholder {width: 965px; background-color: rgb(000,000,000); color: rgb(255,255,255); font-family: 'bitter'; font-size: 11px;  margin-bottom: 3px;}
input.password {width: 965px; background-color: rgb(000,000,000); color: rgb(255,255,255); font-family: 'bitter'; font-size: 11px; border: 1px solid rgb(170,170,170); margin-bottom: 3px;}