/**************************************************************
*************************GENERAL*******************************
**************************************************************/

body { background-color:#242526; color:#797C80; margin:0; padding:0; font-family:"Helvetica", "Arial";}

p {margin: 0;}
* {outline: none;}
form {margin: 0;padding: 0;}
a {text-decoration: none;}
img {border:none; display:block;}
ul {margin: 0; padding: 0;list-style: none;}
.hr {border:0; height:2px; background:url(images/hr.png) repeat-x; margin:7px 0 20px 0;}


.miniTof {width:200px; height:200px; position:absolute; margin-left:15px; cursor:pointer;}
#miniTof0 {background:url(images/tof1.png) no-repeat; z-index:104;}
#miniTof1 {background:url(images/tof2.png) no-repeat; z-index:103;}
#miniTof2 {background:url(images/tof3.png) no-repeat; z-index:102;}
#miniTof3 {background:url(images/tof4.png) no-repeat; z-index:101;}
#miniTof4 {background:url(images/tof5.png) no-repeat; z-index:100;}


.input {font-size:13px; line-height:18px; border:1px solid #AAAEB3; padding:2px; background:#ffffff url(images/inputBg.gif) top left no-repeat; margin-top:2px;}
.input:hover {border:1px solid #494B4C;}

.submit { background:url(images/btnBg.png) repeat-x; font-size:13px; line-height:20px; border:0; border-bottom:1px solid #242526; text-decoration:none; padding:1px 8px 3px 8px; color:#ffffff;}
.submit:hover {cursor: pointer;	background:url(images/btnBgHover.png) repeat-x;}

.IE6 {width:300px; height:140px; background:url(images/IE6.png); margin:50px auto; color:#242526; padding:160px 50px 50px 50px; font-size:13px;}
.gourmets {width:300px; height:390px; background:url(images/gourmets.png); margin:50px auto; color:#242526; padding:160px 50px 50px 50px; font-size:13px;}

.page {padding-top:0; padding-bottom:30px; background:#303233 url(images/fondHeader.png) repeat-x;}
.homePage {padding-top:0; padding-bottom:30px; background:#303233 url(images/fondHeaderHome.png) repeat-x;}

.titre, .titreItemPortfolio {color:#FFFFFF; font-family: "Lucida Grande", Arial, sans-serif; text-align:left; font-size:20px; font-weight:bold; }
.moyenTitre {font-size:16px; line-height:29px; font-weight:normal;}
.fatTitre {color:#FFFFFF; font-family: "Lucida Grande", Arial, sans-serif; text-align:left; font-size:25px; font-weight:bold; margin-bottom:25px;}
.miniTitre {font-size:13px; color:#ffffff; padding-bottom:5px; letter-spacing:0px; font-family: "Lucida Grande", Arial, sans-serif; font-weight:normal; padding:4px 0 4px 0px;}
.mTitre {font-size:17px; color:#ffffff; padding-bottom:5px; letter-spacing:0px; font-weight:normal; padding:4px 0 18px 0px;}
.sliderTitre {color:#FFFFFF; font-family: "Lucida Grande", Arial, sans-serif; font-size:15px; font-weight:bold; letter-spacing:0px; padding:0px 0 20px 0;}
.sliderTitre:hover {color:#00AEEF;}
.titreNoir {color:#3d3e40; text-align:left; font-family: "Lucida Grande", Arial, sans-serif; font-size:20px; font-weight:bold;}
.serviceSousTitre {font-family: "Lucida Grande", Arial, sans-serif; font-size:14px; font-weight:normal; color:#ffffff; margin-bottom:10px; width:100%;}
.texte {font-size:13px; line-height:17px;}
.fatTexte {font-size:16px; font-weight:bold; line-height:17px;}
.green {color:#54C100;}
.blue {color:#00AEEF;}
.gris {color:#B6BABF;}
.rose {color:#ff0099;}
.darkGris {color:#494B4C;}
.blanc {color:#FFFFFF;}
.link {color:#00AEEF;}
.link:hover {color:#FFFFFF; background:#00AEEF;}
.center {text-align:center;}
.tab {margin-left:10px;}
.bottomSpace {margin-bottom:15px;}
.leftSpace {margin-left:27px;}
.vspace {height:10px;}
.copyright {font-size:10px;}
.hidden {display:none;}

.container {width:840px; margin:auto; background:url(images/container.png) no-repeat;}

.header { width:100%;}
.logoBox {width:220px; height:110px;  vertical-align:top;}
.logo {width:220px; height:110px; cursor:pointer;}
.menuBox {width:635px; vertical-align:top; padding:3px 0 0 0;}
.menu {height:20px; float:right; margin-top:5px; list-style-type:none;}
.menuItem, .menuItem a {color:#ffffff; margin:0px 0 0 5px; padding:0 5px; display:inline; font-size:13px;}
.menuItemSelected ,.menuItemSelected a, .menuItem:hover, .menuItem a:hover {color:#429900; margin:0px 0 0 5px; padding:0 5px; display:inline; font-size:13px;}

.rubriqueTitleBox {width:100%; text-align:right;}
.titrePortfolio {width:840px; height:100px; margin-top:25px;}

.content {width:838px; padding:0px 0px; margin:45px 0;}
.apropos {width:838px; height:360px; padding:0px 0px; margin:45px 0 0 0;}
.subMenu { font-size:13px; font-family:"Trebuchet MS", "Arial"; color:#DAE0E5; font-weight:normal; height:50px; width:100%;}


/**************************************************************
***************************HOME********************************
**************************************************************/
.logoBoxHome {width:420px;}
.menuBoxHome {width:840px; vertical-align:top; padding:3px 0 0 0px;}
.menuHome {height:20px; display:inline; list-style-type:none; padding-left:50px;}

.homeContent {width:838px; padding:0px 0px; margin:30px 0;}

.homeTitleBox {width:550px; float:left;}
.titreHome {width:550px; height:290px; margin-bottom:0px;}

.hello {width:230px; height:310px; padding:170px 25px 0 25px; margin-top:150px; font-size:15px; line-height:20px; font-weight:normal; float:right; text-align:left; background:url(images/postIt.png) no-repeat;}

.homeSliderBox {width:520px; background:url(images/logoHome.png) no-repeat; padding:320px 15px 0 0; margin-top:20px; float:left; vertical-align:top;}
.buffer {width:100%; padding-top:20px; clear:both;}
.buffer hr {background:#3d3e40; border:0;}

.topHome { padding:0px 0; vertical-align:top;}

.rubriqueTitleBox {width:100%; margin-top:0px; text-align:right;}
.sliderMiddleHome {width:520px; height:170px; padding:0;}

.slideNav {width:100%; text-align:center; height:30px; padding-top:20px;}
.slideNavBox {height:30px; width:70px; margin:auto;}
.prevSlide {background:url(images/prevSlide.png) no-repeat; cursor:pointer; width:20px; margin-right:1px; border-bottom:1px solid #242526; height:20px; float:left;}
.prevSlide:hover {background:url(images/prevSlideHover.png) no-repeat;}
.nextSlide {background:url(images/nextSlide.png) no-repeat; cursor:pointer; width:20px; border-bottom:1px solid #242526; height:20px; float:left;}
.nextSlide:hover {background:url(images/nextSlideHover.png);}

.megaPaddingG {padding-left:255px;}
.plateforme {height:170px; width:520px; text-align:left; padding:5px 0px 0 0px;}
.miniPortfolioTxt {width:250px; float:left; margin-left:20px;}
.miniPortfolioImg {width:250px; float:left; margin:auto;}
.postIt {padding:20px 20px 25px 20px; width:240px; height:230px; background:url(images/postIt.png) no-repeat;}

.puce {background: url(images/puce.png) no-repeat; padding:2px 0 0 24px; height:16px; margin:7px 0 0 10px; color:#B6BABF; font-size:13px; font-weight:normal;}
.heart {background: url(images/heart.png) no-repeat 0px 2px; padding:3px 0 0 30px; height:16px; margin:6px 0 0 10px; color:#ffffff; font-size:13px; font-weight:normal;}

.textBox {clear:both;}

/**************************************************************
************************SERVICES*******************************
**************************************************************/

.vTable {padding:30px 0 20px 0; width:838px; vertical-align:top;}

.maxiLBox {width:520px; padding:0 30px 0 0;  vertical-align:top;}
.miniRBox {width:280px;  padding:0 0 0 10px; vertical-align:top;}
.miniLBox {width:35%; padding:0 10px 0 0;  vertical-align:top;}
.maxiRBox {width:65%; padding:0 0 0 10px;  vertical-align:top;}
.box {width:100%; padding:30px 0;}

.platformBox {width:520px; padding:0 30px 0 0; vertical-align:top;}
.platformSelector {width:100px; float:left; height:260px; background:url(images/platformSelector.png) no-repeat;}
.platform {width:100px; height:50px; cursor:pointer;}
.pWeb:hover, .pWeb.platformSelected, .pWeb.platformSelected:hover {background:url(images/pWeb.png) no-repeat;}
.pDesktop:hover, .pDesktop.platformSelected, .pDesktop.platformSelected:hover {background:url(images/pDesktop.png) no-repeat;}
.pMobile:hover, .pMobile.platformSelected, .pMobile.platformSelected:hover {background:url(images/pMobile.png) no-repeat;}
.pSignal:hover, .pSignal.platformSelected, .pSignal.platformSelected:hover {background:url(images/pSignal.png) no-repeat;}
.pSurface:hover, .pSurface.platformSelected, .pSurface.platformSelected:hover {background:url(images/pSurface.png) no-repeat;}
.platformText {position:relative; overflow:hidden; float:left; height:250px; width:419px; background:url(images/platformText.png) no-repeat;}
.plat {position:relative; margin:15px 0px; height:214px; width:389px; padding:15px 00px 15px 30px;}

.weLove {background:url(images/heart.png) 0px center no-repeat; padding:3px 0 0 20px; font-size:14px; font-weight:normal; color:#ff0099;}

.bloc {cursor:pointer;}
.bulles {overflow:hidden;}
.bulle {width:560px; height:190px; padding:20px 20px 40px 20px; position:absolute; display:none;}
#bulle0 {margin-left:8px; z-index:200; background: url(images/bulle0.png) no-repeat;}
#bulle1 {margin-left:80px; z-index:201; background: url(images/bulle1.png) no-repeat;}
#bulle2 {margin-left:152px; z-index:202; background: url(images/bulle2.png) no-repeat;}
#bulle3 {margin-left:230px; z-index:203; background: url(images/bulle3.png) no-repeat;}

.triBloc { height:200px;}
.triBlocTxt {position:absolute; margin:260px 0 0 270px; width:500px;}

.iconLabel {position:absolute; background:url(images/bulle.png) no-repeat; margin-top:-10px; width:150px; display:none; height:60px; font-weight:normal; text-align:center; font-size:12px; color:#ffffff;}
#iconLabel0 {margin-left:13px; padding-top:10px;}
#iconLabel1 {margin-left:233px; padding-top:17px;}
#iconLabel2 {margin-left:453px; padding-top:17px;}
#iconLabel3 {margin-left:674px; padding-top:17px;}
.serviceIcon {cursor:pointer; position:absolute; z-index:50; display:none;}
.fakeIcon {cursor:pointer; position:absolute; z-index:50;}

/**************************************************************
************************PORTFOLIO******************************
**************************************************************/

.itemPortfolio {height:250px; width:838px;}

.itemPortfolio a {cursor:pointer;}
.imageItemPortfolioContainer {width:50%; vertical-align:middle;}
.imageItemPortfolioBox {margin:auto; cursor:pointer; width:342px; height:212px;}
.imageItemPortfolio {width:342px; height:212px;}

.textItemPortfolioContainer {width:50%; vertical-align:top; padding-top:20px; padding-bottom:40px; height:190px;}
.textItemPortfolioBox {height:190px;}
.titreItemPortfolio {cursor:pointer;}
.titreItemPortfolio:hover {color:#00AEEF;}
.descriptionItemPortfolio {font-size:13px; line-height:16px; color:#9da2a6;}
.tagBox {font-size:13px; height:20px; font-weight:bold; color:#c2c7cc; background:url(images/icnTag.png) left center no-repeat; padding-left:25px;}
.tag {color:#54C100; font-size:13px; font-weight:bold;}
.tag:hover {background:#54C100; color:#FFFFFF;}
.fatTag {color:#54C100; font-size:16px; font-weight:bold;}
.lirelasuiteBtnBox {text-align:left; vertical-align:bottom; }
.lirelasuiteBtnBox div {width:75px;}

.lirelasuiteBtn { background:url(images/btnBg.png) repeat-x; font-size:13px; line-height:20px; border-bottom:1px solid #242526; text-decoration:none; padding:5px 12px 5px 12px; color:#ffffff; cursor:pointer; font-weight:normal; text-align:center;}
.lirelasuiteBtn:hover {background:url(images/btnBgHover.png) repeat-x;}



/**************************************************************
*********************PORTFOLIO PAGE****************************
**************************************************************/

.subMenu a {color:#00AEEF;}
.subMenu a:hover {color:#FFFFFF; background:#00AEEF;}

.portfolioPage {padding:35px 0 00px 0;}
.portfolioPage td {vertical-align:top;}

.leftSide {width:368px; height:100%; padding:0px 40px 20px 0px; text-align:left; vertical-align:top;}
.Vspace {height:25px;}

.leftSideBox {padding-top:35px;}
.portfolioPageTag {background: url(images/puce.png) no-repeat; padding:2px 0 0 24px; height:16px; margin:7px 0 0 10px; color:#ffffff; font-size:13px; font-weight:normal;}

.portfolioPageLink {line-height:24px; margin-top:6px; color:#54C100; font-size:14px; font-weight:bold;}
.portfolioPageLink:hover {color:#FFFFFF; background:#54C100; font-size:14px; font-weight:bold;}
.portfolioPageBackBox div {width:60px; height:20px;}
.backBtn {background:url(images/btnBg.png) repeat-x; font-size:13px; line-height:20px; border-bottom:1px solid #242526; text-decoration:none; padding:5px 12px 5px 12px; color:#ffffff; cursor:pointer; text-align:center; width:60px; height:20px;}
.backBtn:hover {background:url(images/btnBgHover.png) repeat-x;}

.rightSide {width:460px; height:100%;}
.portfolioPageImage {cursor:pointer;}
.portfolioPageImageBox {width:460px; height:500px; background-image: url(images/fondImagePortfolioPage.png); background-repeat:no-repeat;}
.portfolioPageImage img {height:476px; width:436px; margin:-1px 0px 0 10px; border:2px solid #FFFFFF;}
.portfolioPageImageNavBox {padding-top:5px; text-align:center;}
.dotsNavigator {margin:auto; text-align:center;}
.navDotLink {width:13px; height:13px; background-image:url(images/navDot.png); display:inline-block; cursor:pointer;}
.navDotLinkSelected {width:13px; height:13px; background-image:url(images/navDotHover.png); display:inline-block; cursor:pointer;}

.navTxtLink {color:#00AEEF; cursor:pointer;}
.navTxtLink:hover {color:#ffffff; background:#00AEEF; cursor:pointer;}

.videoBox {margin:30px 0 50px 69px; position:absolute; width:700px; height:420px; display:none; background:url(images/video.png) center center no-repeat;}
.closeBtn {width:30px; height:30px; z-index:150; background:url(images/closeBtn.png) no-repeat; cursor:pointer; position:absolute; margin:5px 0 0 665px;}
.closeBtn:hover {width:30px; height:30px; background:url(images/closeBtnHover.png) no-repeat; cursor:pointer; position:absolute; margin:5px 0 0 665px;}
.video {margin:30px; position:absolute;}
.videoBtn {background:url(images/videoBtn.png) no-repeat; height:80px; width:250px; cursor:pointer;}
.videoBtn:hover {background:url(images/videoBtnHover.png) no-repeat;}
.videoBtn2 {background:url(images/videoBtn2.png) no-repeat; height:80px; width:250px; cursor:pointer;}
.videoBtn2:hover {background:url(images/videoBtn2Hover.png) no-repeat;}

/**************************************************************
*************************CONTACT*******************************
**************************************************************/

.leftContact {width:270px; height:100%; text-align:left; vertical-align:top;}
.rightContact {width:528px; height:100%; padding:0px 40px 20px 0px; }
#titreMap {margin-left:7px;}
.gMap {width:520px; height:420px; margin-top:25px; padding-top:0px; padding:5px 0 0 10px; background: url(images/fondGmap.png) no-repeat;}
#map {width:510px; height:405px;}

.contactTable {width:100%; vertical-align:middle; margin-top:15px; border-bottom:1px solid #3D3E40; padding:10px 0; background:url(images/cadreBg.png) repeat-x;}
.contactTable td {vertical-align:middle;}

.facebook {background:#eceff5; border:1px solid #3b5998;}


/**************************************************************
**************************FOOTER*******************************
**************************************************************/

.footersHeader {width:100%; height:10px; border-top:1px solid #3D3E40; background:url(images/footerShadow.png) repeat-x;}
.footer {width:836px; margin:auto; padding:15px 2px 25px 2px;}
.footerItem {vertical-align:top;}
.footerBlank {width:50px;}
.footerRight {text-align:right; vertical-align:top;}
.footerTitle {font-size:12px; margin-left:20px; color:#aaaeb3; margin-bottom:10px; }
.footerSelectedTitle, .footerRight a:hover span {font-size:12px; margin-left:20px; color:#FFFFFF; margin-bottom:10px;}
.footerSubTitle {font-size:12px; color:#FFFFFF; margin-top:5px;}
.footerText {font-size:12px; color:#aaaeb3;}