/* global: structure */

body {
	font: 12px/20px Arial, Helvetica, sans-serif;
	
	background-color: #f2f2f2; /* dev */
}

div.wrapper {
	margin: 20px auto;
	/*padding: 0 20px;
	max-width: 1024px;*/
	max-width: 100%;
	
	background-color: #cf9; /* dev */
}

div.container {
	margin: 0 auto;
	max-width: 1024px;
	
	background-color: #cff; /* dev */
}

header {
	padding: 10px 0;
	height: 80px;
	
	background-color: #ffc; /* dev */
}

header:before,
header:after {
	display: table;
	
	clear: both;
	
	content: " ";
}

main {
	/*padding-top: 40px;*/
	padding-top: 0;
}

main:before,
main:after {
	display: table;
	
	clear: both;
	
	content: " ";
}

article:before,
article:after {
	display: table;
	
	clear: both;
	
	content: " ";
}

aside:before,
aside:after {
	display: table;
	
	clear: both;
	
	content: " ";
}

article {
	float: left;
	
	/*padding-right: 40px;*/
	padding-right: 20px;
	width: 75%;
}

aside {
	float: right;
	
	width: 25%;
}

footer {
	/*margin-top: 40px;*/
	
	background-color: #ffc; /* dev */
}

/**/

main.home article,
main.jobs article,
main.companies article,
main.details article,
main.signup article,
main.listings article {
	float: none;
	
	padding: 0;
	width: 100%;
}

/**/

div.viewport {
	display: none;
	
	height: 20px;
	
	color: #fff; /* white */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 20px;
	text-align: center;
	
	background-color: #00f; /* blue */
}





/* global: navigation */

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

nav ul:before,
nav ul:after {
	display: table;
	
	clear: both;
	
	content: " ";
}

nav li {
	float: left;
	
	margin: 0;
	padding: 0;
}

nav li a {
	display: block;
}





/* global: navigation: site */

nav.site {
	background-color: #9cf; /* dev */
}

nav.site li {
	margin-right: 10px;
}

nav.site li.active a {
	color: #f00; /* dev */
	font-weight: bold;
}





/* global: navigation: hamburger */

nav.site a.hamburger {
	display: none;
	
	position: absolute;
	top: 0;
	right: 0;
	
	text-decoration: none;
	
	/*background-color: #06f; /* blue */
	background-color: #263248; /* dark blue grey */
}

nav.site a.hamburger i.fa {
	display: block;
	
	width: 40px;
	height: 40px;
	
	color: #fff; /* white */
	font-size: 14px;
	line-height: 40px;
	text-align: center;
}

nav.site a.hamburger:hover {
	/*background-color: #039; /* darker blue */
	background-color: #263248; /* dark blue grey */
}

nav.site a.hamburger.active {
	/*background-color: #090; /* green */
}

nav.site a.hamburger.active i.fa.fa-bars::before {
	content: "\f00d"; /* fa-close */
}

@media screen and (max-width: 768px) {
	
	nav.site {
		/*display: none;*/
		
		position: absolute;
		right: 0;
		top: 10px;
		z-index: 900;
		
		/*padding: 20px 10px;*/
		width: auto;
		
		/*background-color: #06f; /* blue */
	}
	
	nav.site ul {
		/*display: block;*/
		display: none;
		
		margin-top: 40px;
		padding: 20px;
		
		/*background-color: transparent;*/
		/*background-color: #06f; /* blue */
		background-color: #263248; /* dark blue grey */
	}
	
	nav.site li {
		float: none;
		
		margin: 0;
	}
	
	nav.site li a {
		padding: 0 10px;
		
		color: #fff; /* white */
		text-align: left;
	}
	
	nav.site li a:hover,
	nav.site li.active a {
		/*color: #fff; /* white */
		color: #263248; /* dark blue grey */
		
		/*background-color: #039; /* darker blue */
		background-color: #fff; /* white */
	}
	
	nav.site a.hamburger {
		display: block;
	}
	
}




/* global: navigation: top */

nav.top {
	/*position: absolute;
	top: 0; 
	right: 0;*/
	
	background-color: #9fc; /* dev */
}

nav.top li {
	margin-left: 10px;
}

nav.top li.active a {
	color: #f00; /* dev */
	font-weight: bold;
}

nav.top li a i.fa {
	margin-right: 5px;
}





/* global: navigation: footer */





/* global: navigation: pages */

nav.pages {
	float: none;
	
	padding-left: 5px;
	max-width: 100%;
	height: 40px;
	
	text-align: center;
}

nav.pages ul {
	display: inline-block;
}

nav.pages li {
	margin-right: 5px;
}

nav.pages li a {
	display: block;
	
	width: 40px;
	height: 40px;
	
	color: #fff; /* white */
	cursor: pointer;
	line-height: 40px;
	text-align: center;
	text-decoration: none;
	
	background-color: #06f; /* blue */
}

nav.pages li a:hover {
	background-color: #039; /* darker blue */
}

nav.pages li.active a {
	background-color: #000; /* black */
}

nav.pages li.first a,
nav.pages li.previous a,
nav.pages li.next a,
nav.pages li.last a {
	font-size: 16px;
}

nav.pages li span {
	display: none;
}

nav.pages li.disabled {
	display: none;
}

nav.pages li a i.fa {
	line-height: inherit;
}




/* global: content */

.left {
	text-align: left;
}

.center {
	text-align: center;
}

.right {
	text-align: right;
}

.hide {
	display: none;
}





/* global: content: anchors */

a {
	color: #00f; /* blue */
	font-weight: inherit;
}

a:hover {
	color: #00c; /* darker blue */
}

a:active {
	color: #f00; /* red */
}





/* global: content: anchors: buttons */

a.button {
	display: inline-block;
	
	padding: 10px 15px;
	
	color: #fff; /* white */
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
	
	background-color: #00f; /* blue */
}

a.button:hover {
	background-color: #00c; /* darker blue */
}

a.button i.fa {
	margin-right: 5px;
	
	font-size: 14px;
}





/* global: content: columns */

.cols {
	margin: 0 -10px;
	/*margin: 0 -20px;*/
}

.cols:before,
.cols:after {
	display: table;
	
	clear: both;
	
	content: " ";
}

[class*="col-"] {
	float: left;
	
	padding: 0 10px;
	/*padding: 0 20px;*/
}

.col-1-2 {
	width: 50%;
}

.col-1-3 {
	width: 33.333%;
	width: calc(1/3 * 100%);
}

.col-1-4 {
	width: 25%;
}

.col-1-5 {
	width: 20%;
}

.col-1-6 {
	width: 16.666%;
	width: calc(1/6 * 100%);
}

.col-2-3 {
	width: 66.666%;
	width: calc(2/3 * 100%);
}

.col-3-4 {
	width: 75%;
}

.col-2-5 {
	width: 40%;
}

.col-4-5 {
	width: 80%;
}






/* global: content: headings */

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 40px 0 20px;
	
	font-weight: bold;
	
	background-color: #9f6; /* dev */
}

/**/

h1,
h2 {
	margin-top: 0;
}

h1 i.fa,
h2 i.fa,
h3 i.fa,
h4 i.fa,
h5 i.fa,
h6 i.fa {
	margin-right: 5px;
	
	font-size: 14px;
}





/* global: content: images */

/**/

header div.logo img {
	display: block;
	
	width: auto;
	height: 60px;
}

/**/

footer div.logo img {
	display: block;
	
	width: auto;
	height: 40px;
}





/* global: content: images: placeholders */

figure.placeholder {
	padding-bottom: 75%;
	width: 100%;
	
	background-color: #9ff; /* dev */
}

figure.placeholder div {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

figure.placeholder div:after {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 1;
	
	color: #000; /* dev */
	content: "\f03e"; /* fa-picture-o */
	font-family: FontAwesome;
	font-size: 28px;
	/*font-size: 56px;*/
	font-style: normal;
	font-weight: normal;
	line-height: 1;
	text-decoration: inherit;
	
	-webkit-transform: perspective(1px) translateX(-50%) translateY(-50%);
	    -ms-transform: perspective(1px) translateX(-50%) translateY(-50%);
	        transform: perspective(1px) translateX(-50%) translateY(-50%);
}





/* global: content: sections */

section {
	margin-bottom: 20px;
	/*padding: 20px;*/
	padding: 0;
	
	background-color: #fff; /* white */
	/*background-color: transparent;*/
}

section.meta {
	margin-bottom: 20px;
	padding: 0;
	
	background-color: #ff0; /* dev */
}

section.meta:before,
section.meta:after {
	display: table;
	
	clear: both;
	
	content: " ";
}