﻿@import "reset.css";

html {
	height: 100%;
	width: 100%;
	font: normal 9pt Arial, Helvetica, sans-serif;
}

body {
	background-color: #ffffff;
	height: 100%;
	position: relative;
}

#fix  {	
	min-width: 100%;
	min-height: 100%;
	position: absolute;
}


/* --------------------------------------
				HEADER
----------------------------------------*/
	#header_wrap {
		background: #e2e2e2 url(../images/top_background.gif) 0px 0px repeat-x;
		border-bottom: solid 1px #bdbdbd;
		min-width: 960px;
		height: 60px;
	}

	#header {
		position: relative;
		height: 44px;
		width: 960px;
		margin: 0px auto;
		padding-top: 16px;
	}

	#header a {
		position: relative;
		left: 10px;
		top: -10px;
		float: left;
	}

	#header ul {
		position: relative;
		top: 10px;
		float: right;
		height: 27px;
	}

	#header ul li { display: inline; }

	#header ul li a {
		display: block;
		float: left;
		height: 25px;
		padding: 0px 8px 0px 25px;
		color: #8d8d8d;
		font: normal 11px Arial;
		line-height: 25px;
		background-position: 8px 0px;
		background-repeat: no-repeat;
		border: solid 1px #e2e2e2;
		border-top: solid 1px #f4f4f4;
		overflow: hidden;
	}

	#header ul li a.home { background-image: url(../images/icon_home.gif); }
	#header ul li a.login { background-image: url(../images/icon_login.gif); }
	#header ul li a.site { background-image: url(../images/icon_sitemap.gif); }

	#header ul li a:hover {
		background-color: #666666;
		background-position: 8px -25px;
		border: solid 1px #ffffff;
		border-top-color: #666666;
		color: #ffffff;
	}
	
/* --------------------------------------
				NAVIGATION
----------------------------------------*/
	
	#navigation_wrap {
		position: relative;
		height: 33px;
		border-top: 1px solid #f5f5f5;
		border-bottom: 1px solid #bdbdbd;
		min-width: 960px;
		background: #e2e2e2 url(../images/navigation_background.gif) 0px 0px repeat-x;
	}
	
	#navigation {
		position: relative;
		height: 33px;
		width: 960px;
		margin: 0 auto;
	}
	
	#navigation ul {
		display: block;
		width: 960px;
		height: 32px;
		padding-top: 1px;
	}

	#navigation li { display: inline; }

	#navigation a {
		background: transparent url(../images/menu_hover_right.gif) right -29px no-repeat;
		display: block;
		float: left;
		color: #7c7c7c;
		text-decoration: none;
		font: bold 10pt Arial;
		margin-right: 20px;
	}

	#navigation a span {
		background: transparent url(../images/menu_hover_left.gif) left -29px no-repeat;
		display: block;
		height: 29px;
		float: left;
		padding: 0px 12px;
		line-height: 30px;
	}

	#navigation a:hover,
	#navigation a.active	{
		background-position: right 0px;
		cursor: pointer;
	}

	#navigation a:hover span,
	#navigation a.active span	{
		background-position: left 0px;
		color: #ffffff;
		text-shadow: 1px 1px 0px #7c7c7c;  
	}
	
/* --------------------------------------
				BANNER
----------------------------------------*/
	
	#banner_wrap {
		background: #666666 url(../images/banner_background.gif);
		position: relative;
		height: 220px;
	}
	
	#banner {
		background: transparent url(../images/top_shadow.png) 0px 0px no-repeat;
		position: relative;
		height: 220px;
		width: 960px;
		margin: 0px auto;
	}
	
	#banner .left {
		width: 500px;
		height: 190px;
		padding: 10px 10px 0px 10px;
	}
	
	#banner .right {
		background: transparent url(../images/top_car.png) right 0px no-repeat;
		position: relative;
		top: -20px;
		width: 386px;
		height: 220px;
	}
	
	#banner h1 {
		color: #ffffff;
		text-shadow: 1px 1px 0px #292929;  
		font-size: 20px;
		font-weight: normal;
		font-family: 'Yanone Kaffeesatz';
	}

	#banner h2 {
		color: #ffffff;
		text-shadow: 1px 1px 0px #292929;  
		font-family: 'Yanone Kaffeesatz';
		clear: both;
		font-size: 26px;
		line-height: 24px;
	}

	#banner span {
		color: #ffffff;
		display: block;
		font-size: 14px;
		margin-top: 20px;
		margin-bottom: 4px;
	}

	#banner ul li {
		background: transparent url(../images/top_pointer.png) 0px 0px no-repeat;
		color: #ffffff;
		font-size: 14px;
		text-indent: 30px;
		line-height: 20px;
	}

	#banner a {
		display: block;
		float: right;
		width: 142px;
		height: 38px;
		color: #ffffff;
		font: bold 10pt Arial;
		text-indent: 30px;
		background: transparent url(../images/top_anchor.gif) left top no-repeat;
		line-height: 32px;
	}

	#banner a:hover {
		background-position: left bottom;
		cursor: pointer;
	}
	
/* --------------------------------------
				PAGE
----------------------------------------*/
	
	#page_wrap {
		background: transparent url(../images/page_background.gif) left top repeat-x;
		min-width: 960px;
		border-top: solid 1px #ffffff;
		padding-bottom: 70px;
		min-height: 200px;
		overflow: hidden;
	}
	
	#page {
		background: transparent url(../images/top_shadow.png) center 0px no-repeat;
		width: 960px;
		margin: 0px auto;
	}
	
	#content_wrap {
		width: 720px;
		float: left;
		margin: 20px 0px;
	}
	
	#content {
		width: 700px;
		padding: 0px 10px 10px 10px;
		background: #ffffff;
		min-height: 200px;
		overflow: hidden;
	}
	
	#content h1 {
		background: transparent url(../images/title_pointer.gif) 0px 4px no-repeat;
		color: #0570d4;
		display: block;
		font-weight: bold;
		font-size: 10pt;
		line-height: 14pt;
		margin: 10px 0px;
		text-indent: 14px;
		text-shadow: 0px 1px 0px #cdcdcd; 
		clear: both;
	}
	
	#content h2 {
		font-weight: bold;
		font-size: 10pt;
		color: #5e5e5e;
	}
	
	#content p {
		text-align: justify;
		font-size: 9pt;
		color: #5e5e5e;
		clear: right;
		line-height: 14pt;
	}
	
	#content p.info {
		padding: 20px;
		text-align: center;
		font-weight: bold;
		color: #0570d4;
		
	}
	
	#content p a {
		color: #5e5e5e;
		font-size: 9pt;
		text-decoration: underline;
	}

	#content address {
		font-style: normal;
		line-height: 12pt;
	}

	#content .listing {
		display: block;
		color: #5e5e5e;
		margin-left: 5px;
		margin-top: 5px;
		margin-bottom: 5px;
	}
	
	#content .listing li {
		padding-left: 20px;
		background: transparent url(../images/title_pointer2.gif) left 3px no-repeat;
		line-height: 18px;
	}
	
	.forms {
		overflow: hidden;
		float: left;
	}
	
	.forms dl {
		margin-bottom: 8px;
		overflow: hidden;
		clear: both;
	}
	
	.forms dd input,
	.forms dd textarea,
	.forms dd select  {
		display: block;
		float: left;
		border: solid 1px #b7b7b7;
		margin: 1px;
		padding: 4px;
		background-color: #ffffff;
		font: normal 9pt Arial;
	}
	
	.forms dd input {
		height: 16px;
		width: 240px;
	}
	
	.forms dd input:focus,
	.forms dd textarea:focus,
	.forms dd select:focus {
		margin: 0px;
		border: solid 2px #0570d3;
		background-color: #ffffff;
	}
	
	.forms .incorrect {
		margin: 1px;
		border: solid 1px #b7b7b7;
		background: #ffffff url(../images/modalWindow/incorrect.gif) 0px 0px repeat;
	}

	.forms dt {
		float: left;
		width: 70px;
		padding-right: 10px;
		height: 25px;
		line-height: 30px;
		text-align: right;
		font-weight: bold;
		color: #464646;
	}
	
	.forms dd {
		float: left;
	}
	
	.form .buttons {
		clear: both;
	}

	.forms .button {
		display: block;
		border-spacing: 0px;
		background: #0671d5 url(../images/modalWindow/button.gif) left top repeat-x;
		border-top: solid 1px #cae3fa;
		border-left: solid 1px #2780d2;
		border-right: solid 1px #67b3f9;
		border-bottom: solid 1px #1a568e;
		color: #ffffff;
		padding: 0px 10px;
		margin: 0px;
		font: bold 9pt Arial;
		height: 30px;
		line-height: 30px;
		text-align: center;
		float: right;
	}

	.forms .button:hover {
		background-position: left bottom;
		cursor: pointer;
	}

	.forms .button:focus {
		-moz-outline-radius: 12px !important;
		-moz-outline-offset: 0px !important; 
	}
	
	.forms .checkbox p {
		font-size: 8pt !important;
		color: #626262;
		text-align: justify;
		line-height: 10pt !important;
		width: 260px;
	}
	
	.forms .checkbox dt{
		padding-top: 0px;
	}
	
/* --------------------------------------
				SIDEBAR
----------------------------------------*/


	#sidebar_wrap {
		position: relative;
		width: 240px;
		float: right;
		padding-bottom: 92px;
		background: transparent url(../images/box_bottom_shadow.gif) 0px bottom no-repeat;
		margin: 20px 0px;
	}
	
	#sidebar {
		width: 240px;
		float: left;
		background: #0570d4 url(../images/box_background.gif) 0px 24px repeat-x;
		
	}
	
	#sidebar #top_corner {
		background: transparent url(../images/box_top.gif) left top no-repeat;
		padding-top: 22px;
		float: left;
	}
	
	#sidebar #bottom_corner {
		border-right: solid 5px #ffffff;
		width: 235px;
		padding-bottom: 15px;
		background: transparent url(../images/box_bottom.gif) 0px bottom no-repeat;
	}
	
	
	#sidebar h1 {
		background: transparent url(../images/title_pointer3.gif) 0px 4px no-repeat;
		color: #ffffff;
		font-weight: bold;
		font-size: 10pt;
		line-height: 14pt;
		margin: 10px 0px 10px 15px;
		text-indent: 15px;
		text-shadow: 0px 1px 0px #7c7c7c; 
	}
	
	#sidebar p {
		font-size: 9pt;
		color: #ffffff;
		clear: both;
		padding: 0px 10px;
		line-height: 11pt;
		position: relative;
	}
	
	#sidebar .anchor {
		background: #ffffff url(../images/link_corner.gif) right top no-repeat;
		color: #5e5e5e;
		display: block;
		font-weight: bold;
		font-size: 10pt;
		margin: 5px 0px;
		line-height: 25px;
		text-align: center;
		width: 225px;
		height: 25px;
		position: relative;
		left: -10px;
	}
	
	#sidebar ul {
		display: block;
		font-size: 9pt;
		width: 100%;
		overflow: hidden;
		clear: both;
	}

	#sidebar ul li {
		display: block;
		padding-bottom: 24px;
		padding-right: 5px;
		background: transparent url(../images/box_shadow.png) 0px bottom no-repeat;
		margin-bottom: 5px;
		font-size: 8pt;
		line-height: 10pt;
	}
	
	#sidebar ul li b {
		display: block;
		clear: both;
		font-size: 10pt;
	}

	#sidebar ul li a {
		display: block;
		overflow: hidden;
		width: 100%;
		padding-left: 15px;
		color: #ffffff;
		background: transparent url(../images/box_hover.gif) left -100px no-repeat;
	}

	#sidebar ul a:hover { background-position: left 10px; }

	
/* --------------------------------------
				NEWS BOX
----------------------------------------*/	
	
	#news {
		background: transparent url(../images/news/header_border.gif) left bottom no-repeat;
		margin: 0px auto;
		font-family: Arial;
		width: 700px;
		overflow: hidden;
	}

	#news #more {
		display: block;
		height: 23px;
		width: 220px;
		font-weight: bold;
		font-size: 8pt;
		line-height: 23px;
		text-align: center;
		color: #c1c1c1;
		clear: both;
	}

	
	#news  #more:hover { color: #898989; }

	#news .trigger {
		background: #f0f0f0 url(../images/news/header_background.gif) left top repeat-x;
		width: 698px;
		height: 24px;
		border: solid 1px #e1e1e1;
		border-top-color: #ffffff;
	}
	
	#news .trigger:hover {
		cursor: pointer;
	}

	#news  .trigger a {
		background: transparent url(../images/news/header_drop.gif) 10px 5px no-repeat;
		display: block;
		height: 20px;
		text-indent: 20px;
		font: bold 9pt Arial;
		color: #616161;
		padding: 5px 0px 0px 10px;
		text-shadow: 1px 1px 0px #ffffff;  
		float: left;
	}
	
	#news  .trigger span {
		display: block;
		float: right;
		font: normal 8pt Arial;
		text-shadow: 1px 1px 0px #ffffff;  
		color: #616161;
		height: 20px;
		padding: 5px 10px 0px 0px;
	}

	#news  .trigger a:hover { color: #0570d4; }
	#news  .active { background-image: url(../images/news/header_background_over.gif); border-bottom-color: #cccccc;}
	#news  .active a { background-image: url(../images/news/header_up.gif);}

	#news  .toggle-container {
		background-color: #f0f0f0;
		width: 678px;
		border: solid 1px #e1e1e1;
		border-top-color: #ffffff;
		padding: 10px;
		overflow: hidden;
		display: block;
	}

	#news  .toggle-container a {
		display: block;	
		float: right;
		color: #747474;
		font: bold 8pt Arial;
		text-indent: 14px;
		text-decoration: none;
		background: transparent url(../images/news/header_link.gif) left -18px no-repeat;	
	}
	
	#news  .toggle-container a:hover { color: #0570d4; background-position: left 2px; }
	#news  .toggle-container p { font-size: 9pt; clear: right; line-height: 14pt; text-align: justify;color: #5e5e5e; clear: right; padding-bottom: 10px; }

	#news  .toggle-container img {
		background-color: #ffffff;
		display: block;
		float: left;
		width: 120px;
		height: 90px;
		margin: 0px 10px 5px 0px;
		border: solid 2px #e5e5e5;
		padding: 2px;
	}
	

/* --------------------------------------
				GRID BOX
----------------------------------------*/

	#grids-wrap {
		position: relative;
		width: 718px;
		clear: both;
		border: solid 1px #bdbdbd;
		overflow: hidden;
	}
	
	#grids {
		background: #e9e9e9 url(../images/grid_background.gif) 0px 0px repeat-x;
		border: solid 1px #ffffff;
		overflow: hidden;
		padding: 8px 10px;
		width: 100%;
	}

	#grids-wrap .grid {
		position: relative;
		width: 222px;
		height: 142px;
		overflow: hidden;
		float: left;
		margin-right: 15px;
	}

	#grids-wrap .grid-margin { 
		margin-right: 0px; 
	}
	
	#grids-wrap .grid img { 
		position: absolute; 
		top: 0px; 
		left: 0px; 
		border: none; }

	#grids-wrap .grid div { 
		float: left; 
		font-family: Verdana;
		position: absolute; 
		top: 142px;
		left: 0px;
		background: #000; 
		height: 35px; 
		width: 210px; 
		opacity: 0.6; 
		overflow: hidden;
		padding: 5px 5px;
		border-top: solid 1px #ffffff;

	 }
	 
	#grids-wrap .grid h5 {
		color: #ffffff;
		font-size: 10pt;
		font-weight: bold;
		text-decoration: none;
		line-height: 14pt;
	}

	#grids-wrap .grid p{ 
		color: #ffffff; 
		font-size: 8pt;
	}

/* --------------------------------------
				FOOTER
----------------------------------------*/	
	
	#footer_wrap {
		position: absolute;
		background: #e2e2e2 url(../images/footer_background.gif) 0px 0px repeat-x;
		width: 100%;
		bottom: 0px;
		overflow: hidden;
		clear: both;
		border-top: solid 1px #bdbdbd;
	}
	
	#footer {	
		height: 30px;
		width: 960px;
		margin: 0px auto;
		position: relative;
	}

	
	#footer li { display: inline; }
	
	#footer li a {
		display: block;
		float: left;
		height: 30px;
		color: #8d8d8d;
		font-size: 8pt;
		margin-right: 15px;
		line-height: 30px;
	}
	
	#footer li a:hover {
		text-decoration: underline;
		color: #1a7cd8;
	}
	
	#footer_wrap #copyrights {
		height: 18px;
		background-color: #666666;
		border-top: solid 1px #bdbdbd;
		padding-top: 3px;
	}
	
	#footer_wrap p {
		width: 960px;
		margin: 0px auto;
		text-align: right;
		color: #e2e2e2;
		font: normal 8pt Arial;
		overflow: hidden;
	}
	
	#footer_wrap p a {
		color: #e2e2e2;
	}
	
	#footer_wrap p a:hover {
		text-decoration: underline;
	}
	
	
/* --------------------------------------
				COURS
----------------------------------------*/
	.cours { margin-bottom: 10px; }
	
	.cours span {	
		display: block;
		font-size: 10pt;
		color: #5e5e5e;
		border-bottom: dashed 1px #e5e5e5;
		margin-bottom: 5px;
		padding-bottom: 5px;
	}
	
	.cours p {
		text-align: justify;
		color: #5e5e5e;
		line-height: 14pt;
	}



/* --------------------------------------
				GALLERY
----------------------------------------*/

	.gallery {
		overflow: hidden;
		margin-bottom: 10px;
	}

	.gallery h3 {
		margin: 0px 13px;
		clear: both;
		font: bold 10pt Arial;
		color: #898989;
	}

	.gallery a {
		display: block;
		float: left;
		border-top: solid 2px #efefef;
		border-left: solid 2px #e5e5e5;
		border-right: solid 2px #e5e5e5;
		border-bottom: solid 2px #d7d7d7;
		margin: 5px 0px 5px 9px;
	}

	.gallery a:hover {
		border-color: #bcbcbc;
	}


	.gallery  img {
		width: 120px;
		height: 90px;
		background-color: red;
		padding: 3px;
		background: transparent url(../images/loading.gif) center center no-repeat;
	}

/* --------------------------------------
				NEWS
----------------------------------------*/

	.news_box { margin-bottom: 30px; font-family: Arial; }
	.news_box h3 { font-weight: bold; font-size: 10pt; color: #525252; margin-bottom: 5px;}

	.news_box span {
		display: block;
		margin-bottom: 10px;
		font-style: italic;
		font-size: 8pt;
		color: #b0b0b0;
		border-top: dashed 1px #e5e5e5;
		padding-top: 2px;
	}
	
	.news_box p {
		text-align: justify;
		font-size: 9pt;
		color: #5e5e5e;
		clear: right;
		line-height: 14pt;
	}

	.news_box img {
		display: block;
		float: left;
		width: 120px;
		height: 90px;
		margin-right: 10px;
		margin-bottom: 5px;
		border: solid 2px #e5e5e5;
		padding: 2px;
		background-color: #ffffff;
	}
	
	#content #pages {
		display: block;
		font-size: 9pt;
		color: #919191; 
		line-height: 14px;
		height: 15px;
	}
	
	#content #pages a {
		color: #5e5e5e;
	}

	#pages #next { float: right; padding-right: 15px; background: transparent url(../images/news_cross_right.gif) right -14px no-repeat; }
	#pages #previus { float: left; padding-left: 15px; background: transparent url(../images/news_cross_left.gif) left -14px no-repeat; }
	
	#pages #next:hover { color: #1a7cd8; background-position: right 2px; }
	#pages #previus:hover { color: #1a7cd8; background-position: left 2px; }

	
/* --------------------------------------
				CITES
----------------------------------------*/

	#content fieldset {
		background: transparent url(../images/quote_left.gif) left top no-repeat;
		display: block;
		width: 320px;
		float: left;
		padding: 5px 0px 0px 20px;
		font-family: Georgia;
	}

	#content #cite-left { float: left; }

	#content #cite-right { float: right;}

	#content fieldset q {
		padding-bottom: 5px;
		padding-right: 20px;
		font-size: 9pt;
		color: #7d7d7d;
		background: transparent url(../images/quote_right.gif) right bottom no-repeat;
		line-height: 12pt;
	}

	#content fieldset cite {
		display: block;
		margin-top: 10px;
		clear: both;
		text-align: right;
		font-size: 8pt;
		color: #7d7d7d;
	}
	
	.sitemap {
		font-size: 9pt;
		font-weight: bold;
	}
	
	.sitemap a {
		color: #0570d4;
	}
	
	.sitemap li {
		margin-top: 5px;
		clear: both;
	}
	
	.sitemap ul {
		margin-left: 20px;
	}
	
	.sitemap ul li {
		margin-top: 0px;
		overflow: hidden;
	}
	
	.sitemap ul li a {
		display: block;
		background: transparent url(../images/list_normal.gif) 0px 0px no-repeat;
		padding-left: 10px;
		height: 20px;
		line-height: 20px;
		float: left;
	}
	
	.sitemap ul li a:hover { background-position: 0px -40px;}
	.sitemap ul li a.sitemap_end { background-position: 0px -20px; }
	.sitemap ul li a.sitemap_end:hover { background-position: 0px -60px; }
	
	.sitemap ul li a {
		color: #b2b2b2;
	}
	
	.sitemap ul li a:hover {
		color: #0570d4;
	}
	
	.news_rss {
		overflow: hidden;
		width: 698px;
		margin: 0px auto;
		background: #f0f0f0 url(../images/news_rss_line.gif) center 0px repeat-y;
		border: solid 1px #e1e1e1;
	}
	
	.news_rss li {
		width: 329px;
		float: left;
		padding: 10px;
		overflow: hidden;
	}

	
	.news_rss h3 {
		font-size: 9pt;
		border-bottom: solid 1px #e1e1e1;
		padding-bottom: 5px;
		background: transparent url(../images/arrow.gif) 0px 0px no-repeat;
		padding-left: 20px;
		color: #616161;
		line-height: 15px;
	}
	
	.news_rss p {
		color: #5e5e5e;
		line-height: 11pt !important;
		font-size: 9pt;
		border-top: solid 1px #ffffff;
		padding-top: 5px;
		text-align: justify;
	}
	
	.news_rss a {
		display: block;	
		clear: both;
		float: right;
		color: #747474;
		font: bold 8pt Arial;
		text-indent: 14px;
		text-decoration: none;
		margin-top: 15px;
		background: transparent url(../images/news/header_link.gif) left -18px no-repeat;
		
	}
	
	.news_rss a:hover { color: #0570d4; background-position: left 2px; }
	
	
	#gallery {
		width: 100%;
		overflow: hidden;
		position: relative;
		background: transparent url(../images/gallery_background.gif) 0px 0px repeat-y;
	}
	
	#gallery #menu {
		display: block;
		width: 220px;
		float: left;
	}
	
	#gallery #menu li {
		display: block;
		clear: both;
	}
	
	#gallery #menu li a {
		display: block;
		padding: 10px 15px 10px 15px;
		overflow: hidden;
		font: bold 9pt Arial;
		color: #7c7c7c;
	}
	
	#gallery #menu li a:hover {
		background-color: #f0f0f0;
		color: #0570d4;
	}
	
	#gallery #menu li a.active {
		background-color: #f0f0f0;
		color: #0570d4;
	}
	
	#gallery #pictures {
		width: 470px;
		float: right;
		background-color: #f0f0f0;
		padding: 5px;
	}
	
	#gallery #pictures li {
		display: block; 
		float: left;
		margin: 5px;
	}
	
	#gallery #pictures li a {
		display: block;
		padding: 1px;
		border: solid 2px transparent;
	}
	
	#gallery #pictures li img {
		display: block;
		width: 140px;
		height: 105px;
	}
	
	#gallery #pictures li a:hover {
		border-color: #0570d4;
	}
	
