/**** FEUILLE DE STYLE USEWEB ********************************************************************/ /* Generated by Font Squirrel (http://www.fontsquirrel.com) on May 23, 2011 */ @font-face { font-family: 'LibelSuitRegular'; src: url('../fonts/libel-webfont.eot'); src: url('../fonts/libel-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/libel-webfont.woff') format('woff'), url('../fonts/libel-webfont.ttf') format('truetype'), url('../fonts/libel-webfont.svg#LibelSuitRegular') format('svg'); font-weight: normal; font-style: normal; } /*************************************************************************************************/ /* GÉNÉRAL */ /*************************************************************************************************/ * { font-family:Verdana, Arial, Helvetica, sans-serif; } body { margin:0; padding:0; font-size:11px; color:#555; text-align:center; background:#e5e5e5 url(../images/bg/bg_header.jpg) no-repeat 50% 40px; } td { font-size:11px; color:#555; } h1, h2, h3, h4, h5, h6 { margin:0; padding:0; } img { border:0; } p { margin:0 0 10px 0; text-align:left; } hr { border:0; border-bottom:1px dotted #aaa; margin:10px 0; } acronym:hover { cursor:help; } /* Formulaires */ form { margin:0; padding:0; } form ul li { margin:0 0 5px 0; padding:0; list-style-image:none; list-style-type:none; } input[type=text], input[type=password], select, textarea { font-size:11px; color:#777; vertical-align:middle; border:1px solid #cdcdcd; } input[type=text]:focus, input[type=password]:focus, select:focus, textarea:focus { color:#555; border:1px solid #f60; } .quizz ul li a, input[type=button], input[type=submit], input[type=reset] { color:#333; font-size:12px; text-decoration:none; padding:5px 15px; background:url(../images/bg/bg_white.png) repeat-x 0 50%; border:2px solid #fff; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; -o-border-radius:5px; border-radius:5px; -webkit-box-shadow:0 0 2px #777; -moz-box-shadow:0 0 2px #777; -khtml-box-shadow:0 0 2px #777; -o-box-shadow:0 0 2px #777; box-shadow:0 0 2px #777; -webkit-transition: background 0.3s ease; -moz-transition: background 0.3s ease; -khtml-transition: background 0.3s ease; -o-transition: background 0.3s ease; transition: background 0.3s ease; } .quizz ul li a:hover, input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover { color:#fff; background:url(../images/bg/bg_blue.png) repeat-x 0 50%; } .submit a { color:#fff; text-decoration:none; font-weight:bold; padding:5px 10px; background:url(../images/bg/bg_orange.png) repeat-x 0 50%; border:2px solid #fff; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; -o-border-radius:5px; border-radius:5px; -webkit-box-shadow:0 0 2px #777; -moz-box-shadow:0 0 2px #777; -khtml-box-shadow:0 0 2px #777; -o-box-shadow:0 0 2px #777; box-shadow:0 0 2px #777; } .submit a:hover { color:#fff; text-decoration:none; background:url(../images/bg/bg_blue.png) repeat-x 0 50%; } /* liens */ a { color:#555; text-decoration:underline; -webkit-transition: color 0.3s ease; -moz-transition: color 0.3s ease; -khtml-transition: color 0.3s ease; -o-transition: color 0.3s ease; transition: color 0.3s ease; } a:hover { color:#09d; text-decoration:underline; } /* listes */ ul { margin:10px 0; padding:0; } ul li { list-style-type:none; list-style-image:url(../images/li.gif); margin:0 0 8px 20px; padding:0; text-align:justify; } /* Alignements */ .align_right { text-align:right; } .align_left { text-align:left; } .align_center { text-align:center; } .left { float:left; } .right { float:right; margin:0 0 0 60px; } .clear { clear:both; height:1px; font-size:1px; } .toppage { text-align:right; margin:0 0 10px 0; } .toppage a { background:#eee url(../images/bg/bg_white.png) repeat-x 0 60%; color:#999; text-decoration:none; font-size:9px; padding:3px 10px; border:1px solid #ccc; } .toppage a:hover { background:#09d url(../images/bg/bg_blue.png) repeat-x 0 60%; color:#fff; -webkit-box-shadow:0 0 3px #aaa; -moz-box-shadow:0 0 3px #aaa; -khtml-box-shadow:0 0 3px #aaa; -o-box-shadow:0 0 3px #aaa; box-shadow:0 0 3px #aaa; } /*************************************************************************************************/ /* STRUCTURE */ /*************************************************************************************************/ .wrap { margin:0 auto; width:980px; text-align:left; } #top, #header, #content, #footer { margin:0; padding:0; } #top .wrap, #header .wrap { position:relative; } /**** TOP ************************************************************************************/ #top { height:40px; text-align:right; background:#101417 url(../images/bg/bg_top.jpg) no-repeat 50% 0; } #likebox { position:absolute; top:9px; left:0; } #top ul { margin:0; padding:12px 0 0 0; list-style-type:none; text-align:right; } #top ul li { display:inline; background:url(../images/white-10.png); margin:0 10px 0 0; padding:5px 0 5px 5px; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; -o-border-radius:10px; border-radius:10px; } #top ul li a { padding:10px 35px 10px 8px; font-size:10px; text-transform:uppercase; text-decoration:none; } #top ul li a:hover { text-shadow:0 0 5px #fff } #top ul li.liespclt a { color:#aaa; background:url(../images/chip-espclt.png) no-repeat 100% 50%; } #top ul li.lidevis a { color:#f60; background:url(../images/chip-devis.png) no-repeat 100% 50%; } #top ul li.licallback a { color:#0ae; background:url(../images/chip-callback.png) no-repeat 100% 50%; } #top form { display:inline; padding:2px 0 2px 5px; } #top form input[type=text], #top form input[type=password] { width:75px; font:normal 10px Verdana, Arial, Helvetica, sans-serif; color:#aaa; vertical-align:middle; border:1px solid #cdcdcd; padding:0 2px; } #top form input[type=submit] { padding:0; font:normal 10px Verdana, Arial, Helvetica, sans-serif; vertical-align:bottom; text-transform:uppercase; border:1px solid #fff; } /*Esapce Client*/ #top ul li.liespclt em { color:#ac0; font-style:normal; } #top ul li.liespclt em a { text-decoration:underline; background:inherit; color:#fff; text-transform:none; padding:0; } /*CallBack*/ .callback_bottom { z-index:1000; display:none; position:absolute; bottom:-10px; right:10px; } #top .callback_top { z-index:1000; display:none; padding:10px 15px 15px 15px; position:absolute; top:40px; right:0; background-color:#15191c; -webkit-border-radius:0 0 10px 10px; -moz-border-radius:0 0 10px 10px; -khtml-border-radius:0 0 10px 10px; -o-border-radius:0 0 10px 10px; border-radius:0 0 10px 10px; } #top #callback_result_top { color:#0ae; } #top .callback_top form, .callback_bottom form, .callback ul.error_list, #top .callback_top ul.error_list { margin:0; padding:0; } #top .callback_top ul.error_list li, .callback_bottom ul.error_list li { color:#f50; margin-bottom:2px; } #top .callback_top input[type=text], .callback_bottom input[type=text] { color:#09d; text-align:center; padding:4px; font-size:18px; border:none; width:200px; -webkit-border-radius:10px 0 0 10px; -moz-border-radius:10px 0 0 10px; -khtml-border-radius:10px 0 0 10px; -o-border-radius:10px 0 0 10px; border-radius:10px 0 0 10px; -webkit-box-shadow:0 0 2px #777; -moz-box-shadow:0 0 2px #777; -khtml-box-shadow:0 0 2px #777; -o-box-shadow:0 0 2px #777; box-shadow:0 0 2px #777; } #top .callback_top input[type=submit], .callback_bottom input[type=submit] { vertical-align:bottom; color:#fff; background-image:url(../images/bg/bg_blue.png); border:none; margin:0; padding:1px 8px; font:normal 24px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; -webkit-border-radius:0 10px 10px 0; -moz-border-radius:0 10px 10px 0; -khtml-border-radius:0 10px 10px 0; -o-border-radius:0 10px 10px 0; border-radius:0 10px 10px 0; } #top .callback_top input[type=submit]:hover, .callback_bottom input[type=submit]:hover { color:#fff; background-image:url(../images/bg/bg_green.png); } /**** HEADER ************************************************************************************/ #header .wrap { height:160px; } #header h1 { position:absolute; bottom:10px; right:0; font:normal 9px Verdana, Arial, Helvetica, sans-serif; color:#7ac; text-align:right; } #header h2 { position:absolute; top:15px; right:0; font:normal 40px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; color:#fff; text-align:right; } #header p { position:absolute; top:55px; right:0; font-size:14px; color:#fff; text-align:right; } #header strong { color:#f60; font-weight:normal; } #logo { position:absolute; top:30px; left:45px; } .slide { position:relative; overflow:hidden; height:300px; width:600px; border:1px solid red; } .slide .inner { position:absolute; right:-600px; top:45px; border:1px solid green; } #slidemarginright button { } /**** NAVIGATION ************************************************************************************/ #nav { position:absolute; z-index:12000; bottom:40px; right:0; height:30px; } #nav ul, #nav ul li { margin:0; padding:0; } #nav ul li { float:left; margin-left:2px; height:30px; line-height:27px; position:relative; display:inline; list-style-image:none; } #nav ul li a { padding:6px 8px; color:#fff; font-size:14px; text-decoration:none; background:url(../images/white-10.png); -webkit-transition: background 0.3s ease; -moz-transition: background 0.3s ease; -khtml-transition: background 0.3s ease; -o-transition: background 0.3s ease; transition: background 0.3s ease; } #nav ul li a:hover { color:#fff; background:url(../images/bg/bg_blue.png) repeat-x 0 50%; text-decoration:none; } #nav ul li a.actif { color:#09d; background:url(../images/bg/bg_white.png) repeat-x 0 50%; } #nav ul li dl { position:absolute; width:170px; padding:5px 10px; margin:0; background:url(../images/black-70.png); z-index:100; } #nav ul li dl dd { background:url(../images/li.gif) no-repeat 0 50%; line-height:22px; display:block; margin:0; padding:0 0 0 8px; text-align:left; } #nav ul li dl dd a { background:none; margin:0; padding:0; color:#fff; font-size:14px; float:none; text-decoration:none; } #nav ul li dl dd a:hover { color:#aaa; background:none; } #nav ul li dl dd a.actif { color:#09d; background:none; } /**** FOOTER ************************************************************************************/ #footer { background:#101417 url(../images/bg/bg_footer.jpg) no-repeat 50% 0; margin-top:20px; padding:20px 0; } #footer ul { float:left; width:196px; } #footer ul, #footer ul li { margin:0; padding:0; list-style-image:none; } #footer ul li, #footer ul li a{ color:#666; font:normal 10px Arial, Helvetica, sans-serif; text-decoration:none; } #footer ul li strong a { font-weight:normal; color:#0ae; text-transform:uppercase; } #footer ul li a:hover { text-decoration:none; color:#aaa; -webkit-text-shadow:0 0 5px #777; -moz-text-shadow:0 0 5px #777; -khtml-text-shadow:0 0 5px #777; -o-text-shadow:0 0 5px #777; text-shadow:0 0 5px #777; } /* Sociaux */ dl.sociaux, dl.sociaux dd { margin:0; padding:0; } dl.sociaux dd { display:inline; list-style-type:none; } dl.sociaux dd a { background-image:url(../images/socialbar.png); float:left; width:20px; height:20px; margin:5px 5px 0 0; text-decoration:none; background-repeat:no-repeat; text-indent:-5000px; } dl.sociaux dd.litwitter a { background-position:-29px 0; } dl.sociaux dd.litwitter a:hover { background-position:-29px -20px; } dl.sociaux dd.lifacebook a { background-position:-52px 0; } dl.sociaux dd.lifacebook a:hover { background-position:-52px -20px; } dl.sociaux dd.liblog a { background-position:0 0; width:26px; } dl.sociaux dd.liblog a:hover { background-position:0 -20px; } /* Coordonnées Imprimable */ #footer #CoordPrint { display:none; } /*************************************************************************************************/ /* CONTENT */ /*************************************************************************************************/ #content { /*height:auto !important; height:500px; min-height:500px; position:relative;*/ } .inc { background:url(../images/white-30.png); padding:5px; } .include { padding:30px; background-color:#fff; } /* Titres */ #content h2, #content h2 * { font:normal 60px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; color:#333; text-transform:uppercase; } #content h3 { font:normal 16px Verdana, Arial, Helvetica, sans-serif; color:#09d; margin-bottom:15px; } #content h4, #content h4 strong { font:normal 30px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; color:#333; text-transform:uppercase; border-bottom:1px dotted #ccc; padding-bottom:3px; margin-bottom:5px; } #content h5 { font-size:11px; } #content h2 strong, #content h4 strong { color:#aaa; } /* Fonts */ .blue, .color { color:#09d; } .cyan { color:#0ae; } .orange { color:#f60; } .grey { color:#555; } small, small a { font-size:10px; color:#999; } .caps { text-transform:uppercase; } /* Formatage Cadres */ .solid { background-color:#fff; border:1px solid #efefef; height:140px; overflow:hidden; } .gradient { background:url(../images/cadre/bg_gradient_transp.png) repeat-y 100% 0; width:605px; margin:10px; } .frame { padding:10px 20px 20px 20px; } .frame *, .frame p { text-align:right; margin:0; } .frame p a { font-weight:bold; color:#09d; } .frame p a:hover { text-decoration:none; color:#0ae; } #content .frame h2, #content .frame h2 * { font-size:36px; } .col3, .col2 { margin-top:10px; } .col3 .solid, .col2 .solid { float:left; } .col3 .colL, .col3 .colC, .col3 .colR { width:280px; } .col3 .colL, .col3 .colC { margin-right:10px; } .col2 .colL { width:610px; margin-right:10px; } .col2 .colR { width:275px; } /* Cadres couleurs */ #quotbox { padding:10px; height:150px; width:295px; background:url(../images/cadre/bg_temoignage_320.jpg) no-repeat 0 0; } #quotbox img { float:right; margin:0 0 0 10px; border:2px solid #e5e5e5; } #quotbox p { margin:0; font-size:10px; } #quotbox small { color:#920; display:block; } /* Petit cadre 320px */ .col3 .orangebox { background:url(../images/cadre/bg_orange_320.jpg) no-repeat 0 0; } .col3 .bluebox { background:url(../images/cadre/bg_blue_320.jpg) no-repeat 0 0; } .col3 .cyanbox { background:url(../images/cadre/bg_cyan_320.jpg) no-repeat 0 0; } /* Grand cadre 980px */ .orangebox, .col2 .orangebox { background:url(../images/cadre/bg_orange_980.jpg) no-repeat 0 0; } .bluebox, .col2 .bluebox { background:url(../images/cadre/bg_blue_980.jpg) no-repeat 0 0; } .cyanbox, .col2 .cyanbox { background:url(../images/cadre/bg_cyan_980.jpg) no-repeat 0 0; } /* Cadre Default */ .orangebox, .col2 .orangebox { background:url(../images/cadre/bg_orange_980.jpg) no-repeat 0 0; } .bluebox, .col2 .bluebox { background:url(../images/cadre/bg_blue_980.jpg) no-repeat 0 0; } .cyanbox, .col2 .cyanbox { background:url(../images/cadre/bg_cyan_980.jpg) no-repeat 0 0; } .orangebox *, .bluebox *, .cyanbox *, #quotbox *, #content .orangebox a, #content .bluebox a, #content .cyanbox a, #content .orangebox h2, #content .orangebox h4, #content .bluebox h2, #content .cyanbox h2, #content #quotbox h2, .orangebox p, .bluebox p, .cyanbox p, #quotbox p { color:#fff; text-decoration:none; } #content .orangebox h4 { border-bottom:1px dotted #fff; } .orangebox ul li, .bluebox ul li, .cyanbox ul li { list-style-image:url(../images/li_white.gif); margin:0 0 0 20px; } .orangebox button[type=button] { margin-top:15px; font-size:12px; color:#333; font-weight:bold; background:url(../images/bg/bg_white.png) repeat-x 0 50%; } .orangebox button[type=button]:hover { color:#fff; background:url(../images/bg/bg_orange.png) repeat-x 0 50%; } /* Colonnes Default */ .colLeft { width:440px; float:left; } .colRight { margin-left:460px; } .hanger { width:450px; } #addthis { float:right; } .fb_bouton { display:inline !important;display:inline-block;float:left; } .addthis_toolbox { display:inline !important;display:inline-block;float:left; } /*************************************************************************************************/ /* ACCUEIL */ /*************************************************************************************************/ #home h2 strong { font-weight:normal; color:#09d; } #home h2 em { font-style:normal; color:#aaa; } #home .gradient .quot { padding-left:100px; background:url(../images/quot.gif) no-repeat 0 50%; } #home .labels { float:right; width:315px; position:relative; } #home .labels ul { margin:0; padding:0; } #home .labels li { list-style-image:none; list-style-type:none; margin:0; padding:0; } #home .labels li a { float:left; display:block; width:315px; height:92px; overflow:hidden; margin:10px 0 0 0; text-indent:-5000px; background-image:url(../images/labels-home.jpg); background-repeat:no-repeat; } #home .labels li.litest a { background-position:0 0; } #home .labels li.lidevis a { background-position:0 -100px; } #home .labels li.licallback a { background-position:0 -200px; } #home .labels li.litest a:hover { background-position:-315px 0; } #home .labels li.lidevis a:hover { background-position:-315px -100px; } #home .labels li.licallback a:hover { background-position:-315px -200px; } #home #slideshow { position:relative ; z-index:0; background:url(../images/white-30.png); padding:5px; } #home #slideshow * { text-align:right; } #home #slideshow h2 { font-size:36px; color:#000; line-height:24px; } #home #slideshow h2 strong { font-size:36px; color:#aaa; display:block; } #home #slideshow h3 { font-size:11px; } #home #slideshow p { margin-bottom:20px; } /*#home #slideshow a { display:block; font-weight:bold; color:#09d; }*/ #home #slideshow a.button { padding:6px 10px; color:#fff; font-weight:bold; font-size:12px; text-decoration:none; background:url(../images/bg/bg_orange.png) repeat-x 0 50%; border:2px solid #fff; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; -o-border-radius:5px; border-radius:5px; -webkit-box-shadow:0 0 1px #aaa; -moz-box-shadow:0 0 1px #aaa; -khtml-box-shadow:0 0 1px #aaa; -o-box-shadow:0 0 1px #aaa; box-shadow:0 0 1px #aaa; } #home #slideshow a.button:hover{ background:url(../images/bg/bg_blue.png) repeat-x 0 50%; border:2px solid #fff; } #controls { position:absolute; top:10px; left:10px; z-index:100; } #controls ul, #controls ul li { margin:0; padding:0; } #controls ul li { list-style-image:none; display:inline; } #controls ul li a { background-image:url(../images/controls.png); background-repeat:no-repeat; width:20px; height:0; float:left; margin-right:2px; overflow:hidden; padding-top:20px; -webkit-border-radius:5px; -moz-border-radius:5px; -khtml-border-radius:5px; -o-border-radius:5px; border-radius:5px; } #controls ul li.play a { background-position:0 0; } #controls ul li.play a:hover { background-position:0 -20px; } #controls ul li.pause a { background-position:-20px 0; } #controls ul li.pause a:hover { background-position:-20px -20px; } #home .idea { background:url(../images/idea.gif) no-repeat 0 50%; padding-left:125px; height:140px; } /*************************************************************************************************/ /* PRESENTATION USEWEB */ /*************************************************************************************************/ #presentation .include img { float:right; margin-left:10px; } #presentation .colLeft { width:280px; } #presentation .colLeft a { text-decoration:none; } #presentation .colRight { margin-left:300px; } ul#clients, ul#clients li { margin:0; padding:0; text-align:center; } ul#clients li { display:inline; } ul#clients li a { float:left; margin:8px 8px; } ul#clients li a img { -webkit-transition: opacity 0.3s ease; -moz-transition: opacity 0.3s ease; -khtml-transition: opacity 0.3s ease; -o-transition: opacity 0.3s ease; transition: opacity 0.3s ease; } ul#clients li a:hover img { -webkit-opacity:0.6; -moz-opacity:0.6; -khtml-opacity:0.6; -o-opacity:0.6; opacity:0.6; } /* Méthode */ #methode dl.bigstep dd { margin:0 0 50px 0; padding:0 0 0 100px; background-repeat:no-repeat; background-position:0 0; } #methode dl.bigstep dd .visu { padding-right:350px; } #methode dl.bigstep dd.un { background-image:url(../images/etape1_big.gif); background-position:0 0; } #methode dl.bigstep dd.de { background-image:url(../images/etape2_big.gif); } #methode dl.bigstep dd.tr { background-image:url(../images/etape3_big.gif); } #methode dl.bigstep dd.un .visu { background:url(../images/gabarit.jpg) no-repeat 100% 0; } #methode dl.bigstep dd.de .visu { background:url(../images/integration-html.jpg) no-repeat 100% 30px; } #methode dl.bigstep dd.tr .visu { background:url(../images/statistiques.jpg) no-repeat 100% 0; } /* Equipe */ #equipe dl, #equipe dl dd { margin:0; padding:0; } #equipe dl dd { display:inline; float:left; width:280px; height:105px; background:#e5e5e5 url(../images/hr_verti.gif) repeat-y 95% 0; padding:5px; margin:0 10px 10px 0; -webkit-box-shadow:3px 3px 2px #ccc; -moz-box-shadow:3px 3px 2px #ccc; -khtml-box-shadow:3px 3px 2px #ccc; -o-box-shadow:3px 3px 2px #ccc; box-shadow:3px 3px 2px #ccc; } #equipe dl dd strong, #equipe dl dd em { display:block; } #equipe dl dd em { color:#999; } #equipe dl dd div { margin:10px 0 0 115px; } #equipe dl dd span { width:100px; height:100px; position:relative; overflow:hidden; border:3px solid #fff; float:left; -webkit-box-shadow:0 0 2px #aaa; -moz-box-shadow:0 0 2px #aaa; -khtml-box-shadow:0 0 2px #aaa; -o-box-shadow:0 0 2px #aaa; box-shadow:0 0 2px #aaa; } #equipe dl dd span img { position:absolute; left:0; top:0; width:100px; -webkit-transition: top 0.3s ease; -moz-transition: top 0.3s ease; -khtml-transition: top 0.3s ease; -o-transition: top 0.3s ease; transition: top 0.3s ease; } #equipe dl dd span img:hover { top:-100px; } #equipe dl dd ul { margin:40px 0 0 0; padding:0; } #equipe dl dd ul li { margin:0; padding:0; display:inline; list-style-image:none; } #equipe dl dd ul li img { border:none; float:none; -webkit-opacity:0.3; -moz-opacity:0.3; -khtml-opacity:0.3; -o-opacity:0.3; opacity:0.3; box-shadow:inherit; } #equipe dl dd ul li img:hover { -webkit-opacity:1; -moz-opacity:1; -khtml-opacity:1; -o-opacity:1; opacity:1; } /*************************************************************************************************/ /* REALISATIONS */ /*************************************************************************************************/ #realisations .include { padding:10px 15px; background:#fff url(../images/bg/bg_grey.png) repeat-y 100% 0; } .viewer { margin:0; width:100%; height:390px; overflow:hidden; } .zoom { float:left; padding:5px; height:390px; overflow:hidden; } .zoom img { width:600px; height:380px; /*-webkit-box-shadow:0 0 3px #777; -moz-box-shadow:0 0 3px #777; -khtml-box-shadow:0 0 3px #777; -o-box-shadow:0 0 3px #777; box-shadow:0 0 3px #777;*/ } .legend { margin-left:630px; padding-right:90px; height:390px; background:url(../images/realisations-web.gif) no-repeat 100% 50%; } .legend .link { margin:20px 0 0 0; border-left:3px solid #09d; padding-left:5px; } .legend .link strong { display:block; } .legend .link, .legend .link a { color:#09d; } .legend .link a:hover { color:#555; /*-webkit-text-shadow:0 0 5px #09d; -moz-text-shadow:0 0 5px #09d; -khtml-text-shadow:0 0 5px #09d; -o-text-shadow:0 0 5px #09d; text-shadow:0 0 5px #09d;*/ } #content .legend h2 { font-size:36px; margin-bottom:10px; } #content .legend h3 strong { display:block; font-weight:normal; font-size:13px ; color:#555; } #view_front, #view_back { width:100%; height:390px; } /* Navigation */ #realisations .solid { height:inherit; margin-top:10px; } #realisations .frame { padding:10px; } #realisations .frame * { text-align:left; } .nav_rea { height:30px; } .nav_rea ul, .nav_rea ul li { margin:0; padding:0; } .nav_rea ul li { float:left; margin-right:2px; height:30px; line-height:30px; display:inline; list-style-image:none; } .nav_rea ul li a { cursor:pointer; padding:7px 15px 6px 15px; color:#fff; font-size:14px; text-decoration:none; background:url(../images/white-10.png); } .nav_rea ul li a:hover { color:#fff; background:url(../images/bg/bg_orange.png) repeat-x 0 50%; text-decoration:none; } #content .orangebox .nav_rea ul li a.actif { color:#f40; background:url(../images/bg/bg_white.png) repeat-x 0 50%; } .thumbs { padding:10px; background-color:#ececec; } .thumbs ul li { cursor:pointer; margin:0; padding:0; display:inline; list-style-image:none; } .thumbs ul li a img { width:130px; height:80px; -webkit-opacity:0.5; -moz-opacity:0.5; -khtml-opacity:0.5; -o-opacity:0.5; opacity:0.5; } .thumbs ul li a:hover img { -webkit-opacity:1; -moz-opacity:1; -khtml-opacity:1; -o-opacity:1; opacity:1; -webkit-box-shadow:0 0 3px #777; -moz-box-shadow:0 0 3px #777; -khtml-box-shadow:0 0 3px #777; -o-box-shadow:0 0 3px #777; box-shadow:0 0 3px #777; } /*************************************************************************************************/ /* PRESTATIONS */ /*************************************************************************************************/ #prestation .colLeft { width:350px; } #prestation .colRight { margin-left:380px; } #prestation .visu { float:right; width:400px; text-align:right; } #prestation .visu img { margin-bottom:15px; } #prestation .visu a img { border:3px solid #fff; -webkit-box-shadow:0 0 3px #777; -moz-box-shadow:0 0 3px #777; -khtml-box-shadow:0 0 3px #777; -o-box-shadow:0 0 3px #777; box-shadow:0 0 3px #777; } #prestation .visu a:hover img { border:3px solid #f60; } /* Etapes */ dl.step { margin:20px 0; padding:0; } dl.step dd { margin:0 0 30px 0; padding:0 0 0 40px; background-repeat:no-repeat; background-position:0 0; } dl.step dd.un { background-image:url(../images/etape1_or.gif); background-position:6px 0; } dl.step dd.de { background-image:url(../images/etape2_or.gif); } dl.step dd.tr { background-image:url(../images/etape3_or.gif); } dl.step dd.qu { background-image:url(../images/etape4_or.gif); } dl.bigstep dd { margin:0; padding:0 0 0 100px; background-repeat:no-repeat; background-position:0 0; } dl.bigstep dd.un { background-image:url(../images/etape1_big.gif); background-position:0 0; } dl.bigstep dd.de { background-image:url(../images/etape2_big.gif); } dl.bigstep dd.tr { background-image:url(../images/etape3_big.gif); } .interest { margin-top:20px; /*text-align:right;*/ } .interest a { padding:5px 20px; font:normal 36px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; text-transform:uppercase; color:#fff; text-decoration:none; background:url(../images/bg/bg_green.png) repeat-x 0 50%; border:2px solid #fff; -webkit-border-radius:10px; -moz-border-radius:10px; -khtml-border-radius:10px; -o-border-radius:10px; border-radius:10px; -webkit-box-shadow:0 0 1px #aaa; -moz-box-shadow:0 0 1px #aaa; -khtml-box-shadow:0 0 1px #aaa; -o-box-shadow:0 0 1px #aaa; box-shadow:0 0 1px #aaa; } .interest a:hover { background:url(../images/bg/bg_blue.png) repeat-x 0 50%; color:#fff; text-decoration:none; } /* Offres */ #offre dl { margin:20px 0; padding:0; } #offre dl dd { display:inline; position:relative; float:left; padding:10px; width:272px; height:340px; margin:0 10px 0 0; border:2px solid #fff; background:#fff url(../images/cadre/bg_gradient_grey.png) repeat-x 0 0; -webkit-box-shadow:0 0 2px #aaa; -moz-box-shadow:0 0 2px #aaa; -khtml-box-shadow:0 0 2px #aaa; -o-box-shadow:0 0 2px #aaa; box-shadow:0 0 2px #aaa; } #offre dl dd p { margin:0; } #offre dl dd ul { margin:5px 0; } #offre dl dd ul li { margin-bottom:1px; } #offre dl dd img { position:absolute; bottom:10px; left:10px; } #offre dl dd .submit { position:absolute; bottom:40px; right:10px; } #offre dl dd.pack1 h2 strong, #offre dl dd.pack1 strong { color:#0ae; } #offre dl dd.pack2 h2 strong, #offre dl dd.pack2 strong { color:#09d; } #offre dl dd.pack3 h2 strong, #offre dl dd.pack3 strong { color:#08b; } #offre dl dd.pack3 { margin:0; } /* Tablea comparatif */ #comparatif table { width:100%; margin:30px 0 10px 0; } #comparatif table thead th, #comparatif table thead td { background-color:#333; color:#fff; padding:5px 10px; font:normal 24px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; text-transform:uppercase; } #comparatif table thead .tabhead th { color:#333; background-color:inherit; } #comparatif table thead .tabhead td, #comparatif table thead .tabhead td strong { font-size:24px; padding:10px; } #comparatif table thead th { color:#fff; text-align:right; } #comparatif table thead td { text-align:center; } #comparatif table thead strong{ color:#09d; font:normal 24px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; } #comparatif table thead td { font:normal 50px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; color:#fff; text-transform:uppercase; } #comparatif table thead td.bg1{ background-color:#0ae; } #comparatif table thead td.bg2{ background-color:#09d; } #comparatif table thead td.bg3{ background-color:#08b; } #comparatif table tbody th, #comparatif table tbody td { padding:5px; } #comparatif table tbody th { padding-right:10px; font-weight:normal; text-align:right; } #comparatif table tbody td { text-align:center; font-weight:bold; color:#333; } #comparatif table tbody td.bg1 { background-color:#cceefc; } #comparatif table tbody td.bg2 { background-color:#ccebf8; } #comparatif table tbody td.bg3 { background-color:#cce7f1 } #comparatif table tbody tr.tdbg th { background-color:#ebebeb; } #comparatif table tbody tr.tdbg td.bg1 { background-color:#b2e5fa; } #comparatif table tbody tr.tdbg td.bg2 { background-color:#b2e0f5; } #comparatif table tbody tr.tdbg td.bg3 { background-color:#b2dbea; } /*************************************************************************************************/ /* FORMATIONS */ /*************************************************************************************************/ #formation .include { background:#fff url(../images/formateur.jpg) no-repeat 100% 100%; } #formation h4 { font-size:23px; margin-top:30px; } /*************************************************************************************************/ /* OUTILS */ /*************************************************************************************************/ .onglets ul, .onglets ul li { margin:0; padding:0; list-style-type:none; text-align:justify; } .onglets ul li { display:inline; } .onglets ul li a { background:#09d url(../images/bg/bg_blue.png) repeat-x 0 0; border:1px solid #ccc; text-decoration:none; padding:2px 5px; color:#fff; font:normal 30px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; } .onglets ul li a:hover { background:#eee url(../images/bg/bg_white.png) repeat-x 0 0; color:#555; -webkit-box-shadow:0 0 3px #aaa; -moz-box-shadow:0 0 3px #aaa; -khtml-box-shadow:0 0 3px #aaa; -o-box-shadow:0 0 3px #aaa; box-shadow:0 0 3px #aaa; } /* Faq */ #faq .include, #lexique .include { padding-right:280px; background:#fff url(../images/surprise.jpg) no-repeat 98% 100%; } #faq h3 { margin:0 0 5px 0; font-size:16px; } #faq h3:hover { cursor:pointer; color:#f60; } /* Lexique */ #lexique h4 { margin:0; color:#0ae; border-bottom:none; padding:0; } #lexique h6 { color:#0ae; font:normal 60px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; -webkit-text-shadow:5px 0 3px #ccc; -moz-text-shadow:5px 0 3px #ccc; -khtml-text-shadow:5px 0 3px #ccc; -o-text-shadow:5px 0 3px #ccc; text-shadow:5px 0 3px #ccc; } #lexique ul { margin:0 0 15px 0; } #lexique ul li { margin-bottom:0; } /* Quizz */ #quizz .include { padding-right:400px; background:#fff url(../images/whisper.jpg) no-repeat 98% 100%; } #quizz .ireset { margin:0 0 10px 0; font-size:16px; width:360px; } .good { color:#7a0; } .wrong { color:#f40; } .quizz ul li a { text-align:left; width:400px; display:block; } .lastask { margin:20px 0; } .lastask a { text-decoration:none; font-weight:bold; color:#09d; } .lastask a:hover { color:#f60; } /* Simulation */ #simulation .include { padding-right:250px; background:#fff url(../images/technicien.jpg) no-repeat 100% 100%; } #simulation .include, #quizz .include { height:auto !important; height:250px; min-height:250px; } /* Indispensables */ .logiciel { width:450px; height:100px; float:left; } .pack { float:left; background:url(../images/pack.png) no-repeat 0 0; width:70px; height:85px; position:relative; } .pack img { position:absolute; top:30px; right:8px; } .txt { margin:0 0 0 80px; } .txt p { margin:0; } #content .txt h3 { margin:5px 0 0 0; } .txt h3 a { color:#09d; font:normal 36px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; text-decoration:none; text-transform:none; } .txt h3 a:hover { color:#0ae; } #clavier .colLeft { width:600px; } #clavier .colRight { margin-left:650px; } /* Support */ #support .include { padding-right:200px; background:#fff url(../images/technicien.jpg) no-repeat 100% 100%; } #zones h4 { text-align:left; } #zones ul li { list-style-image:none; text-align:center; font-size:14px; display:inline; float:left; padding:10px; width:210px; height:90px; margin:0 5px 0 0; background-image:url(../images/white-10.png); } #zones ul li.last { margin:0; } #zones ul li h5 { text-align:center; margin:0 0 10px 0; text-transform:uppercase; } /*************************************************************************************************/ /* CONTACT / ACCES */ /*************************************************************************************************/ #contact .include img { float:right; margin:20px 0 20px 10px; } #contact .colLeft { width:290px; } #contact .colRight { margin-left:310px; } .chps { font-size:10px; /*text-align:right;*/ color:#09d; } .tab_form { border-collapse:collapse; margin:10px 0; } .tab_form input[type=submit] { margin-top:10px; } .tab_form td, .tab_form th { vertical-align:top; } .tab_form th { text-align:left; font-weight:normal; } .ireset { width:190px; } #captcha_code { width:50px; } ul.error_list li { padding:2px 3px; margin:0 2px 0 0; list-style-image:none; color:#fff; background-color:#f70; font-size:10px; } ul.error_list { margin:0; margin:0; border: none; } /* Popup */ #popup { padding:20px; text-align:left; font-size:14px; } #popup h2 { font:normal 30px 'LibelSuitRegular', Verdana, Arial, Helvetica, sans-serif; color:#333; text-transform:uppercase; border-bottom:1px dotted #ccc; padding-bottom:3px; margin-bottom:5px; } #popup .tab_form input[type=text], #popup .tab_form textarea { font-size:14px; } #popup .tab_form td, #popup .tab_form th { padding:2px; } #acces .colLeft { width:580px; } #acces .colRight { margin-left:630px; } #acces ul li, #acces h4 { text-align:left; } #content #acces a { text-decoration:underline; } /* Recrutement */ #recrutement .colLeft { width:350px; } #recrutement .colRight { margin-left:380px; } /*************************************************************************************************/ /* CGV */ /*************************************************************************************************/ #cgv h3 { margin:20px 0 5px 0; } #cgv h3#preambule { margin:0 0 5px 0; } #cgv p, #cgv ul li { text-align:justify; } #mentionslegales .colLeft { width:450px; } #mentionslegales .colRight { margin-left:530px; }