.header {
padding: 0;
height: 80px;
background-color: #006cb4;
}
.spectacledcoder-navbar {
align-items: center;
position: fixed;
width: 100%; padding: 22px 45px;
display: flex; z-index: 100;
backdrop-filter: blur(20px);
background-color: #006cb4; margin: auto;
left: 0;
right: 0;
top: 0;
}
.spectacledcoder-navbar .brand {
margin: auto;
width: fit-content;
margin-left: 20px;
margin-top: 5px;
display: flex;
margin-right: 30px;
width: 17.6%;
}
.spectacledcoder-navbar .brand img {
max-width: 100px;
}
.spectacledcoder-navbar ul {
width: 82%;
height: 100%;
margin-top: 5px;
margin-right: 35px;
margin-left: 0px;
display: flex; margin-bottom: 0;
justify-content: space-between;
}
.desktop_service {
position: relative;
}
.desktop_service a i {  display: inline-block;
font: normal normal normal 14px / 1 FontAwesome;
font-size: 9px !important;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
color: #ffffff;
vertical-align: top;
margin: 5px 0 0 12px;
}
.desktop_service:hover .nav_hover {
display: block !important;
}
.nav_hover {
display: none;
position: absolute;
box-shadow: 4px 17px 11px rgba(0, 0, 0, 0.15);
transition: all 0.5s;
transform-origin: top center;
transform: scale(1, 0);
display: block;
overflow: hidden;
border-radius: 12px;
}
.desktop_service:hover .nav_hover {
transform: scale(1);
}
.spectacledcoder-navbar .nav_dropdown {
background-color: #ffffff;
padding: 20px;
border-radius: 12px;
margin-top: 10px;
width: 250px;
display: block;
margin-right: 0;
}
.spectacledcoder-navbar .nav_dropdown::after {
position: absolute;
margin-left: -20px;
display: inline-block;
border-right: 10px solid transparent;
border-bottom: 10px solid #fff;
border-left: 10px solid transparent;
content: '';
z-index: 30;
top: 0;
left: 45px;
}
.spectacledcoder-navbar .nav_dropdown li {
list-style-type: none;
margin-bottom: 0px;
line-height: 22px;
text-transform: uppercase;
padding: 5px 10px !important;
}
.spectacledcoder-navbar .nav_dropdown li a {
color: #333;
}
.spectacledcoder-navbar ul li { list-style: none;
font-weight: 400;
margin-right: 0;
}
.rect {
margin: auto;
margin-left: 0px;
width: 0%;
height: 2px;
background-color: rgb(255, 255, 255);
}
.spectacledcoder-navbar ul li:hover .rect {
width: 100%;
transition: all 0.5s;
}
.spectacledcoder-navbar ul li a {
font-family: "GoogleSans-Regular", sans-serif !important;
font-size: smaller;
text-decoration: none;
color: rgb(255, 255, 255);
font-size: 16px;
font-weight: 400;
}
.spectacledcoder-navbar ul li a i {
font-size: 10px;
margin-left: 8px;
}
.spectacledcoder-navbar .navbar-toggler {
margin: auto;
width: 32px;
height: 35px;
display: none;
flex-direction: column;
cursor: pointer;
transition: all 0.5s;
margin-left: 0; }
.spectacledcoder-navbar .navbar-toggler .line1 {
margin: 2px auto;
width: 100%;
height: 4px;
background-color: rgb(255, 255, 255);
}
.overlay-dropdown {
display: none;
}
.overlay-dropdown ul li {
display: none;
}
#intro-div,
#about-div,
#services-div,
#careers-div,
#contact-div {
margin: auto;
width: 100%;
height: 100vh;
display: flex;
}
#intro-div h2,
#about-div h2,
#services-div h2,
#careers-div h2,
#contact-div h2 {
margin: auto;
font-size: 7vw;
color: rgb(255, 255, 255);
}
.fa-angle-down:before {
content: "\f078" !important;
}
@media only screen and (max-width: 991px) {
.spectacledcoder-navbar ul {
display: none;
}
.spectacledcoder-navbar .navbar-toggler {
display: flex;
align-items: center;
padding-top: 9px; margin-right: 10px;
}
.overlay-dropdown {
position: absolute;
width: 100%;
height: 100%;
margin: auto;
display: none;
flex-direction: column;
background-color: rgb(255, 255, 255);
}
.overlay-dropdown .brand {
margin: auto;
height: 60px;
margin-left: 20px;
margin-top: 12px;
}
.overlay-dropdown .brand h1 {
font-family: "Comforter", cursive;
margin: auto;
}
.overlay-dropdown ul {
width: 50%;
height: 100%;
margin: auto;
display: flex;
flex-direction: column;
margin-left: -16px;
background-color: #006cb4;
}
.overlay-dropdown ul li {
display: flex;
list-style-type: none;
margin-left: 6px;
padding-top: 6px;
}
.overlay-dropdown ul li a {
text-decoration: none;
color: black;
font-size: 16px;
}
.responsive_dropdown li {
text-transform: uppercase;
}
.responsive_navbar {
padding-top: 15px;
}
.spectacledcoder-navbar .brand { margin: 0 auto;
}
body.dropD .nav_hover {
width: 166%;
}
}
@media (max-width:767px) {
.spectacledcoder-navbar .brand {
margin-right: 41%;
} body.dropD .nav_hover {
width: 172%;
}
} @media (max-width:690px) {
.overlay-dropdown ul li a {
text-decoration: none;
color: black;
font-size: 12px;
}
}
@media (max-width: 575px) {
.spectacledcoder-navbar .navbar-toggler {
margin-right: unset;
}
.spectacledcoder-navbar .brand {
margin-right: 43%;
}
}   .disclaimer {
margin: auto;
margin-bottom: 20px;
width: fit-content;
color: rgb(255, 255, 255);
text-align: center;
font-family: 'Belanosima', sans-serif;
}
.disclaimer a {
text-decoration: none;
color: #ffffff;
font-family: "Kaushan Script", cursive;
font-weight: 900;
}
.disclaimer a:hover {
text-decoration: overline;
}
.responsive_hover {
background-color: #f9f9f9;
padding: 10px;
border: 1px solid #ddd;
border-radius: 5px;
margin-top: 32px;
position: relative;
left: -74px;
}
.responsive_dropdown {
list-style-type: none;
padding: 0;
margin: 0;
}
.responsive_dropdown li {
padding: 5px 0;
cursor: pointer;
background-color: #f9f9f9;
}
.responsive_dropdown li:hover {
background-color: #f1f1f1;
} .navbar-toggler {
background: transparent;
border: 0;
}
@media (max-width:1200px) {
.spectacledcoder-navbar ul li a {
font-size: 13px;
}
}
@media (max-width: 991px) {
.brands {
min-height: auto !important;
}
.desktop_service:hover .nav_hover {
position: initial !important;
box-shadow: none;
}
.nav_hover li {
padding: 0;
background: #fff;
}
.spectacledcoder-navbar .nav_dropdown {
padding: 0 !important;
}
.spectacledcoder-navbar .nav_dropdown li {
background: #fff !important;
padding-left: 10px !important;
padding: 7px 45px;
}
.spectacledcoder-navbar .nav_dropdown li a {
font-size: 16px !important;
}
.spectacledcoder-navbar .nav_dropdown {
height: auto !important;
}
.spectacledcoder-navbar .nav_dropdown {
box-shadow: none;
padding: 15px 0 !important;
}
.spectacledcoder-navbar ul {
position: fixed;
top: 76px;
left: -100%;
bottom: 0;
max-width: 58%;
padding: 0;
height: 100vh;
background: #006cb4;
margin: 0;
display: block;
transition: 0.3s;
}
body.mobileMenu .spectacledcoder-navbar ul {
display: block;
left: 0;
top: 0;
border-radius: 10px;
overflow: hidden;
margin-bottom: -14px !important;
}
body.mobileMenu .spectacledcoder-navbar ul li {
margin: auto;
list-style: none;
font-weight: 400;
margin-right: 0;
padding: 14px 0;
background: #006cb4; border-bottom: 1px solid #e9e9e9;
}
body.mobileMenu .spectacledcoder-navbar ul li a {
font-size: 12px;
padding-left: 27px;
padding-right: 27px;
}
.clsLi {
padding-left: 15px !important;
padding-right: 15px !important;
padding-bottom: 15px !important;
}
body.mobileMenu .spectacledcoder-navbar .nav_dropdown li a {
padding-left: 17px !important;
padding-right: 6px !important;
display: inline-block;
}
body.mobileMenu .spectacledcoder-navbar .nav_dropdown li {
border-bottom: 0;
}
.spectacledcoder-navbar {
padding: 11px 7px 15px !important;
}
header {
height: 55px !important;
}
.ekart_logistics_body_class .container .content-box-sec .img-section img {
padding-top: 63px !important;
} }
@media (min-width:768px) and (max-width:991px) {
.spectacledcoder-navbar ul {
max-width: 60%;
}
}
.clsLi {
display: block;
text-align: right;
}
.closeM {
text-align: right;
font-size: 20px;
color: #fff;
padding: 5px;
background: transparent;
border: 0;
}
.img-section img {
height: 485px !important;
width: 100%;
}
.DrAdd {
font-size: 23px;
margin-left: auto;
position: absolute;
right: 7px;
top: 3px;
width: 40px;
height: 40px;
background: transparent;
border: 0;
}
.DrAdd .mns {
display: none;
}
body.dropD .DrAdd .mns {
display: block;
}
body.dropD .DrAdd .plush {
display: none;
}
@media (min-width:992px) {
.clsLi {
display: none;
}
.DrAdd {
display: none;
}
}
@media (max-width: 991px) {
.desktop_service a i {
display: none;
}
body.dropD .nav_dropdown {
width: 100%;
position: inherit;
top: 0;
}
body.dropD .nav_hover {
transform: scale(1) !important;
position: inherit;
overflow: visible;
top: 0;
}
body.mobileMenu:before {
content: '';
position: fixed;
left: 0;
top: 0;
background: rgba(51,51,51,.9)!important;
width: 100%;
left: 0;
right: 0;
bottom: 0;
height: 100vh;
z-index: 1;
}
}