/****************************

	CSS Directory
	MOBILE STYLING

1) Base Rules
2) Module Rules
3) Layout Rules
	i. template styling
		a) navbar
		b) hero
		g) addresses
		h) footer
/*==================================================
    						MOBILE STYLING (start)
====================================================*/

/******************* 1) Base rules (start) ******************/
* {
  margin: 0;
  padding: 0;
}

html {
  scroll-behavior: smooth;
}

img {
  width: 100%;
}

@font-face {
	font-family: "AvenirNext";
	src:url("/template/font/AvenirNextLTPro-Regular.woff");
}

body {
  margin: 0 auto;
  padding: 0;
	font-family: "AvenirNext", Arial, Helvetica, sans-serif;
}

i{
	font-family: "AvenirNext", Arial, Helvetica, sans-serif;
}

li {
  list-style-type: none;
}

a {
  text-decoration: none;
}

h1 {
	font-size: 40px;
	color: #fff;
	/* letter-spacing: -1px; */
	word-spacing: -2px;
}

h2 {
	font-size: 30px;
}

h3{
	font-size: 22px;
}

h4{
	font-size: 20px;
}

button{
	outline: none;
	cursor: pointer;
	font-size: 16px;
	border: none;
	color: #fff;
}

small {
	padding: 0;
}

input{
	outline: none;
}

textarea{
	resize: none;
}

/******************* 1) Base rules (end) ******************/

/******************* 1) loader (start) ******************/

.loader-bg{
	position: fixed;
	right: 0;
	left: 0;
	bottom:0;
	top:0;
	text-align: center;
	z-index: 5;
	background-color: rgba(0,0,0,0.5);
	display: none;
}
.lds-roller {
	position: relative;
	width: 64px;
	height: 64px;
	top: 50%;
	display: none;
}

.lds-roller div {
-webkit-animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
        animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
-webkit-transform-origin: 32px 32px;
    -ms-transform-origin: 32px 32px;
        transform-origin: 32px 32px;
}
.lds-roller div:after {
	content: " ";
	display: block;
	position: absolute;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #fff;
	margin: -3px 0 0 -3px;
}
.lds-roller div:nth-child(1) {
	-webkit-animation-delay: -0.036s;
  animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
	top: 50px;
	left: 50px;
}
.lds-roller div:nth-child(2) {
	-webkit-animation-delay: -0.072s;
  animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
	top: 54px;
	left: 45px;
}
.lds-roller div:nth-child(3) {
	-webkit-animation-delay: -0.108s;
  animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
	top: 57px;
	left: 39px;
}
.lds-roller div:nth-child(4) {
	-webkit-animation-delay: -0.144s;
  animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
	top: 58px;
	left: 32px;
}
.lds-roller div:nth-child(5) {
	-webkit-animation-delay: -0.18s;
  animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
	top: 57px;
	left: 25px;
}
.lds-roller div:nth-child(6) {
	-webkit-animation-delay: -0.216s;
  animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
	top: 54px;
	left: 19px;
}
.lds-roller div:nth-child(7) {
	-webkit-animation-delay: -0.252s;
  animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
	top: 50px;
	left: 14px;
}
.lds-roller div:nth-child(8) {
	-webkit-animation-delay: -0.288s;
  animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
	top: 45px;
	left: 10px;
}
@-webkit-keyframes lds-roller {
	0% {
	-webkit-transform: rotate(0deg);
					transform: rotate(0deg);
	}
	100% {
	-webkit-transform: rotate(360deg);
					transform: rotate(360deg);
	}
}
@keyframes lds-roller {
	0% {
	-webkit-transform: rotate(0deg);
					transform: rotate(0deg);
	}
	100% {
	-webkit-transform: rotate(360deg);
					transform: rotate(360deg);
	}
}
/******************* 1) loader (end) ******************/

/******************* 2) Module rules (start) ******************/
.wrapper {
	max-width: 1440px;
	margin: 0 auto;
	padding: 0 10px;
}

.circle {
  border-radius: 50%;
  background: #5c75ae;
  padding: 8px 16px;
  display: inline-block;
  color: #f2f6eb;
  font-size: 24px;
  margin-right: 5px;
}

.button{
	background: #83ce44;
	padding: 10px;
	width: 100%;
}

.bold{
	font-weight: bold;
}

.italic{
	font-style: italic;
}

/******************* Hero (start) ********************/
.hero {
	align-items: center;
	display: flex;
	font-size: 18px;
	height: 500px;
	justify-content: center;
	overflow: hidden;
	position: relative;
	text-align: center;
	transform-style: preserve-3d;
	perspective: 100px;
}

.hero:before {
	animation: fade-slide-down 10s .5s cubic-bezier(0, 0.5, 0, 1) forwards;
	background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,.3)),
	url(../images/hero__image.jpg) no-repeat bottom;
	background-size: cover;
	content: "";
	opacity: 0;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
}

.hero:after {
	background: #fff;
	content: "";
	height: 40rem;
	left: -5%;
	position: absolute;
	right: -5%;
	top: 90%;
	transform-origin: 0 0;
	z-index: 0;
}

.hero_title-container span{
	font-size: 20px;
}

.hero_title-container{
	margin-bottom:22px;
}

.hero_button-container{
	transform: translateZ(.1px);
	position: relative;
	z-index: 10;
}

.hero_title-container {
	-webkit-animation-delay: .3s!important;
    animation-delay: .3s!important;
}

.hero_button-container{
	-webkit-animation-delay: .6s!important;
	animation-delay: .6s!important;
}
/******************* Hero (end) ********************/


/******************* Animations for hero text poping in and hero image slide down (start) ********************/
.animate-pop-in {
	animation: pop-in .6s cubic-bezier(0, 0.9, 0.3, 1.2) forwards;
	opacity: 0;
}

@keyframes fade-slide-down {
  0% {
    opacity: 0;
    transform: translateY(-4rem);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes pop-in {
  0% {
    opacity: 0;
    transform: translateY(-4rem) scale(.8);
  }
  100% {
    opacity: 1;
    transform: none;
  }
}
/******************* Animations for hero text popping in and hero image slide down (end) ********************/

.form_error_msg {
  display: none;
  color: orange;
  padding-bottom: 10px;
  font-size: 14px;
  font-weight: 700;
}

.custom-dropdown--large {
	font-size: 1.5em;
}

.custom-dropdown--small {
	font-size: .7em;
}

.custom-dropdown__select{
	font-size: inherit; /* inherit size from .custom-dropdown */
	padding: .5em; /* add some space*/
	margin: 0; /* remove default margins */
}

.custom-dropdown__select--blue {
	background-color: #3f5a99;
	color: white;    
}

@supports (pointer-events: none) and
	  ((-webkit-appearance: none) or
	  (-moz-appearance: none) or
	  (appearance: none)) {

	.custom-dropdown {
		position: relative;
		display: inline-block;
		vertical-align: middle;
	}

	.custom-dropdown__select {
		padding-right: 2.5em; /* accommodate with the pseudo elements for the dropdown arrow */
		border: 0;
		border-radius: 3px;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;    
	}

	.custom-dropdown::before,
	.custom-dropdown::after {
		content: "";
		position: absolute;
		pointer-events: none;
	}

	.custom-dropdown::after { /*  Custom dropdown arrow */
		content: "\25BC";
		height: 1em;
		font-size: .625em;
		line-height: 1;
		right: 1.2em;
		top: 50%; margin-top: -.5em;
	}

	.custom-dropdown::before { /*  Custom dropdown arrow cover */
		width: 2em;
		right: 0; top: 0; bottom: 0;
		border-radius: 0 3px 3px 0;
	}

	.custom-dropdown__select[disabled] {
		color: rgba(0,0,0,.3);
	}

	.custom-dropdown.custom-dropdown--disabled::after {
		/* color: rgba(0,0,0,.1); */
		color: white;
	}

	/* blue dropdown style */
	.custom-dropdown--blue::before {
		background-color: #5c75ae;
		border-left: 1px solid #5c75ae;
	}

	.custom-dropdown--blue::after {
		color: white;
	}

	/* FF only temp fix */
	@-moz-document url-prefix() {
		.custom-dropdown__select 			 { padding-right: .9em }
		.custom-dropdown--large .custom-dropdown__select { padding-right: 1.3em }
		.custom-dropdown--small .custom-dropdown__select { padding-right: .5em }
	}
}


/******************* 2) Module rules (end) ******************/


/******************* 3) Layout rules (start) ******************/

/*////////// i. Landing page (start)////////////*/

/*========= (a) navbar (start) ========*/
#navbar {
  background: rgb(45, 76, 134);;
  position: fixed;
  width: 100%;
  top: 0;
	z-index: 30;
	transition: all .3s;
	box-shadow: none;
}

@-webkit-keyframes autofill {
	to {
		background: transparent;
		color: white;
	}
}

#navbar input{
	-webkit-animation-name: autofill;
      -webkit-animation-fill-mode: both;
}

#navbar input{
  background: transparent!important;
}


#navbar input:-webkit-autofill, 
#navbar input:-webkit-autofill:hover, 
#navbar input:-webkit-autofill:focus, 
#navbar input:-webkit-autofill:active{
	transition-delay:99999s;
	-webkit-transition-delay: 99999s;
	background-color: transparent!important;
}

#navbar.navbar-shadow{
	box-shadow: 0 2px 2px 3px rgba(0,0,0,.2);
}

.triangle-right {
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid white;
  margin: 0px 10px 0px 10px;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  display: block;
}

.triangle-down {
  -webkit-transform: rotateZ(90deg);
  -ms-transform: rotate(90deg);
  transform: rotateZ(90deg);
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid white;
  margin: 0px 10px 0px 10px;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  display: block;
}

.mobile-dropdown-btn{
  padding: 15px 10px;
  border-right: 1px solid #425e90;
  cursor: pointer;
  background: none;
  border-left: none;
  border-top: none;
  border-bottom: none;
  float: left;
	margin-right: 10px;
	transition: .3s all;
}

.navbar__desktop__form {
  display: none;
}

.form__modal{
  display: none;
  overflow: hidden;
}

#navbar small {
  padding: 10px;
}

.navbar__logo img {
  width: 250px;
}

.navbar-mobile__hamBtn {
  position: absolute;
  right: 10px;
  top: 25px;
  cursor: pointer;
}

.navbar-mobile__hamBtn span {
  border: 1.5px solid white;
  width: 25px;
  margin: 5px 0 5px 0;
  display: block;
  -webkit-transition: .3s;
  -o-transition: .3s;
  transition: .3s;
  cursor: pointer;
}

.header__btn-cross {
  top: 35px;
}

.header__btn-cross span:nth-child(1) {
  -webkit-transform: rotateZ(45deg);
  -ms-transform: rotate(45deg);
  transform: rotateZ(45deg);
}

.header__btn-cross span:nth-child(2) {
  -webkit-transform: rotateZ(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotateZ(-45deg);
  position: relative;
  top: -8px;
}

.header__btn-cross span:nth-child(3) {
  display: none;
}

.navbar__nav {
  background: #6180b4;
  width: 0;
  position: fixed;
  right: 0;
  bottom: 0;
  top: 82px;
  overflow: hidden;
  -webkit-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

.navbar__nav.open {
  width: 100%;
  overflow: auto;
  -webkit-transition: all .3s ease;
  -o-transition: all .3s ease;
  transition: all .3s ease;
}

.navbar__nav__menu__item h3 {
  color: #f4f4f4;
  margin-left: 60px;
}

.navbar__nav__menu__item {
  border-top: 1px solid #425e90;
  background: #6180b4;
  width: 100%;
  display: inline-block;
}

.navbar__nav__menu__item a{
  width: auto;
  display: block;
  padding: 10px;
}

.header__nav__menu li {
  border-bottom: 1px solid #f3f3f3;
}

.header__nav__menu li a {
  padding-top: 15px;
  padding-bottom: 15px;
	display: block;
	padding-left: 50px;
}

.header__nav__menu a {
  color: #425e90;
}

.header__nav__menu.open,
.navbar__nav__submenu-content__body.open {
  max-height: 500px;
}

.mobile-dropdown-btn--submenu{
	border: none;
}

.navbar__nav__submenu-content__body li a {
  padding-top: 15px;
  padding-bottom: 15px;
  display: block;
	color: #6180b4;
	padding-left: 83px;
}

.navbar__nav__submenu-content__head {
  border-top: 1px solid #6180b4;
  color: #e4e4e4;
  width: 100%;
  display: inline-block;
}

.navbar__nav__submenu-content__head .mobile-dropdown-btn {
	/* border-right: 1px solid #6180b4; */
	padding-left: 24px;
}

.navbar__nav__submenu.open {
  max-height: 1700px;
}

.navbar__nav__submenu-content__body li {
  border-bottom: 1px solid#f3f3f3;
}

.navbar__nav__submenu-content__head h4,
.navbar__nav__submenu-content__head a {
	padding: 13px;
	margin-left:64px;
	border-left: 1px solid #6180b4;
}

.header__nav__menu,
.navbar__nav__submenu,
.navbar__nav__submenu-content__body {
  max-height: 0;
  overflow: hidden;
  -webkit-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
	background: white;
	-webkit-box-shadow: inset 0px 8px 17px -9px rgba(0,0,0,0.75);
	-moz-box-shadow: inset 0px 8px 17px -9px rgba(0,0,0,0.75);
	box-shadow: inset 0px 8px 17px -9px rgba(0,0,0,0.75);
}

.navbar__nav__submenu{
	 background: #425e90;
}

.navbar__nav__login-tab {
  background: #6180b4;
  border-top: 1px solid #425e90;
  color: white;
  padding-top: 10px;
  padding-bottom: 30px;
  padding-left: 25px;
  display: block;
}

.navbar__nav__login-tab h3 {
  cursor: pointer;
  display: inline;
}

.navbar__mobile__form {
  background: #4368ae;
  width: 100%;
  height: 0;
  bottom: 0;
  left: 0;
  position: fixed;
  overflow: hidden;
  -webkit-transition: all .3s ease-in-out;
  -o-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.navbar__mobile__form.open {
  height: 100%;
}

.navbar__mobile__form__close-btn span {
  border: 2px solid white;
  width: 25px;
  cursor: pointer;
}

.login_error_msg{
	text-align:center;
  color: orange;
  margin: 5px 0;
  display: inline-block;
	font-size: 14px;
}

.navbar__mobile__form__close-btn {
  position: absolute;
  top: 0;
  margin-left: auto;
  margin-right: auto;
  margin-top: 25px;
  right: 0;
  left: 0;
  padding: 10px;
  cursor: pointer;
  text-align: center;
  width: 35px;
}

.navbar__mobile__form__close-btn img {
  width: 35px;
}

.navbar__mobile__form__container img {
  max-width: 300px;
  margin: 10px auto 50px auto;
}

.navbar__mobile__form__container input::-webkit-input-placeholder {
  color: #bdbdbd;
}

.navbar__mobile__form__container input:-ms-input-placeholder {
  color: #bdbdbd;
}

.navbar__mobile__form__container input::-ms-input-placeholder {
  color: #bdbdbd;
}

.navbar__mobile__form__container input::placeholder, #navbar .form__modal-body input::placeholder {
  color: #bdbdbd;
}

.navbar__mobile__form__container input:placeholder-shown,
.navbar__desktop__form input:placeholder-shown, 
.form__modal-body input:placeholder-shown {
  color: white;
  font-style: italic;
}

.navbar__mobile__form__container input {
	height: 33px;
	border-radius: 0;
  margin-top: 15px;
  /* background: transparent; */
  padding-left: 5px;
  font-size: 16px;
  outline: none;
	color: white;
	border-color: #e3e3e3;
	border-width: 0px 0px .5px 0px;
	border-style: solid;
}

.navbar__mobile__form__container  {
  padding: 15px;
}  

.navbar__mobile__form__content{
  display: block;
  width: 350px;
  padding: 20px;
  margin: 0 auto;
  position: absolute;
	top: 50%;
	left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.navbar__mobile__form__content input {
  width: 100%;
}

.navbar__mobile__form__content button{
  display: block;
  width: 100%;
}

.navbar__mobile__form__container a {
  color: #e3e3e3;
  margin: 20px 0;
  display: block;
  text-align: left;
}

.navbar__mobile__form__container p {
  text-align: left;
}

.navbar__mobile__form__container a:last-child {
  color: #83ce44;
  display: inline-block;
}

.navbar__mobile__form__container hr {
  border: .5px solid #6180b4;
}

.navbar__nav__social.social-logos {
  padding-left: 20px;
  display: block;
}

.social-logos a {
  height: 40px;
  background: white;
  width: 40px;
  text-align: center;
  border-radius: 50%;
  color: #6180b4;
  margin-right: 10px;
  display: inline-block;
  line-height: 40px
}
/*mobile view iso logo*/
.social-logos a.ISOlogo {
		/*width: 200px;
		height: 139px;*/
		width:100px;
		height:70px;
		background: none;
		text-align: right;
		/*position: relative;
		top:10px;
		right:50px; 
		margin-right: 10px;*/
		float: right;
		display: inline-block;
		
		position: relative;
		top: -20px;
	
	}
/*========= (a) header (end) ========*/
/*========= (a-1) private navbar (start) ========*/
#navbar .private-header{
	display: none;
}

.navbar__nav-private-profile{
	display: block;
	color: white;
	text-align: center; 
	padding: 50px 0; 
	background-image: linear-gradient(to bottom right, #425e90, rgb(45, 76, 134));
}

.button--private{
	display: block;
	margin-top: 20px;
	width: 109px; 
	margin-left:25px; 
	text-align: center
}

.navbar__nav-private-profile__links{
	margin-top:20px;
}

.navbar__nav-private-profile__links a {
	font-size:20px;
	margin: 0 20px; color: #83ce44;
}

.button--private a:hover{
	background: white;
	color: green;
}
/*========= (a-1) private header (end) ========*/



/*======== (g) addresses (start) =========*/
.addresses {
  background: #456aac;
  color: white;
  padding: 20px 0;
}

.addresses .branchTitle {
	font-size: 20px;
	font-weight: 700;
}

.addresses__address__content {
  max-width: 350px;
  line-height: 25px;
	margin: 0 auto;
	text-align: center;
}

.addresses__address {
  margin: 10px;
  display: block;
	text-align: left;
}

.addresses__container {
  text-align: center;
}

.addresses__address__content h4 {
  margin-bottom: 10px;
}
/*========= (g) addresses (end) ==========*/

/*========= (h) footer (start) ===========*/
.footer {
  background: #20457d;
  color: white;
  padding-top: 20px;
  padding-bottom: 10px;
}

.footer__content__top {
  text-align: center;
  display: block;
  margin: 0 auto;
}

.footer li a {
  color: white;
}

.footer__logo img {
  width: 70px;
}

.footer .social-logos a {
  color: #20457d;
}

.footer__address {
  max-width: 247px;
  padding-left: 5px;
  margin-left: 5px;
  display: inline-block;
  text-align: left;
}

.footer__menu {
  padding-top: 20px;
  text-align: center;
}

.footer__menu li {
  border-right: 2px solid white;
  padding: 0 10px;
  margin: 10px 0;
  display: inline-block;
}

.footer__menu li:last-child {
  border-right: none;
}

.footer__services__body {
  width: 100%;
}
.footer__services {
  text-align: center;
}

.footer__services ul {
  padding: 20px;
  width: 219px;
  line-height: 25px;
  display: inline-block;
  vertical-align: top;
  text-align: left;
}

.footer__services h3 {
  padding-bottom: 10px;
}

.menu-line {
  border-top: 1px solid #425e90;
  margin: 5px 0;
}

.footer li a.active {
  font-weight: bold;
  color: #83ce44;
}

.footer__copyright {
  text-align: center;
  color: #c5c5c5;
}

.footer__copyright--responsive {
  display: none;
}

.footer__nav__social{
  text-align: center;
  margin-bottom: 10px;
}
	

.footer__address a{
 color: white;
}
/*========= (h) footer (end) =============*/

/*////////// i. Landing page (end)////////////*/


/*==================================================
    						MOBILE STYLING (end)
====================================================*/

@media only screen and (min-width: 768px){


	/********* 4) Desktop Lading page classes (start) *********/
	.hero h1 {
		font-size: 50px;
		text-align: left;
	}

	.button:hover {
		background: white;
		color: rgb(45, 76, 134);
		font-weight: 700;
	}

	@-webkit-keyframes autofill {
		to {
			background: transparent;
			color: white;
		}
	}
	
	#navbar input{
		-webkit-animation-name: autofill;
				-webkit-animation-fill-mode: both;
	}

	#navbar input{
		background: transparent!important;
	}
	
	#navbar input:-webkit-autofill, 
	#navbar input:-webkit-autofill:hover, 
	#navbar input:-webkit-autofill:focus, 
	#navbar input:-webkit-autofill:active{
		transition-delay:99999s;
		-webkit-transition-delay: 99999s;
		background-color: transparent!important;
	}

/********* 4) Desktop Lading page classes (end) *********/

/****************************************************
                7.  Address desktop view (start)
******************************************************/

.addresses__address {
  margin: 10px;
  display: inline-block;
	vertical-align: top;
}

.addresses__address a {
	color: #83ce44;;
}

.addresses__address a:hover{
	color: white;
}

.addresses__address__content {
	text-align: left;
}


/****************************************************
                7.  Address desktop view (end)
******************************************************/
}

@media only screen and (min-width: 1024px) {
	#navbar {
		background: rgb(45, 76, 134, 0.5);
	}

	@-webkit-keyframes autofill {
		to {
			background: transparent;
			color: white;
		}
	}

	.header__form__desktop__btns__bottom{
		display: inline-block;
	}
	
	.navbar__desktop__form-btns__top{
		display: block;
		text-align: left;
		float: left;
	}

	#navbar input{
		-webkit-animation-name: autofill;
				-webkit-animation-fill-mode: both;
	}

	#navbar input{
		background: transparent!important;
	}
	
	#navbar input:-webkit-autofill, 
	#navbar input:-webkit-autofill:hover, 
	#navbar input:-webkit-autofill:focus, 
	#navbar input:-webkit-autofill:active{
		transition-delay:99999s;
		-webkit-transition-delay: 99999s;
		background-color: transparent!important;
	}

	.navbar__nav-private-profile{
		display: none;
	}

	.button--private{
		display: none;
	}

		/*========= (a.1) private header (start) ========*/
		#navbar .private-header{
			display: block;
			color: white;
			float: right;
			padding: 17px 0px;
		}
		#navbar .private-header a {
			color: white;
			font-size: 25px;
			transition: all .2s;
		}

		#navbar.navbar-opacity{
			background: rgb(45, 76, 134, 0.8);
		}
		
		#navbar .private-header a:hover{
			color: #83ce44;
		}
		#navbar .private-header--nav{
			text-align: left;
			font-weight: 700;
			padding: 28px 31px;
			line-height: 25px;
		}

		#navbar .private-header--nav a {
			display: block;
			color: #83ce44;
			font-size: 18px;
			transition: all .2s;
		}

		#navbar .private-header--nav a:hover{
			color: white;
		}
	
	/*========= (a.1) private header (end) ========*/
	
	
	.hero_title span{
		font-size: 30px;
	}
	
			/*====================  
		7.1) bg color,
		logo, hamburger btn,
		X btn [Hide mobile Elements]
		(start) ==================== */
		#navbar .navbar__mobile__form__close-btn,
		#navbar .mobile-dropdown-btn,
		#navbar .navbar__nav__login-tab,
		#navbar .navbar__nav__social.social-logos ,
		#navbar .navbar-mobile__hamBtn {
				display: none;
			}
	
			#navbar	.navbar__mobile__form {
				background: none;
			}
			/*==========================
		7.1) bg color, 
		logo, hamburger btn, 
		X btn [Hide mobile Elements] 
		(end) ===================== */
	
	
			/*====  7.4) navbar (start) ==== */
	
			#navbar .navbar__nav{
				background: none;
				width: 100%;
				position: static;
				right: auto;
				bottom: auto;
				top: auto;
				overflow: visible;
				-webkit-transition: all .3s ease;
				-o-transition: all .3s ease;
				transition: all .3s ease;
				display: inline-block;
				vertical-align: top;
				max-width:417px;
				margin: 0 auto;
				text-align: center;
			}
	
			#navbar .navbar{
				text-align: right;
			}
	
			#navbar .navbar__logo img{
				width: 290px;
				padding: 10px 0;
				float: left;
			}
	
			#navbar .navbar__nav.open {
				width: auto;
			} 
	
			/*====  7.4) navbar (end) ==== */
	
				/*====  7.5) navbar menu (start) ==== */
			#navbar .header__nav__menu{
			max-height: none;
			position: absolute;
			display: none;
			background: white;
		}
	
		#navbar .navbar__nav__menu__item h3{
			font-weight: 400;
			font-size: 20px;
		}
	
		#navbar .navbar__nav__menu__item a{
			padding: 44px 0px;
			margin: auto;
			transition: all .3s ease;
		}
		#navbar .navbar__nav__menu__item a:hover{
			background: #6180b4;
			transition: all .3s ease;
		}
		/*====  7.5) navbar menu (end) ==== */
	
			/*===  7.6) navbar submenu (start) ==== */
		#navbar .navbar__nav__submenu{
			position: absolute;
			display: none;
		}
		#navbar .navbar__nav__submenu-content__body{
			position: static;
			border-top: 1px solid #425e90;
			padding-top: 10px;
			margin-top: 10px;
			-webkit-box-shadow: none;
			-moz-box-shadow: none;
			box-shadow: none;

		}
		#navbar .navbar__nav__submenu h4{
			padding-left:0;
			font-weight: 700;
		}
		#navbar .navbar__nav__submenu, 
		#navbar .navbar__nav__submenu-content__body{
				max-height: none;
		}
		#navbar .navbar__nav__menu__item, 
		#navbar .navbar__nav__submenu-content__head, 
		#navbar .navbar__nav__submenu-content__body li{
			border: none;
			background: none;
			padding: 0;
		}
		#navbar .navbar__nav__submenu-content__body li a, 
		#navbar .header__nav__menu li, 
		#navbar .header__nav__menu li a{
				padding: 0;
				border: none;
		}
		#navbar .navbar__nav__submenu-content__body li a, 
		#navbar .header__nav__menu li a{
			line-height: 25px;
			transition: all.3s;
			display: inline-block;
		}
		#navbar .navbar__nav__submenu{
			width: 918px;
			padding: 20px;
			position: absolute;
			margin: 0 auto;
			left: 0;
			right: 0;
			border-top: 44px solid #83ce44;
			
		}
	
		#navbar .header__nav__menu{
			overflow: visible;
			width: auto;
			padding: 10px 28px;
			margin: 0 -80px;
			border-top: 44px solid #83ce44;
		}
	
		#navbar .navbar__nav__menu__item h3 {
			padding: 0;
		}
	
		#navbar .navbar__nav__dropdown:hover .header__nav__menu{
			display: block;
		}
		#navbar .navbar__nav__dropdown:hover .navbar__nav__submenu{
			display: block;
			text-align: center;
		} 
		#navbar .navbar__nav__submenu-content{
			width:280px;
			width: 280px;
			display: inline-block;
			margin: 0 5px;
			vertical-align: top;
			text-align: left;
		}
		#navbar .navbar__nav__submenu, 
		#navbar .header__nav__menu{
			box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
			transition: all .3s ease-in-out;
			text-align: left;
			background: white;
		}
		#navbar .navbar__nav__submenu li a:hover, 
		#navbar .header__nav__menu li a:hover{
			padding-left: 5px;
			color: #20457d;
			font-weight: bold;
		}

		.navbar__nav__submenu-content__head h4{
			margin-left:0;
			border-left: none;
		}

		#navbar .navbar__nav__submenu h4{
			font-size: 20px;
			font-weight: 400;
			color: #425e90;
		}
	
		#navbar .navbar__nav__menu__item h3 {
			margin: 0 30px;
		}
	
		#navbar .navbar__nav__submenu-content:nth-child(1n+4){
			margin-top: 10px;
		}
		/*==  7.6) navbar submenu (end) === */
	
			/*==  7.7) navbar navbar__nav__dropdown (start) === */
			#navbar .navbar__nav__dropdown{
			position: static;
			display: inline-block;
		}
	
		#navbar .navbar__nav__dropdown:hover 
		#navbar .navbar__nav__menu__item a{
			background: #6180b4;
		}
		
	
		#navbar .navbar__nav__dropdown:hover .menu-triangle{
			display: block;
		}
		/*===  7.7) navbar navbar__nav__dropdown (end) === */ 
		/*=== 7.8) top border menu triangle (start) === */
		#navbar .menu-triangle {
			width: 0;
			height: 0;
			border-left: 25px solid transparent;
			border-right: 25px solid transparent;
			border-bottom: 45px solid white;
			position: absolute;
			z-index: 4;
			display: none;
			margin-left: 40px;
		}
	
		/*=== 7.8) top border menu triangle (end) === */
	
		/*=== 7.9) form pop up background hidden by default (start) === */
		#navbar .navbar__mobile__form__container {
			display: none;
			position: fixed;
			z-index: 50;
			width: 100%;
			height: 100%;
			overflow: auto;
			background-color: rgb(0, 0, 0);
			background-color: rgba(0, 0, 0, 0.4);
			overflow: auto;
			left: 0;
			top: 0;
			align-items: center;
			justify-content: center;
		}
	
		/* form pop up background becomes visible 
		when adding the open class in javascript */
	
	
		/*=== 7.9) form pop up background (end) === */
				/* Add Animation */
		@-webkit-keyframes animatetop {
			from {top:-300px; opacity:0} 
			to {top:0; opacity:1}
		}
	
		@keyframes animatetop {
			from {top:-300px; opacity:0}
			to {top:0; opacity:1}
		}
	/* header nav form height and position are set to it's default values*/
	#navbar .navbar__mobile__form{
			height: auto;
			position: static;
			display: none;
		}
		/* pop up form */
		#navbar .navbar__mobile__form__content{
			width: 350px;
			height: 450px;
			background: #4368ae;
			padding: 20px;
			box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
			-webkit-animation-name: animatetop;
			-webkit-animation-duration: 0.4s;
			animation-name: animatetop;
			animation-duration: 0.4s;
			position: relative;
			border: 1px solid #6180b4;
		}
	/* header nav form (desktop view) */
	#navbar	.navbar__desktop__form {
			padding: 4px 0;
			display: block;
			text-align: right;
			float: right;
		}
	/* header nav form email and password fields*/
	#navbar	.navbar__desktop__form input {
			border: 0;
			border-radius: 0;
			border-bottom: 1px solid #cccccc;
			min-width: 250px;
			padding: 5px;
			outline: none;
			color: white;
			display: block;
		}
	
		/* header nav form buttons */
		#navbar .navbar__desktop__form button{
			border: none;
			background: none;
			outline: none;
			color: #83ce44;
			font-size: 16px;
			cursor: pointer;
		}
	
		#navbar .navbar__desktop__form button:hover{
			color: #f2f2f2;
		}

		#navbar .header__form__desktop__btns__bottom a:hover{
			color: grey!important;
		}
	
		#navbar .navbar__desktop__form input::placeholder{
			color: #cccccc;
		}
		#navbar .navbar__desktop__form input:-ms-input-placeholder{
			color:#cccccc;
		}
	
		#navbar .header__form__desktop__btns__bottom a{
			display: inline-block;
		}
	
		#navbar .navbar__desktop__form-btns{
			margin-top: 5px;
			display:block;
		}
	
	/* header nav form links */
		#navbar .navbar__desktop__form a {
			color: white;
			font-size: 12px;
		}
	
		#navbar .navbar__desktop__form a:first-child{
			color: #f2f2f2;
			font-size: 16px;
		}
		#navbar .navbar__desktop__form a:last-child {
			padding-top: 5px;
		}

		#navbar .navbar__desktop__form a:first-child:hover,
		#navbar .navbar__desktop__form a:last-child:hover{
			color:#83ce44;
		}
		
		#navbar .navbar__desktop__form-btns__top input{
			border: none;
			width: auto;
			min-width: 0;
			padding: 0;
			font-size: 15px;
			cursor:pointer;
		}
	
	
	
		/******************  Desktop Form Modal  **************************/
	
		/* The Modal (background) */
		#navbar .form__modal {
			display: none; /* Hidden by default */
			position: fixed; /* Stay in place */
			z-index: 5; /* Sit on top */
			padding-top: 112px; /* Location of the box */
			left: 0;
			top: 0;
			width: 100%; /* Full width */
			height: 100%; /* Full height */
			overflow: auto; /* Enable scroll if needed */
			background-color: rgb(0,0,0); /* Fallback color */
			background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
		}
		
		#navbar .form__modal.open{
			display: block;
		}
		
		/* Modal Content */
		#navbar .form__modal-content {
			position: relative;
			background-color: rgb(45, 76, 134);
			margin: auto;
			padding: 0;
			width: 350px;
			-webkit-box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
							box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
			-webkit-animation-name: animatetop;
			-webkit-animation-duration: 0.4s;
			animation-name: animatetop;
			animation-duration: 0.4s
		}
		
		#navbar .form__modal-content img{
			width: 250px;
			padding: 20px 0 60px 0;
			margin: 0 auto;
		}
		
		/* Add Animation */
		@-webkit-keyframes animatetop {
			from {top:-300px; opacity:0} 
			to {top:0; opacity:1}
		}
		
		@keyframes animatetop {
			from {top:-300px; opacity:0}
			to {top:0; opacity:1}
		}
		
		#navbar .close:hover,
		#navbar .close:focus {
			color: #000;
			text-decoration: none;
			cursor: pointer;
		}
		
		#navbar .form__modal-body {
			padding: 2px 16px;
			text-align: center;
		}
		
		#navbar .form__modal-body input {
			font-size: 16px;
			border-top: none;
			border-left: none;
			border-right: none;
			border-bottom: 1px solid white;
			padding: 10px;
			margin-top: 10px;
			outline: none;
		}

		#navbar .form__modal-body input::-webkit-input-placeholder {
			font-size: 16px;
		 
		}
		
		#navbar .form__modal-body input:-ms-input-placeholder {
			font-size: 16px;
		 
		}
		
		#navbar .form__modal-body input::-ms-input-placeholder {
			font-size: 16px;
		 
		}
		
		#navbar .form__modal-body input::placeholder {
			font-size: 16px;
		 
		}
		
		#navbar .form__modal-footer{
			margin-bottom: 50px;
			line-height: 50px;
			text-align: left;
		}
		
		#navbar .form__modal-body a{
			color: white;
		}
		
		#navbar .form__modal-body button{
			background: #6383b5;
			border: none;
			padding: 10px 0;
			width: 45%;
			color: white;
		}
		#navbar .form__modal-body input {
			color: white;
			width: 300px;
		}
		
		#navbar .form__modal-body__btns button:first-child{
			background: #83ce44;
			float: left;
		}
		
		#navbar .form__modal-body__btns button:last-child{
			background: #999;
			float:right;
		}
		
		#navbar .form__modal-footer span{
			color: #83ce44;
		}
		
		#navbar .form__modal-footer hr{
			border-color: #6383b5;
		}
		
		#formModalErrorMsg{
			text-align: center;
			color: orange;
			padding-top:10px;
		}
		
	/****************************************************
						6. Desktop Header Media Query (end)
	******************************************************/

	/****************************************************
									8. Footer Desktop (start)
	******************************************************/
		
	.footer__content__top {
		text-align: right;
	}

	.footer__services li {
		border-radius: 5px;
	}

	.footer__services a {
		-webkit-transition: all .2s;
		-o-transition: all .2s;
		transition: all .2s;
		display: block;
		padding: 2px 5px;
	}

	.footer__services a:hover {
	background: #83ce44;
	}

	.footer__services ul {
	padding: 20px;
	width: auto;
	line-height: 25px;
	}

	/* services links */
	.footer__menu a {
	-webkit-transition: all .2s;
	-o-transition: all .2s;
	transition: all .2s;
	}

	.footer__menu a:hover {
	color: #83ce44;
	}

	.footer__address {
	border-left: 2px solid white;
	padding-left: 15px;
	margin-left: 15px;
	display: inline-block;
	}

	/* copyright is hidden (different location in mobile view)*/
	.footer__copyright {
	display: none;
	}

	/* copyright (desktop view) becomes visible*/
	.footer__copyright--responsive {
	text-align: right;
	margin: 15px 0 0 10px;
	display: inline-block;
	vertical-align: top;
	}

	/* logo */
	.footer__logo img {
	width: 90px;
	}
	/*===== 7.2) social logos (start) ======= */

	.footer__nav__social{
	padding-bottom: 30px;
	/*text-align: right;*/
	text-align: center;
	}

	.footer__nav__social a {
	color: #20457d;
	}

	.footer__nav__social a:hover {
	background: #83ce44;
	color: white;
	-webkit-transition: all .2s;
	-o-transition: all .2s;
	transition: all .2s;
	}
	  /****************************************************
									8. Footer Desktop (end)
		******************************************************/
		
		.addresses__container{
			display: flex;
			justify-content: space-around;
			font-size: 15px;
		}
	
		.social-logos a.ISOlogo {
		width: 200px;
		height: 139px;
		/*width:100px;
		height:70px;*/
		background: none;
		text-align: right;
		/*position: relative;
		top:10px;
		right:50px; 
		margin-right: 10px;*/
		float: right;
		display: inline-block;
		
		position: relative;
		top: -50px;
	
	}
}