﻿/*
	Stylesheet for Flanders Fashion Institue (modejobs.be)

	Media:      screen
	Author:		Tom Bevers
	Copyright:  cvwarehouse.com <http://www.cvwarehouse.com>
*/

/*
	Reset
	@see http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td							{ margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
/* remember to define focus styles! */
:focus																	{ outline: 0; }
body																	{ line-height: 1; color: black; background: white; }
ol, ul																	{ list-style: none; }
/* tables still need 'cellspacing="0"' in the markup */
table																	{ border-collapse: separate; border-spacing: 0; }
caption, th, td															{ text-align: left; font-weight: normal; }
blockquote:before, blockquote:after,
q:before, q:after														{ content: ""; }
blockquote, q															{ quotes: "" ""; }

/*
	Typography
*/

body																	{ font: 12px/20px Georgia,Cambria,sans-serif; color: #777; }

h1, h2, h3, h4, h5, h6													{ font-weight: bold; font-style: normal; margin: 0 0 10px; }

h1																		{ font-size: 15px; color: #E2001A; }
h2																		{ font-size: 15px; color: #E2001A;  }
h3																		{ font-size: 14px; color: #000; }
h4																		{ font-size: 14px; color: #7C8388;  }
h5																		{ font-size: 12px; font-variant: small-caps; }
h6																		{ font-size: 12px; }

#header h1 a															{ margin: 0; line-height: 167px; color: #000; text-decoration: none; font-size: 2.2em; font-family: Arial, Helvetica, Sans-Serif; }
#header h1#logo															{ margin: 0; }

#languages																{ font-family: Arial,sans-serif; font-size: 11px; text-align: left; }
#languages a															{ color: #999; }

#content p, #content ul, #content ol									{ margin: 0 0 10px; }
#content ul, #content ol												{ padding-left: 30px; }
#content ul																{ list-style-type: disc; }
#content ol																{ list-style-type: decimal; }

a																		{ color: #E2001A; }
a:focus																	{ border-color: #c2d3e4; outline-color: #000; outline-style: dotted; outline-width: 1px; }

strong																	{ font-weight: bold; }
em																		{ font-style: italic; }

.about #content h3 a													{ color: #000; }
.logoyje																{ margin-top:50px; margin-left:50px;}							

/*
	Basic layout
*/

body																	{ background: #fff; }
#wrapper																{ margin: 0 auto; width: 965px; }

#header																	{ height: 190px; }
#header #navigation														{ float: left; width: 575px; height: 190px; background: #1A171B url('../img/headerImage.jpg') no-repeat 395px 10px; }
#header .mainNav, #header .subNav										{ width: 190px; height: 190px; float: left; }
#header .subNav															{ width: 195px; background: #E2001A; }

#header #navigation ul													{ text-transform:uppercase; font: bold 14px "Arial Narrow",Arial,sans-serif; margin:7px 0 0; }
#header #navigation li													{ display: inline; }
#header #navigation a													{ display: block; padding: 1px 0 1px 8px; text-decoration: none; }
.home #header .mainNav a.home, #header .mainNav a:hover,
.about #header .mainNav a.about, .jobs #header .mainNav a.jobs,
.portfolios #header .mainNav a.portfolios								{ background: url('../img/topnav-active.gif') no-repeat left center; color: #fff; }
#header .mainNav a														{ color: #B1B3B4; }

#headerWrapper															{ text-align: center; float: left; width: 390px; height: 190px; }
#quote																	{ position:relative; top:-50px; padding-left:10px;}

#languages																{ margin: 0 0 0 5px; position:relative; top:-40px; }

#main																	{ background: #E8E7D9; padding: 10px; }
#content																{ }
#footer																	{ background: #333; color: #fff; font-size: 10px; margin: 0 0 10px; padding: 3px 15px; }

#jobContent																{ float: left; background: #fff; padding: 5px; width: 715px; }
#sideBar																{ float: right; width: 200px; background: #fff; padding: 5px; margin: 0 0 0 10px; text-align: center; }

#sideBar img															{ margin: 0 0 25px; }
#sideBar img.first														{ margin: 0 0 70px; }
#sideBar img.last														{ margin: 0 0 10px; }

hr {
	border: none;
	border-top: 1px solid #ddd;
	padding: 0;
}

div.hr {
	border-bottom: 1px solid #ddd;
	width: 98%;
	margin: 25px auto;
}

	div.hr hr {
		display: none;
	}

.form dt																{ float: left; text-align: left; width: 170px; }
.form dd																{ margin-left: 180px; padding-top: 5px; }
.form dd.text input, .form dd.text textarea								{ width: 200px; }
.form dd.text textarea													{ height: 80px; width: 300px; }
.form dd.button	 input													{ width: 100px; }

.errorMessage															{ color: #E2001A; }

/*
	Intro
*/

div.intro																{ margin: 0 auto; width: 500px; line-height: 200px; margin-bottom: 20px; }
div.intro h1															{ color: #000; font-size: 2.2em; font-family: Arial, Helvetica, Sans-Serif; text-align: center; padding: 0; margin: 0; }
div.left																{ float: left; width: 240px; background: #E8E7D9; }
div.right																{ float: right; width: 240px; background: #E8E7D9; }


/*
	JobList
*/

div.company																{ margin: 0 0 20px 10px; }
div.company img															{ float: left; border: 1px solid #e8e7d9; }
div.company div															{ float: left; margin: 0 0 0 20px;}

.jobList li a															{ color: #333; }

/*
	Powered By Button
*/

.poweredBy																{ margin: 0 !important; }

/*
	Clearfix
	@see  http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack/
*/

.clearfix:after															{ visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix																{ display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix														{ height: 1%; }
.clearfix																{ display: block; }
/* close commented backslash hack */