.header-p-container {
padding-left: 50px;
padding-right: 50px; }
@media (max-width: 767px) {
.header-p-container {
padding-left: 40px;
padding-right: 40px; } }
@media (max-width: 500px) {
.header-p-container {
padding-left: 10px;
padding-right: 10px; } }
div.navigation {
padding-top: 41px;
background-color: #3581ef;
padding-bottom: 21px;
color: white;
position: fixed;
z-index: 3001;
width: 100%; }
@media (max-width: 767px) {
div.navigation {
padding-top: 27px;
padding-bottom: 16px;
z-index: 2000;
width: 100%; } }
.background-transition-color {
color: #3581ef; }
.background-transition-nav-brand {
max-width: 70px;
-webkit-transition: 2s;
-o-transition: 2s;
transition: 2s; }
.background-transition-navbar {
background-color: white;
-webkit-transition: 2s;
-o-transition: 2s;
transition: 2s; }
button.navbar-toggler {
border: none;
margin-top: -8px; }
@media (max-width: 767px) {
button.navbar-toggler {
margin-top: -17px; } }
@media (max-width: 991px) {
button.navbar-toggler {
margin-top: -17px; } }
.bar-one, .bar-three {
-webkit-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease; }
span.icon-bar {
background-color: white;
width: 30px;
display: block;
height: 2px;
margin: 7px;
border-radius: 2px; }
button.navbar-toggler, button.navbar-toggler:focus, button.navbar-toggler:active {
border: none;
padding: 0px; }
.navbar-nav {
margin-top: -10px; }
@media (max-width: 767px) {
.navbar-nav {
padding-top: 40px;
padding-bottom: 140px; } }
.navbar-brand {
max-width: 112px;
float: left;
padding-top: 0px; }
@media (max-width: 767px) {
.navbar-brand {
max-width: 70px; } }
.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link:hover {
color: white; }
@media (max-width: 991px) {
.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link:hover {
padding-top: 60px;
padding-bottom: 20px; } }
@media (max-width: 767px) {
.navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link:hover {
padding-top: 20px;
padding-bottom: 40px; } }
.navbar {
background-color: #3581ef;
padding: 0px 8px 0px 8px; }
@media (max-width: 991px) {
.mobile-button {
width: 75%;
text-align: right;
margin-top: -15px;
margin-left: -30px; } }
@media (max-width: 767px) {
.mobile-button {
text-align: center;
margin-top: -17px;
margin-left: -30px;
width: 25%; } }
@media (max-width: 600px) {
.mobile-button {
margin-left: -20%; } }
.navbar-collapse { -webkit-transition: .1s;
-o-transition: .1s;
transition: .1s; }
.navbar .nav-link {
color: white;
font-weight: 600 !important; }
.navbar .nav-link {
text-transform: capitalize;
font-size: 16px; }
@media (max-width: 991px) {
.navbar .nav-link {
font-size: 16px; } }
.navbar a.btn, .navbar a.btn:hover {
background-color: #3581ef;
color: white;
border: solid white 2px;
border-radius: 0px;
text-transform: uppercase;
font-size: 14px;
font-weight: 600;
margin-left: 15px;
letter-spacing: 0.5px;
text-decoration: none; }
@media (max-width: 767px) {
.navbar a.btn, .navbar a.btn:hover {
margin-left: 0px; } }
.navbar a.btn .background-transition, .navbar a.btn:hover .background-transition {
background-color: white;
-webkit-transition: 2s;
-o-transition: 2s;
transition: 2s;
color: #3581ef;
padding-top: 21px;
padding-bottom: 21px; }
.last {
padding-bottom: 100vh; }
@media (min-width: 991px) {
.last {
padding-bottom: 0px; } }
.bar-one-transition {
background-color: white;
width: 20px;
display: block;
height: 3px;
border-radius: 2px;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: 10% 90%;
-ms-transform-origin: 10% 90%;
transform-origin: 10% 90%;
-webkit-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease; }
.bar-two-transition {
opacity: 0;
-webkit-transition: all .1s ease;
-o-transition: all .1s ease;
transition: all .1s ease; }
.bar-three-transition {
background-color: white;
width: 20px;
display: block;
height: 3px;
border-radius: 2px;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: 10% 10%;
-ms-transform-origin: 10% 10%;
transform-origin: 10% 10%;
-webkit-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease; }