/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Dec 22, 2017, 9:18:58 PM
    Author     : Khalfan
 #558C89-bk
#333333-footer
#ECECEA, #74AFAD-content main
#ECECEA-cont,#FDF3E7-bk
#7E8F7C
#F3FAB6-bk, #FDF3E7-cont
*/
/*Tittle of the company*/
*{
    padding: 0;
    margin: 0;
}
/* Body css*/
body{
    background-color:#F3FAB6;
    background-position: center;
    alignment-adjust: central;
}

#tittle{
    color:yellowgreen;
    font-size: 40px;
    margin-top: 20px;
    margin-left: -50px;
    margin-bottom: 25px;
    text-align: center;
    
}
#tim{
    color: blue; 
    border-radius: 6px;
    font-family: cursive; 
    font-size: 20px;
    margin-top:-25px;
    margin-left: 50px;
    margin-bottom: 5px;
    position: absolute;
    text-align: center;
}
/*Lilo-ID Icon*/
#lilo-id{
    color:#006400;
    font-family: monospace;
    font-size: 25px;
    margin-left: 20px;
    margin-top: 10px;
    font-style: italic;
   
}
/*Header css*/
#header{
    background-color:#bbb;
    border:4px solid #893667;
    padding: 20px;
    margin-left: 160px;
    width: 700px;
    margin-top: -50px;
    border-radius: 6px;
}
.head-button{
     background-color: #006400;
     border-radius: 6px;
     margin-bottom: -15px;
}
a{
    
    box-shadow: 0px 0px;
    border-right: none;
    text-align: center;
    text-decoration: none;
    list-style-type: none;
    margin: 5px;
    padding: 0px;
    font-size: 20px;
    width: 60px;
    color: yellowgreen;
}

a:last-child {
    border-right: none;
    
}
a:hover{
    color: white;
    background-color: #893667;
    border: 1px solid white;
}
.dropdown{
    position: relative;
    display: inline-block;
}
.dropdown-content{
    background-color: #006400;
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display:none;
    position: absolute; 
    min-width: 60px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}   
.dropdown:hover .dropdown-content {
    display: none;
    display: block;
    position: absolute;
}
.dropdown:hover .dropdown-content a{
 display: block;
 margin-left: -10px;
}

.dropdown-menu{
    display: none;
    margin-left: 60px;
    margin-top: -45px;
    background-color: #006400;
    padding: 12px 16px;
}
.hover-me:hover .dropdown-menu {
    position: absolute; 
    display: block;
    
}


         ul    {
                    display: inline;
                    list-style: none;
                     
               } 
        li    {
                
               border-radius: 15px;
               background: #ffe5e5;
               padding: 5px;
               margin: 12px;
               box-shadow: 0 5px yellow;
               text-align: center;
              }


/*Main content div css*/
#content-main{
            text-align: center;
            border: 4px solid #bbb;
            width: 675px;
            height: 400px;
            margin-left: 170px;
            margin-top: 0px;
            background-color:#F6F6F6 ;
}

#left-content{
            border: 4px solid #893667;
            width: 150px;
            margin-left: 30px;
            margin-top: -410px;
            height: 400px;
            background-color:#bbb;
            border-radius: 6px;
}
.left-buttons{
    
}
#right-content{
            border: 4px solid #893667;
            width: 160px;
            margin-left: 850px;
            margin-top: -410px;
            height: 400px;
            background-color:#bbb;
            border-radius: 6px;    
}
 .loginform{
              margin-top: 25px;
              margin-left: 0.5px;

              }
input[type=text],input[type=password]{
                 padding: 4px 4px;
                 margin: 4px 0px;
                 display: inline-block;
                 border: 3px solid blue;
                 border-radius: 4px;
                 box-sizing: border-box;
                 
               }
input[type=reset],input[type=submit] {
                 box-shadow: 0 5px yellow;
                 width: 10%;
                 background-color: blue;
                 color: white;
                 padding: 4px 6px;
                 margin: 8px 0;
                 border: none;
                 border-radius: 4px;
                 cursor: pointer;
                   }
input[type=reset]:hover,input[type=submit]:hover {
                         background-color: chartreuse;
                         }
th          {
            
             padding: 4px 4px;
             background-color: #bbb;
            }
tr          {
            text-align: center;
             padding: 0px 0px;
             background-color:#006400 ;   
            } 
td          {
             padding: 0px 0px;
             background-color:white;   
            }
#left-list{
            text-align: left; 
            margin-left: 30px
            }
#middle-list{
            text-align: left;
            margin-left: 300px;
            margin-top: -175px;    
            }
#last-list{
             margin-top: -30px;
             margin-left: 30px;
             text-align: left;
            }
         
.scrow{
    overflow:scroll;
    height: 370px;
    background-color: #F6F6F6;
    margin-left: 20px;
}

#footer{
            border: 4px solid #893667;
            padding: 10px;
            margin-left: 160px;
            alignment-adjust: central;
            width: 700px;
            background-color:#bbb;
}