@charset "UTF-8";
/* CSS Document */
* {
	margin:0;
	padding:0;
	}
	
p{
	padding-bottom:10px;
	width:600px;
	line-height:normal;
	text-align:justify;
}


#award_p {
	padding-bottom:10px;
	width: auto !important;
	text-align: right !important;
	text-transform: uppercase;
}

#logo_bas{width:800px;margin-top:-10px;}



a{
	text-decoration:none;
	color:#FFFFFF;
}


#langues { 
	padding:0; 
	margin:0;
	position:absolute;
	top:17px; 
	right:17px;
	font-size:10px;
} 
#langues li { 
	list-style-type:none;
	display: inline;
	margin-left:7px;
 } 
 
#langues a:hover { 
	color:#038099;
	font-size:10px;
}

.select-lang {
	color:#038099;
} 
 
#langues a { 
	color:#ffffff;
	font-size:10px;
 } 
 
 

a:hover{
	text-decoration:underline;
	color:#FFFFFF
}
	
	
body {
	text-align:center;/*centers all content in the browser window*/
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:13px;
	background:#474747 url(../images/background.gif);
	line-height:15px;
	color:#FFFFFF;
}

textarea {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}

h3{font-size:13px;}
	
#contact_block{
	position:absolute;
	top:120px; 
	right:0px; 
	width:300px;
	height:200px;
	text-align:left; 
	padding-right:150px; 
	padding-left:20px; 
	padding-top:25px;
	padding-bottom:45px;
	background-image:url(../images/pngback.png);
}
	
#container_template_04 {
	width: 1000px;
	position: absolute;
	margin-left:-500px;
	margin-top:0;
	left: 50%;
	height:800px;
	z-index: 2;
	overflow: hidden;
	/*background-image:url(admin/uploads/16/originals/<?=$r_img->filename.".".$r_img->filetype?>);*/
}	
	
#home1 {
	width: 300px;
	position:absolute;
	/*margin-top:-100px;*/
	}
	

	
#home2 {
	width: 500px;
	position: absolute;
	margin-left:380px;
	/*margin-top:-100px;*/
	z-index:2;
	}
	
.upper {
	text-transform: uppercase;
	text-align:left;
	width: 500px !important;
}	

.upper2 {
	text-transform: uppercase;
	text-align:left;
	width: 500px !important;
	color: #999999;
}	
.upper2:hover {
	text-transform: uppercase;
	text-align:left;
	width: 500px !important;
	color: #999999;
	text-decoration:none;
}
	
#header {
	width:1000px;/*keeps sizing*/
	height:100px;
	float:left;/*is needed for all uneven size panels to float properly*/
	background-image:url(../images/top.png);
	text-align:left;
	}
	
#logos{
	position:absolute;
	top:260px;
	right:25px;
	width:250px;
}

.logos{
	margin: 0 0 0 10px;
}

.logos2{
	margin: 0 20px 10px 0;
}

.logos4{
	margin: 0px 20px 10px 0;
	position:absolute;
}

.logo_winning {
	float: left;
	width: 270px;
	font-size: 11px;
}

.logos3{
	margin: 0 0 0 20px;
	color: #000000;
}

#logos2 {
	position:relative;
	left: 0px; 
	width:216px;
	height: 62px; 
	margin-right:30px;
	line-height:normal;
	padding:20px 10px 20px 0px;
	background-image: url(../images/index_imgback.png) ;
	background-repeat:no-repeat;
	margin-top: 90px;
}	


	
#text_award	{
	text-align: right !important;
	margin-right:10px;
}

#text_award	h2 {
	text-transform: uppercase;
	font-size: 15px;
}

#award	p{
	text-align: right !important;
	margin-right:10px !important;
}

#content_template_01 {
	width:1000px;/*keeps sizing*/
	height:630px;
	float:left;
	background-image:url(../images/pngback.png);
}

#content_template_01_bis {
	width:1000px;/*keeps sizing*/
	height:630px;
	float:left;
	background:url(../images/background_winning.png) no-repeat;
}

#sitemap {
	width:1000px;/*keeps sizing*/
	height:auto;
	float:left;
	background-image:url(../images/pngback.png);
}
	
#content_template_02 {
	text-align:left;
	width:1000px;/*keeps sizing*/
	height:630px;
	float:left;
	background-image:url(../images/pngback2.png);
}



#content_template_02bis {
	text-align:left;
	width:1000px;/*keeps sizing*/
	height:630px;
	float:left;
	background-image:url(../images/pngback2.png);
}



#content_template_03 {
	width:1000px;/*keeps sizing*/
	height:530px;
	float:left;
}

#content_template_04 {
	width:1000px;/*keeps sizing*/
	height:165px;
	float:left;
}


#content_inside_template_01 {
	width:960px;/*keeps sizing*/
	height:500px;
	text-align:left;
	float:left;
	padding:50px 20px 0 20px;
}

#content_inside_sitemap {
	width:960px;/*keeps sizing*/
	height: auto;
	text-align:left;
	float:left;
	padding:20px 20px 0 20px;
}
	
	
#mission_format{
	margin-top:300px;
}
	
div#scrollable{
	width:550px;
	height:510px;
	overflow:auto;
}

div#scrollable p{
	padding-bottom:10px;
	width:490px;
	line-height:normal;
	text-align:justify;
}

div#scrollable2{
	width:650px;
	height:155px;
	overflow:auto;
}

div#scrollable3{
	width:460px;
	height:445px;
	overflow:auto;
}

div#scrollable3 p{
	padding-bottom:10px;
	width:440px;
	line-height:normal;
	text-align:justify;
}

div#scrollable4{
	width:300px;
	height:145px;
	overflow:auto;
}

div#scrollable4 p{
	padding-bottom:10px;
	width:280px;
	line-height:normal;
	text-align:justify;
}

div#scrollable5{
	width:580px;
	height:145px;
	overflow:auto;
}

div#scrollable5 p{
	padding-bottom:10px;
	width:540px;
	line-height:normal;
	text-align:justify;
}

	
#text-page-bottom{
margin-top:390px;
}	

.image {
	width: 320px;
	height: 390px;
	position: absolute;
	top: 220px;
	left: 620px;
	overflow: hidden;
}	
	
#content_inside_template_02 {
	width:960px;/*keeps sizing*/
	height:200px;
	text-align:left;
	float:left;
	padding:30px 20px 0 20px;
}

#content_inside_template_04 {
	width:960px;/*keeps sizing*/
	height:160px;
	text-align:left;
	float:left;
	padding:60px 20px 0 20px;
}


#content_inside_template_03 {
	width:960px;/*keeps sizing*/
	height:100px;
	text-align:left;
	float:left;
	padding:0 20px 0 20px;
}

#pdf{
	margin-top:-10px;
}
		
#logo {
	width:231px;/*keeps sizing*/
	height:62px;
	float:left;/*is needed for all uneven size panels to float properly*/
	background-image:url(../images/logo.gif);
	text-indent:-9999px;
	position:absolute;
	top:13px;
	left:13px;
}
	
#footer {
	width:990px;/*keeps sizing*/
	height:60px;
	float:left;/*is needed for all uneven size panels to float properly*/
	background-color:#000000;
	text-align:left;
	float:left;
	color:#736f6f;
	font-size:10px;
	padding-left:10px;
	padding-top:10px;
	position:relative;
}

#footer_index{
	width:990px;/*keeps sizing*/
	height:60px;
	float:left;/*is needed for all uneven size panels to float properly*/
	background-color:#000000;
	text-align:left;
	float:left;
	color:#736f6f;
	font-size:10px;
	padding-left:10px;
	padding-top:10px;
}


	
#footer a, #footer_index a {
	color:#736f6f;
}
	
#footer :hover {
	color: #FFFFFF;
}
	
#maadigroup {
	width:125px;/*keeps sizing*/
	height:45px;
	float:right;
	text-indent:-9999px;
	position:relative;
	right:13px;
}

.maadigroup {
	width:125px;/*keeps sizing*/
	height:45px;
	float:right;
	background-image:url(../images/maadigroup.gif);
	text-indent:-9999px;
	margin: 3px 13px 0 0; 
}		
	
#maintitle {
	font-size:22px;
	font-weight:bold;
	padding-bottom:15px;
	line-height:normal;
	height: 55px;
}	
	
#maintitle2 {
	font-size:22px;
	font-weight:bold;
	padding-bottom:15px;
	color:#038099;

}	

#maintitle3 {
	position:relative; 
	margin-top:45px; 
	left:20px; 
	text-align:left;
	line-height:normal; 
	width:450px
}

#maintitle4 {
	font-size:22px;
	font-weight:bold;
	line-height:normal;
	height: 35px;
}

#hometext {
	position:relative; 
	margin-top:10px; 
	left:20px; 
	text-align:left; 
	width:380px;
	height: 120px;
}

#hometext p{
	padding-bottom: 0;
	width:400px;
}
	
/*------------------------------MENU START ------------------------------*/
	
#wrap {
   font-size: 12px;
   width: 1000px;
}

/* These styles create the dropdown menus. */

.under-menu-back {
	background: url(../images/top_under.png);
	z-index: 100;
}
 
#navbar li {
   list-style: none;
   float: left;
   color:#9D9EA3; 
}

#navbar li a {
   display: block;
   padding:0 10px 7px 7px;
   text-decoration: none; 
   color: #9D9EA3;
   cursor: pointer;
}

#navbar li a.no-select:hover {
   color: #fff;
   text-transform: uppercase;
}

#navbar li ul {
   display: none; 
}

#navbar li:hover ul, #navbar li.hover ul {
   position: absolute;
   display: inline;
   left: 0;
   width: 700px;;
   margin: 0;
   padding: 0;
}

#navbar li:hover li, #navbar li.hover li {
   float: left;
}

#navbar li:hover li a, #navbar li.hover li a {
   color: #FFF; 
}

#navbar li li a:hover {
   color: #FFF; 
}
 
 
.sous {color: #9d9ea3; font-size:11px;}

#about li a.sous:link, #product li a.sous:link, #application li a.sous:link  {color: #9d9ea3; text-decoration: none; font-size:12px;}
#about li a.sous:hover, #product li a.sous:hover, #application li a.sous:hover {color: #FFFFFF; text-decoration: none; font-size:12px;}

#about li a.sous, #product li a.sous, #application li a.sous{
	color: #9d9ea3; 
	text-decoration: none; 
	font-size:12px;
}

#about ul, #product ul, #application ul {
	list-style: none;
}

#about li, #product li, #application li{
	display: inline;
}

ul#navbar li a.select {
	color: #0099CC;
	text-transform: uppercase;
}

ul#navbar li a.no-select {
	color: #9D9EA3;
	text-transform: uppercase;
}

#about ul li a.sous-select, #product ul li a.sous-select, #application ul li a.sous-select {
	color: #0099CC;
	font-size: 12px;
}

#footer a.select {
	color: #038099;
}
/*------------------------------ MENU END ------------------------------*/


.share {
	position: absolute;
	top: 30px;	
}

.share2 {
	position: absolute;
	top: 745px;	
}

#lbCaption p{
	width: 100% !important;
}

#contenu {
	width:620px;
}

#contenu ul{
	list-style:circle;
}
#contenu ul li{
	margin-bottom:10px;
	font-size:12px;
}
#contenu ul li span{
	font-weight:bold;
}

/*------------------------------ CUSTOMIZE -----------------------------------*/

 #step1_a, #step1_b, #step1_c {
	float: left;
}

#step1_a {
 	background: #323232;
	height: 270px;
	width: 150px;
}

#step1_b {
	width: 160px;
	height: 260px; 
	background: #3e3e3e;
	margin-top: 10px;
}

#step1_c {
	width: 150px;
	height: 250px; 
	background: #616262;
	margin-top: 20px;
}

#step2_a, #step2_b, #step2_c,#step2_d, #step2_e, #step2_f, #step2_g {
	background: #424346;
	height: 300px;
    position: absolute;
    top: 330px;
    width: 400px;
	padding-left: 40px;
	z-index: 100;
}

#text_length, #text_width {
	width: 60px;
	height: 18px;
}

#text_length_box, #text_width_box {
	height: 15px;
    text-align: right;
    width: 50px;
}

#step1, #step2, #step3 {
	float: left;
	width: 1000px;
}
#next1, #next2, #next3, #next4, .back, #back, #next5 {
	cursor: pointer;
	font-weight: bold;
}

#next3 {
	font-size: 25px;
    font-weight: bold;
    left: 740px;
    position: absolute;
    top: 60px;
	display: none;
}

#next5 {
	position: absolute;
	left: 372px;
	top: 7px;
	text-align: left;
	z-index: 2;
	font-size: 11px;
}

#bridge {
	background: url(../images/PNG/base.png);
	width: 2000px;
	height: 630px;
	float: left;
}

#bridge_end, #bridge_kickplate, #bridge_decking, #bridge_finish, #bridge_fencing, #bridge_features, #bridge_system, #bridge_top {
	position: absolute;
	width: 2000px;
	height: 630px;
	display: block;
}

#bridge_end {
	z-index: 1;
}

#bridge_decking {
	z-index: 2;
}

#bridge_finish {
	z-index: 3;
}

#bridge_kickplate {
	z-index: 4;
}

#bridge_fencing {
	z-index: 5;
}

#bridge_features {
	z-index: 6;
}

#bridge_system {
	z-index: 7;
}

#bridge_top {
	z-index: 8;
}

.displaynone {
	display: none;
}

.box1, .box2, .box3 {
	float: left;
	width: 220px;
	position: absolute;
}

.box1 {
	right: 590px;
    top: 378px;
	z-index: 100;
}

.box2 {
	right: 325px;
	z-index: 100;
}

.box3 {
	right: 60px;
	z-index: 100;
}

.floatright {
	float: right;
    text-align: right;
    width: 250px;
	padding: 5px 10px 35px 0;
}

.floatright2 {
	float: right;
    width: 300px;
	padding-right: 10px;
}

#box .floatright2 p{
	width: 50px !important;
	text-align: left !important;
}

.floatleft {
	float: left;
}

.floatright_step3 {
	float: right;
    text-align: right;
    width: 250px;
	padding: 5px 10px 0 0;
	font-size: 12px;
}

.floatright_input {
	float: right;
    text-align: right;
	margin: 0 10px 10px 0;
	cursor: pointer;
}

.floatright_input_step2 {
	left: 371px;
    position: absolute;
    text-align: right;
    top: 10px;
	z-index: 2;
	cursor: pointer;
}

.floatright_back_step2 {
	left: 310px;
    position: absolute;
    text-align: right;
    top: 10px;
	z-index: 2;
	cursor: pointer;
}

.floatright_input1 {
	float: right;
    text-align: right;
	margin: 0 5px 0 0;
}

#content_template_customize {
	text-align: left;
	width: 3000px;/*keeps sizing*/
	height: 630px;
	float: left;
	background: #4d4c4e;
	position: relative;
}

#custom_h1 {
	width: 960px;
	border-bottom: 1px solid #ffffff;
	padding-left: 40px;
	padding-top: 60px;
	z-index: 100;
	height: 80px;
}

#custom_h1 p, .custom_step2_h1 p{
	padding-top: 7px;
}

#custom_h2 {
	padding-top: 30px;
	height: 200px;
	width: 960px;
	padding-left: 40px;
	color: #0099CC;
	z-index: 100;
}

#custom_h2  h2{
	padding-bottom: 10px;
}

.custom_step2_h1 {
	width: 960px;
	border-bottom: 1px solid #ffffff;
	padding-left: 40px;
	padding-top: 60px;
	position: absolute;
	z-index: 100;
}

.custom_step2_h2 {
	position: absolute;
	padding-top: 30px;
	width: 960px;
	padding-left: 40px;
	top: 130px;
	z-index: 100;
}

.custom_step3_h2 {
    position: absolute;
    text-align: right;
    top: 165px;
    width: 980px;
	z-index: 100;
}

.custom_step3_h2 p {
	float: right;
    text-align: right;
    width: 490px;
}

.custom_step2_h2 h2, .custom_step3_h2 h2 {
	color: #0099CC;
}

.radio, .radio2 {
	float: left;
    font-weight: bold;
    line-height: 25px;
    padding-bottom: 25px;
    width: 70px;
}

.radio2 {
    padding-bottom: 15px;
}

.text {
	float: left;
    margin: 12px 10px;
    text-align: right;
    width: 65px;
}

.radio_box {
	float: left;
    line-height: 20px;
}

.text_box {
	float: left;
    margin: 8px 10px;
    text-align: right;
}

#step1_c .text {
	width: 60px;
}

.space_custom1 , .space_custom2, .space_custom3, .space_custom4{
	width: 30px; 
	height: 270px; 
	display: block; 
	float: left;
}

.space_custom1 {
	background: #323232;
}

.space_custom2 {
	margin-top: 10px;
}

.space_custom3 {
	margin-top: 20px;
}

.space_custom4 {
	margin-top: 30px;
}

#trois, #quatre {
	display: none;
}


.custom_box, .custom_box_white {
	margin-bottom: 2px;
    width: 250px;
	padding: 2px 0 5px 7px;
	line-height: 19px;
	font-size: 12px;
}
.custom_box {
	background:url(../images/bg-black.png);
}

.custom_box_white {
	background:url(../images/bg-dark.png);
}

.step1_p, .step2_p, .quote_p {
	width: 60px;
	background: #ffffff;
	color: #0099CC;
	text-align: center;
	font-weight: bold; 
	float: left;
	margin-right: 15px;
	padding: 4px 7px !important;
}

.step1_p_on, .step2_p_on, .quote_p_on {
	width: 60px;
	background: #0099CC;
	color: #ffffff;
	text-align: center;
	font-weight: bold; 
	float: left;
	margin-right: 15px;
	padding: 4px 7px !important;
}

#plus_end, #plus_kickplate, #plus_decking, #plus_finish, #plus_fencing, #plus_features, #plus_system {
	z-index: 200;
	position: absolute;
	width: 30px;
	height: 30px;
	display: block;
	cursor: pointer;
}
/*1*/
#plus_end {
	left: 1350px;
    top: 270px;
}
/*4*/
#plus_kickplate {
	left: 1520px;
    top: 415px;
}
/*2*/
#plus_decking {
	left: 1585px;
    top: 460px;
}
/*3*/
#plus_finish {
	left: 1520px;
    top: 250px;
}
/*5*/
#plus_fencing {
	left: 1725px;
    top: 400px;
}
/*6*/
#plus_features {
	left: 1745px;
    top: 260px;
}
/*7*/
#plus_system {
	left: 1650px;
    top: 340px;
}

#tablo {
	position: absolute;
	top: 170px;
	left: 560px;
	display: none;
	width: 425px;
	height: 442px;
}

.font11 {
	font-size: 11px;
}

.font14 {
	font-size: 14px;
}

#strenght {
	left: 380px;
    position: absolute;
    top: 300px;
    width: 170px;
}

#strenght p {
	float: left;
	width: 140px;
}

.strenght50 {
	width: 30px;
	height: 22px;
	background: #ffe0ba;
	display: block;
	float: right;
}

.strenght100 {
	width: 30px;
	height: 22px;
	background: #ff8b00;
	display: block;
	float: right;
}

.step2A {
	width: 190px;
	float: left;
	padding-right: 10px;
}

label {
	padding-bottom: 5px;
}

.decking, .paint, .kickplate, .fencing, .light {
	width: 517px;
	position: absolute;
	z-index: 1;
	display: block;
}

.decking {
	top: 147px;
	height: 153px;
}

.paint {
	top: 170px;
	height: 130px;
}

.kickplate {
	top: 87px;
	height: 213px;
}

.fencing {
	top: 141px;
	height: 213px;
	left: 0;
}

.light {
	top: 20px;
	height: 313px;
}

.deck_radio, .kick_radio, .fen_radio, .light_radio {
	position: absolute;
	z-index: 2;
	width: 440px;
}

.colorB {
	color: #ff8b00;
}

#submit_step3 {
	position: absolute;
	right: 13px;
    top: 130px;
	z-index: 100;
}

.error1, .error2 {
	font-weight: bold;
	color: #FF8B00;
	font-size: 9.6px;
}

#box .centerbox {
	text-align: center !important;
	font-size: 15px;
}

.linkstomize {
    display: block;
    height: 58px;
    position: absolute;
    width: 272px;
	background: url(../images/index-customize.png) no-repeat;
	top: 340px;
	text-transform: uppercase;
	color: #007a90;
	font-weight: bold;
	padding-top: 13px;
}

.linkstomize a:hover, .linkstomize a {
	color: #007a90;
}

.linkstomize div {
	margin-right: 10px;
	text-align: right !important;
}

.fontbold {
	font-weight: bold;
}
/*------------------------------ POPUP -----------------------------------*/
#filter
{
	display: none;
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: #000;
	z-index:300;
	opacity:0.6;
	filter: alpha(opacity=60);
}

#box 
{
	display: none;
	position: absolute;
	width: 680px;
	height: auto;
	padding: 35px 10px 0 10px;
	border: 1px solid black;
	background-color: #333;
	z-index:301;
	overflow: none;
	right: 150px;
	top: 90px;
	color: #FFFFFF;
	text-align: right;
	font-size: 12px;
	
}

#box p{
	width: 100% !important;
	text-align: right !important;
}

#boxtitle
{
	position:absolute;
	float:center;
	top:0;
	left:0;
	width:100%;
	height:24px;
	padding:0;
	padding-top:4px;
	left-padding:8px;
	margin:0;
	border-bottom:4px solid #3CF;
	background-color: #09c;
	color:white;
	text-align:center;
}

#box p.font12 {
	font-size: 12px;
	text-align: left !important;
	padding-left: 110px;
}

.color {
	color: #0099CC;
}

#box input, #box select  {
	width: 220px;
}