html{
		margin:0;
		height:100%;
}
body{
  font-family: 'Raleway', sans-serif !important;
/*	font-family:"Lucida Grande", Arial;*/
  height:100% !important;
}
@font-face {
    font-family: "My Custom Font";
    src: url(../fonts/LilitaOne-Regular.ttf) format("truetype");
}

#header{
  background:#000;
}

#service-icon .tool-content:hover {
  background-color: rgba(255,255,255,0.8);
	color:#555;
	transition:0.8s;
}

#border{
  position:fixed;
  height:100%;
  top:0;
  bottom:0;
  width:300px;
  max-width:50vw;
  z-index:-1;
  background: url('../img/back.png');
}
#header .title{
  font-family: "My Custom Font", Verdana, Tahoma;
}

#header .sep{color: #fff !important;     }

.navbar-default .navbar-brand, .navbar-default .navbar-nav li a {color: #FF9900 !important;}
.lang.navbar-text{
  margin-left:5em;
  padding-top:5px;
}
.lang.navbar-text, .lang.navbar-text a {color: #FFFFFF !important;}

.navbar{ margin-bottom:0px !important;}


#header li:hover{background-color: #fff !important;}
/* #presentation */
a{
  cursor:pointer;
  color: #ff9900 !important;
}

.module{
  width : auto;
  margin: 0 auto;
  height: auto;
  position: relative;
}

.module .content{
  height: auto;
  margin: 0 auto;
/*  padding: 10px;*/
  position: relative;
}
.module-title{
  padding-bottom:2em;
  padding-top:2em;
}
.module-title h1{
  margin-top:0em !important;
  font-size:2em;
  text-transform: uppercase;
  font-weight:bold;
}

.text-white{color:#fff;}
.text-dark{color: rgba(0,0,0,0.8);}

#presentation{
  margin-top:1em;
  padding-bottom:1em;

  color:#fff;
}

#presentation-detail{
/*  background: rgba(200,200,200,0.2);  */
/*  padding:1em;*/
/*  border-radius:1em;     */

}

img.presentation{
  width:10em;
  border-radius:0.5em;
}

.spacer span{
  display: inline-block;
  width: 80vw;
	max-width:300px;
  height: 0.6em;
  background: #FF9900;
  border-radius:0.2em;
}



#knowledge{
  padding:2em 0 2em 0;
  font-size:1.5em;
  line-height:1.5em;
}



#service-icon{
  font-size:12px;
}


.tool-content{
  padding-top:1em;
  background:rgba(0,0,0,0.1);
  border-radius:1em;
  height:15em;
}


#presentation-detail h2{
  font-size:1em;
  line-height:1.8em;
  text-align: justify;
}

.tool{
  text-align:center;
  margin:1em 0 1em 0;
}


/*                                                         portfolio + realisation */
.background-dark{
  color:#fff;
  background: rgba(0,0,0,0.8);
}
.background-orange{
  color:#fff;
  background: rgba(255,153,0,0.7);
}


.section{
  padding-top:25px;
  padding-bottom:50px;
}

#portfolio-list{
/*  overflow:hidden;*/
  text-align:center;
/*  background: rgba(0,0,0,0.8);*/
}

.portfolio-list-item{
  padding-top:10px;
  padding-bottom:10px;
}
/*
#contact .module-title,
#portfolio .module-title,
#contact-form-content{
  background: rgba(0,0,0,0.8);
}
*/




#portfolio-list .realisation{
  padding-bottom:1em;
  cursor:pointer;
}
.realisation .text{display:none;}


div.link{padding-left:1em;}
a.link{
  color:#fff !important;
  padding-left:1em;
}

#portfolio-list .screenshot{
  width:14em;
  height:10.5em;
}

.realisation .image{padding:1em;}

#realisation-detail{
  overflow:hidden;
}

#realisation-detail .realisation_desc{
  padding-top:1em;
}
/*
.realisation:nth-child(1) .detail-part{background:rgba(255,153,0,0.2);}
.realisation:nth-child(2) .detail-part{background:rgba(0,110,255,0.2);}
.realisation:nth-child(3) .detail-part{background:rgba(40,158,43,0.2);}
.realisation:nth-child(4) .detail-part{background:rgba(158,148,40,0.2);}
.realisation:nth-child(5) .detail-part{background:rgba(200,100,100,0.2);}
.realisation:nth-child(6) .detail-part{background:rgba(50,50,50,0.1);}
.realisation:nth-child(7) .detail-part{background:rgba(255,158,255,0.2);}
.realisation:nth-child(8) .detail-part{background:rgba(100,255,40,0.2);}
*/
/*
.realisation:nth-child(1) .realisation_detail{
  border:0.2em solid rgba(255,153,0,0.5);
  background:rgba(255,153,0,0.2);
}
.realisation:nth-child(2) .realisation_detail{
  border:0.2em solid rgba(0,110,255,0.5);
  background:rgba(0,110,255,0.2);
}
.realisation:nth-child(3) .realisation_detail{
  border:0.2em solid rgba(40,158,43,0.5);
  background:rgba(40,158,43,0.2);
}
*/
/*.realisation:nth-child(1) .image{background:rgba(255,153,0,0.3);}*/
/*.realisation:nth-child(2) .image{background:rgba(0,110,255,0.3);}*/
/*.realisation:nth-child(3) .image{background:rgba(40,158,43,0.3);}*/

.realisation_title{
  font-size:1.5em;
  font-weight: 600;
}
/*
.realisation_content .text{
  background:#FFFFFF;
  color:#000;
  text-align:left;
}
*/
#portfolio-detail{
  display:none;
  overflow:hidden;
  background: rgba(255,153,0,0.7);
  color:#fff;
  padding-bottom:1em;
}
#portfolio-detail img.screenshot{
  width:25em;
}
/*
#portfolio-detail .image{
  text-align:right;
}
*/
#realisation-button-hide{
  position:absolute;
  top:0px;
  right:0px;
  z-index:100;
}



.realisation_desc ul{
  list-style-image: url('../img/check-18.png');
}

#portfolio-list .diaporama{display:none;}
.diaporama img{width:4em;}

/*                                                      contact */
#contact{
  padding-top:2em;
  padding-bottom:0.5em;
}

#contact-form-content{
  position:relative;
  padding-bottom:2em;
}

#contact-form-pending{
  display:none;
  position:absolute;
  width:100%;
  height:100%;
  background: rgba(0,0,0,0.8);
  z-index:100;
}
#contact-form-pending .progress{
  width: 30em;
  height: 1.5em;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -1em 0 0 -15em;
}

#contact-form-action{height:4em;}

.form-group.mandatory div.star:before {
  content:"*";
  color:red;
  font-size:2em;
}
/*                                                      footer */
footer{
  position:relative;
  padding-top:1em;
  clear:both;
  background: rgba(0,0,0,1);
  color:#ff9900;
  line-height:2em;
  vertical-align:middle;
}
#footer{text-align:center; }

footer div.padding-right{padding-right:2em;}

footer .copyright{
  position:absolute;
  bottom:1em;
  right:2em;
}
footer .copyright a{color: rgba(255,255,255,0.8) !important;}

.no-padding-side{
  padding-right: 0px !important;
  padding-left: 0px !important;
}

.no-margin-side{
  margin-right: 0px !important;
  margin-left: 0px !important;
}

#portfolio-detail-desc{
  font-family: 'Raleway', sans-serif;
  color:#555;
  font-size:1.2em;
}
#portfolio-detail-title{
  font-size:2em;
  font-weight:bold;
}



.portfolio-img-thumb{
  padding-bottom:20px;
}