@font-face{
  font-family: "Roboto-Regular";
  src: url("./Roboto-Regular.ttf") format("truetype");
}

@font-face{
  font-family: "Roboto-Bold";
  src: url("./Roboto-Bold.ttf") format("truetype");
}

body {
   font-family               : Roboto-Regular;
   font-size                 : 12pt;
   margin                    : 0px;
   padding                   : 0px;
}

#menu {
   width                     : 250px;
   height                    : 100%;
   position                  : absolute;
   left                      : 0px;
   top                       : 0px;
   background-color          : #262E44;
   z-index                   : 100;
}

.menuitem {
   width                     : 300;
   height                    : 30px;
   padding-left              : 40px;
   margin-top                : 15px;
}

.menuitem a {
   color                     : #FFFFFF;
   text-decoration           : none;
   font-size                 : 18pt;
}

.menuitem a:hover {
   color                     : #FF0000;
   text-decoration           : underline;
}

h1 {
   font-size                 : 16pt;
   font-family               : Roboto-Bold;
   color                     : #262E44;
}

h2 {
   font-size                 : 14pt;
   font-family               : Roboto-Bold;
   color                     : #262E44;
   font-style                : italic;
}

.h1link {
   font-size                 : 16pt;
   font-family               : Roboto-Bold;
   color                     : #262E44;
   text-decoration           : none;
}

.h1linkselected {
   font-size                 : 16pt;
   font-family               : Roboto-Bold;
   color                     : #262E44;
   text-decoration           : underline;
}

.infocard {
   width                     : 200px;
   height                    : 275px;
   border-radius             : 20px;
   -webkit-box-shadow        : 4px 4px 3px 1px #262E44; 
   box-shadow                : 4px 4px 3px 1px #262E44; 
   border                    : 1px #262E44 solid;
   margin                    : 20px; 
   float                     : left;
}

#main {
   padding-left              : 260px;
   position                  : absolute;
   left                      : 0px;
   top                       : 0px;
   z-index                   : 0;
}

.ForeCastDay {
   margin-bottom             : 10px;
   border                    : 1px #000000 solid;
   padding                   : 10px;
}

.DetailDaysButtonActive {
   background-color          : #262E44;
   color                     : #FFFFFF;
   height                    : 30px;
}

.DetailDaysButtonInActive {
   background-color          : #FFFFFF;
   color                     : #262E44;
   height                    : 30px;
}

.ForeCastTotal {
   margin-bottom             : 10px;
   border                    : 1px #000000 solid;
   padding                   : 10px;
}

.formselect {
   border                    : 1px #000000 solid;
   border-radius             : 3px;
   height                    : 30px;
   min-width                 : 50px;
   font-size                 : 12pt;
   background-color          : #DFFFFF;
}

.formcheckbox {
   border                    : 1px #000000 solid;
   height                    : 20px;
   width                     : 20px;
   background-color          : #DFFFFF;
}

.formlabel {
   font-size                 : 12pt;
}

.formsubmit {
   font-size                 : 12pt;
   background-color          : #262E44;
   color                     : #FFFFFF;
   min-width                 : 100px;
   height                    : 30px;
   border                    : 1px #262E44 solid;
}