body {
  margin:10px;
  height:100%;
  font-family:"Trebuchet MS", Arial, Verdana;
  font-size:16px;
  color:#176B87;
  background-color:#DAFFFB;
  text-align:left;
}
/* UTILITIES */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

body {
font-family: "Trebuchet MS", Arial, Verdana;
}

a {
text-decoration: none;
}

li {
list-style-type: circle;
margin-left: 10px;
}

/* NAVBAR STYLING STARTS */
.navbar {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px;
color: #fff;
}

.nav-links a {
color: #fff;
}

/* LOGO */
.logo {
font-size: 32px;
}

/* NAVBAR MENU */
.menu {
display: flex;
gap: 1em;
font-size: 18px;
background-color: #001c30;
}

.menu li:hover {
background-color: #64CCC5;
border-radius: 5px;
transition: 0.3s ease;
}

.menu li {
padding: 5px 14px;
}

/* DROPDOWN MENU */
.services {
position: relative;
color: #fff;
}

.dropdown {
background-color: #64CCC5;
padding: 1em 0;
position: absolute; /*WITH RESPECT TO PARENT*/
display: none;
border-radius: 8px;
top: 35px;
}

.dropdown li + li {
margin-top: 10px;
}

.dropdown li {
padding: 0.5em 1em;
width: 8em;
text-align: center;
background-color:#001c30;
}

.dropdown li:hover {
background-color: #64CCC5;
}

.services:hover .dropdown {
display: block;
}
/* RESPONSIVE NAVBAR MENU STARTS */

/* CHECKBOX HACK */

input[type=checkbox] {
display: none;
}

/* HAMBURGER MENU */
.hamburger {
display: none;
font-size: 24px;
user-select: none;
}

/* APPLYING MEDIA QUERIES */
@media (max-width: 768px) {
.menu {
display:none;
position: absolute;
background-color:teal;
right: 0;
left: 0;
text-align: center;
padding: 16px 0;
}

.menu li:hover {
display: inline-block;
background-color:#64CCC5;
transition: 0.3s ease;
}

.menu li + li {
margin-top: 12px;
}

input[type=checkbox]:checked ~ .menu {
display: block;
}

.hamburger {
display: block;
}

.dropdown {
left: 50%;
top: 30px;
transform: translateX(35%);
}

.dropdown li:hover {
background-color: #64CCC5;
}
}