@import url(reset.css);
@import url(font.css);

/* GENERIC */
body{ background: #000 url(images/slcs-in.jpg);}
h3{ margin-bottom: 15px;}
h3.category{ margin-bottom: 5px; margin-top: 20px;}
p{ margin-bottom: 12px;}
p.last{ margin-bottom: 0;}
.txt strong{ font-weight: bold; color: #fff;}
strong{ font-weight: bold;}

hr{ border: none; border-bottom: 1px solid #333; background: none;}

input{ padding: 5px; margin: 0; border: 0; background: #4d4d4d; color: #ccc;}
input:focus{ background: #ccc; color: #333;}
input.btn{ background: #abe1fa; color: #000; padding: 5px 15px;}
input.size135{ width: 135px;}
input.size185{ width: 185px;}
input.size200{ width: 200px;}
input.size235{ width: 235px;}
input.size275{ width: 275px;}
input.size305{ width: 290px;}
input.size330{ width: 330px;}

textarea{ background: #1f1f1f; color: #ccc; border: 0; padding: 5px;}
textarea.textarea{ width: 330px; height: 90px;}
textarea.textareagobos{ width: 290px; height: 90px;}

.white{ color: #fff;}

.mt{ margin-top: 10px;}
#mt{ margin-top: 20px;}
.right{ float: right;}
img.right{ margin-left: 10px;}
.img{ width: 230px; float: left;}
.img img{ border: 1px solid #fff;}
.clear{ clear: both;}


/* BASE */
#sl{ width: 920px; margin: 0 auto;}

/* LANGCHOICE & MENU */
ul.langchoice{ float: right; background: #000; padding: 7px 5px;}
ul.langchoice li{ display: inline; padding: 0 2px;}
ul.langchoice li a{ color: #fff; text-decoration: none;}
ul.langchoice li a:hover{ text-decoration: underline;}

ul#menu{ background: #000; margin-top: 20px; float: left; width: 880px; padding: 15px 20px; margin-bottom: 10px;}
ul#menu li{ float: left; margin-right: 20px; padding-top: 3px;}
ul#menu li.last{ float: right; margin-right: 0; padding-top: 0;}
ul#menu li a{ color: #fff; text-decoration: none;}
ul#menu li a.select{ background: url(images/select.gif) repeat-x left bottom; padding-bottom: 5px; display: block;}
ul#menu li h1{ background: url(images/logo.gif) no-repeat;}
ul#menu li h1 a{ width: 189px; height: 21px; display: block; text-indent: -9999px;}

ul.nav{ margin-top: 10px;}
ul.nav li{ background: #000; padding: 5px 10px; float: left; margin-right: 5px;}
ul.nav li.here{ background: #fff;}
ul.nav li.here a{ color: #000;}

ul#tabs{ background:url(images/bkgd-ul-tab.jpg) no-repeat; width: 555px; height: 36px; padding-left: 120px; padding-top: 23px;}
ul#tabs li{ text-transform: uppercase; margin-right: 5px;}
ul#tabs li a{ background: #363636; padding: 5px 10px;}
ul#tabs li a:hover{ background: #1f1f1f;}

/* COL */
.colleft, .colright{ float: left;}
.colleft{ padding: 15px; background-color:#000}
.colright{ margin-left: 10px;}

.whatido .col{ background: url(images/whatido.gif) repeat-y; float: left; font-size:12px}
.whatido .all { background-color:#000; width: 880px; padding: 15px 20px;font-size:12px }
.whatido .colleft{ width: 350px;}
.whatido .colright, .whatido .colright .boximg, .whatido .colright .box{ width: 500px;}
.whatido .colright .boximg{ text-align: center;}
.whatido .colright .boximg img{ height: 332px;}

.project .col{ background: url(images/projects.gif) repeat-y; float: left;}
.project .colleft{ width: 175px;}
.project .colright{ width: 705px;}
.project .colright .box.mt{}
.project .colright .box h3{ margin-bottom: 0;}
.project .colright .box h4.h4proj{ margin-bottom: 15px;}

.rendering .col{ background: url(images/rendering.gif) repeat-y; float: left;}
.rendering .colleft{ width: 250px;}
.rendering .colright{ width: 630px;}
.rendering .colright .box{ height:970px }

.contact .col{ background: url(images/contact.gif) repeat-y; float: left;}
.contact .colleft{ width: 350px;}
.contact .colright{ width: 530px;}


.gobos .col{ background: url(images/gobos.gif) repeat-y; float: left;}
.gobos .colleft{ width: 305px;}
.gobos .colright{ width: 545px;}
.gobos .colright .box{ width: 545px;}

.links .col{ background: url(images/gobos.gif) repeat-y; float: left;}
.links .colleft{ width: 305px;}
.links .colright{ width: 575px;}

/* BOX */
.box{ background: #000; padding: 15px;}
.box.who{ width: 880px; padding: 20px;}

/* BANNER HOME */
#slidehome {border: 5px solid #fff; width:910px; height:320px; padding:0; position:relative;}
#contentslid { width:910px;}
.slide-content { width:500px; position:absolute; top:275px; left: 30px; z-index:250;color: #fff;}
.slide-content h2{ margin-bottom: 5px;}
.slide-content .detail { height:25px;}
.slide-content ul li{ list-style:none; display:block; float:left; width: 910px; height: 320px;}
#slides img{ width: 910px; height: 320px; display: block;}

/* TRANSITION PHOTO EN FONDU */
#slidephoto{ height:320px; width: 910px; position: relative; border: 5px solid #FFF;}
#slidephoto p{ margin: 0;}
#slidephoto img { display:none;	position:absolute;}

#newsphoto{ height:15px; width: 300px; position: relative; margin-left: 70px; margin-top: 3px;}
#newsphoto p{ margin: 0;}
#newsphoto img { display:none; position:absolute;}

.newshp{ float: right;}
.newshp h3{ margin-bottom: 0; float: left;}
.newshp ul{ float: left;}
.newshp ul li{ float: left; padding: 7px 15px; border-right: 1px solid #333; color: #fff;}
.newshp ul li:last-child{ border-right: none;}

img.iBanner{border: 5px solid #fff; width:910px; height:320px; padding:0; position:relative;}

.slide-nav{ position: absolute; top: 280px; right: 30px; z-index: 300;}
#slide-pagers { list-style:none;}
#slide-pagers a {outline:none;}
#slide-pagers :focus {-moz-outline-style:none;}
#slide-pagers li { float: left; margin-left: 5px;}
#slide-pagers li a, #slide-pagers li strong{ display: block; text-indent: -9999px; background: #fff; width: 10px; height: 10px;}
#slide-pagers li a{ background: #fff;}
#slide-pagers li strong{ background: #f09;}

.bg-trans { width:910px; height:65px; position:absolute; z-index:200; top:255px; background:#000; opacity: 0.78; filter:alpha(opacity=78); -moz-opacity:0.78; display: none;}

/* PROJECT PAGE */
.txt, .video{ float: left;}
.txt{ width: 328px;}
.video{ width: 325px; margin-left: 20px;}
.video img{ border: 1px solid #fff;}

ul.projects{ margin-top: 0;}
ul.projects li{ margin-bottom: 4px; background: url(images/tiret.gif) no-repeat left 6px; padding-left: 8px;}
ul.projects li a{}

.links ul.projects li{ margin-bottom: 15px;}

/* WHAT I DO PAGE */
.whatido .colleft ul.classic{ margin: 7px 0 7px 15px; list-style: square;}
.whatido .colleft ul.classic li{ margin-bottom: 2px;}

/* RENDERING PAGE */
.rendering .colleft ul{}
.rendering .colleft ul li{ padding-bottom: 5px; margin-bottom: 5px; border-bottom: 1px solid #333;}
.rendering .colleft ul li a img{ border: 1px solid #fff; padding: 2px;}
.rendering .colleft ul li a:hover img{ border: 1px solid #333;}

/* GALLERY */
ul.gallery li{ float: left; margin: 0 1px 1px 0;}
ul.video.gallery li{ margin: 0 1px 1px -17px; float:none}
ul.video.gallery li a{ float:none}
ul.video.gallery li a img{}

.mt ul.gallery li, .rendering ul.gallery li{ float: left; margin: 5px; width: 123px; height: 100px; overflow: hidden; border: 1px solid #ccc; text-align: center;}
.rendering ul.gallery li{ width: 138px;}
.whatido .mt ul.gallery li{ width: 113px;}

/* CONTACT */
.form tr.first td{ padding-bottom: 5px;}
.form td{ padding-bottom: 2px;}

/* GOBOS */
.gob{ width: 111px; float: left; margin: 0 20px 15px 0; text-align: center; height:110px}
.gob img{ border: 1px solid #fff;}
.gobos .colleft form{ margin-top: 20px;}

/* LINKS */
.links .box table{ width: 100%;}
.links .box table td{ border-bottom: 1px dashed #666; padding: 10px 0;}
.links .box table td a{ text-decoration: underline;}
.links .box table td.lefttd{ width: 45%; color: #abe1fa;}
.links .box table td.righttd{}

/* FOOTER */
.homepage .footer{ width: 480px;}
.whatido .footer{ width: 340px;}
.project .footer{ width: 280px;}
.rendering .footer{ width: 280px;}
.contact .footer{ width: 340px;}
.gobos .footer{ width: 295px;}
.links .footer{ width: 295px;}
ul.footer{ background: #000; padding: 10px 20px; margin-top: 10px; float: left;}
ul.footer li{ display: inline; padding: 0 1px;}

#gallery {position:relative; width:646px; margin:2px auto; padding:10px; border:6px solid #000; background:#000}
#images {border:2px solid #9ac1c9; height:225px; background:#eef5f6; margin-bottom:20px}
#image {position:relative; width:632px; height:375px; padding:5px; border:2px solid #666; background:#000 url(../images/loading.gif) center center no-repeat}
#image img {position:absolute; top:5px; left:5px}

.imgnav {position:absolute; height:375px; width:20%; z-index:100; height:375px; width:20%; z-index:100; outline:none; cursor:pointer}
#previmg {left:0; background:url(../images/left.gif) left center no-repeat; border-left:5px solid #000}
#previmg:hover {opacity:1; filter:alpha(opacity=100)}
#nextimg {right:0; background:url(../images/right.gif) right center no-repeat; border-right:5px solid #000}
#nextimg:hover {opacity:1; filter:alpha(opacity=100)}

.logo_menu { z-index:5000; position:relative; width:260px; float:right; margin:-67px 0 0 0}

.img_services { float:left}
.services { line-height:30px;}
.services ul.liste { margin:0 0 0 20px;  font-size:15px}
.services ul.liste li {  padding:0 0 0 20px  ; background:url(../images/services/bullet.jpg) no-repeat 0 10px}
.services .gallery li { margin:0 3px 0 2px}


#dynmap { background-color:#000 !important;}
.chooseproject { background-color:#000; padding:10px; margin:0 0 10px 0; width:200px}
.gm-style .gm-style-iw .country { color:#FFF; font-weight:bold; font-size:20px}
.gm-style .gm-style-iw .subtitle { color:#666867; font-size:14px}
.listproject {width:250px}
.listproject ul li { margin:0 0 10px 0}
.listproject ul a { color:#1363a8; text-decoration:none;}
.listproject ul a:hover { color:#1363a8; text-decoration:underline}
.gm-style .gm-style-iw > div { overflow:hidden !important; }
#conteneurInfoBulle { overflow-x: hidden;}