body {
	background-color: #f4f5f6;
	
	font: 13px 'Open Sans', Arial, helvetica, sans-serif;
	/*color: #9aa6af;*/
	text-rendering: optimizelegibility;
	
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
	
	-moz-tap-highlight-color:rgba(0,0,0,0); 
	-moz-text-size-adjust: none;
	-moz-font-smoothing: antialiased;
	
	-ms-tap-highlight-color:rgba(0,0,0,0); 
	-ms-text-size-adjust: none;
	-ms-font-smoothing: antialiased;
}
a {text-decoration: none;}

.container_mobile {
	overflow: hidden;
	background-color: #f4f5f6;
	

/*  Prevents Flickering  */
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
}




header_mobile {
	height: 60px;
	position: relative;
	/*background-color: #3fa3d1;*/
	background-color:#F2F2F2;
}
header_mobile h1 {
	color: #9aa6af;
	text-align: left;
	font-size: 27px;
	line-height: 60px;
	font-weight: bold;
	padding-left: 20px;
}

.burger_mobile {
	position: absolute;
	/*float: left;*/
	float:right;
	padding: 0px 10px;
	top: 4px;
	/*left: 10px;*/
	right:0px;
	display: none;
	list-style-type: none;
}
.burger_mobile li {
	width: 30px;
	height: 4px;
	/*background-color: #fff;*/
	background-color:#000080;
	border-radius: 3px;
	margin: 5px 0;
}
.burger_mobile.open li {background-color: #d9dde1;}

.burger_desktop {
	position: absolute;
	/*float: left;*/
	float:right;
	/*padding: 10px;*/
	padding:0px 10px;
	top: 4px;
	/*left: 10px;*/
	right:0px;
	display: none;
	list-style-type: none;
	cursor:pointer;
}


.burger_desktop li {
	width: 30px;
	height: 4px;
	/*background-color: #fff;*/
	background-color:#000080;
	border-radius: 3px;
	margin: 4px 0;
}
.burger_desktop.open li {

background-color: #d9dde1;

}


nav_mobile {
	position: absolute;
	top: 0;
	right: 5px;
}
nav_mobile li {
	float: left;
	
	display: inline-block;
}
nav_mobile li a {
	font-size: 11px;
	color: #9aa6af;
	padding: 24px 15px;
	
	display: block;
}
nav_mobile li a:hover {color: #000;}




/*  Removable CSS  */

.header-section_mobile,
.body-section_mobile,
.footer-section_mobile 
{padding: 0px;}

.header-section_mobile {background-color: #ffffff;}
.body-section_mobile {background-color: #f4f5f6;}
.footer-section_mobile {background-color: #dadee1;}
.placefiller_mobile {
	text-align: center;
	/*font-size: 20px;
	border: 1px dashed rgba(190, 196, 202, 0.5);*/
}
.header-section_mobile .placefiller_mobile {line-height: 300px;}
.body-section_mobile .placefiller_mobile {line-height: 900px;}
.footer-section_mobile .placefiller_mobile {
	line-height: 200px;
	border: 1px dashed rgba(190, 196, 202, 0.9);
}





header_mobile {
	height: 60px;
	z-index: 2;
	/*background-color: #3fa3d1;*/
	/*background-color:#F2F2F2;*/
	background-color:#f4f5f6;
	
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	
		/* starting point */
	-webkit-transform: translate3d(0,0,0);
	-moz-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
header_mobile h1 {
	color: #ffffff;
	text-align: center;
	padding-left: 0;
	display: block;
}
.burger_mobile {display: block;}


/*  Nav Drawer Layout  */
nav_mobile {position: relative;}

nav_mobile ul {
	height: 100%;
	overflow-y: auto;
}
nav_mobile li {
	display: block;
	float: none;
}
nav_mobile li a {
	padding: 22px 25px;
	letter-spacing: 3px;
	font-size: 14px;
	text-align:right;
}
nav_mobile li a.logo {
	display: none;
}
nav_mobile li a.active {
	color: #fff;
	background-color: #141e23;
}
nav_mobile li a:hover {
	color: #fff;
	background-color: #19252c;
}
nav_mobile li:first-child a.active,
nav_mobile li:first-child a:hover 
{border-radius: 10px 0 0 0;}

.header-section_mobile {margin-top: 60px;}


/* NAVIGATION ANNIMATION */
nav_mobile {
	width: 93%;
	height: 100%;
	position: fixed;
	right: 0;
	top: 0;
	margin: 0;
	background-color: #1d2d35;
	border-radius: 8px;
	
	/* starting point */
	opacity: .3;
	-webkit-transform: translate3d(-5%,0,0)scale(.97);
	-moz-transform: translate3d(-5%,0,0)scale(.97);
	transform: translate3d(-5%,0,0)scale(.97);
}

/*Nav Expanding Open Effect*/
nav_mobile.open_mobile {
	opacity: 1;

	-webkit-transform: translate3d(0,0,0)scale(1);
	-webkit-animation: slideIn .35s ease-in-out;
	
	-moz-transform: translate3d(0,0,0)scale(1);
	-moz-animation: slideIn .35s ease-in-out;
	
	transform: translate3d(0,0,0)scale(1);
	animation: slideIn .35s ease-in-out;
}
@-webkit-keyframes slideIn {
	0%       {opacity: .3;
				-webkit-transform: translate3d(-5%,0,0)scale(.97);}
	100%  {opacity: 1;
				-webkit-transform: translate3d(0,0,0)scale(1);}
}
@-moz-keyframes slideIn {
	0%      {opacity: .3;
				-moz-transform: translate3d(-5%,0,0)scale(.97);}
	100%  {opacity: 1;
				-moz-transform: translate3d(0,0,0)scale(1);}
}
@keyframes slideIn {
	0%      {opacity: .3;
				transform: translate3d(-5%,0,0)scale(.97);}
	100%  {opacity: 1;
				transform: translate3d(0,0,0)scale(1);}
}

/*Nav Shrinking Closed Effect*/
nav_mobile.close_mobile {
	opacity: .3;
	
	-webkit-transform: translate3d(-5%,0,0)scale(.97);
	-webkit-animation: slideOut .3s ease-in-out;
	
	-moz-transform: translate3d(-5%,0,0)scale(.97);
	-moz-animation: slideOut .3s ease-in-out;
	
	transform: translate3d(-5%,0,0)scale(.97);
	animation: slideOut .3s ease-in-out;
}
@-webkit-keyframes slideOut {
	0%      {opacity: 1;
				-webkit-transform: translate3d(0,0,0)scale(1);}
	100%  {opacity: .3;
				-webkit-transform: translate3d(-8%,0,0)scale(.97);}
}
@-moz-keyframes slideOut {
	0%      {opacity: 1;
				-moz-transform: translate3d(0,0,0)scale(1);}
	100%  {opacity: .3;
				-moz-transform: translate3d(-8%,0,0)scale(.97);}
}
@keyframes slideOut {
	0%      {opacity: 1;
				transform: translate3d(0,0,0)scale(1);}
	100%  {opacity: .3;
				transform: translate3d(-8%,0,0)scale(.97);}
}



/* CONTENT ANNIMATION */
.content_mobile {
	/* starting point */
	-webkit-transform: translate3d(0,0,0);
	-moz-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	z-index: 1;
}

/*Content Sliding Open Effect*/
header_mobile.open_mobile,
.content_mobile.open_mobile 
{   
	-webkit-transform: translate3d(-240px,0,0);
	-webkit-animation: open .5s ease-in-out;
	
	-moz-transform: translate3d(-240px,0,0);
	-moz-animation: open .5s ease-in-out;
	
	transform: translate3d(-240px,0,0);
	animation: open .5s ease-in-out;
}
@-webkit-keyframes open {
	0%      {-webkit-transform: translate3d(0,0,0);}
	70%    {-webkit-transform: translate3d(-260px,0,0);}
	100%  {-webkit-transform: translate3d(-240px,0,0);}
}
@-moz-keyframes open {
	0%      {-moz-transform: translate3d(0,0,0);}
	70%    {-moz-transform: translate3d(-260px,0,0);}
	100%  {-moz-transform: translate3d(-240px,0,0);}
}
@keyframes open {
	0%      {transform: translate3d(0,0,0);}
	70%    {transform: translate3d(-260px,0,0);}
	100%  {transform: translate3d(-240px,0,0);}
}

/*Content Sliding Closed Effect*/
header_mobile.close_mobile,
.content_mobile.close_mobile 
{
	-webkit-transform: translate3d(0,0,0);
	-webkit-animation: close .3s ease-in-out;
	
	-moz-transform: translate3d(0,0,0);
	-moz-animation: close .3s ease-in-out;
	
	transform: translate3d(0,0,0);
	animation: close .3s ease-in-out;
}
@-webkit-keyframes close {
	0%      {-webkit-transform: translate3d(-240px,0,0);}
	100%  {-webkit-transform: translate3d(0,0,0);}
}
@-moz-keyframes close {
	0%       {-moz-transform: translate3d(-240px,0,0);}
	100%  {-moz-transform: translate3d(0,0,0);}
}
@keyframes close {
	0%       {transform: translate3d(-240px,0,0);}
	100%  {transform: translate3d(0,0,0);}
}



/* Style the navigation bar */
.navbar_2 {
  width: auto;
 /* background-color: #555;*/
  overflow: auto;
}

/* Navbar links */
.navbar_2 a {
  float: left;
  text-align: center;
  padding: 20px;
  /*color: white;*/
  color:#000080;
  
  text-decoration: none;
  font-size: 14px;
}

/* Navbar links on mouse-over */
.navbar_2 a:hover {
  /*background-color: #19252c;*/
  background-color:#D1D1D1;
}

/* Current/active navbar link */
.active {
  background-color: #D1D1D1;
}

/* Add responsiveness - will automatically display the navbar vertically instead of horizontally on screens less than 500 pixels */
@media screen and (max-width: 760px) {
  .navbar_2 a {
      float: left;
	  text-align: center;
	  padding: 14px;
	  /*color: white;*/
	  color:#000080;
	  text-decoration: none;
	  font-size: 17px;
  }
}
/* The Overlay (background) */
.overlay {
  /* Height & width depends on how you want to reveal the overlay (see JS below) */    
  height: 100%;
  width: 0;
  position: fixed; /* Stay in place */
  z-index: 111; /* Sit on top */
  left: 0;
  top: 0;
  background-color:#FFFFFF;
  /*background-color: rgb(0,0,0); *//* Black fallback color */
  /*background-color: rgba(0,0,0, 0.9);*/ /* Black w/opacity */
  overflow-x: hidden; /* Disable horizontal scroll */
  transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

/* Position the content inside the overlay */
.overlay-content {
  position: relative;
  top: 10%; /* 25% from the top */
  width: 100%; /* 100% width */
  text-align: left; /* Centered text/links */
  margin-top: 10px; /* 30px top margin to avoid conflict with the close button on smaller screens */
  padding-left:20%;
}

/* The navigation links inside the overlay */
.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 14px;
  color:#000080;
  display: block; /* Display block instead of inline */
  transition: 0.3s; /* Transition effects on hover (color) */
  line-height:2.22;
}

/* When you mouse over the navigation links, change their color */
.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;
}

/* Position the close button (top right corner) */
.overlay .closebtn {
  position: absolute;
  top: -10px;
  /*right: 10px;*/
  right: 24px;
  font-size: 30px;
}

/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-height: 450px) {
  .overlay a {font-size: 14px}
  .overlay .closebtn {
    font-size: 30px;
    top: 10px;
    right: 0px;
  }
}
@media screen and (min-width: 780px) {
.burger_mobile{
display:none;
}
.burger_desktop{
display:block;
}
}

/* Dropdown Button */
.dropbtn {
  background-color: #3498DB;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}

/* Dropdown button on hover & focus */
.dropbtn:hover, .dropbtn:focus {
  background-color: #2980B9;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  /*background-color: #3fa3d1;*/
  background-color:#F2F2F2;
  min-width: 285px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  top:60px;
      right: 0px;
}

/* Links inside the dropdown */
.dropdown-content a {
 	/*color: #fcf8f8;*/
	color:#000080;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font-size: 14px
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {
/*background-color:#000*/
background-color:#D1D1D1;
}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;}