/* 
    Created on : May 21, 2015, 8:52:08 PM
    Author     : Mohammad Kawser
    Email      : mkawser953@gmail.com
*/

@media screen and (max-width: 768px){
    nav#mainMenu{display: none;}
    nav ul li{ display: block;}
    nav ul li a{
    display: block;
    width:  100%;
    background: #308A94;
    text-align:  left;
    padding-left:  10px;
    border-right: none;
}
nav ul li a:hover{
    background: #217983;
}

    #showMenu{display: block;}
    
    h2.normal{
        display: none;
    }
    h2#showSideMenu{
        cursor: pointer;
        display: block;
    }
    
    ul#main{
        display: none;
    }
    
    
    ul#main li:hover ul#sub{
        display: block;
        position: absolute;
        top: 30px;
        left: 5%;
        width:  95%;
    }

    ul#sub{
        position: absolute;
        list-style:  none;
        display:  none;
        z-index: 2;
        background: rgb(253, 253, 253);
    }
    ul#sub li{
        width:  100%;
        border-bottom: 31px solid lightgrey;
    }
    ul#sub li a{
       
        position:  relative;
    }
}