/*
	(c)2012 - visuallizard.com
	
	General Layout Styles.
	Sets major blocking (and minor styles) to genaral elements in the template.
	All can be removed and started from scratch or elemnts can be adjusted individually.
*/

.container {
/*
	Set site width only here and use this class to centre the content in browser window.
	Default width is 960px and can be changed in skeleton.css to maintain resposivnes.
*/	
	width: 90%;
	max-width: 1030px;
	
	margin: 0 auto;
	padding: 0;
	position: relative;

}

/* Header */
	#header {
		clear: both;
		position: relative;
		margin: 0;
		padding: 0;
		
		background-color: #fff;
	}
	
		body.info #header {
			border-bottom: 1px solid #ddd;
		}
		
		body.members #header {
			border-bottom: 1px solid #cb4a30;
		}
	
		#header:before {
			display: block;
			content: " ";
			
			position: absolute;
			top: 0; left: 0;
			height: 100%; width: 100%;
			
			background-image: url(../../img/test-tubes.jpg);
			background-size: cover;
			
			opacity: 0.35;
		}
	
		#header h1 {
			display: block;
			position: relative;
		
			width: 90%;
			max-width: 1030px;
			
			height: 205px;
			margin: 0 auto;
			
			z-index: 2;
		}
		
		#header h1 .logo {
			display: block;
			background: url(../../img/logo-blue.png) left bottom no-repeat transparent;
			background-size: 100% auto;
			text-indent: -99999em;
			cursor: pointer;
			
			width:50%;
			max-width: 394px;
			height: 165px;
		}
		header a:hover,
		header a:focus {
			color: #fff;
			text-decoration: none;
		}
		
		/* Language toggle */
		header .language-toggle {
			position:absolute;
			top: -175px;
			right: 6px;
			z-index: 2;
		}
		
			body.info .language-toggle {
				top: -420px;
			}
			
			body.members .language-toggle {
				top: -220px;
			}
		
		header .language-toggle-option {
			text-transform: lowercase;
			padding: 0 4px 0 0;
		}
			
			header .language-toggle-option:first-child:before {
				display: none;
			}
		
			header span.language-toggle-option {
				color: #cb4a30;
			}
		
			header a.language-toggle-option:hover {
				color: #cb4a30;
			}
		
			header span.language-toggle-option:before,
			header a.language-toggle-option:before,
			header a.language-toggle-option:before:hover {
				content: "/";
				padding-right: 4px;
				color: #000;
				opacity: 0.2;
			}


/* 	Navigations */
	nav {
		display: block;
		position: relative;
		width: 100%;
		margin: 0;
		clear: both;
		
		background-color: #0d2132;
		background-color: rgba(13, 33, 50, 0.9);
				
		border-color: #cb4a30;
		border-style: solid;
		border-bottom-width: 6px;
	}
		
		/* no border on homepage */
		.info nav,
		.members nav { 
			border-bottom-width: 0;
		}
	
		nav ul {
			-webkit-display : flex;
			-moz-display : flex;
			display : flex;
			
			-webkit-flex-direction: row;
			-moz-flex-direction: row;
			flex-direction: row;
			
			position: relative;
			width: 90%;
			max-width: 1030px;
			
			clear: both;
			margin: 0 auto;
			
			padding: 0;
			list-style: none;
		}
			nav ul li {
				display: inline-block;
				position: relative;
				padding: 0;
				margin: 0;
			}
				nav ul li a {
					display: block;
					position: relative;
					padding: 0 12px;
					color: #fff;
					text-transform: uppercase;
					font-size: 1.1em;
					text-decoration: none;
					line-height: 4em;
				}
				
					/* Sign Up */
					
					#nav_li_item_227 {
						display: none;
					}
					
					#access-button {
						position: absolute;
						top: -230px;  
						right: 20px;
						z-index: 10;
				
						padding: 0 20px;
						background-color: #71abe0;
					
						color: #fff;
						line-height: 40px;
						text-transform: uppercase;
					}
					
						#access-button:hover {
							background-color: #cb4a30;
						}
						
						body.info #access-button {
							top: -475px; 
						}
						
						body.members #access-button {
							top: -275px; 
							background-color: #cb4a30;
						}
				
				nav ul li:hover a,
				nav ul li.at a,
				nav ul:hover li.at:hover a,
				#nav_li_item_227.at a,
				#nav_li_item_227 a:hover {
					background-color: #cb4a30;
				}
				
				nav ul:hover li.at a {
					background: none;
				}
		
				
		/* 	Drop-downs */
		nav ul.nav_1 > li > ul {
		  position: absolute;
		  top: 100%;
		  left: -30px;
		  z-index: 1000;
		  float: left;
		  display: none;
		  min-width: 200px;
		  width: 100%;
		  margin: 0;
		  padding: 10px 30px 20px 30px;
		  list-style: none;
		  background-color: #0d2132;
		  background-color: rgba(13, 33, 50, 0.9);
		  border-color: #cb4a30;
		  border-style: solid;
		  border-top-width: 6px;
		}
		nav ul.nav_1 > li:hover > ul {
			display: block;
		}
			nav ul.nav_1 > li >  ul li {
				display: block;
			}
			nav ul.nav_1 > li >  ul a {
				text-transform: none;
				clear: both;
				color: #aed1ec;
				display: block;
				font-weight: normal;
				line-height: 18px;
				padding: 8px 0;
				border-bottom: 1px solid #206aa1;
			}
			
				nav ul.nav_1 > li >  ul li:last-child a {
					border-bottom: none;
				}
			
			nav ul.nav_1 li:hover    ul a,
			nav ul.nav_1 li.at:hover ul a,
			nav ul.nav_1 li.at ul a,
			nav ul.nav_1 li.at ul .at a {
				background: none;
			}
			
			nav ul.nav_1 li    ul li:hover a,
			nav ul.nav_1 li.at ul li:hover a,
			nav ul.nav_1 li.at ul li.on a {
				color: #fff;
			}
		
/* Login form */
	header form input[type="text"],
	header form input[type="password"],
	header form input[type="email"] {
		margin: 0 5px 0 0;
		width: auto;
	}
	header form .input {
		display: inline-block;
	}
	
	header .login-nav,
	header .login-form,
	header .search-form {
		position: relative;
		color: #fff;
		float: left;
		display: block;
		vertical-align: top;
		margin:  0 20px 0 0;
	}
		.login-nav,
		.login-options {
			list-style: none;
			margin: 0 0 .5em 0;
		}
	header .login-nav li {
		display: inline-block;
	}
	header .login-nav a,
	header .login-form a {
		font-size: 13px;
		padding: 0 5px 0 0;
		margin: 0;
		text-transform: none;
		text-decoration: none;
	}
	header .login-form .error-message {
		position: absolute;
		bottom: 0; left: 0;
		margin: 0;
		color: #ee5f5b;
		font-size: 13px;
	}
	
	header .quicklinks_header_1 {
		display: block;
		list-style-type: none;
		margin: 250px 0 0 0;
		background-color: #6caddf;
		background-color: rgba(108,173,223,0.8);
		padding: 20px;
	}
	
		header .quicklinks_header_1:before {
			display: block;
			float: left;
			content: "Quick Links:";
			width: 24%; 
			margin-bottom: 1em;
			
			color: #fff;
			font-style: italic;
			font-size: 18px;
			line-height: 30px;
		}
		
			html[lang=fr] header .quicklinks_header_1:before {
				content: "Liens Rapides:";
			}
	
		header .quicklinks_header_1 li {
			display: inline-block;
			width: 25%;
		}
		
			header .quicklinks_header_1 li:before {
				content:"> ";
				color: #345;
				margin-right: 0.25em;
			}
		
			header .quicklinks_header_1 a {
				color: #345;
				line-height: 30px;
				font-size: 1.15em;
				margin: 0 1em 0 0;
			}
			
				header .quicklinks_header_1 a:hover {
					text-decoration: underline;
				}
	
	header .members_header_1 {
		display: block;
		list-style-type: none;
		margin: 50px 0 0 0;
		background-color: rgb(203, 74, 48);
		background-color: rgba(203, 74, 48, 0.8);
		padding: 20px;
	}
	
		header .members_header_1:before {
			display: block;
			float: left;
			content: "Member Tools:";
			width: 24%; 
			margin-bottom: 1em;
			
			color: #0d2132;
			font-style: italic;
			font-size: 18px;
			line-height: 30px;
		}
		
			html[lang=fr] .members_header_1:before {
				content: "Outils Membres:";
			}
	
		header .members_header_1 li {
			display: inline-block;
			width: 25%;
		}
		
			header .members_header_1 li:before {
				content:"> ";
				color: #fdd;
				margin-right: 0.25em;
			}
		
			header .members_header_1 a {
				color: #fdd;
				line-height: 30px;
				font-size: 1.15em;
				margin: 0 1em 0 0;
			}
			
				header .members_header_1 li.at:before,
				header .members_header_1 li.at a {
					color: #fff;
					/* font-weight: 600; */
				}
			
				header .members_header_1 li.at:before:hover,
				header .members_header_1 a:hover {
					color: #fff;
					text-decoration: underline;
				}


/* 	Colummns and Sections	*/
	#main {
		min-height: 600px;
	}
	
	#main,
	#footer .events {
		margin: 50px 0;
		font-size: 18px;
		line-height: 1.6em;
		color: #333;
		font-family: "Open Sans", Helvetica, Arial, sans-serif;
	}
	
	#main h2,
	#main h3,
	#main h4,
	#main h5,
	#main b,
	#main strong,
	#footer .events h2,
	#footer .events h3,
	#footer .events h4,
	#footer .events h5,
	#footer .events b,
	#footer .events strong,
	#footer .events time,
	#footer .events a {
		font-family: "Montserrat", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
	}
	
		#main h2 .arrow,
		#main h3 .arrow,
		#main h4 .arrow,
		#main h5 .arrow {
			font-size: 0.55em;
			vertical-align: middle;
		}

/* Footer	 */
	footer {
		clear: both;
		position: relative;
	}
	
		footer ul {
			-webkit-display : flex;
			-moz-display : flex;
			display : flex;
			
			-webkit-flex-direction: row;
			-moz-flex-direction: row;
			flex-direction: row;
			
			display: block;
			list-style-type: none;
			margin: 0;
		}
	
		footer li {
			display: inline-block;
			vertical-align: top;
		}
	
	footer .events {
		background-color: #b1d6f0;
		padding: 20px 0;
	}
	
		footer .events li {
			width: 30%;
			margin-right: 4.5%;
			margin-bottom: 20px;
		}
	
		footer .events li:last-child {
			width: 30%;
			margin-right: 0;
		}
			
			footer .events time {
				display: block;
				color: #336da7;
				margin: 1em 0 0.5em 0;
			}
			
			footer .events h3 {
				color: #2d2d2d;
			}
			
			footer .events li a {
				color: #cb4a30;
			}
			
				footer .events li a:before {
					content:"> ";
					margin-right: 0.25em;
				}
					
	
	footer .funding {
		padding: 30px 0;
		text-align: center;
	}
		
		footer .funding p {
			color: #0b273b;
			font-size: 18px;
		}
		
	footer .quicklinks {
		background-color: #2f3840; /* #071a28; */
		padding: 50px 0;
	}
	
		footer .quicklinks .container {
			background-image: url(../../img/logo-white.png);
			background-position: left center;
			background-repeat: no-repeat;
		}
	
		footer .quicklinks ul {
			margin-left: 34.5%;
		}
			
			footer .quicklinks ul:before {
				display: block;
				content: "Quick Links:";
				
				color: #fff; /* #8bafc9; */
				font-style: italic;
				font-size: 18px;
				margin-bottom: 0.5em;
			}
			
				html[lang=fr] footer .quicklinks ul:before {
					content: "Liens Rapides:";
				}
		
			footer .quicklinks li {
				margin-right: 3%;
				margin-bottom: 0.5em;
			}
		
			footer .quicklinks a {
				color: #76baf4; /* #8bafc9; */
				margin: 0 1em 0 0;
			}
			
				footer .quicklinks li:before {
					content:"> ";
					color: #76baf4; /* #8bafc9; */
					margin-right: 0.25em;
				}
	
	footer .navigation {
		background-color: #000; /* #0b273b; */
		padding: 40px 0 60px 0;
	}
	
		footer .navigation li {
			display: block;
			max-width: 14%;
			margin-right: 3%;
			float: left; 
		}
		
			footer .navigation li:first-child {
				display: none;
			}
		
			footer .navigation li:last-child {
				margin-right: 0;
			}
			
			footer .navigation li#footer_nav_li_item_227 {
				display: none;
			}
		
			footer .navigation a {
				text-transform: uppercase;
				padding: 5px 0;
				color: #fff;
			}
		
		footer .navigation li li {
			float: none;
			max-width: 100%;
			margin-right: 0;
		}
		
			footer .navigation li li a {
				text-transform: none;
				display: block;
				color: #ace; /* b5d6f0; */
			}
	
		
	
	footer .copyright {
		background-color: #000; /* #0b273b; */
	}
	
		footer .copyright ul {
			float: left;
		}
		
			footer .copyright a {
				color: #fff;
				margin: 0 1em 0 0;
				font-size: 11px;
			}
	
		footer .copyright p {
			float: right;
			color: #b5d6f0;
			font-size: 11px;
		}



/* Content layout (appearence) */
.content-display {
	
}
	.content-display:after { clear: both; }
	
	.content-display .content-block {
		width: 45%;
		float: left;
		margin: 0 2.5% 0 0;
	}
	
	/* 	single */
	.content-display.type-0 {
		
	}
	
	/* 	double */
	.content-display.type-1 .content-block {

	}
	
	/* double, wide-top */
	.content-display.type-2 .content-block:nth-child(3n+1) {
		width: 100%;
		clear: both;
		float: none;
		margin: 0;
	}

	/* double, wide-bottom */
	.content-display.type-3 .content-block:nth-child(3n+3) {
		width: 100%;
		clear: both;
		float: none;
		margin: 0;
	}
	
	
	/* triple */
	.content-display.type-4 .content-block {
		width: 30%;
		margin-right: 3%;
		float: left;
	}


/* Hide content that requires JavaScript unless JavaScript is running. */
body .requires-js { display: none; }