/*	Default Layout
	92px columns, 24 px gutters, 72 px margins, 1234px total (extra space for scrollbars)
	-------------------------------------------------------------------------------
cols    1    2     3     4     5     6     7     8     9     10     11     12     13
px      68   160   252   344   436   528   620   712   804   896	988    1050   1142 */

.menu-mobile {
	display: none;
}

#left-nav {
	width: 100%;
	height: 50px;
	margin: 0 auto;
    display: flex;
  justify-content: space-between;
}

#left-nav a {
    background-color: #00668c;
	height: 25px;
	color: #fff;
	font-weight: bold;
	font-size:16px;
    margin: 0 3px;
	padding: 5px 0;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    flex: 1;
    text-align: center;
transition: all .5s ease-in-out;

}

#left-nav a:first-child {
    margin-left: 0;
}
#left-nav a:last-child {
    margin-right: 0;
}

#left-nav a {
    color: #fff;
}

#left-nav a:hover {
	background-color: #1A7598;
	height: 35px;
	padding: 10px 0 0 0;
}

.social {
	width: 1200px;
	margin: 0 auto;
	position: relative;
}

.icons{
	position: absolute;
	right: 5px;
	bottom: 0;
}

.icons a {
	transition: all .5s ease-in-out;
} 

.icons a:hover {
	opacity: .7;
}

.action {
    position: relative;
    width: 100%;
    padding: 20px;
    margin: 0 auto;
    border-radius: 5px;
    box-sizing: border-box;
}

.green {
    color: #aecd54;
}
.greenbk {
    background-color: #00668c;
}

.blue {
    background-color: #99c2d1;
}

.bluedk {
    background-color: rgb(0,101,141);
}

.orange {
    background-color: #ff982a;
}

.yellow {
    background-color: #fcc25a;
}

.action p {
    font-family: 'TeXGyreAdventorRegular';
    color: #333;
    width: 75%;
    margin: 0;
    padding: 0;
    font-size: 28px;
    line-height: 38px;
    font-weight: bold;
}

.action-btn {
    position: absolute;
    left: 20px;
    bottom: 20px;
    text-align: center;
    text-shadow: none;
	padding:6px;
	border-radius: 5px;
    width: 180px;
	margin:20px 0 0;
    transition: all .5s ease-in-out;
    
}

.action-btn a {
    color: white;
}

.action-btn:hover {
    background-color: #1A7598;
}

.ebtn {
    display: inline-block;
    padding: 6px 10px;
	border-radius: 5px;
    margin:0 auto;
    transition: all .5s ease-in-out;
    
}

.ebtn a {
    color: white;
}

.ebtn:hover {
    background-color: #1A7598;
}


.shade {
    margin: 40px 0;
    padding: 20px;
}

h1 {
    font-family: 'TeXGyreAdventorBold';
   color: #00668c; 
    padding: 20px 0;
    text-shadow: none;
}

.h2 {
    color: #00668c;
}
.intro {
     
}



/*		10 Column Layout: 992px. 
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */

@media only screen and (min-width: 992px) and (max-width: 1221px) {
    
    	.social {
	width: 940px;
}

#main-highlight {height: 284px;}

#left-nav li a {
	width: 228px;
	font-size:14px;
	margin-left: 2.5px;
}
	
.first {
	width: 228px!important;
}
    
.action p {
    font-size: 25px;
    line-height: 35px;
}

}

/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 991px) {
	
	.social {
	width: 740px;
}
    
#main-highlight {height: 228px;}
    
	#left-nav {
	width: 740px;
}

#left-nav li a {
	width: 183px;
	font-size:14px;
	margin-left: 3.2px;
	}
	
.first {
	width: 181px!important;
}

.action p {
    font-size: 20px;
    line-height: 30px;
}
    
    .action img {
        width: 100px;
        height: 100px;
    }

}

/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */

@media only screen and (max-width: 479px) {

    #main-highlight {height: 91px;}
    
		.social {
	width: 295px;
			text-align: center;
}
	
	.icons{
	position: relative;
		width: 295px;
		text-align: center;
}
	
	.menu-mobile {
		display: block;
	width: 99.6%;
	background-color: rgb(0,101,141); 
		padding:2px 0 2px 2px;
        margin: 0;
	}
	
	#left-nav {
		width: 100%;
	}	
	
	#left-nav li {
		width: 100%;
	}
	
#left-nav li a{
	width: 100%;
	height: auto;
	margin: 0;
	display: block;
	padding: 15px 0;
	border-radius: 0;
	z-index: 1;
	position: relative;
	border-bottom: 1px solid #949ca1;
		
}

	.first {
		border-top: 1px solid #949ca1;
	}
	
	.first {
		width: 100%!important;
	}
	
	#left-nav li a:hover {
	height: auto;
	padding: 15px 0;
}
    
.intro {
  font-size: 16px; 
    line-height: 28px; 
}
    
    .action p {
    font-size: 20px;
    line-height: 30px;
}
    
    .action img {
        width: 100px;
        height: 100px;
    }    
  .h2 {
    margin-top: 10px;
}  
}

/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436   */

@media only screen and (min-width: 480px) and (max-width: 767px) {

    .social {
	width: 453px;
}

#main-highlight {height: 140px;}	

.menu-mobile {
	display: block;
	width: 99.6%;
	background-color: rgb(0,101,141); 
		padding:2px 0 2px 2px;
    margin: 0;
	}
	
#left-nav {
		width: 100%;
	}	
	
	#left-nav li {
		width: 100%;
	}
	
#left-nav li a{
	width: 100%;
	height: auto;
	margin: 0;
	display: block;
	padding: 15px 0;
	border-radius: 0;
	z-index: 1;
	position: relative;
	border-bottom: 1px solid #949ca1;
		
}

	.first {
		border-top: 1px solid #949ca1;
        width: 100%!important;
	}
	
	#left-nav li a:hover {
	height: auto;
	padding: 15px 0;
}
    
    .action p {
    font-size: 20px;
    line-height: 30px;
}
    
    .action img {
        width: 100px;
        height: 100px;
    }

.h2 {
    margin-top: 10px;
}
}