@CHARSET "ISO-8859-1";
/* Reset CSS
 * --------------------------------------- */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	padding: 0;
	margin: 0;
}

a {
	text-decoration: none;
}

table {
	border-spacing: 0;
}

fieldset, img {
	border: 0;
}

address, caption, cite, code, dfn, em, strong, th, var {
	font-weight: normal;
	font-style: normal;
}

strong {
	font-weight: bold;
}

ol, ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

caption, th {
	text-align: left;
}

body {
	overflow-x: hidden;
	max-width: 1920px;
	margin: 0 auto;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	font-size: 100%;
	margin: 0;
	padding: 0;
	color: #444;
}

q:before, q:after {
	content: '';
}

abbr, acronym {
	border: 0;
}

/* Custom Font 
 * --------------------------------------- */

@font-face {
	font-family: 'Lato-Bold';
	src: url('../fonts/Lato-Bold.eot');
	src: url('../fonts/Lato-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato-Bold.ttf') format('truetype'), url('../fonts/Lato-Bold.woff') format('woff'), url('../fonts/Lato-Bold.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Lato-Light';
	src: url('../fonts/Lato-Light.eot');
	src: url('../fonts/Lato-Light.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato-Light.ttf') format('truetype'), url('../fonts/Lato-Light.woff') format('woff'), url('../fonts/Lato-Light.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Lato-Medium';
	src: url('../fonts/Lato-Medium.eot');
	src: url('../fonts/Lato-Medium.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato-Medium.ttf') format('truetype'), url('../fonts/Lato-Medium.woff') format('woff'), url('../fonts/Lato-Medium.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Lato-Regular';
	src: url('../fonts/Lato-Regular.eot');
	src: url('../fonts/Lato-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/Lato-Regular.ttf') format('truetype'), url('../fonts/Lato-Regular.woff') format('woff'), url('../fonts/Lato-Regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
}

h1 {
	font-size: 5em;
	font-family: Lato-Medium;
	color: #fff;
	margin: 0;
	padding: 40px 0 0 0;
}

.intro p {
	color: #fff;
	padding: 40px 0 0 0;
}

/* Centered texts in each section
* --------------------------------------- */

.section {
	text-align: center;
}

/* GLOBAL Styles Starts
 * --------------------------------------- */

.global-padding-0 {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

.global-pr-0 {
	padding-right: 0 !important;
}

.global-pl-0 {
	padding-left: 0 !important;
}

.global-br {
	border-right: 1px solid #000000;
}

.global-bb-4 {
	border-bottom: 4px solid #ed1c24;
}

.global-pt-70 {
	padding-top: 70px;
}

.img-full-width {
	width: 100%;
}

.global-mb-10 {
	margin-bottom: 10px;
}

.global-mb-minus-20 {
	margin-bottom: -20px;
}

.global-mb-25 {
	margin-bottom: 25px;
}

.global-divider-line {
	height: 2px;
	background-color: #7e7e7e;
	max-width: 730px;
	margin: 45px auto;
}

.global-mt-30 {
	margin-top: 30px;
}

.global-mt-50 {
	margin-top: 50px;
}

.global-max-width-1000 {
	max-width: 1000px;
}

.global-margin-3percent {
	margin-left: 3%;
	margin-right: 3%;
}

#1stPage_thumb {
	cursor: pointer;
}

.fix-width-1000 {
	max-width: 1000px;
	position: relative;
}

.global-left-10 {
	position: relative;
	left: 10px;
}

.global-pr-38 {
	padding-right: 38px;
}

/* CUSTOM Styles Starts
 * --------------------------------------- */

.fix-height-1080 {
	height: 1080px;
}

.fix-height-1084 {
	height: 1084px;
}

/*.sticky-fix-nav { position:fixed; right:0; top:25%; z-index:100; }
.sticky-fix-nav > ul { list-style-type:none; display:block; }
.sticky-fix-nav > ul > li { padding-bottom:6px; cursor:pointer; }*/

h1 {
	font-size: 40px;
	font-weight: 500;
}

h2 {
	font-size: 35px;
}

h3 {
	font-size: 28px;
}

h4 {
	font-size: 22px;
}

h5 {
	font-size: 18px;
}

h6 {
	font-size: 16px;
}

ul {
	margin: 0px;
	padding: 0px;
}

li {
	list-style: none
}

p {
	font-size: 16px;
	font-weight: normal;
	font-family: Lato-Regular;
	line-height: 24px;
	color: black;
	margin-bottom: 15px;
}

hr {
	margin: 60px 0;
	padding: 0px;
	border-bottom: 1px solid #eceff8;
	border-top: 0px;
}

label {
	color: #7e7e7e;
	cursor: pointer;
	font-size: 14px;
	font-weight: 400;
}

.wrapper {
	width: 100%;
	height: auto;
	overflow: hidden;
	/*margin-top: 14px;*/
}

.item {
	/*	background: #ae8bff;*/
	height: auto;
}

.slider-text1 {
	position: absolute;
	left: 55%;
	top: 30%;
	z-index: 11;
}

.slider-text1 h2 {
	position: absolute;
	z-index: 11;
	color: white;
	font-size: 16px;
	font-family: Lato-Medium;
}

.slider-text2 {
	position: absolute;
	left: 10%;
	bottom: 30%;
	/*width:50%;*/
	z-index: 11;
}

.slider-text2 h2 {
	font-size: 16px;
	color: white;
	font-family: Lato-Medium;
}

.slider-text4 {
	position: absolute;
	top: 50%;
	right: 15%;
	font-size: 65px;
	line-height: 60px;
	color: white;
	text-align: center;
	font-family: Lato-Medium;
}

.slider-text4 span, .slider-text5 span {
	color: #f58424;
}

.slider-text5 {
	position: absolute;
	font-size: 25px;
	text-align: center;
	font-family: Lato-Medium;
	top: 40%;
	right: 30%;
	line-height: 15px;
	color: white;
}

.slider-text5 span {
	font-size: 65px;
}

.slider-text5 hr {
	margin: 10px 0;
	border: 2px solid #f58424;
}

.slider-text5 h2 {
	color: white;
	font-size: 65px;
}

/*nav {
	position: fixed;
	width: 100%;
}*/

header {
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 11;
}

.main-menu-area {
	position: fixed;
	width: 100%;
}

/* OWL CAROUSEL*/

.owl-carousel .owl-dots {
	margin-top: 10px;
	position: absolute;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	bottom: 0;
	z-index: 10;
}

.owl-carousel .owl-dots button.owl-dot span {
	width: 40px;
	height: 5px;
	background-color: #c6c7c9;
}

.owl-carousel .owl-dots button.owl-dot.active span {
	width: 40px;
	height: 5px;
	background-color: #5498eb;
}

.spotlight1.owl-carousel .owl-nav button.owl-next {
	background: rgba(0, 0, 0, 0) url(../images/arrows.jpg) no-repeat -277px -70px;
	color: transparent;
	height: 65px;
	right: 0;
	position: absolute;
	top: 37%;
	width: 59px;
}

.spotlight1.owl-carousel .owl-nav button.owl-prev {
	background: rgba(0, 0, 0, 0) url(../images/arrows.jpg) no-repeat -162px -70px;
	color: transparent;
	height: 65px;
	left: 0;
	position: absolute;
	top: 37%;
	width: 60px;
}

.owl-next:focus, .owl-prev:focus {
	outline: none;
}

.spotlight1.owl-carousel .owl-dots {
	display: none;
}

.spotlight .owl-theme .owl-dots .owl-dot {
	width: 20px;
	margin-right: 10px;
}

.spotlight .owl-theme .owl-dots .owl-dot span {
	width: 20px;
	margin-right: 10px;
}

.spotlight-image {
	position: relative;
}

.slider-img {
	position: relative;
	width: 100%;
}

/*NAVIGATION*/

.logo {
	position: fixed;
	float: left;
}

.logo.black {
	position: fixed;
	float: left;
}

img.logo_resize {
	height: 60px;
	transition: all 0.5s ease;
	-webkit-transition: all 0.4s ease;
}

nav {
	position: fixed;
	width: 100%;
	line-height: 60px;
	transition: 0.3s;
}

ul li.navigation-dropdown {
	position: relative;
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
}

li.navigation-dropdown-menu {
	position: absolute;
}

ul.navigation {
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
}

/* nav ul {
	line-height: 40px;
	list-style: none;
	overflow: hidden;
	color: #fff;
	padding: 0;
	text-align: center;
	margin: 0;
	transition: 0.2s;
	font-family: Lato-Light;
} */

nav.black {
	background: #fff;
	font-size: 20px;
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s ease;
	opacity: 1;
}

/* nav ul li {
	display: inline-block;
	padding: 15px;
}

nav ul li a {
	text-decoration: none;
	color: #fff;
	font-size: 19px;
}

nav ul li a:hover {
	text-decoration: none;
	color: #f58424;
} */

.nav-bgcolor {
	width: 100%;
}

.menu-icon {
	line-height: 60px;
	width: 100%;
	background: #000;
	text-align: right;
	box-sizing: border-box;
	/*padding: 15px 24px;*/
	cursor: pointer;
	color: #fff;
	display: none;
}

.slicknav_menu {
	display: none;
}

.slicknav_menu ul {
	display: inline-block;
}

.slicknav_menu ul li {
	display: block;
}

/* --------------- Bootstrap Responsive Menu ------------------ */

.navbar-nav>li>a {
	padding-top: 0;
	padding-bottom: 0;
	color: #0764a2 !important;
}

.mainmenu {
	background-color: transparent;
	border-color: transparent;
	margin-bottom: 0;
	border: 0px !important;
}

.navbar-nav>li:last-child>a {
	padding-right: 0px;
	margin-right: 0px;
}

.dropdown-menu {
	padding: 0px 0;
	margin: 0 0 0;
	border: 0px solid transition !important;
	border: 0px solid rgba(0, 0, 0, .15);
	border-radius: 0px;
}

.caret {
	margin-left: 6px;
}

/*=-====Main Menu=====*/

.navbar-nav .open .dropdown-menu>li>a {
	padding: 16px 15px 16px 25px;
}

.header_bottom {
	/* background: #0071ba */
}

.header_area .header_bottom .mainmenu a, .navbar-default .navbar-nav>li>a {
	color: #000;
	font-size: 16px;
	text-transform: capitalize;
	padding: 16px 15px;
	font-family: 'Roboto', sans-serif;
}

.header_area .mainmenu .active>a, 
.header_area .mainmenu .active a:focus, 
.header_area .mainmenu li a:hover, 
.header_area .mainmenu li a:focus, 
.navbar-default .navbar-nav>.open>a, 
.navbar-default .navbar-nav>.open>a:focus, 
.navbar-default .navbar-nav>.open>a:hover,
.navbar-nav li.nav-item.active>a:hover {
	color: #f58424 !important;
	background: transparent;
	outline: 0;
}

.header_area .mainmenu .active>a:hover {
	background: #dfdfdf;
}

/*-----./ Main Menu-----*/

.navbar-default .navbar-toggle {
	border-color: #000;
}

.nav-item>a {
	padding: 25px 15px !important;
	font-weight: bold;
}

/*Toggle Button*/

.navbar-default .navbar-toggle .icon-bar {
	background-color: #000;
}

/*Toggle Button*/

/*==========Sub Menu=v==========*/

.mainmenu .collapse ul>li:hover>a {
	/* background: #54c6d4; */
}

.mainmenu .collapse ul ul>li:hover>a, .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>li>a:hover {
	background: #dfdfdf;
	color: #f58424;
}

.mainmenu .collapse ul ul ul>li:hover>a {
	background: #dfdfdf;
}

.mainmenu .collapse ul ul, .mainmenu .collapse ul ul.dropdown-menu {
	background: white;
}

.mainmenu .collapse ul ul ul, .mainmenu .collapse ul ul ul.dropdown-menu {
	background: white;
}

.dropdown-menu a {
	color: black;
}

/* .mainmenu .collapse ul ul ul ul,
.mainmenu .collapse ul ul ul ul.dropdown-menu {
	background: #e4eeb8
} */

/******************************Drop-down menu work on hover**********************************/

.mainmenu {
	/* background: #fff; */
	border: 0 solid;
	margin: 0;
	padding: 0;
	min-height: 20px
}

@media only screen and (min-width: 767px) {
	.mainmenu .collapse ul li {
		position: relative;
	}
	.mainmenu .collapse ul li:hover>ul {
		display: block
	}
	.mainmenu .collapse ul ul {
		position: absolute;
		top: 100%;
		left: 0;
		min-width: 250px;
		display: none
	}
	/*******/
	.mainmenu .collapse ul ul li {
		position: relative
	}
	.mainmenu .collapse ul ul li:hover>ul {
		display: block
	}
	.mainmenu .collapse ul ul ul {
		position: absolute;
		top: 0;
		left: 100%;
		min-width: 250px;
		display: none
	}
	/*******/
	.mainmenu .collapse ul ul ul li {
		position: relative
	}
	.mainmenu .collapse ul ul ul li:hover ul {
		display: block
	}
	.mainmenu .collapse ul ul ul ul {
		position: absolute;
		top: 0;
		left: -100%;
		min-width: 250px;
		display: none;
		z-index: 1
	}
}

/* ---------------- Desktop menu ------------------ */

.container-navbar {
	width: 80%;
	margin: 0 auto;
}

ul.dp-main-menu {
	overflow: visible;
}

ul.dp-main-menu a {
	color: #0764a2;
	display: block;
	text-align: center;
	font-weight: bold;
	font-size: 18px;
}

.dropdown-item {
	font-size: 16px;
}

/* .dropdown-menu {
	display: unset;
	background-color: transparent;
	border: none;
	top: -450px;
	box-shadow: none;
	min-width: 250px;
} */

.dropdown-menu a {
	/* color: black !important; */
}

.dropdown-item {
	color: black;
}

/* .dropdown:hover .dropdown-menu {
	display: block;
	margin-top: 0;
	top: 65px;
} */

.dropdown:hover .dropdown_animate {
	clip: auto;
	opacity: 1;
	-webkit-transform: translateY(0) scaleY(1) !important;
	transform: translateY(0) scaleY(1) !important;
}

.dropdown_animate {
	clip: rect(1px, 1px, 1px, 1px);
	opacity: 0;
	transition: opacity 0.2s cubic-bezier(0.2, 0, 0.2, 1), -webkit-transform 0.1s cubic-bezier(0.2, 0, 0.2, 1);
	transition: transform 0.1s cubic-bezier(0.2, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.2, 0, 0.2, 1);
	transition: transform 0.1s cubic-bezier(0.2, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.2, 0, 0.2, 1), -webkit-transform 0.9s cubic-bezier(0.2, 0, 0.2, 1);
	-webkit-transform: translateY(-10px) scaleY(0.5);
	transform: translateY(-10px) scaleY(0.5);
	-webkit-transform-origin: top;
	transform-origin: top;
	box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.3);
	background: white;
}

.sub-dropdown {
	position: relative;
}

.dropdown-sub-menu {
	display: none;
	position: absolute;
	left: -100%;
	top: 0;
	z-index: 1000;
	min-width: 250px;
	padding: 5px 0;
	margin: 2px 0 0;
	list-style: none;
	font-size: 14px;
	text-align: left;
	/* background-color: #ffffff; */
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	transition: 300ms ease-in-out;
}

.sub-dropdown:hover .dropdown-sub-menu {
	display: block;
	left: 100%;
	top: 0;
}

.sub-dropdown:hover .dropdown_animate2 {
	clip: auto;
	opacity: 1;
	-webkit-transform: translateY(0) scaleY(1) !important;
	transform: translateY(0) scaleY(1) !important;
}

.dropdown_animate2 {
	clip: rect(1px, 1px, 1px, 1px);
	opacity: 0;
	transition: opacity 0.2s cubic-bezier(0.2, 0, 0.2, 1), -webkit-transform 0.1s cubic-bezier(0.2, 0, 0.2, 1);
	transition: transform 0.1s cubic-bezier(0.2, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.2, 0, 0.2, 1);
	transition: transform 0.1s cubic-bezier(0.2, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.2, 0, 0.2, 1), -webkit-transform 0.9s cubic-bezier(0.2, 0, 0.2, 1);
	-webkit-transform: translateX(-150px) scaleX(0.5);
	transform: translateX(-150px) scaleX(0.5);
	-webkit-transform-origin: left;
	transform-origin: left;
	box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.3);
	background: white;
}

.dropdown-bg-white {
	background: white;
}

*/ @media screen and (max-width: 786px) {
	/* #menu is the original menu */
	ul#menu {
		display: block;
	}
	.js .slicknav_menu {
		display: block;
		position: fixed;
		top: 0;
		right: 0;
		z-index: 10;
	}
}

@media(max-width: 786px) {
	.logo {
		position: fixed;
		top: 0;
		z-index: 999;
		/*margin-top: 16px;*/
	}
	/*.nav-bgcolor {
			width: 100%;
		}*/
	nav ul {
		/*max-height: 0px;*/
		/*background: transparent;*/
		width: 100%;
		/*padding: 0;*/
	}
	nav.black ul {
		/* background: #000; */
		/*width: 100%;*/
	}
	.showing {
		max-height: 34em;
	}
	nav ul li {
		box-sizing: border-box;
		width: 100%;
		padding: 0px;
		text-align: left;
		/*background: black;*/
	}
	nav.black ul li {
		box-sizing: border-box;
		width: 100%;
		padding: 0px;
		text-align: left;
	}
	.menu-icon {
		display: block;
		background: transparent;
	}
}

/*WHO WE ARE SECTION*/

.content {
	margin-top: 50px;
	margin-bottom: 40px;
}

.content h3 {
	text-align: center;
	font-size: 33px;
	color: #084771;
}

.content p {
	text-align: center;
	margin-left: 70px;
	margin-right: 70px;
	margin-top: 25px;
}

ul.who-we-are {
	display: flex;
}

ul.who-we-are li {
	display: inline-block;
	position: relative;
}

ul.who-we-are li a {
	position: absolute;
	bottom: 14px;
	text-align: center;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	font-family: 'Lato-Medium';
	font-size: 20px;
	color: #FFFFFF;
}

ul.who-we-are li a:hover {
	text-decoration: none;
}

.company-img {
	position: relative;
}

.company-img h2 {
	position: absolute;
	bottom: 14px;
	text-align: center;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	font-family: 'Lato-Medium';
	font-size: 20px;
	color: #FFFFFF;
}

ul.who-we-are li img {
	width: 100%;
}

li a.link-active {
	border-bottom: 1px solid #f58424;
	color: #f58424;
}

/*WHAT WE DO*/

.bg-img {
	width: 100%;
	opacity: 0.2;
	background-image: url("../images/Web-Design-1-1.jpg");
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
	min-height: 590px;
	box-shadow: inset 0 0 0 1000px rgba(17, 123, 193, 0.4);
}

.whatwedo-position {
	position: absolute;
	top: 0%;
	left: 43%;
	z-index: 1;
}

.whatwedo-section {
	position: relative;
	margin-top: 40px;
}

.whatwedo-slider {
	position: absolute;
	top: 20%;
	left: 0%;
	/*margin-top: 30px;*/
}

.service-box {
	position: absolute;
	z-index: 10;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	background: #fff;
	border-radius: 82px;
	border: 3px solid rgb(8, 71, 113);
	height: 390px;
	width: 300px;
	transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
}

.service-box:hover {
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
}

.item-height {
	height: 405px;
}

.text-color {
	color: #084771;
}

.img-position {
	margin-top: 85px;
	margin-bottom: 48px;
}

.img-position-seo {
	margin-top: 51px;
	margin-bottom: 20px;
}

.img-position-bo {
	margin-bottom: 42px;
}

.img-position-branding {
	margin-top: 10px;
}

/*BUTTON*/

.btn {
	background-color: #084771;
	-moz-border-radius: 28px;
	-webkit-border-radius: 29px;
	border-radius: 28px;
	display: inline-block;
	cursor: pointer;
	color: #ffffff;
	font-size: 17px;
	padding: 5px 20px;
	text-decoration: none;
	text-shadow: 0px 1px 0px #000;
	margin-top: 68px;
	margin-left: 48px;
	transition: background-color 0.3s ease-out;
}

.btn:hover {
	background-color: #f58424;
	color: #084771;
}

.btn:active {
	position: relative;
	top: 1px;
}

.btn-position {
	position: absolute;
	top: 67%;
	left: 11%;
}

.service-image a {
	position: absolute;
	bottom: 20px;
	left: 0;
	right: 0;
	width: auto;
	margin-left: auto;
	margin-right: auto;
	max-width: 130px;
	background-color: #084771;
	border-radius: 28px;
	color: #ffffff;
	font-size: 17px;
	padding: 5px 20px;
	text-decoration: none;
	text-shadow: 0px 1px 0px #000;
	transition: background-color 0.3s ease-out;
}

.service-image a:hover {
	background-color: #f58424;
	color: #084771;
}

/*BLANK DIV*/

.home-blank-div {
	background-color: white;
	height: 150px;
}

/*FOOTER*/

.footer-bg {
	color: white;
	background-color: #084771;
	text-align: center;
	padding-top: 30px;
	padding-bottom: 30px;
	font-family: Lato-Medium;
}

.footer-bg a {
	color: white;
}

.footer-bg a:hover {
	color: #f58424;
	text-decoration: none;
}

.footer-header h2 {
	font-size: 26px;
	font-family: Lato-Regular;
	color: white;
}

ul.footer-listing, ul.followus-listing {
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
}

ul.footer-listing li, ul.followus-listing li {
	display: inline-block;
	padding: 8px 15px;
	font-size: 18px;
	color: white;
}

.footer-copyright {
	display: block;
	font-size: 12px;
	padding-top: 10px;
	clear: both;
}

/*ul.followus-listing li { background: url("../images/arrows1.jpg") no-repeat; height: 25px; }
ul.followus-listing li.icon-fb { background-position: 10px 10px; }

.followus-listing ul li a.icon-fb {
	background-image: url("../images/arrows1.jpg") no-repeat;
}
.icon-tt { background-image: url("../images/arrows1.jpg") no-repeat 10px 10px; }
.icon-instagram { background-image: url("../images/arrows1.jpg") no-repeat 10px 10px; }
.icon-linkdin {background-image: url("../images/arrows1.jpg") no-repeat 10px 10px;  }
*/

/*-------------------ABOUT US PAGE-----------------*/

/*ABOUT US SECTION*/

.spotlight-image img {
	position: relative;
	width: 100%;
}

.spotlight-text-web-construct {
	position: absolute;
	top: 50%;
	left: 10%;
	z-index: 1;
	color: white;
}

.spotlight-text-web-construct h1 {
	font-size: 60px;
	font-family: Lato-Bold;
	text-align: center;
	line-height: 50px;
}

.spotlight-text-web-construct p {
	font-size: 24px;
	text-align: center;
	margin-top: 21px;
	color: white;
}

.spotlight-text-web-construct hr {
	margin: 18px 0;
	border-bottom: 4px solid white;
	border-top: 0px;
}

.spotlight-text {
	position: absolute;
	top: 50%;
	left: 10%;
	z-index: 1;
}

.spotlight-text h1 {
	color: white;
	font-size: 60px;
	font-family: Lato-Bold;
	text-align: center;
	line-height: 50px;
}

.spotlight-text p {
	font-size: 24px;
	text-align: center;
	margin-top: 21px;
	color: white;
}

.spotlight-text hr {
	margin: 18px 0;
	border-bottom: 4px solid white;
	border-top: 0px;
}

.spotlight-text-webcheckup {
	position: absolute;
	top: 45%;
	left: 40%;
	z-index: 1;
}

.spotlight-text-webcheckup h1 {
	color: white;
	font-size: 60px;
	font-family: Lato-Bold;
	text-align: center;
	line-height: 50px;
}

.spotlight-text-webcheckup p {
	font-size: 24px;
	text-align: center;
	margin-top: 21px;
	color: white;
}

.spotlight-text-webcheckup hr {
	margin: 18px 0;
	border-bottom: 4px solid white;
	border-top: 0px;
}

.spotlight-text-smm {
	position: absolute;
	top: 50%;
	left: 10%;
	z-index: 1;
}

.spotlight-text-smm h1 {
	color: white;
	font-size: 60px;
	font-family: Lato-Bold;
	text-align: center;
	line-height: 50px;
}

.spotlight-text-smm hr {
	margin: 18px 0;
	border-bottom: 4px solid white;
	border-top: 0px;
}

.spotlight-text-smm p {
	font-size: 24px;
	text-align: center;
	margin-top: 21px;
	color: white;
}

.spotlight-text-mobile-apps {
	position: absolute;
	top: 50%;
	left: 10%;
	z-index: 1;
}

.spotlight-text-mobile-apps h1 {
	color: white;
	font-size: 60px;
	font-family: Lato-Bold;
	text-align: center;
	line-height: 50px;
}

.spotlight-text-mobile-apps hr {
	margin: 18px 0;
	border-bottom: 4px solid white;
	border-top: 0px;
}

.spotlight-text-mobile-apps p {
	font-size: 24px;
	text-align: center;
	margin-top: 21px;
	color: white;
}

.spotlight-text-seo {
	position: absolute;
	top: 50%;
	left: 10%;
	z-index: 1;
}

.spotlight-text-seo h1 {
	color: white;
	font-size: 60px;
	font-family: Lato-Bold;
	text-align: center;
	line-height: 50px;
}

.spotlight-text-seo hr {
	margin: 18px 0;
	border-bottom: 4px solid white;
	border-top: 0px;
}

.spotlight-text-seo p {
	font-size: 24px;
	text-align: center;
	margin-top: 21px;
	color: white;
}

.ul-format {
	font-size: 16px;
	font-weight: normal;
	font-family: Lato-Regular;
	line-height: 24px;
	color: black;
	margin-bottom: 15px;
}

.company-img img {
	width: 100%;
}

.m-top {
	margin-top: 20px;
}

.m-top-ourspec {
	margin-top: 60px;
}

.m-no-top {
	margin-top: 10px !important;
}

/*OUR SPECIALIZATION*/

.bg-circle {
	background: #084771;
	width: 183px;
	height: 183px;
	border-radius: 50%;
}

.bg-circle img {
	transform: scale(1.0);
	transition: 0.3s ease;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
}

.bg-circle img:hover {
	transform: scale(1.1);
	transition: 0.3s ease;
}

.spec-description a {
	color: #084771;
	text-decoration: none;
}

.spec-description a:hover {
	color: #f58424;
	text-decoration: none;
	transition: 0.3s ease;
}

.spec-description {
	font-family: Lato-Medium;
	font-size: 25px;
	color: #000000;
	text-align: center;
}

div.bg-circle {
	margin-left: auto;
	margin-right: auto;
}

/*------------------SERVICE PAGE----------------*/

.services-htext h3 {
	color: black;
	font-size: 38px;
}

.services-heading {
	color: #084771;
	/*text-decoration: underline;*/
	margin-bottom: 20px;
}

hr.services-heading {
	margin-top: 8px;
	margin-bottom: 8px;
	border-bottom: 3px solid #084771;
	border-top: 0px;
	width: 100%;
	border-radius: 6px;
}

.services-menu {
	float: left;
	width: 82%;
	border: 2px solid #084771;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	background: #ffffff;
}

.services-menu ul {
	padding: 0;
	margin: 0;
	list-style: none;
	float: right;
	width: 100%;
}

.services-menu ul li {
	display: block;
	overflow: hidden;
	line-height: 24px;
	border-top: 2px solid #084771;
	transition: 0.3s ease;
}

.services-menu ul li a {
	display: block;
	text-decoration: none;
	font: 500 20px/18px 'Lato-Medium', sans-serif;
	color: #222;
	padding: 20px 8px 20px 16px;
}

.services-menu ul li.active a {
	color: #f38223;
}

.services-menu ul li:hover a {
	color: #f38223;
	text-decoration: none;
}

.services-menu ul li:hover {
	background: #084771;
	transition: 0.3s ease;
}

.services-menu ul li:first-child {
	border: 0
}

ul li a.services-menu {
	margin-right: auto;
	margin-left: auto;
}

/*--------------CONTACT US PAGE---------------*/

.bg-img-contact {
	width: 100%;
	opacity: 0.8;
	background-image: url("../images/bg-contactus.jpg");
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
	min-height: 590px;
	box-shadow: inset 0 0 0 1000px rgba(10, 154, 249, 0.4);
}

.bg-circle-contact {
	background: #084771;
	width: 234px;
	height: 214px;
	border-radius: 23%;
	border: 4px solid white;
	vertical-align: middle;
}

div.bg-circle-contact {
	margin-left: auto;
	margin-right: auto;
	margin-top: 180px;
}

.bg-circle-contact h1 {
	font-family: Lato-Bold;
	text-align: center;
	color: white;
	font-size: 30px;
	/*margin-top: 51px;*/
}

.bg-circle-contact hr {
	width: 130px;
	border-top: 3px solid white;
	margin-left: 48px;
	border-radius: 6px;
	margin-top: 20px;
	margin-bottom: 20px;
}

.bg-circle-contact p {
	font-family: Lato-Bold;
	text-align: center;
	color: white;
	margin-top: 20px;
}

/*----------WEBSITE CHECKUP----------*/

.row-position {
	margin-top: 50px;
	margin-bottom: 20px;
}

.menu-position {
	margin-left: 40px;
}

/*--------SCROLL TO TOP-----------*/

#scroll {
	position: fixed;
	right: 10px;
	bottom: 10px;
	cursor: pointer;
	width: 50px;
	height: 50px;
	background-color: #f69c4f;
	text-indent: -9999px;
	display: none;
	-webkit-border-radius: 60px;
	-moz-border-radius: 60px;
	border-radius: 60px;
	transition: 0.2s ease;
}

#scroll span {
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -8px;
	margin-top: -12px;
	height: 0;
	width: 0;
	border: 8px solid transparent;
	border-bottom-color: #ffffff;
	transition: 0.2s ease;
}

#scroll:hover {
	background-color: #084771;
	opacity: 1;
	filter: "alpha(opacity=100)";
	-ms-filter: "alpha(opacity=100)";
	transition: 0.2s ease;
}

/*--------------Mob Navigation----------------*/

dt, dd a {
	display: block;
	/*padding: 15px 0 15px 22px;*/
	@include user-select(none);
	color: #333;
}

dt {
	cursor: pointer;
	outline: none;
	/*margin-top: 25px;*/
	color: #1375b7;
	font-size: 19px;
	line-height: 53px;
}

dl {
	margin: 0;
}

dl a {
	font-size: 22px;
	display: block;
	color: #0099ff;
}

dl a:active {
	text-decoration: none;
}

dd {
	line-height: 38px;
	font-size: 20px;
	a {
		text-decoration: none;
		color: pink;
		&:hover {
			color: darken(#333, 15%)
		}
		&:active {
			color: darken(#333, 20%);
		}
	}
}

dd a {
	color: #f69c4f;
}

dd a:active {
	text-decoration: none;
}

.accordion-element {
	&__term {
		font-weight: bold;
		&.active, &:hover, &:focus {
			background-color: #eee;
		}
	}
}

.dropdown-scroll {
	height: 360px;
	overflow-y: scroll;
}

/*-----------------BREADCRUMBS------------------*/

.breadcrumb-right-arrow .breadcrumb-item+.breadcrumb-item::before {
	content: "›";
	vertical-align: top;
	font-size: 24px;
	line-height: 14px;
	color: #ffaf22;
}

.breadcrumb-style {
	height: 50px;
	background: rgba(0, 0, 0, 0);
	font-size: 14px;
	margin-top: 12px;
	margin-bottom: 0;
	border-radius: 0;
	display: flex;
}

.breadcrumb-style a {
	color: black;
}

.breadcrumb-style a:hover {
	color: black;
}

.breadcrumb > li {
    display: flex;
}

.breadcrumb-item {
	margin-top: 5px;
}

.breadcrumb-style>.active {
	color: #f69c4f;
}

/*----------------------CLIENTS PAGE--------------------*/

.spotlight-text-clients {
	position: absolute;
	top: 40%;
	width: 100%;
	text-align: center;
	/*font-family: Lato-Bold;
	font-size: 60px;*/
	/*right: 0;*/
}

.spotlight-text-clients h1 {
	font-family: Lato-Bold;
	font-size: 60px;
}

span.banner-text-color {
	color: #f58424;
}

.spotlight-text-clients p {
	color: white;
	font-size: 17px;
	font-family: Lato-Medium;
}

.clients-section {
	width: 90%;
	margin: 0 auto;
	margin-top: 40px;
	margin-bottom: 100px;
}

.clients-section p {
	text-align: center;
	font-family: Lato-Regular;
	font-size: 16px;
}

.clients-list {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
}

.client-display {
	flex-basis: 30%;
    border: 2px solid #888888;
    height: 280px;
    width: 500px;
    margin: 20px;
    position: relative;
    box-shadow: 0 2px 5px;
}

.client-display img {
	opacity: 1;
	display: block;
	width: 100%;
	height: 100%;
	transition: .5s ease;
	backface-visibility: hidden;
}

.overlay-effect {
	transition: .5s ease;
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/*  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);*/
	text-align: center;
}

.client-display:hover .client-display img {
	opacity: 0.3;
}

.client-display:hover .overlay-effect {
	opacity: 1;
}

.overlay-text {
	background-color: #084771;
	color: white;
	font-size: 16px;
	width: 100%;
	height: 100%;
	padding: 40px;
	text-align: left;
}

.overlay-text h2 {
	color: white;
	font-family: Lato-Medium;
	font-size: 30px;
	text-align: left;
}

.overlay-text p {
	color: white;
	font-family: Lato-Light;
	font-size: 11px;
	text-align: left;
	padding: 35px 0;
}

/*.overlay-text h3 {
	color: white;
	font-family: Lato-Medium;
	font-size: 20px;
	text-align: left;
	padding: 40% 0;
}*/

.overlay-text h3 {
	color: white;
	font-family: Lato-Medium;
	font-size: 20px;
	text-align: left;
	position: absolute;
	bottom: 20px;
}

/* Media Queries - responsive
 * --------------------------------------- */

@media screen and (min-width: 320px) and (max-width:479px) {}

@media screen and (min-width: 480px) and (max-width:767px) {
	.logo-container>a>img {
		width: 110px;
	}
	.footer-three-thumb-link-container {
		display: none;
	}
}

@media screen and (min-width: 320px) and (max-width:480px) {}

@media screen and (min-width: 481px) and (max-width:767px) {}

@media screen and (min-width: 320px) and (max-width:767px) {
	.hidden-xs {
		display: none;
	}
	.mainmenu {
	    background-color: white;
	}
	.slider-text1 {
		position: absolute;
		left: 50%;
		z-index: 11;
		width: 50%;
	}
	.slider-text2 {
		left: 5%;
		z-index: 11;
		width: 50%;
	}
	.slider-text1 h1, .slider-text2 h1 {
		font-size: 15px;
		padding-bottom: 6px;
	}
	.slider-text1 h2, .slider-text2 h2 {
		font-size: 10px;
	}
	.slider-text4 {
		font-size: 25px;
		line-height: 25px;
		right: 3%;
	}
	.slider-text5 {
		font-size: 17px;
		top: 45%;
		right: 20%;
		line-height: 7px;
	}
	.slider-text5 h2 {
		font-size: 25px;
	}
	.slider-text5 span {
		font-size: 25px;
	}
	.slider-text1 p, .slider-text2 p {
		font-size: 12px;
		line-height: 14px;
	}
	.content {
		margin-top: 24px;
	}
	.content h3 {
		text-align: center;
		font-size: 33px;
	}
	.content p {
		text-align: center;
		margin-left: 20px;
		margin-right: 13px;
		margin-top: 18px;
	}
	.bg-img {
		width: 100%;
		opacity: 0.4;
	}
	.bg-img-contact {
		width: 100%;
		opacity: 0.4;
	}
	.bg-img h3 {
		text-align: center;
	}
	.m-top-ourspec {
		margin-top: 10px;
	}
	.owl-carousel .owl-dots button.owl-dot.active span {
		width: 30px;
	}
	.owl-carousel .owl-dots button.owl-dot span {
		width: 30px;
	}
	.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-dots button.owl-dot {}
	.spotlight1.owl-carousel .owl-nav button.owl-next {
		background: rgba(0, 0, 0, 0) url(../images/arrows.jpg) no-repeat -284px -169px;
		color: transparent;
		height: 46px;
		/*right: 0;*/
		left: 87%;
		position: absolute;
		top: 41%;
		width: 35px;
	}
	.spotlight1.owl-carousel .owl-nav button.owl-prev {
		background: rgba(0, 0, 0, 0) url(../images/arrows.jpg) no-repeat -182px -169px;
		color: transparent;
		height: 47px;
		left: 0;
		position: absolute;
		top: 41%;
		width: 36px;
	}
	ul.footer-listing li, ul.followus-listing li {
		padding: 8px 5px;
		font-size: 16px;
	}
	ul.footer-listing, ul.followus-listing {
		display: inline-block;
		width: 45%;
		text-align: left;
		padding-left: 5%;
	}
	ul.footer-listing li {
		display: block;
		width: 100%;
		float: left;
	}
	ul.followus-listing li {
		display: block;
		width: 100%;
		float: right;
	}
	ul.who-we-are {
		display: block;
	}
	ul.who-we-are li img {
		width: 100%;
	}
	.service-box {
		position: absolute;
		z-index: 10;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		background: #fff;
		border-radius: 82px;
		border: 3px solid rgb(8, 71, 113);
		height: 390px;
		width: 280px;
		transition: all 0.3s cubic-bezier(.25, .8, .25, 1);
	}
	.service-box:hover {
		box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
	}
	.bg-circle {
		background: #084771;
		height: 155px;
		border-radius: 50%;
	}
	div.bg-circle {
		/* margin-left: auto; */
		/* margin-right: auto; */
		width: 100%;
		/* padding-top: 10px; */
		position: relative;
		text-align: center;
		/* top: 50%; */
		padding-top: 36px;
		position: relative;
	}
	img.bg-circle {
		align-content: center;
	}
	.spotlight-image img {
		position: relative;
		width: 100%;
	}
	.spotlight-text h1 {
		position: absolute;
		top: 50%;
		left: 5%;
		z-index: 1;
		color: white;
		font-size: 33px;
		font-family: Lato-Bold;
	}
	.spotlight-text-web-construct, .spotlight-text-mobile-apps, .spotlight-text-smm, .spotlight-text-seo {
		position: absolute;
		top: 80px;
		left: 3%;
		z-index: 1;
		/*color: white;*/
		/*font-size: 22px;*/
		font-family: Lato-Bold;
		/*text-align: left;
    line-height: 24px;*/
	}
	.spotlight-text-web-construct h1, .spotlight-text-mobile-apps h1, .spotlight-text-smm h1, .spotlight-text-seo h1 {
		color: white;
		font-size: 22px;
		font-family: Lato-Bold;
		text-align: left;
		line-height: 24px;
	}
	.spotlight-text-web-construct p, .spotlight-text-mobile-apps p, .spotlight-text-smm p {
		font-size: 16px;
		text-align: left;
		margin-top: 0px;
		line-height: 18px;
	}
	.spotlight-text-web-construct hr, .spotlight-text-mobile-apps hr, .spotlight-text-smm hr {
		margin: 10px 0;
		border-bottom: 4px solid white;
		border-top: 0px;
	}
	.m-bottom {
		margin-bottom: 25px;
	}
	.services-htext h3 {
		margin-top: 28px;
	}
	div.bg-circle-contact {
		margin-left: auto;
		margin-right: auto;
		margin-top: 50px;
		margin-bottom: 35px;
	}
	.contact-heading h3 {
		margin-top: 30px;
	}
	.bg-circle {
		background: #084771;
		width: 183px;
		height: 150px;
		border-radius: 50%;
	}
	.bg-circle img {
		transform: scale(1.0);
		transition: 0.3s ease;
		/* width: 160px; */
		left: 0;
		right: 0;
		margin-left: auto;
		margin-right: auto;
	}
	.spec-description {
		font-size: 18px;
		line-height: 20px;
		margin-bottom: 20px;
		margin-top: 10px;
	}
	.menu-position {
		margin-left: 30px;
		margin-top: 30px;
		margin-bottom: 5px;
	}
	.whatwedo-position {
		position: absolute;
		top: 7%;
		left: 26%;
		z-index: 1;
	}
	.m-top-columns {
		margin-top: 20px;
	}
	.breadcrumb-style {
		height: 43px !important;
		font-size: 11px !important;
		margin-top: 12px !important;
	}
	.breadcrumb-right-arrow .breadcrumb-item+.breadcrumb-item::before {
		font-size: 20px !important;
		line-height: 11px !important;
	}
	.nav-bgcolor {
		width: 100%;
		height: 65px;
		background-color: rgba(255, 255, 255, 0.8);
	}
	.client-display {
		flex-basis: 100%;
		height: 230px;
		margin: 20px 0;
	}
	.spotlight-text-clients h1 {
		font-size: 30px;
	}
	.spotlight-text-clients p {
		font-size: 10px;
	}
	.overlay-text {
		padding: 20px;
	}
	.overlay-text h2 {
		font-size: 24px;
	}
	.overlay-text p {
		font-size: 13px;
		padding: 15px 0;
	}
	.overlay-text h3 {
		font-size: 16px;
	}
}

@media screen and (min-width: 768px) and (max-width:1199px) {
	.hidden-sm {
		display: none;
	}
	.hidden-md {
		display: none;
	}
}

/*---ipad------*/

@media (min-width: 768px) and (max-width: 991.98px) {
	.client-display {
		height: 250px;
		margin: 10px;
	}
	.overlay-text {
		padding: 20px;
	}
	.overlay-text h2 {
		font-size: 26px;
	}
	.overlay-text p {
		font-size: 14px;
		padding: 15px 0;
	}
	.overlay-text h3 {
		font-size: 16px;
		padding: 0;
	}
	.topnav a {
		padding: 0 10px !important;
		font-size: 14px !important;
	}
	.dropdown .dropbtn {
		font-size: 14px !important;
	}
	.slider-text1 h1 {
		font-size: 25px;
	}
	.slider-text2 h1 {
		font-size: 30px;
	}
	.slider-text4 {
		top: 40%;
		font-size: 45px;
		line-height: 40px;
	}
	.slider-text5 {
		top: 40%;
		right: 25%;
		line-height: 10px;
	}
	.slider-text5 h2 {
		font-size: 45px;
	}
	.slider-text5 span {
		font-size: 45px;
	}
}

@media (min-width: 992px) and (max-width: 1199.98px) {
	.slider-text1 h1 {
		font-size: 32px;
	}
	.slider-text4 {
		top: 40%;
		font-size: 45px;
		line-height: 50px;
	}
	.slider-text5 {
		font-size: 22px;
		right: 27%;
	}
	.slider-text5 h2, .slider-text5 span {
		font-size: 55px;
	}
	ul.dp-main-menu a {
		font-size: 16px;
	}
	.client-display {
	    margin: 10px;
	}
}

@media screen and (min-width: 789px) and (max-width: 1199px) {
	.spotlight-text-web-construct, .spotlight-text-mobile-apps, .spotlight-text-smm, .spotlight-text-seo {
		top: 45%;
		left: 30px;
		font-size: 50px;
	}
}

@media (min-width: 1281px) {
	.hidden-lg {
		display: none;
	}
}

/*And so on... https://responsivedesign.is/develop/browser-feature-support/media-queries-for-common-device-breakpoints/
*/

.topnav {
	/*overflow: hidden;*/
	/*background-color: #333;
  font-family: Lato-Light;*/
	font-family: 'Lato-Regular';
}

.topnav a {
	float: left;
	display: block;
	color: #084771;
	text-align: center;
	padding: 0 16px;
	text-decoration: none;
	font-size: 17px;
}

.topnav a.hover {
	color: #f58424;
}

.topnav a.nav_active, .dropdown .nav_active {
	color: #f58424 !important;
}

.topnav .icon {
	display: none;
}

.mobile_menu {
	display: none;
}

.dropdown {
	/* float: left; */
	/*overflow: hidden;*/
}

.dropdown .dropbtn {
	font-size: 17px;
	border: none;
	outline: none;
	color: #084771;
	padding: 0 16px;
	background-color: inherit;
	font-family: inherit;
	margin: 0;
}

.dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	/*background: rgb(0, 0, 0);*/
	min-width: 242px;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	z-index: 1;
	top: 50px;
	color: #ffffff;
}

.dropdown-content a {
	float: none;
	color: #0865a3;
	padding: 12px 16px;
	text-decoration: none;
	display: block;
	text-align: left;
	line-height: 34px;
	font-size: 16px;
	border-bottom: 1px solid #0865a3;
}

.topnav a:hover, .dropdown:hover .dropbtn {
	color: #f58424;
}

.dropdown-content a:hover {
	color: #f58424;
}

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

@media screen and (max-width: 600px) {
	.topnav a:not(:first-child), .dropdown .dropbtn {
		display: none;
	}
	.topnav a.icon {
		float: right;
		display: block;
	}
	a.mobile_menu {
		display: block;
		position: relative;
		left: 90%;
		text-decoration: none;
		font-size: 30px;
		color: white;
	}
	.topnav {
		overflow: hidden;
		display: none;
	}
	.dropdown {
		/* overflow: hidden; */
	}
	.dropdown-content {
		background: rgba(0, 0, 0, 0.9);
		z-index: 1;
		top: 0;
		padding-left: 10px;
	}
	.dropdown-content a {
		color: white;
	}
	.topnav.responsive {
		position: absolute;
		display: block;
		background: rgb(0, 0, 0);
		width: 100%;
		left: 0;
	}
	.topnav.responsive .icon {
		position: absolute;
		right: 0;
		top: 0;
	}
	.topnav.responsive a {
		float: none;
		color: #ffffff;
		display: block;
		text-align: left;
		border-bottom: 1px solid #f58424;
	}
	.topnav.responsive .dropdown {
		float: none;
	}
	.topnav.responsive .dropdown-content {
		position: relative;
	}
	.topnav.responsive .dropdown .dropbtn {
		display: block;
		width: 100%;
		text-align: left;
		color: #ffffff;
		border-bottom: 1px solid #f58424;
	}
}

.spinner {
	width: 80px;
	height: 80px;
	border: 2px solid #f3f3f3;
	border-top: 3px solid #f25a41;
	border-radius: 100%;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 30;
	animation: spin 1s infinite linear;
}

@keyframes spin {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

#overlay {
	height: 100%;
	width: 100%;
	background: rgba(0, 0, 0, .5);
	position: fixed;
	left: 0;
	top: 0;
	z-index: 30;
}

@media (device-height: 568px) and (device-width: 320px) and (-webkit-min-device-pixel-ratio: 2) {
	#menu {
		width: 340px !important;
	}
	dl a {
		font-size: 19px !important;
	}
}

@media screen and (min-width: 320px) and (max-width:480px) {
	#menu {
		width: 340px !important;
	}
	dl a {
		font-size: 19px !important;
	}
}

@media only screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) {
	#menu {
		width: 415px !important;
	}
	dl a {
		font-size: 19px !important;
	}
}

@media only screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) {
	#menu {
		width: 375px !important;
	}
	dl a {
		font-size: 19px !important;
	}
}

@media screen and (min-width: 320px) and (max-width:767px) {
	#menuToggle {
		display: block;
		position: absolute;
		top: 20px;
		right: 20px;
		z-index: 10;
		-webkit-user-select: none;
		user-select: none;
	}
	#menuToggle input {
		display: block;
		width: 40px;
		height: 32px;
		position: absolute;
		top: -7px;
		left: -5px;
		cursor: pointer;
		opacity: 0;
		z-index: 2;
		/* and place it over the hamburger */
		-webkit-touch-callout: none;
	}
	.container-navbar {
		width: 95%;
	}
	.navbar-nav {
		margin: 0;
	}
	.nav-item>a {
		padding: 15px !important;
	}
	.no-pad-mobile, .navbar-collapse {
		padding: 0;
	}
	.dropdown-menu {
		position: relative;
		box-shadow: none;
	}
	.navbar-nav {
		height: 500px;
		overflow: scroll;
		box-shadow: 0 2px 4px gray;
	}
	.navbar-toggle {
		margin-top: 15px;
	}
	.header_area .header_bottom .mainmenu a, .navbar-default .navbar-nav>li>a {
		padding: 16px 35px;
	}
	.navbar-nav .open .dropdown-menu>li>a {
		padding: 16px 15px 16px 55px;
	}
	.caret {
		margin-left: 10px;
	}
	/*
* Just a quick hamburger
*/
	#menuToggle span {
		display: block;
		width: 33px;
		height: 4px;
		margin-bottom: 5px;
		position: relative;
		background: #084771;
		border-radius: 3px;
		z-index: 1;
		transform-origin: 4px 0px;
		transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), opacity 0.55s ease;
	}
	#menuToggle span:first-child {
		transform-origin: 0% 0%;
	}
	#menuToggle span:nth-last-child(2) {
		transform-origin: 0% 100%;
	}
	/* 
* Transform all the slices of hamburger
* into a crossmark.
*/
	#menuToggle input:checked~span {
		opacity: 1;
		transform: rotate(45deg) translate(-2px, -1px);
		background: #084771;
	}
	/*
* But let's hide the middle one.
*/
	#menuToggle input:checked~span:nth-last-child(3) {
		opacity: 0;
		transform: rotate(0deg) scale(0.2, 0.2);
	}
	/*
* Ohyeah and the last one should go the other direction
*/
	#menuToggle input:checked~span:nth-last-child(2) {
		opacity: 1;
		transform: rotate(-45deg) translate(0, -1px);
	}
	/*
* Make this absolute positioned
* at the top left of the screen
*/
	#menu {
		position: absolute;
		width: 375px;
		margin: -100px 0 0 0;
		padding: 50px;
		padding-top: 125px;
		right: -20px;
		background: #000000;
		list-style-type: none;
		-webkit-font-smoothing: antialiased;
		/* to stop flickering of text in safari */
		transform-origin: 0% 0%;
		transform: translate(100%, 0);
		transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
	}
	#menu li {
		padding: 10px 0;
		font-size: 18px;
	}
	/*
* And let's fade it in from the left
*/
	#menuToggle input:checked~ul {
		transform: scale(1.0, 1.0);
		opacity: 1;
	}
	.menu-mob-container {
		display: inline-block !important;
		float: right;
	}
}

.menu-mob-container {
	display: none;
}