/* Votre Style */

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700,800,300);
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700);
@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,700);
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700,300);

/*Grosse police*/
@font-face {
    font-family: 'HelveticaBlack';
    src: url('helvetica-condensed-black-webfont.eot');
    src: url('helvetica-condensed-black-webfontd41d.eot?#iefix') format('embedded-opentype'),
         url('helvetica-condensed-black-webfont.woff') format('woff'),
         url('../helvetica-condensed-black-webfont.html') format('truetype'),
         url('helvetica-condensed-black-webfont.svg#helvetica_condensed_blackRg') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'helvetica_condensedmedium';
    src: url('helvetica-condensed-light-webfont.eot');
    src: url('helvetica-condensed-light-webfontd41d.eot?#iefix') format('embedded-opentype'),
         url('helvetica-condensed-light-webfont.woff') format('woff'),
         url('../helvetica-condensed-light-webfont.html') format('truetype'),
         url('helvetica-condensed-light-webfont.svg#helvetica_condensed_lightRg') format('svg');
    font-weight: normal;
    font-style: normal;

}

html, body {
	height: 100%;
}

body{
	background-image : url(fond_imp3d.jpg);
	background-position : top center;
	background-color:black;
	background-repeat: no-repeat;
	color:white;
	font-weight: 300 !important;
	font-family : "Helvetica", Arial;

}

a{
	color:white;
	text-decoration: none;
	/*vertical-align: middle;*/
}

a.nav_text{
	font-size: 20px;
	font-weight: 300;
	margin: 0 5px;
	line-height: 35px;
	margin: 0px 0px;
	padding:50px 7px 0;
}

h1, .h1-like{
	font-size : 2em;
}

.h1-like{
	font-weight: 700 !important;
}

/*************************************************haeder***************************************/



ul#menu{
	width: 950px;
	margin: 0 auto;
	height: 88px;

}

ul#menu>li{
	display:block;
	float:left;
	display: block;
	height : 90px;
	font-family: "HelveticaBlack" , "Helvetica" , "Arial";
	line-height: 100px;
	margin: 0 2px;
}

ul#menu>li>a{
	display: block;
	/*min-height: 100%;*/
	height:90px;
}

ul#menu>li.sm{
	/*background-color: lightgray !important;*/
}

ul#menu>li.sm>a{
	/*background-color: lightgreen !important;*/

	opacity: 0.999;
}



ul#menu>li.sm>div.sm_container{
	background-color: black !important;
	box-shadow : 0px 0px 15px black;
	border-top: 3px #C8632D solid;
	font-family: Arial, sans-serif;
	z-index:9999;
	display:none;

	position:absolute;
	padding: 0 5px;
	margin-left: -230px;
	margin-top: -3px;
}

ul#menu>li.sm>div.sm_container>ul,
ul#menu>li.sm>div.sm_container>span.separateur_vertical{
	padding: 0 !important;
	display: inline-block;
	position: relative;
	vertical-align: top;
	top: 0;
}

ul#menu>li.sm>div.sm_container>span.separateur_vertical{
	height: 440px;
	margin: 10px 2px;
	border-left: 1px solid #CE6531;
}

ul#menu>li.sm>div.sm_container>ul>li{
	border-bottom: 1px grey dashed;
	line-height: 1.5em;
	/*margin: 10px 10px 0px 10px;*/
	padding: 10px 3px;
	display: block;
}

ul#menu>li.sm>div.sm_container>ul>li>a{
	display:block;
}

ul#menu>li.sm>div.sm_container>ul>li div{
	display: inline-block;
}

ul#menu>li.sm>div.sm_container>ul>li div span{
	color: #EF9A4A;
	font-weight: bold;
}

ul#menu>li.sm>div.sm_container>ul>li div.miniature_produit{
	display: inline-block;
	vertical-align: top;
	height: 100%;
	width: 40px;
	margin-right: 5px;
}

ul#menu>li.sm>div.sm_container>ul>li:hover{
	background-color: #C8632D !important;
}

ul#menu>li.sm>div.sm_container>ul>li:hover span{
	color: white;
}

ul#menu>li.sm>div.sm_container>ul>li.last{
	border-bottom: none !important;
}

ul#menu li ul{
	font-weight: 300 !important;
	position: absolute;
	background-color: black;
	top: 80px;
	color:white;
}



ul#menu li ul li {
	list-style-type: none;
}

ul#menu li ul li b {
	font-weight: bold;
}

#container{
	width: 1200px;
	margin: 2em auto;
}


nav#menu{
	font-size: 1.5em;
	color:white;
}

nav#menu a{
	color:white;
	text-decoration:none;
	font-family : "HelveticaBlack" , "Helvetica" , "Arial";
}

#menu a#acheter{
	color:#C8632D;
}

nav#menu a.nav_text{
	display:inline-block;
	padding:3em 1em 0.5em 1em;
	line-height: 1em;
	vertical-align: top;
}

a.nav_text:hover , a.nav_text:active , a.active, ul#menu>li.sm:hover{
	border-bottom : 3px #C8632D solid;
	background-color: #262625;
}









/**************************SLIDER*****************************/


#slider_container{
	width: 1010px;
	margin: 0 auto;
	margin-top : 25px;
}

#slider_container:after{
	clear:both;
}


#slider_container div.slider-control{
	height: 300px;
	display:table-cell;
	vertical-align:top;
	padding-top: 200px
}


section#slider{
	width:880px;
	margin : 0 auto;
}


.slides{
	width:880px;
	margin: 0 auto;

}

.slider-control{
	width: 61px;
}

ul.slides li div{
	/*min-height : 400px;*/
}

/****************slide1***********************/

#slide1 > img{
	float: left;
	margin-left: -50px;
}

.img_bobine{
	margin-left:50px;
}

#first_desc{
	float: left;
	width: 400px;
}

#first_desc p.fond_transparent_blanc{
	background-image: url(png_fond_blanc_transparent.png);
	line-height: 0.9em;
	font-family: "Roboto Condensed","Helvetica","Arial";
	font-weight: 300;
	padding: 5px 15px;
	font-size: 1.1em;
	color:white;
	text-align: justify;
}

#first_desc p.fond_transparent_blanc .exemples_creation{
	display: block;
	text-align: center;
	margin-top: 20px;
}

#first_desc p.fond_transparent_blanc .exemples_creation img{
	vertical-align: baseline;
	margin-right: 15px;
}

#first_desc p.fond_transparent_blanc .exemples_creation img:last-child{
	margin-right: 0;
}

#first_desc p.fond_transparent_blanc a{
	color:white;
	text-decoration: underline;
	font-weight: 300;
}

#first_desc p.fond_transparent_blanc a:hover{
	color: #cecece;
}

#first_desc div.h-background{
	margin-top : 30px;
	background-image: url(png_fond_blanc_transparent.png);
}

#first_desc div.h-background div{
	font-size: 1.6em;
	font-family: "Roboto","Helvetica","Arial";
	color: white;
	border-left: 5px #7B8793 solid;
	border-right: 5px #7B8793 solid;
	line-height: 2.2em;
	letter-spacing: -0.01em;
	color: #fff;
    font-weight: 700;
	padding: 0 10px;
}

#first_desc .border_div{
	margin-top: 4px;
	border-top: 2px #7B8793 solid;
}

/******************slide2****************************/

#slide2-container{
	width: 950px;
	margin: 0 auto;
	background-color: #e3e5e2;
	color:black;
	border: 6px solid #6e838e;
	padding: 15px;
	font-family:  "Roboto Condensed" , "Helvetica" , "Arial";
	font-size:1.2em;
	font-weight:300;

}

#slide2-container h2{
	font-size : 1.4em;

}


#desc_imp_mini , #desc_coque_iphone{
	float:right;
	margin-left: 20px;
}

#desc_tete_mini{
	float:left;
	margin-right: 20px;
	border: 2px black solid;
	border-radius: 2px;
	box-shadow: 3px 3px 5px #333;
}



/************************slide3*********************/

#slide3-container{
	width: 950px;
	background-color: #e3e5e2;
	color:black;
	border: 6px solid #6e838e;
	padding: 15px;
	font-family: "Roboto Condensed", "Helvetica" , "Arial";
	font-size:1.2em;
	width:60%;
	float:right;
	margin-right: 50px;
}

#slide3-container h2{
	font-size : 1.4em;
}

#slide3-container p.desc_line{
	line-height:2em;
}

#slide3-container p#intro{
	font-size: 0.9em;
}

.exemples{
	text-align:center;
	margin-top: 20px;
}

.exemples img{
	margin-right: 8px;

}

.column-left{
	float:left;
	width: 30%;

}

.column-left #imp_spec{

	display:block;
	width: 100%;
	/*margin-bottom: 0px;*/

}


.column-left div#imp_detail {
	background-color: white;
	border: 6px solid #6e838e;
	padding:10px;
	width: 80%;
	margin: 0 auto;
}

.column-left div#imp_detail h2{
	color:black;
	font-size : 0.8em;
	text-align:center;
	border: 1px lightgray solid;
	border-radius :2px ;
	margin-top : 10px;
}

.column-left div#imp_detail a img{
	width: 100%;
}

/***************************slide4***************************/

#slide4,
.slide4{
	font-size:1.1em;
}

#slide4-container,
.slide4-container{
	width: 950px;
	margin: 0 auto;
	background-color: #e3e5e2;
	color:black;
	border: 6px solid #6e838e;
	padding: 15px;
	font-family: "Roboto Condensed", "Helvetica" , "Arial";
}

#slide4-container h2,
.slide4-container h2{
	margin-bottom : 25px;
	font-size : 1.4em;
}

.avis_personne{
	width: 20%;
	float:left;
}

.avis_texte{
	width: 79%;
	float:right;
	margin-bottom:25px;
	font-style: italic;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

.avis_texte:after{
	float:none;
}

.min_impo3D{float:right;margin:10px;}

/*****************************realisations***********************/

.realisation{
	width: 32.21%;
	float:left;
	display : inline-block;
	background-color: #F4F4F4;
	border:1px #D5D7D6 solid;
	margin-bottom: 25px;
	margin-right: 1.63%;
}

.realisation_end{
	margin-right: 0;
}

.realisation>span>img{
	width: 90%;
	margin: 5% 5% 15px 5%
}

.realisation>span>.img_wrapper{
	min-height: 220px;
	max-height: 220px;
	overflow: hidden;

}

.realisation>span>.img_wrapper>img{

    max-height: 220px;
    max-height: 340px;
    max-width: 340px;
   /*	margin-left: -10%;*/
}

.realisation p{
	margin:10px 10px 0 10px;
	padding-bottom: 10px;
}

.realisation p.origine{
	width:80%;
}

.realisation p.nb_images{
	float:right;
	width: 10%;

}

.realisation p.zoom{
	position:relative;
	top: -40px;
	text-align:right;
	margin-bottom: -40px;

}

.realisation p.nb_images img{
	margin-top:-3px;
}



.realisation p.desc{
	height: 30px;
}

.realisation p.origine a, .realisation p.desc a, .realisation p.link a, .realisation p.link span{
	color:black;
	font-weight: 700;
}

#envoi_realisation,#envoi_avis,#form_contact{
	display:inline-block;
	margin: 15px 0px ;
	min-width: 400px;
}



/****************************drivers*****************************/


table#drivers{
	width: 100%;
	border:2px white solid;
	border-spacing:0;
	border-radius: 10px 10px 0px 0px;
}

table#drivers thead tr th {
	border-bottom: 2px white solid;
	text-align:left;
	padding-left: 10px;
	font-size:1.4em;
}

table#drivers tbody tr td{
	border-bottom: 2px white dashed;
	padding-left: 10px;
}

table#drivers tbody tr td a img{
	margin-left:30px;
}

table#drivers tbody tr:last-child td{
	border:0;
}

table#drivers td{
	height: 50px;
}

table#drivers tr:hover{
	background-color: #BFC1BF;
	cursor: pointer;
}

/****************************footer*****************************/



.footer {
	background-image: url(fond_footer.jpg);
	background-repeat: repeat-x;
	width:100%;
	height: 80px;
   	margin-top: 20px;
}

.footer .wrapper{
	width: 880px;
	margin: 0 auto;
	color:black;

}

.footer .wrapper .contact {
	font-family: "HelveticaBlack","Helvetica","Arial";
	padding-top:10px;
	color:black;
	float:right;
	width : 175px;
	margin-top: 0px;
}


.footer .wrapper .contact p {
    margin-bottom: -9px;
    margin-right: 23px;
    margin-top: -4px;
    text-align: right;
}

.footer .wrapper .avis_client {
	font-family: "Roboto Condensed","Helvetica","Arial";
	text-align:left;
	color:black;
	float:left;
	width : 450px;
	height: 80px;
	line-height:80px;
}

.footer .wrapper>div:first-child p{
  width:420px; /* largeur zone de texte */
  vertical-align:middle;
  display:inline-block;
  line-height:1.2; /* on rétablit le line-height */
  text-align:left; /* ... et l'alignement du texte */
}

.footer .wrapper p.btn_avis{
	width: 200px;
	float:left;
	padding-top:20px;
}

.footer .wrapper>div p a{
	font-weight:900;
	color:black;
}


/*****************************************formulaire de contact***********************************/

h1#contact-title{
	margin-top :5px !important;
	margin-bottom : 1em;
}

.grid1-2.form-row{
	margin-bottom:20px;
}

.mbot15{
	margin-bottom: 15px;
}



/*********************************** popup details*************************************/

.detail_realisation{
	width: 700px;
	font-family : "Roboto Condensed","Helvetica","Arial"
}

.big_image img{
	display:none;
	border:1px white solid;
}

.miniature, .detail_realisation p, .big_image img.current{
	display:block;
	width: 90%;
	margin: 10px auto;

}

.miniature {
	text-align:center;

}

.miniature a img{
	height: 90px;
	text-align: center;
	border:1px white solid;
}

/***************************************popup general***********************************/

div form{
	width: 100%;
	margin: 10px;
}

div form p , div form > div {
	width: 100%;
}

div form p label , div form>div label{
	display:inline-block;
	width:25%;
	min-width: 140px;
	text-align:right;
}

div form p input[type='text'],div form p input[type='file'] , div form p textarea , div form > div input[type='file']{
	display:inline-block;
	font-size: 12px;
	width : 50%;
	margin-left: 10px;
}

div form p textarea{
	height : 80px;
}

div form p input[type='image'] , div form p input[type='button'] , div form p input[type='submit']{
	margin-left : 50%;
}

div form>div.upload #progress{
	background-color: white;
	margin-left: 27%;
	width: 50%;
}

div form>div.upload #progress>#bar{
	background-color: #3AF84B;
	height: 20px;
	width: 0;

}

div form>div.upload #percent{
	margin-top:-21px;
	text-align:center;

}

/********************************popup deposer un avis***************************/


.envoi_avis h1 span img {
    padding-bottom: 10px;
}



/*********************************message**************************/
.error {
    background-color: #E1C7C7;
    box-shadow: 0 0 5px #B4B4B4;
    color: #FF0000;
    padding: 10px;
}

.warning {
    background-color: #EECF8A;
    box-shadow: 0 0 5px #B4B4B4;
    color: #915A0A;
    padding: 10px;
}

.info{
   	background-color: #A9D5F1;
    box-shadow: 0 0 5px #B4B4B4;
    color: #0C699A;
    padding: 10px;
}

.success{
	background-color: #93D68B;
    box-shadow: 0 0 5px #B4B4B4;
    color: #066311;
    padding: 10px;
}


.test_envoi_rea{
	margin-bottom: 25px;
	display:none;

}

.test_envoi_rea_container{
	border: 4px #6E838E solid;
}

.upload_form p{
	margin-left: 10px;
}


/********************produits*************************/

.produits{

	width : 80%;
	margin: 0 auto;
}

.produits h2>span{
	color: #C8632D;
}

.produits div.container{
	width: 68%;
	float:right;
}

.produits img{
	/*width : 280px;*/
	float : left;
	margin-right: 20px;
}

.produits h2+p{
	margin-top : -25px;
	margin-right: 25px;
}

.produits hr:before{
 	content: url("ico_plus.png");
    position: relative;
    top: -9px;
    margin-left: -18px;
}

.produits hr{
	color: transparent;
	/*border-bottom : 1px darkgrey dashed;*/
	margin-top: 15px;
	margin-left: 18px;
	display: block; height: 1px;
	border: 0; border-top:  1px darkgrey dashed;
	/*margin: 1em 0;*/ padding: 0;
}


.produits p a , .texte p a{
	color:black;
	font-size: 16px;
	font-weight: 700;
	text-decoration:underline;
	font-size: 1em;
}

.produits p a:after , .texte p a:after{
   content: url("ico_lien.png");
   margin-left: 5px;
}

img.acheter_en_ligne{
	width: inherit;
	float:none;
	margin-top: 20px;
}
/*
.produits a{
	transition-duration: 0.2s;
	font-size : 1.8em;
	color: red;
	font-weight: 900;
	display : inline-block;
	background-color: rgba(255,255,255,0.5);
	box-shadow : 0px 0px 1px darkgrey;
	padding :  0px 15px 0 15px;
	line-height : 34px;
	vertical-align: top;
	margin-top: 15px;
}

.produits a:hover{
	transition-duration: 0.5s;
	transform-origin : 50% 50%;
	-webkit-transform:perspective(900) rotateX(-45deg);

	background-color: rgba(255,255,255,1);

}	*/



/***************************packs*****************************/

.pack .partie1{

}

.pack .partie1 h1{
	text-align: center;
}

.pack .partie1 h1 span , .pack > h2 > span{
	color: #C8632D;
}

.pack .partie1 img{
	float:left;
	margin-right : 20px;
}

.pack .partie1 .texte{
	width: 57%;
	float:right;
}

.pack .partie1 .texte p{
	max-width: 92%;
}


.pack .partie1 .texte h2{
	margin-top : 30px;
}

.pack .partie1 .texte hr,
.pack .partie1 + hr{
	/*color: transparent;
	border-bottom : 2px #6E8591 dashed;
	margin : 25px 0 ;*/
	display: block; height: 1px;
    border: 0; border-top:  2px #6E8591 dashed;
    margin: 1em 0; padding: 0;
}

.pack .partie1 .texte hr.plus ,
.pack .partie1 + hr.plus{
	width: 92%;
}

.pack .partie1 .texte hr:before{
	content : url(ico_plus.png);
	position: relative;
	top: -9px;
	left: -2px;
	border: none;
	height: 2px;
}

.pack .partie1 + hr{
	clear:both;
}

.pack_description p{
	width : 100%;
}

.pack_description p a{
	color: inherit;
	text-decoration: underline;
}

.pack_description h2{
	font-size: 2em !important;
}

.pack_description h2 span , .pack > h2 > span{
	color: #C8632D;
}

.cursor{
	cursor: pointer;
}

/* COOKIES LAW */

#cookie-law {
	background:  #fff;
	left: 0;
	top:0;
	width: 100%;
	position: relative;
	z-index:39;
}

#cookie-law p {
	font-size:13px;
	color:#444;
	margin:0 auto;
	width: 950px;
	position: relative;
	height: 30px;
	line-height: 30px;
}

#cookie-law p .close{
	position: absolute;
	right:0;
	width: 40px;
	text-align:center;
	font-size: 1.2em;
}

body.cookie-banner{
	background-position: center 30px;
}

/*************************** Page avis client *****************************/

.left-menu {
	background-color: #E3E5E2;
	border-right: 3px solid #6E838E;
	margin-right: 10px;
}

.left-menu > .menu-title {
	font-size: 1.3em;
	font-weight: bold;
	text-align: center;
	border-bottom: 3px solid #6E838E;
}

.left-menu > ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.left-menu > ul > li {
	font-weight: bold;
	border-bottom: 1px dashed #6E838E;
	border-right: 3px solid #E3E5E2;
}

.left-menu > ul > li.last {
	margin-bottom: 0;
	border-bottom: none;
}

.left-menu > ul > li:hover,
.left-menu > ul > li.selected {
	background-color: #C6CFC6;
	border-right: 3px solid #C8632D;
}

.left-menu > ul > li > a {
	display: block;
	color: inherit;
	padding: 5px;
	text-align: right;
}

.left-menu > ul > li > a > span {
	vertical-align: middle;
}

.left-menu > ul > li > a > span.menu-image {
	float: left;
	margin-right: 3px;
}

.left-menu > ul > li > a > span.menu-texte {
	float: right;
	margin-top: 10px;
}

/*************************** PrintMeASheep *****************************/

.printmeasheep .text_input {
	height: 35px;
	width: 250px;
}

.printmeasheep .search_button {

}

img.pmas {
	height: 220px;
}

.presentation a {
	color: black;
	text-decoration: underline;
}

hr.dashed {
	height: 0;
	border: none;
	border-top: 1px dashed black;
}