/* =====================================
= >>	Crystal PHP - Framework PHP
= >>	Créé par Sylvain Simao
= >>	www.sylvain-simao.fr
======================================== */

/* Reset 
===================== */

* {
	margin: 0;
	padding: 0;
}

a img {
	border: none;
}

header, footer, section, aside, nav, article {
	display: block;
}

/* Structure
===================== */

html {
	background-image: url('../images/background.jpg');
	background-repeat: repeat-x;
}

body {
	font-family: Arial,Helvetica,sans-serif;
	font-size: 12px;
	background-image: url('../images/bg_borders.jpg');
	background-repeat: no-repeat;
	background-position: center;
	height: 1560px;
	width: 100%;
}

#conteneur {
	width: 1000px;
	margin: 0 auto;
	overflow: hidden;
}

/* Navigation
===================== */

nav {
	width: 1000px;
	height: 46px;
	margin: 0 auto;
}

	nav ul.navigation {
		height: 46px;
		margin: 0 auto;
		padding-left:5px;
		background-image: url("../images/bg_nav.jpg");
		background-repeat: no-repeat;
		list-style: none;
	}

		nav ul li {
			float: left;
		}
		
			nav ul li a {
				display: block;
				width: 105px;
				font-size: 14px;
				line-height: 43px;
				text-align: center;
				text-decoration: none;
				color: #777;
				font-family: "Arial", Verdana, Serif;
				font-style: italic;
				padding-left: 8px;
			}
			
			nav ul li.bt_01 a{
				color: #e88ed2;
				background-image: url("../images/bt_01.png");
				background-position: center center;
				background-repeat: no-repeat;
			}			
				nav ul li.bt_01 a:hover {
					color: #eee;
					text-decoration: none;
					background-image: none;
					background-image: url("../images/bt_01h.png");
					background-position: center center;
					background-repeat: no-repeat;
				}
			nav ul li.bt_02 a{
				color: #ffa692;
				background-image: url("../images/bt_02.png");
				background-position: center center;
				background-repeat: no-repeat;
			}			
				nav ul li.bt_02 a:hover {
					color: #eee;
					text-decoration: none;
					background-image: none;
					background-image: url("../images/bt_02h.png");
					background-position: center center;
					background-repeat: no-repeat;
				}
			nav ul li.bt_03 a{
				color: #ffceb2;
				background-image: url("../images/bt_03.png");
				background-position: center center;
				background-repeat: no-repeat;
			}			
				nav ul li.bt_03 a:hover {
					color: #eee;
					text-decoration: none;
					background-image: none;
					background-image: url("../images/bt_03h.png");
					background-position: center center;
					background-repeat: no-repeat;
				}
			nav ul li.bt_04 a{
				color: #aed0e8;
				background-image: url("../images/bt_04.png");
				background-position: center center;
				background-repeat: no-repeat;
			}			
				nav ul li.bt_04 a:hover {
					color: #eee;
					text-decoration: none;
					background-image: none;
					background-image: url("../images/bt_04h.png");
					background-position: center center;
					background-repeat: no-repeat;
				}
			
header {
	width: 1000px;
	height: 210px;
	margin: 0 auto;
}
	
	#header_left {
		width: 252px;
		height: 210px;
		float: left;
	}
		#header_01 {
			width: 252px;
			height: 45px;
			background-image: url("../images/header_01.jpg");
			background-repeat: no-repeat;
		}
		#header_g1 {
			width: 252px;
			height: 95px;
		}
			#header_02 {
				width: 191px;
				height: 95px;
				background-image: url("../images/header_02.jpg");
				background-repeat: no-repeat;
				float: left;
			}
			#header_g1_2 {
				width: 61px;
				height: 95px;
				float: left;
			}
				#header_twitter {
					width: 61px;
					height: 54px;
				}
				#header_twitter_bottom {
					width: 61px;
					height: 41px;
					float: left;
					background-image: url("../images/header_twitter_bottom.jpg");
					background-repeat: no-repeat;
				}
		#header_03 {
			width: 252px;
			height: 70px;
			background-image: url("../images/header_03.jpg");
			background-repeat: no-repeat;
		}
	
	#header_right {
		width: 748px;
		height: 210px;
		float: left;
	}
			#header_title {
				width: 748px;
				height: 140px;
				background-image: url("../images/header_title.jpg");
				background-repeat: no-repeat;
			}
			#header_g2 {
				width: 748px;
				height: 70px;
			}
				#header_subtitle {
					width: 401px;
					height: 70px;
					background-image: url("../images/header_subtitle.jpg");
					background-repeat: no-repeat;
					float: left;
				}
				#coffee_top {
					width: 282px;
					height: 70px;
					background-image: url("../images/coffee_top.jpg");
					background-repeat: no-repeat;
					float: left;
				}	
				#header_04 {
					width: 65px;
					height: 70px;
					background-image: url("../images/header_04.jpg");
					background-repeat: no-repeat;
					float: left;
				}
				
#portfolio {
	width: 1000px;
	height: 403px;
	margin: 0 auto;
}
	#portfolio_polaroid {
		width: 653px;
		height: 403px;
		float: left;
		background-image: url("../images/portfolio_polaroid.jpg");
		background-repeat: no-repeat;
	}
	#portfolio_c1 {
		width: 282px;
		height: 403px;
		float: left;
	}
		#coffee_bottom {
			width: 282px;
			height: 166px;
			background-image: url("../images/coffee_bottom.jpg");
			background-repeat: no-repeat;
		}
		#portfolio_categories {
			width: 282px;
			height: 237px;
			background-image: url("../images/portfolio_categories.jpg");
			background-repeat: no-repeat;
			padding-top: 60px;
		}
		#cats_hover {
			position: absolute;
			z-index:10;
			/*top:469px;*/
		}
		#cats{
			font-family: BlackJack;
			font-weight: normal;
			color: #455d6b;
			font-size: 23px;
			line-height: 24px;
			text-align: right;
			letter-spacing: 3px;
			z-index:800;
   			position:absolute;
   			margin-top:-7px;
			margin-left:-42px;
		}
		.csstransforms #cats{
			-webkit-transform: rotate(9deg);
    		-moz-transform: rotate(9deg);
			-o-transform: rotate(9deg);
   			transform: rotate(9deg);
		}
		#cats span {
			cursor: pointer;
		}
		
	#portfolio_c2 {
		width: 65px;
		height: 403px;
		float: left;
	}
		#portfolio_01 {
			width: 65px;
			height: 166px;
			background-image: url("../images/portfolio_01.jpg");
			background-repeat: no-repeat;
		}
		#portfolio_02 {
			width: 65px;
			height: 237px;
			background-image: url("../images/portfolio_02.jpg");
			background-repeat: no-repeat;
		}
#preloader_polaroid{
	position:absolute;
	margin-top:160px;
	margin-left:300px;
	font-family: BlackJack;
	font-style: italic;
	font-weight: normal;
	color: #1d3f41;
	font-size: 10.5px;
	text-align:center;
	background-color:#fff;
	border: 1px solid #c6daec;
}
		
#services {
	width: 1000px;
	height: 399px;
	margin: 0 auto;
}
	#services_01 {
		width: 80px;
		height: 399px;
		float: left;
		background-image: url("../images/services_01.jpg");
		background-repeat: no-repeat;
	}
	#services_c1 {
		width: 227px;
		height: 399px;
		float: left;
	}
		#services_02 {
			width: 227px;
			height: 100px;
			background-image: url("../images/services_02.jpg");
			background-repeat: no-repeat;
		}
		#graphic_design {
			width: 227px;
			height: 59px;
			background-image: url("../images/graphic_design.jpg");
			background-repeat: no-repeat;
		}
		#gd_content {
			width: 227px;
			height: 158px;
			background-image: url("../images/gd_content.jpg");
			background-repeat: no-repeat;
		}
		#services_03 {
			width: 227px;
			height: 82px;
			background-image: url("../images/services_03.jpg");
			background-repeat: no-repeat;
		}
	#services_04 {
		width: 59px;
		height: 399px;
		float: left;
		background-image: url("../images/services_04.jpg");
		background-repeat: no-repeat;
	}
	#services_c2 {
		width: 228px;
		height: 399px;
		float: left;
	}
		#services_05 {
			width: 228px;
			height: 39px;
			background-image: url("../images/services_05.jpg");
			background-repeat: no-repeat;
		}
		#web_development {
			width: 228px;
			height: 61px;
			background-image: url("../images/web_development.jpg");
			background-repeat: no-repeat;
		}
		#wd_content {
			width: 228px;
			height: 152px;
			background-image: url("../images/wd_content.jpg");
			background-repeat: no-repeat;
		}
		#services_06 {
			width: 228px;
			height: 147px;
			background-image: url("../images/services_06.jpg");
			background-repeat: no-repeat;
		}
	#services_07 {
		width: 46px;
		height: 399px;
		float: left;
		background-image: url("../images/services_07.jpg");
		background-repeat: no-repeat;
	}
	#services_c3 {
		width: 240px;
		height: 399px;
		float: left;
	}
		#services_title {
			width: 240px;
			height: 68px;
			background-image: url("../images/services_title.jpg");
			background-repeat: no-repeat;
		}
		#services_08 {
			width: 240px;
			height: 48px;
			background-image: url("../images/services_08.jpg");
			background-repeat: no-repeat;
		}
		#logotype_and_identity {
			width: 240px;
			height: 75px;
			background-image: url("../images/logotype_and_identity.jpg");
			background-repeat: no-repeat;
		}
		#li_content {
			width: 240px;
			height: 136px;
			background-image: url("../images/li_content.jpg");
			background-repeat: no-repeat;
		}
		#services_09 {
			width: 240px;
			height: 72px;
			background-image: url("../images/services_09.jpg");
			background-repeat: no-repeat;
		}
	#services_c4 {
		width: 120px;
		height: 399px;
		float: left;
	}
		#services_10 {
			width: 120px;
			height: 306px;
			background-image: url("../images/services_10.jpg");
			background-repeat: no-repeat;
		}
		#services_c5 {
			width: 120px;
			height: 52px;
		}
			#remonter {
				width: 94px;
				height: 52px;
				float: left;
			}
			#services_11 {
				width: 26px;
				height: 52px;
				background-image: url("../images/services_11.jpg");
				background-repeat: no-repeat;
				float: left;
			}
		#services_12 {
			width: 120px;
			height: 41px;
			background-image: url("../images/services_12.jpg");
			background-repeat: no-repeat;
		}

#candp {
	width: 1000px;
	height: 300px;
	margin: 0 auto;
}
	#contact {
		width: 621px;
		height: 300px;
		float: left;
	}
		#contact_g1 {
			width: 621px;
			height: 46px;
		}
			#contact_title {
				width: 156px;
				height: 46px;
				background-image: url("../images/contact_title.jpg");
				background-repeat: no-repeat;
				float: left;
			}
			#contact_01 {
				width: 465px;
				height: 46px;
				background-image: url("../images/contact_01.jpg");
				background-repeat: no-repeat;
				float: left;
			}
		#contact_content {
			width: 621px;
			height: 254px;
			background-image: url("../images/contact_content.jpg");
			background-repeat: no-repeat;
		}
		
	#contactprofil_separation {
		width: 11px;
		height: 300px;
		background-image: url("../images/contactprofil_separation.jpg");
		background-repeat: no-repeat;
		float: left;
	}
	#profil {
		width: 368px;
		height: 300px;
		float: left;
	}
		#profil_top {
			width: 368px;
			height: 63px;
			background-image: url("../images/profil_top.jpg");
			background-repeat: no-repeat;
		}
		#profil_header {
			width: 368px;
			height: 97px;
			background-image: url("../images/profil_header.jpg");
			background-repeat: no-repeat;
		}
			#profil_header img{
				margin-left: 16px;
				margin-top: 14px;
				float: left;			
			}
			#profil_header span{
				float: left;
				width:200px;
				margin-left: 10px;
				margin-top: 30px;
				font-family: "Verdana",Arial,Serif;
				font-size: 12px;
				font-weight: bold;
				font-style: italic;
				line-height: 18px;
				color: #b2a290;
			}
		#profil_content {
			width: 368px;
			height: 140px;
			background-image: url("../images/profil_content.jpg");
			background-repeat: no-repeat;
		}
			#profil_content span{
				float: left;
				width: 288px;
				margin-left: 16px;
				margin-top: 2px;
				font-family: "Verdana",Arial,Serif;
				font-size: 12px;
				font-style: italic;
				line-height: 21px;
				color: #b2a290;
			}
			#profil_cv{
				position: absolute;
				margin-top: 97px;
				margin-left: 275px;
			}

footer {
	width: 1000px;
	height: 202px;
	margin: 0 auto;
	background-image: url("../images/footer.jpg");
	background-repeat: no-repeat;
}

footer p{
	font-family: "Arial",Verdana,Serif;
	font-size: 12px;
	color: #9c8868;
	padding-top: 20px;
	margin-left: 17px;
}
p.footer_p1{
	padding-top: 40px;
}
p.footer_p2 a{
	color: #778782;
}
p.footer_p3 a{
	color: #b7a983;
}
p.footer_p4{
	color: #a66641;
}
p.footer_p4 a{
	color: #c2794e;
}
span.yellow a{
	color: #b7a983;
}
footer span.bold{
	color: #b2a480;
}
footer span.sep{
	color: #936b24;
}
	#social_networks{
		float:right;
		margin-top:-38px;
		margin-right:15px;
	}
	#social_networks img{
		margin: 2px;
	}

/* Polices, titres et liens
===================== */

h1 { text-shadow: 1px 1px 12px #333; color: #fff; text-align:center; font-size:50px; margin-top:40px; background: rgba(116,109,98,0.3); }
h1 a { }
h1 a:hover { }

h2 { text-shadow: 1px 1px 12px #333; color: #e3c191; text-align:center; font-style: italic; font-size:21px; background: rgba(116,109,98,0.3); }
h2 span.time { /* color: #e3c191; */ }
h2 a { }
h2 a:hover { }

h3 { }
h3 a { }
h3 a:hover { }

a:link, a:active, a:visited { text-decoration: none; outline:0; }
a:hover { text-decoration: underline; }

/* Form
===================== */

form input[type=text], form input[type=email], form input[type=url], form textarea {
	background-color: #5f5040;
	border: 1px solid #453b31;
	opacity: 0.5;
	filter: alpha(opacity = 50);
	font-family: "Verdana",Arial,Serif;
	font-size: 11px;
	color: #e1d7cb;
}
form input[type=image] {
	position: absolute;
	margin-top: -8px;
	margin-left: 283px;
	outline: 0;
}
form label{
	font-family: "Verdana",Arial,Serif;
	font-size: 10.5px;
	font-style: italic;
	line-height: 18px;
	color: #b2a290;
	margin-left: 17px;
}
div.form_txt{
	font-family: "Verdana",Arial,Serif;
	font-size: 12px;
	font-style: italic;
	line-height: 21px;
	color: #b2a290;
	text-align: center;
	position: absolute;
	margin: auto;
	width:621px;
	padding-top: 80px;
	z-index: 500;
}
div.form_txt p{
	background-color: #5f5040;
	border: 1px solid #453b31;
	opacity: 0.7;
	filter: alpha(opacity = 70);
	width: 350px;
	margin: auto;
}
form input.champ_t1{
	width: 203px;
	height: 20px;
	margin-left: 17px;
	margin-bottom: 3px;
}
div.champ_t2{
	margin-top: 14px;
	margin-right: 18px;
	float: right;
}
div.champ_t2 textarea{
	width: 364px;
	height: 193px;
	overflow: hidden;
}
div.champ_t2 label{
	margin-left: 0px;
}
form input.champ_t1[disabled], form textarea[disabled] {
	opacity: 0.3;
	filter: alpha(opacity = 30);
}
form input.champ_t1:focus, form textarea:focus {
	border-color: #bb8e46;
}

/* Divers
===================== */

.float_gauche { float: left; }
.float_droite { float: right; }
.clear { clear: both; }

#gd {
	list-style: none;
	text-align: right;
	margin-right: 18px;
	font-family: "Verdana",Arial,Serif;
	font-style: italic;
	color: #555f64;
	font-size: 13px;
	line-height: 21px;
	letter-spacing: 1px;
}

#wd {
	list-style: none;
	text-align: right;
	margin-right: 18px;
	font-family: "Verdana",Arial,Serif;
	font-style: italic;
	color: #555f64;
	font-size: 13px;
	line-height: 21px;
	letter-spacing: 0.5px;
}

#li {
	list-style: none;
	text-align: right;
	margin-right: 22px;
	padding-top: 10px;
	font-family: "Verdana",Arial,Serif;
	font-style: italic;
	color: #555f64;
	font-size: 13px;
	line-height: 21px;
	letter-spacing: 1px;
}

#gd li{
	background: url("../images/puce_g.png") right center no-repeat;
	padding-right: 21px;
}
#wd li{
	background: url("../images/puce_b.png") right center no-repeat;
	padding-right: 21px;
}
#li li{
	background: url("../images/puce_r.png") right center no-repeat;
	padding-right: 21px;
}

/* Divers Instructions ...
===================== */

#polaroidcontainer { width:653px; height:403px; }

.polaroid { width:190px; height:193px; background-image:url(../images/polaroid-bg.png); position: absolute; cursor: move; cursor: url(../images/hand.png), move; }
.polaroid img { width:154px; height:125px; margin:22px 0 0 17px; cursor: pointer; cursor: url(../images/zoom-in.png), pointer; }
.polaroid p { text-align:center; font-family:Tahoma,Arial,serif; font-size:10.5px; color:#696360; margin-top:6px; }

div.ImgPreloader {
	width:154px;
	height:125px;
	background-image: url(../images/micro-loader.gif);
	background-repeat: no-repeat;
	background-position: center center;
	margin:22px 0 0 17px;
	display:none;
}

.redborder { border:1px solid red; margin:-1px; }

#fond { position:absolute; top:0; left:0; width:100%; height:1560px; background: rgb(70,62,51); background: rgba(70,62,51,0.9); z-index:999; }
#fond p {margin:auto; margin-top:15%; text-align:center; font-family:"Tahoma",Arial,Serif; color:#eee;}

#work_close{
	position: absolute;
	top:7px;
	right:0px;
	margin-right:26px;
	cursor:pointer;
	font-size:17px;
	color: #fa9939;
	text-shadow: 1px 1px 12px #333;
	font-variant: small-caps;
	letter-spacing:2px;
}
#work_close:hover {
	text-shadow: 1px 1px 12px #fa9939;
	text-decoration:none;
}

#work_menu {
	margin: auto;
	text-shadow: 1px 1px 12px #333;
	color: #00adef;
	text-align:center;
	font-size:16px;
	margin-top:30px;
	font-style: italic;
	background: rgba(94,89,82,0.3);
}
#work_menu a {
	margin: auto;
	text-shadow: 1px 1px 12px #333;
	color: #00adef;
	text-align:center;
	font-size:16px;
	margin-top:30px;
	font-style: italic;
}
#work_menu a:hover {
	text-shadow: 1px 1px 12px #00adef;
	text-decoration: none;
}

#work_tasks{
	text-align:center;
	background: rgba(94,89,82,0.3);
	margin-top:35px;
}
#work_tasks a {
	margin: auto;
	text-shadow: 1px 1px 12px #333;
	color: #c9ff23;
	font-size:16px;
	font-style: italic;
}
#work_tasks a:hover {
	text-shadow: 1px 1px 12px #c9ff23;
	cursor: help;
	text-decoration:none;
}
#work_video {
	margin-top: 35px;
	text-align:center;
}
#work_description {
	margin-top: 35px;
	color: #fff;
	text-align:left;
	font-size:16px;
	margin-top:35px;
	font-style: italic;
	background-color:#121c1b;
	padding:10px;
}
#work_images {
	margin: auto;
	width: 1000px;
	margin-top: 35px;
}
div.ImgPreloader2 {
	margin: auto;
	display:none;
	background-color:#121c1b;
	background-image: url(../images/big-ajax-loader.gif);
	background-repeat: no-repeat;
	background-position: center center;
	min-width:66px;
	min-height:66px;
}
#work_images img.miniImgWork {
	cursor: pointer;
}
#work_images img.miniImgWork, img.bigImgWork {
	border: 5px solid #121c1b;
	margin-bottom:4px;
	max-width: 790px;
}
div.description_title {
	color: #ff0179;
	text-decoration: underline;
	font-weight: bold;
	background-color:#121c1b;
	text-align:center;
}
#work_images img.miniImgWork:hover{
	border: 5px solid #ff0179;
	cursor: pointer;
}
	#work_minis {
		float: left;
	}
	#work_minis li {margin: 0; padding:0; list-style: none;}
	#work_minis ul {margin: 0; padding:0;}

	#work_giant {
		margin-right:0px;
		float: right;
		max-width: 790px;
	}


nav ul li.blog {
	margin:0px;
	width:138px;
	height:46px;
	float:right;
}

ul#icons {margin: 0; padding: 0; padding-top:7px;}
ul#icons li {margin-left: 4px; position: relative; padding: 4px 0; float: left;  list-style: none;}
ul#icons li.ui-state-default { cursor: pointer; }
ul#icons li.text a{ font-variant: small-caps; color: #c8c3bb; font-size: 11px; padding: 0px; padding-right:10px; padding-top:9px; cursor:help; text-decoration:none; width: auto; line-height: 1px; }
ul#icons span.ui-icon {float: left; margin: 0 4px;}

div.sucre {
	width: 140px;
	height: 140px;
	position: absolute;
	top: 230px;
	z-index:600;
}
#sucre01 {
	cursor: pointer;
	cursor: url(../images/sucre01.png), pointer;
}
#sucre02 img{
	margin-top: 18px;
	margin-left: 32px;
}
#sucre03 img{
	margin-top: 45px;
	margin-left: 29px;
}
#sucre04 img{
	margin-top: 69px;
	margin-left: 28px;
}

#polaroidpaginationP{
	float:left;
	font-family: BlackJack;
	font-style: italic;
	font-weight: normal;
	color: #1d3f41;
	font-size: 15px;
	padding-top: 5px;
	letter-spacing: 2px;
}
#polaroidpaginationC{
	position: absolute;
	margin-top: 345px;
	margin-left: 460px;
	z-index: 800;
}

#polaroidpagination {
	border:0px;
	padding:0px;
	color: #1d3f41;
	float:left;
}

#polaroidpagination.pagination {
	border:0px;
	text-decoration: none;
	background-color: transparent;
	font-weight: bold;
	font-style: italic;
	font-size: 10px;
}
        
#polaroidpagination.pagination a {
	background-color: transparent;
	background-image: url(../images/pagination.png);
	background-repeat: no-repeat;
	width:31px;
	height:31px;
}

#polaroidpagination.pagination a, .pagination span {
	text-decoration: none;
	padding-top:10px;
    display: block;
    float: left;
	text-align:center;
	border:0px;
	background-color: transparent;
	color: #1d3f41;
}

#polaroidpagination.pagination a:hover {
	background-image: url(../images/pagination_hover.png);
	background-repeat: no-repeat;
}

#polaroidpagination.pagination .current {
	background-color: transparent;
	background-image: url(../images/pagination_hover.png);
	background-repeat: no-repeat;
	text-decoration: none;
	width:31px;
	height:31px;
	border:0px;
}

#polaroidpagination.pagination .current.prev, .pagination .current.next{
	color:#999;
	border:0px;
	text-decoration: none;
}

span.hotTxtPolaroid {
	color:#8d4848;
}

#alert-browser {
	position: fixed;
	width:100%;
	height:97px;
	display: none;
	bottom: 0;
	background-color:#5e4848;
	background-image: url(../images/idp/bg_alert_bg.gif);
	background-repeat: repeat-x;
	z-index:999;
}
#alert-browser span.browser-alert-close{
	float: right;
	margin-top: 10px;
	margin-right: 20px;
	cursor: pointer;
	font-variant: small-caps;
	letter-spacing:2px;
	font-size:11px;
	color:#fa9939;
}
#alert-browser p {
	width:80%;
	margin: auto;
	text-align:center;
	margin-top:22px;
	color: #ecdbdb;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 13px;
}
#alert-browser p.browser-dl {
	margin-top:12px;
	font-size: 13px;
}
#alert-browser p span.info {
	font-size:0.8em;
	font-style: italic;
}
#alert-browser p a {
	color: #c8b28c;
}