@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');
*{
	margin: 0px;
	padding: 0px;
	font-family: 'Roboto', sans-serif;
}
body,html{
	overflow-x: hidden;
	background-color: #064c68;
	color: #fff;
}
a{
	color: #fff;
	transition: 0.3s all;
	font-weight: 600;
}
a:hover{
	color: #000;
	text-decoration: none;
}
.header .row{
	height: 100%;
}
.dropdown {
  position: relative;
  display: inline-block;
  padding: 10px 25px;
    border-radius: 20px;
    background: #064c68;
    transition: 0.3s all;
    border:none;
}
.dropbtn{
	background-color: transparent;
	border:none;
	color: #fff;
	transition: 0.3s all;
	font-weight: 600;
}
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f1f1f1;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 9;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}


.dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .dropdown-content li{
	border-radius: none !important;
}
.header{
	background-color: #064c68;
	padding: 18px 30px;
	box-shadow: 0px 0px 10px #064c68;
}
.logo-header-image {
    width: 220px;
}
ul{
	list-style: none;
}

.header-border{
    margin: 5px;
}
.menu-list{
	display: flex;
	justify-content: space-around;
	align-items: center;
	width: 100%;
	margin-bottom: 0px;
}
.menu-list li{
	padding: 10px 25px;
    border-radius: 20px;
    background: transparent;
    transition: 0.3s all;
}
.menu-list li:hover{
	background-color: #f2f2f2;
}
.menu-list li:hover a{
	color: #000;
}
.menu-list li:hover .dropbtn{
	color: #000;
}
.anchorbutton{
	background-color: #064c68 !important;
	color: #fff;
	padding: 10px 45px !important;
	border-radius: 20px !important;
	border:2px solid #fff;
	box-shadow: 0px 0px 5px #fff;
}
.anchorbutton a{
	color: #fff;
}
.header-content,.header-list{
	display: flex;
	align-items: center;
}
.header-content i{
	margin-right: 5px;
}
.checkbtn {
    font-size: 25px;
    float: right;
    cursor: pointer;
    display: none;
    padding: 0px;
}
#check{
	display: none;
}


@media only screen and (max-width: 576px){
	.logo-header-image{
		width: 160px;
	}
	.menu-list{
		flex-direction: column;
		width: 100%;
		position: fixed;
		left: -100%;
		background: #064c68;
		top: 90px;
		z-index: 999;
		transition: 0.3s all;
		padding: 30px 0px;
	}
	.header-content{
		display: none;
	}
	.checkbtn {
    display: block;
    position: absolute;
    top: -45px;
    margin: 0px;
    padding: 0px !important;
    z-index: 99;
    color: #fff;
    right: 20px
}
#check:checked ~ .menu-list{
	left: 0%;
}
}