styleB.css

/* body & header for parent and baby sitter (diffenet html implementation) */
@import url(//fonts.googleapis.com/css?family=Optima:300:400);

body { 

    background: whitesmoke;
    color:#404040; 
    }
    
    *{
    padding: 0; 
    margin: 0;
    font-family: Optima, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }
    
    header {
    position: fixed;
    top:0; left:0; right:0;
    background:Linear-gradient(60deg , rgb(196 , 183, 247) 0% , rgb(97 , 219 , 235) 100%); 
    /*box-shadow: 0px 5px Linear-gradient(60deg , rgb(196 , 183, 247) 0% , rgb(97 , 219 , 235) 100%);*/
    padding:20px 7%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index:1000;
    }
    
    header img {
    width:100px;
    height:50px;
    }
    
    /*list dots removed*/
    header .navbar ul {
    list-style:none;
padding: 0px 20px; 
  }

  header .navbar ul .inner{
    list-style:none;
    padding: 0 0 0 0;
    border-radius: 12px;

  }

    
    header .navbar ul li{ 
    position:relative;
    /* try to remove it*/
    float:left;
    padding: 0px 20px 0 0;  

    }
       
    
    header .navbar ul li a {
    font-size:20px;
    padding:5px;
    color:rgb(41,33,78);;
    display:block;
    } 
    
    header .navbar ul li a:hover {
background-color: whitesmoke; 
border-radius: 12px;
}
header .navbar ul li ul a:hover {
    background-color: whitesmoke; 
    border-radius: 0;
    }

    header .navbar ul li ul .first a:hover {
        background-color: whitesmoke; 
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;

        }

a {text-decoration: none; }
    
    header .navbar ul li .inner {
    
    position: absolute;
    left:0;
    width:200px;
    background:Linear-gradient(60deg , rgb(196 , 183, 247) 0% , rgb(97 , 219 , 235) 100%);;
    display:none;
    } 
    
    header .navbar ul li ul .first  {
        width:100%;
        border-top: 0;
        }

    header .navbar ul li ul li {
    width:100%;
    border-top: 0.5px solid whitesmoke;
    }
    
    header .navbar ul li:focus-within > ul ,
    header .navbar ul li:hover > ul {
    display:initial;
    }