/* * CSS Document * CSS3Create.com 18/01/2012 * VDO * -- * var * couleurFond: #24292b * couleurMenu: #09C -> #006080 * couleurH4Menu: #004c66 */ *{margin:0;padding:0;border:none;} li{list-style:none;} @font-face { font-family: 'ComfortaaBold'; src: url('polices/Comfortaa_Bold-webfont.eot');/*IE*/ src: url('polices/Comfortaa_Bold-webfont.woff') format('woff'), url('polices/Comfortaa_Bold-webfont.ttf') format('truetype'), url('polices/Comfortaa_Bold-webfont.svg#webfont') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Code'; src: url('polices/Anonymous_Pro-webfont.eot'); src: url('polices/Anonymous_Pro-webfont.woff') format('woff'), url('polices/Anonymous_Pro-webfont.ttf') format('truetype'), url('polices/Anonymous_Pro-webfont.svg#webfont') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'TeXGyreReg'; src: url('polices/texgyreadventor-regular-webfont.eot'), url('polices/texgyreadventor-regular-webfont.woff') format('woff'), url('polices/texgyreadventor-regular-webfont.ttf') format('truetype'), url('polices/texgyreadventor-regular-webfont.svg#webfontR1Kizti2') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'TeXGyreReg'; src: url('polices/texgyreadventor-bold-webfont.eot'); src: url('polices/texgyreadventor-bold-webfont.woff') format('woff'), url('polices/texgyreadventor-bold-webfont.ttf') format('truetype'), url('polices/texgyreadventor-bold-webfont.svg#webfontXBQs7V8x') format('svg'); font-weight: bold; font-style: normal; } @font-face { font-family: 'mySymbol'; src: url('mysymbol-webfont.eot'); src: local('?'), url('polices/mysymbol-webfont.woff') format('woff'), url('polices/mysymbol-webfont.ttf') format('truetype'), url('polices/mysymbol-webfont.svg#webfontRSDwuQZd') format('svg'); font-weight: normal; font-style: normal; } /*----------------------------------------------------------------------------*/ /* STRUCTURE */ html{height:100%;width:100%;background:#111;font:1em "Helvetica Neue",Helvetica,"Trebuchet MS",Arial,Verdana,sans-serif;} body{width:100%;height:auto;position:relative;/*pour footer*/background: #1C1C1C;} header,nav,article,section,footer{display:block;} #wrapAll{width:960px;margin:0 auto;} #header{width:960px;height:85px;position:relative;z-index:1000;} #ap_container{position:absolute;z-index:10000;} #bandeau{clear:both;width:360px;position:relative;/*pagination*/min-height:770px;overflow: hidden;} #content{margin:0px;border-left:360px solid #0099cc;} ::selection{color:#fff;background:#09c;text-shadow:none;} ::-moz-selection{color:#fff;background:#09c;text-shadow:none;} .spip_code code::selection{color:#000 !important;background:#51c3fa !important;} .spip_code code::-moz-selection{color:#000 !important;background:#51c3fa !important;} #evitement{position:absolute;width:360px;text-align:right;line-height:.8em;} #evitement a{font-size:.6em;margin:2px;color:#51c3fa;} #evitement a:hover, #evitement a:focus{color:white;} /*----------------------------------------------------------------------------*/ /* ADMIN */ .crayon-active{background:white !important;color:black !important;} span.spip_documents_center{display:block;text-align:center;} span.spip_documents_center img{max-width:100%;height:auto;} /*----------------------------------------------------------------------------*/ /* CODE */ div.spip_code{position:relative;padding:15px 20px 15px 20px;background:#f5f2f0;font-size:1em;text-indent:0px;border:1px dashed #32393b;margin:10px 0px;} /*div.spip_code:hover{border-color:#555;background:rgba(0,0,0,0.3);} div.spip_code code::after{content:attr(class);position:absolute;z-index:100;top:0;right:0;color:#222;font-size:2em;font-family:sans-serif;padding:0 2px;} div.spip_code code.css::after{content:'css';} div.spip_code code.html4strict::after{content:'html';} div.spip_code:hover code::after{color:#51c3fa;}*/ code{font:1em "Code",monospace;color:#51c3fa;outline:none;padding:2px;text-shadow:0px 1px 0px #000;background:rgba(0,0,0,0.3);border:1px dashed #32393b;padding:0 2px;} div.spip_code code{border:none;background:none;white-space: pre-wrap;} div.spip_code a{text-decoration:none;} a .spip_code{color:white;border:none;background:transparent;} #article p code, #article ul code, #article q code, #article h1 code, #article h2 code, #article h3 code, #article .note-info code{color: #F5F2F0; background: none; text-shadow: none; padding: 2px;} #article p code span, #article ul code span, #article q code span, #article h1 code span, #article h2 code span, #article h3 code span, #article .note-info code span{ color: #F5F2F0; background: none; } /*----------------------------------------------------------------------------*/ /* CSS PSEUDO OO */ .wrapLeft{float:left;} .btn{ display:inline-block;height:20px; text-indent:23px; background:url('CSS/btnSprite.png') top left no-repeat, #292e33; background:url('CSS/btnSprite.png') top left no-repeat, -moz-linear-gradient(top, #474d55, #21262a); background:url('CSS/btnSprite.png') top left no-repeat, -webkit-gradient(linear,left top,left bottom,color-stop(0, #474d55),color-stop(1, #21262a)); text-shadow:0px -1px 0px black; } .btnVert{ position:relative; display:inline-block;height:18px;padding:2px 3px 0px 3px;margin-top:3px;font-size:0.8em; background:rgba(0,0,0,.4);color:#8ce54c;text-decoration:none; text-shadow:0px 1px 1px rgba(0,0,0,0.4); border-radius:2px; box-shadow:0px 1px 0px rgba(255,255,255,0.3); -webkit-transition:all 0.2s ease; -moz-transition:all 0.2s ease; -o-transition:all 0.2s ease; transition:all 0.2s ease; } .btnVert:hover{color:#FFF;} .btnVert.no_link{background:rgba(0,0,0,.2);box-shadow:none;} .btnVert.no_link:hover{color:#8ce54c;} .nouv{background:#9C0;color:#000;font-size:9px;/*bug safari si em*/padding:0px 2px;margin-right:2px;border-radius:2px;text-shadow:0 1px 0 rgba(255,255,255,.2);vertical-align:top;} .nouv.tutoIcon{background:#09C;} .backBlue{ background:#016e93; /*linear-gradient*/ background:-webkit-linear-gradient(#0183ae, #016e93); background: -moz-linear-gradient(#0183ae, #016e93); background: -ms-linear-gradient(#0183ae, #016e93); background: -o-linear-gradient(#0183ae, #016e93); background: linear-gradient(#0183ae, #016e93); } .radius3{ border-radius:3px; } /*----------------------------------------------------------------------------*/ /* ENTETE */ #header .wrapLeft{width:360px;height:100%;background:#51c3fa;} #logoSite{height:75px;} #logoSite a{display:block;width:150px;margin-top:10px;height:64px;overflow:hidden;} #logoSite a:hover{ -webkit-animation: tada 1s; -moz-animation: tada 1s; -ms-animation: tada 1s; -o-animation: tada 1s; animation: tada 1s; } @-webkit-keyframes tada { 0% {-webkit-transform: scale(1);} 10%, 20% {-webkit-transform: scale(0.8) rotate(-3deg);} 30%, 50%, 70%, 90% {-webkit-transform: scale(1) rotate(3deg);} 40%, 60%, 80% {-webkit-transform: scale(1) rotate(-3deg);} 100% {-webkit-transform: scale(1) rotate(0);} } @-moz-keyframes tada { 0% {-moz-transform: scale(1);} 10%, 20% {-moz-transform: scale(0.8) rotate(-3deg);} 30%, 50%, 70%, 90% {-moz-transform: scale(1) rotate(3deg);} 40%, 60%, 80% {-moz-transform: scale(1) rotate(-3deg);} 100% {-moz-transform: scale(1) rotate(0);} } @-ms-keyframes tada { 0% {-ms-transform: scale(1);} 10%, 20% {-ms-transform: scale(0.8) rotate(-3deg);} 30%, 50%, 70%, 90% {-ms-transform: scale(1) rotate(3deg);} 40%, 60%, 80% {-ms-transform: scale(1) rotate(-3deg);} 100% {-ms-transform: scale(1) rotate(0);} } @-o-keyframes tada { 0% {-o-transform: scale(1);} 10%, 20% {-o-transform: scale(0.8) rotate(-3deg);} 30%, 50%, 70%, 90% {-o-transform: scale(1) rotate(3deg);} 40%, 60%, 80% {-o-transform: scale(1) rotate(-3deg);} 100% {-o-transform: scale(1) rotate(0);} } @keyframes tada { 0% {transform: scale(1);} 10%, 20% {transform: scale(0.8) rotate(-3deg);} 30%, 50%, 70%, 90% {transform: scale(1) rotate(3deg);} 40%, 60%, 80% {transform: scale(1) rotate(-3deg);} 100% {transform: scale(1) rotate(0);} } #header .wrapRight{height:100%;position:relative;margin-left:360px;} #header .wrapLeft:after{content:"";position:absolute;width:340px;height:0px;margin-left:10px;border-top:1px solid rgba(255,255,255,0.25);border-bottom:1px solid rgba(0,153,204,0.25);} /*prefixmycss*/ #prefixmycss{position:absolute;width: 175px;height: 39px;top:20px;left:200px;} #prefixmycss a{display: block;width: 175px;height: 0;padding-top: 39px;overflow: hidden;background: url('CSS/pleeease.png');} /*menu des mots-cles*/ #navMotCle{position:absolute;right:0;margin-top:5px;} #navMotCle .motCle{float:left;} #navMotCle .motCle > ul{display:none;position:absolute;background:#51C3FA;padding:10px 0;box-shadow:0px 0px 5px black;} #navMotCle .motCle > ul ul{font-size:.9em;padding-left:10px;} #navMotCle .motCle ul li a{display:block;padding:2px 20px;color:rgba(44,49,51,1);text-shadow:0px 1px rgba(255,255,255,0.3);font-size:0.75em;text-decoration:none;} #navMotCle .motCle ul li a:hover{background:rgba(255,255,255,0.2);} #navMotCle h2{display:inline-block;font-size:0.8em;font-weight:normal;color:#09C;height:20px;padding:5px 8px 0px 8px;} #navMotCle h2 a{color:#09c;text-decoration:none;} #navMotCle h2 a:hover,#navMotCle h2 a:focus{color:#fff;} #navMotCle h2 span{margin-right:3px;} #navMotCle .motCle:hover ul{display:block;} #navMotCle .motCle:hover h2{background:black;border-radius:4px;} #navMotCle div.voirTous a{ display:block;color:white;font-size:0.8em;width:130px;height:20px;padding:5px 8px 0px 8px;text-decoration:none; text-indent:23px; background:url('CSS/btnSprite.png') bottom left no-repeat, #43AF00; background:url('CSS/btnSprite.png') bottom left no-repeat, -webkit-linear-gradient(top,#6AE51D,#43AF00); background:url('CSS/btnSprite.png') bottom left no-repeat, -moz-linear-gradient(top,#6AE51D,#43AF00); background:url('CSS/btnSprite.png') bottom left no-repeat, -ms-linear-gradient(top,#6AE51D,#43AF00); background:url('CSS/btnSprite.png') bottom left no-repeat, -o-linear-gradient(top,#6AE51D,#43AF00); background:url('CSS/btnSprite.png') bottom left no-repeat, linear-gradient(top,#6AE51D,#43AF00); text-shadow:0px -1px 0px rgba(0,0,0,0.3); } #navMotCle .motCle h2::before{margin-right:3px;color:rgba(255,255,255,0.2);} #navMotCle .motCle:nth-child(2) h2::before{content:"@";} #navMotCle .motCle:nth-child(3) h2::before{content:"{}";} #navMotCle .motCle:nth-child(4) h2::before{content:"#";} /*----------------------------------------------------------------------------*/ /* BANDEAU */ #bandeau .rubMenu{position:relative;} #bandeau #rubDemo{ background:url('images/fondBandeau.png') 0 0 repeat-x; background:-webkit-linear-gradient(top,#51c3fa,rgba(81,195,250,0)); background:-moz-linear-gradient(top,#51c3fa,rgba(81,195,250,0)); background:-ms-linear-gradient(top,#51c3fa,rgba(81,195,250,0)); background:-o-linear-gradient(top,#51c3fa,rgba(81,195,250,0)); background:linear-gradient(top,#51c3fa,rgba(81,195,250,0)); } #bandeau h2{height:20px;font-size:0.95em;font-weight: normal;line-height:1em;padding:5px 10px 0px 10px;color:white;margin-top:25px;box-shadow:0px 0px 5px rgba(0,0,0,0.5);} /*menu demo*/ #bandeau .btn2{position:absolute;left:100px;top:27px;font-size:0.85em;} #bandeau #rubTuto .btn2{left:110px;} #bandeau #rubApprendre .btn2{left:120px;} #bandeau .btn2 a{display:inline-block;opacity:0;padding:2px 4px;margin-left:3px;text-decoration:none;color:#51C3FA;text-shadow:0px 1px 0px rgba(0,0,0,0.3); box-shadow:0px 1px 0px rgba(255,255,255,0.2); -moz-transition:opacity 0.5s ease;-webkit-transition:opacity 0.5s ease;transition:opacity 0.5s ease;} #bandeau .rubMenu:hover .btn2 a{opacity:1;} #bandeau .rubMenu:hover .btn2 a:hover{background:#006080;box-shadow:0px 0px 2px #1C1C1C;color:#fff;} #bandeau #navDemo,#bandeau #navTuto{height:290px;padding-top:15px;width:5000px;position:relative;left:0;} #bandeau #navDemo.anim{-webkit-transition:left 0.5s ease;-moz-transition:left 0.5s ease;-o-transition:left 0.5s ease;}/*anim en js*/ #bandeau ul{float:left;width:360px;font-family:"TeXGyreReg",sans-serif;font-size:14px;font-weight:normal;letter-spacing:0px;} #bandeau ul.menuDemo{height:275px;} #bandeau ul.menuTuto{height:175px;} #bandeau ul li{position:relative;clear:left;width:360px;list-style:none;margin-bottom:5px;} #bandeau ul.menuDemo li{height:50px;} #bandeau ul.menuTuto li{height:25px;} #bandeau ul.menuDemo li img{background:#111;float:left;width:150px;height:50px;margin-left:10px;margin-right:10px;box-shadow:0px 0px 2px black;border-radius:3px; /*transition*/ -webkit-transition:-webkit-transform .3s cubic-bezier(.5,2,.6,.5); -moz-transition: -moz-transform .3s cubic-bezier(.5,2,.6,.5); -ms-transition: -ms-transform .3s cubic-bezier(.5,2,.6,.5); -o-transition: -o-transform .3s cubic-bezier(.5,2,.6,.5); transition: transform .3s cubic-bezier(.5,2,.6,.5); } #bandeau ul li > a{display:block;padding-right:10px;line-height:140%;} #bandeau ul li a{text-decoration:none;color:rgba(44,49,51,1);text-shadow:0px 1px 0px rgba(255,255,255,0.2);} #bandeau ul li a:hover{color:white;} #bandeau ul li.on a{color:white;} #bandeau ul.menuDemo li:hover img{ /*transform*/ -webkit-transform:rotate(-5deg); -moz-transform:rotate(-5deg); -ms-transform:rotate(-5deg); -o-transform:rotate(-5deg); transform:rotate(-5deg); z-index:1; } #bandeau #navTuto{height:190px;} #bandeau #navTuto li{display:block;white-space:nowrap;position:relative;} #bandeau #navTuto li a strong{display:inline-block;vertical-align: top;font-weight:normal;} #bandeau #navTuto li a::after{content:"";position:absolute;top:0;right:0;width:20px;height:25px; background:#09C; background:-webkit-linear-gradient(right,#09C,#09C 50%,rgba(0,153,204,0)); background: -moz-linear-gradient(right,#09C,#09C 50%,rgba(0,153,204,0)); background: -ms-linear-gradient(right,#09C,#09C 50%,rgba(0,153,204,0)); background: -o-linear-gradient(right,#09C,#09C 50%,rgba(0,153,204,0)); background: linear-gradient( to left,#09C,#09C 50%,rgba(0,153,204,0)); } #bandeau ul.menuTuto li span{display:inline-block;width:35px;height:16px;background:#016e93;position:relative;margin:2px 6px 2px 10px;border-radius:4px;box-shadow:0 1px 0px rgba(255,255,255,0.2);} #bandeau ul.menuTuto li span span{margin:0;background:#51C3FA;width:8px;height:8px;position:absolute;top:4px;left:4px;border-radius:4px;} #bandeau ul.menuTuto li span span::after,#bandeau ul.menuTuto li span span::before{content:"";background:#51C3FA;width:8px;height:8px;left:10px;position:absolute;border-radius:4px;} #bandeau ul.menuTuto li span span::before{left:20px;} #bandeau ul.menuTuto li span.tut18 span::after,#bandeau ul.menuTuto li span.tut18 span::before{background:transparent;border:1px solid #51C3FA;width:6px;height:6px;} #bandeau ul.menuTuto li span.tut19 span::before{background:transparent;border:1px solid #51C3FA;width:6px;height:6px;} /*NOUV*/ /*#bandeau .nouvTuto{display:block;position:absolute;bottom:0;left:12px;z-index:100;}*/ /* -- pagination -- */ #bandeau p.pagination{position:absolute;z-index:500;top:335px;left:298px;font-size:1.2em;width:46px;height:20px;border-radius:16px;padding:3px; background:#016e93; background:-webkit-linear-gradient( #0183ae, #016e93); background:-moz-linear-gradient( #0183ae, #016e93); background:-ms-linear-gradient( #0183ae, #016e93); background:-o-linear-gradient( #0183ae, #016e93); background:linear-gradient( #0183ae, #016e93); box-shadow:0px 1px 0px rgba(255,255,255,0.2);} #bandeau #rubTuto p.pagination{top:240px;} #bandeau p.pagination a{display:block;float:left;width:20px;height:20px;outline:none; background:#51c3fa; background:-webkit-linear-gradient( #51c3fa, #09c); background:-moz-linear-gradient( #51c3fa, #09c); background:-ms-linear-gradient( #51c3fa, #09c); background:-o-linear-gradient( #51c3fa, #09c); background:linear-gradient( #51c3fa, #09c); color:white;text-align:center;font-family:'Code';margin-left:2px;border-radius:10px; text-align:center;text-decoration:none;text-shadow:0px 1px 2px black;} #bandeau p.pagination a.on:hover{ background:#51c3fa;} #bandeau p.pagination a.on:active{ color:#000;background:#09C;} #bandeau p.pagination a.off{color:#09C;cursor:default;text-shadow:none;background:rgba(0,0,0,0.2);} #bandeau p.pagination a:last-child{text-indent:5px;} #bandeau p.nbPage{position:absolute;z-index:500;top:341px;right:70px;font-size:0.7em;color:rgba(44, 49, 51, .6);} #bandeau p.nbPage span{font-weight:bold;} /*Suivre*/ #bandeau .lesGens{margin-top:15px;} #bandeau .lesGens p{text-align:left;text-indent:20px;height:23px;color:rgba(44,49,51,1);font-size:.7em;} #bandeau .lesGens p.tw, #bandeau .lesGens p.rssfb{text-indent:40px;} #bandeau .lesGens > p + div{margin-bottom:10px; } #bandeau .lesGens p a{display:inline-block;text-decoration:none;color:#000;height:23px;font-weight:bold;text-indent:20px;} .lesGens p a.rss{background:url('images/rss.png') no-repeat 0 1px;} #bandeau .lesGens p a.fb{background:url('images/facebook.png') no-repeat 0 1px;} #bandeau .lesGens p a + a{margin-left:10px;} #bandeau .lesGens p a:hover{text-decoration:underline;} #bandeau .lesGens p a img{margin-right:6px;vertical-align:middle;} /*gplus*/ #bandeau .gplus{position:absolute;z-index:500;right:-10px;margin-top:5px;text-align:right;font-size:0.7em;font-style:italic;color:#09c;} #bandeau #navApp ul{float:none;width:auto;padding:15px;} #bandeau #navApp ul li{display:inline-block;width:auto;} #bandeau #navApp ul li a{display:inline;padding:2px;font-size:.9em;} #bandeau #navApp ul li a:hover{background:#016e93;} /*encart livre*/ #livre{position:relative;display:table;-moz-box-sizing:border-box;box-sizing:border-box;width:100%;margin-top:20px;padding:20px 20px 0 20px;text-shadow: 0 1px 0 rgba(255,255,255,.2);background:rgba(81,195,250,.3);border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)} #livre > div{display: table-cell;vertical-align:top;} #livre > div:last-child{padding:20px 0 20px 20px ;} #livre p{font-size:.7em;text-align: right;color: rgb(44, 49, 51);} #livre .livreTitre{text-align: left;font:1.05em TeXGyreReg, sans-serif;color:#fff;} #livre .livreSSTitre{text-align: left;font:.95em TeXGyreReg, sans-serif;} #livre .livreAmazon{padding-top:30px;padding-bottom:2px;} #livre p a{color:white;text-decoration:none;text-shadow: 0 1px 0 rgba(0,0,0,.2);} #livre p.livreSSTitre a{color: rgb(44, 49, 51);text-shadow: 0 1px 0 rgba(255,255,255,.2);} #livre p a:hover, #livre p a:focus{text-decoration:underline;} /*----------------------------------------------------------------------------*/ /* ARTICLE */ #article{padding-left:20px;min-height:770px;padding-bottom:25px;color:#ccc;overflow:hidden;} /*----------------------------------------------------------------------------*/ /* ARTICLE - TITRES */ #article h1,#article h2,#article h3,#article h4{ font-family:"TeXGyreReg",sans-serif;font-weight:normal;color:#FFF;letter-spacing:-0.5px;word-spacing:0px;line-height:1.2em;} #article h1{font-size:1.6em;text-shadow:0px 0px 2px #FFF;margin-bottom:10px;} #article h1 span{color:#09C;text-shadow:0px 0px 2px #09C;} #article h1 + h2{color:#6AE51D;font-size:1em;padding:0px 0px 10px 0px;margin:0 0 15px 0;letter-spacing:0.5px;} #article h2, #article h3{position:relative;font-size:1.2em;color:#6AE51D;padding:5px 5px 10px 5px;margin:30px 0 10px 0;text-shadow:0 -1px 0 #000;} #article h3{color:#eee;} #article h2.invert{color:#51c3fa;} #article h2::after, #article h3::after{ content:'';position:absolute;bottom:0;left:0;width:100%;height:0;border-top:1px solid rgba(0,0,0,.4);border-bottom:1px solid rgba(255,255,255,.1);} #article h1 + h2::after{display:none;} #article h2 a{color:#6AE51D;text-decoration:none;} #article h2 em{font-size:.85em;font-style:normal;color:#444;} /*----------------------------------------------------------------------------*/ /* ARTICLE - BALISES */ #article .content_texte{font-size:15px;line-height:1.4em;} #article .content_texte p{padding:10px;} #article .content_texte strong{color:#6AE51D;font-weight:normal;} #article .content_texte a{color:#bbb;background:#444;padding:0 3px;text-shadow:0px 0px 1px #000;text-decoration:none;border-radius:2px;} #article .content_texte a:hover, #article .content_texte a:focus{background:#777;color:#ddd;} #article .content_texte.only a{background:transparent;color:#ddd;} #article .content_texte.only a:hover, #article .content_texte.only a:focus{color:#51C3FA;} #article .content_texte.intro{color:#fff;padding:15px 0px;} #article .content_texte.intro2{font-size:0.9em;color:#888;padding-top:10px;} #article .content_texte ul{padding:15px 40px;} #article .content_texte ul ul{padding-top:0;font-size:.9em;} #article .content_texte ul li{padding:2px;color:#ddd;list-style:disc;} #article .content_texte ul.noPuce li{list-style:none;} #article .content_texte ul.noPuce li a{display:table;table-layout:fixed;white-space:normal;} #article .content_texte ul.noPuce li a > img, #article .content_texte ul.noPuce li a > span{display:table-cell;vertical-align:top;} #article .content_texte ul li img{display:inline-block;vertical-align:top;border-radius:2px;margin-right:5px;} #article .content_texte ul li a em{font-size:.8em;color:#aaa;} #article .content_texte blockquote{padding:25px;text-align:center;font:italic 1em Georgia,serif;color:#aaa;quotes: '\00AB' '\00BB';} #article .note-info{color: #aaa; font-size: .8em; padding: 1em 2em;} #article .note-info ul li{color: #aaa;} #article #accueilHasard ul.noPuce li a{font-size:1.2em;} #article #accueilHasard blockquote{padding:15px 25px;} #article #accueilHasard p:last-of-type{text-align:right;font-size:.8em;} #accueil .cell{display:table-cell;width:50%;} #accueil .cell.only ul{padding:0;} #accueil .cell.only ul li{min-height:50px;} #accueil #accueilThemes ul {text-align:center;line-height:2.6em;background:rgba(0,0,0,.5);border-radius:3px;padding:20px 0;} #accueil #accueilThemes ul li{display:inline;height:auto;font-size: 1em;white-space: nowrap;} #accueil #accueilThemes ul li a{color:#51c3fa;text-decoration:none;padding:9px;border-radius:3px; -webkit-transition:all 0.2s ease;-moz-transition:all 0.2s ease;-ms-transition:all 0.2s ease;-o-transition:all 0.2s ease;transition:all 0.2s ease;} #accueil #accueilThemes ul li a:hover, #accueil #accueilThemes ul li a:focus{background:#51C3FA;color:#111;text-shadow:0 1px 0 rgba(255,255,255,.3);} #accueil #accueilApprendre section{display:table;table-layout:fixed;width:100%;} #accueil #accueilApprendre h3{font-size:1em;margin:5px;} #accueil #accueilApprendre h3::after{display:none;} #accueil #accueilApprendre section div{display:table-cell;width:50%;} /*date articles*/ #datesArticle{font-size:.7em;font-style:italic;text-align:right;color:#555;} #datesArticle span{color:#09c;padding:2px;} #datesArticle span:first-child{color:#ccc;} /*encart demo*/ .demoTime{clear:right;min-height:100px;padding-top:1px;margin-top:5px;position:relative;overflow:hidden;border:2px solid white; background:#eee; background:-webkit-linear-gradient(#fff,#eee); background:-moz-linear-gradient(#fff,#eee); background:-ms-linear-gradient(#fff,#eee); background:-o-linear-gradient(#fff,#eee); background:linear-gradient(#fff,#eee); } /*infos demo*/ #infosArticle{display:table;table-layout:fixed;min-height:158px;width:100%; background:#5ED414; background:-webkit-linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0) 4px,rgba(0,0,0,0)),-webkit-linear-gradient(#6AE51D,#43AF00); background:-moz-linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0) 4px,rgba(0,0,0,0)),-moz-linear-gradient(#6AE51D,#43AF00); background:-ms-linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0) 4px,rgba(0,0,0,0)),-ms-linear-gradient(#6AE51D,#43AF00); background:-o-linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0) 4px,rgba(0,0,0,0)),-o-linear-gradient(#6AE51D,#43AF00); background:linear-gradient(rgba(0,0,0,0.8),rgba(0,0,0,0) 4px,rgba(0,0,0,0)),linear-gradient(#6AE51D,#43AF00); } #infosArticle .grd{display:table-cell;width:213px;height:138px;padding:10px;border-right:1px solid rgba(0,0,0,0.2);} #infosArticle .pet{display:table-cell;width:92px;padding:10px;overflow:hidden;} #infosArticle h5{font-family:"TeXGyreReg",sans-serif;font-size:0.8em;font-weight:normal;color:#386d11;} #infosArticle h5:nth-of-type(2){margin-top:20px;} #infosArticle .pet h5:nth-of-type(2){margin-top:10px;} #infosArticle .pet p.note{font-size:0.6em;color: #386d11;width:89px;} #infosArticle .pet .note{margin:0;} #infosArticle .pet p.note .nbVote{float:right;} #infosArticle .notation_note{position:relative; display:inline-block;height:18px;padding:2px 2px 0px 2px;margin-top:2px;font-size:0.8em; background:#41731E;color:#7CCD43;text-decoration:none; text-shadow:0px 1px 0px rgba(0,0,0,0.5);border-radius:2px;} #infosArticle a.brow7,#infosArticle a.brow8,#infosArticle a.brow9,#infosArticle a.brow10,#infosArticle a.brow11{ text-indent:20px;background-image:url('images/btnBrowser.png');background-position:2px 0px;background-repeat:no-repeat;} #infosArticle a.brow8{background-position: 2px -40px;} #infosArticle a.brow9{background-position: 2px -60px;} #infosArticle a.brow10{background-position: 2px -80px;} #infosArticle a.brow11{background-position: 2px -20px;} /*content #TEXTE */ #footer_article .quiQuand{clear:both;} #footer_article .quiQuand p{text-align:right;font-size:0.8em;color:#555;padding-bottom:35px;} /* plus de demos */ #article .blocSite{margin:40px 0;font-size:.95em;} #article .blocSite h3{text-align:left;padding:10px 0;} #article .blocSite h3 small{color:white;} #artsRel{position:relative;overflow:auto;background:rgba(0,0,0,0.3);padding:15px 0px 30px 0px;} #artsRel .artRel{width:150px;height:135px;margin-left:34px;float:left;text-indent:0px;} #artsRel .artRel a{text-decoration:none;color:#aaa;} #artsRel .artRel a:hover, #artsRel .artRel a:focus{color:#fff;} #artsRel p.voirTous{position:absolute;bottom:5px;right:15px;} #artsRel p.nouvTuto{position:absolute;margin-top:-24px;margin-left:2px;} /*----------------------------------------------------------------------------*/ /* FORUM */ #forum h3{text-align:left;} #forum .comment{width:258px;padding:15px;background:rgba(0,0,0,0.3);display:table-cell;border:1px solid #1c1c1c;line-height:1.3em;} #forum .idF{color:#6AE51D;} #forum .nomPers{color:#51C3FA;} #forum .nomDate{font-size:0.7em;color:#888;padding-left:10px;} #forum .texteF p{font-size:0.9em;} #forum .comment a{color:#bbb;background:#444;padding:0 3px;text-shadow:0px 0px 1px #000;text-decoration:none;border-radius:2px;} #forum .comment a:hover{background:#777;color:#ddd;} #formulaire_forum{padding:10px;margin:0px;border:1px solid #1c1c1c; background:#5ED414; background:-webkit-linear-gradient(#6AE51D,#43AF00); background:-moz-linear-gradient(#6AE51D,#43AF00); background:-ms-linear-gradient(#6AE51D,#43AF00); background:-o-linear-gradient(#6AE51D,#43AF00); background:linear-gradient(#6AE51D,#43AF00); } #formulaire_forum legend{display:none;} #formulaire_forum .explication{font-size:0.7em;color:rgba(0,0,0,0.2);} #texte{width:555px;height:100px;max-width:555px;} #formulaire_forum label{font-family:"TeXGyreReg",sans-serif;font-size:0.9em;color:rgba(0,0,0,0.8);display:block;min-width:200px;} #formulaire_forum input, #formulaire_forum textarea{background:rgba(0,0,0,0.3);color:white;padding:2px;font-size:0.9em;font-family:"Helvetica Neue",Helvetica,"Trebuchet MS",Arial,Verdana,sans-serif;} #formulaire_forum input:active, #formulaire_forum input:focus, #formulaire_forum textarea:active, #formulaire_forum textarea:focus{background:#fff;color:#1c1c1c;box-shadow:0 0 5px rgba(0,0,0,0.7);} #formulaire_forum fieldset.previsu{padding:10px;margin:10px;border:1px solid #1c1c1c;background:rgba(255,255,255,0.2);} #formulaire_forum fieldset.previsu .forum-chapo strong,#formulaire_forum fieldset.previsu .forum-chapo small{font-weight:bold;color:#1c1c1c;font-size:0.9em;} #formulaire_forum fieldset.previsu .forum-texte{color:#1c1c1c;text-shadow:0px 1px 0px rgba(255,255,255,0.2);} #formulaire_forum .saisie_texte{margin-top:10px;} #formulaire_forum .saisie_texte_info{font-size:0.8em;letter-spacing:0.1em;} #formulaire_forum .erreur_message{color:#1c1c1c;font-size:0.8em;} #formulaire_forum p.boutons{text-align:center;} #formulaire_forum p.boutons input{cursor:pointer;margin-top:5px;border:none;padding:2px;background:#235901;color:#8ce54c;border-radius:2px;box-shadow:0px 1px 0px rgba(255,255,255,0.3);} #formulaire_forum p.boutons input:hover{color:#fff;} /*BUG*/#vosComments .bugajaxie{display:block;height:1px;display:none;} /*----------------------------------------------------------------------------*/ /* FOOTER */ #footer{width:100%;height:150px;background:#111;clear:both;} #wrap_footer{width:960px;height:100%;margin:0 auto;} #footer #wrapFootLeft{float:left;width:360px;height:100%;background:-moz-linear-gradient(top,#004c66,transparent); background:-webkit-gradient(linear,left top,left bottom,from(#004c66),to(transparent));} #wrapFootRight div.column{width:144px;float:left;margin-right:15px;padding-top:15px;border-right:1px solid #000;} #wrapFootRight div.column:first-child{margin-left:15px;width:264px;} #wrapFootRight div.column:nth-child(3){margin-right:0px;} #wrapFootRight ul li{list-style:none;font-size:0.7em;padding-left:5px;white-space:nowrap;text-wrap:ellipsis;padding-bottom:2px;} #wrapFootRight ul li a{text-decoration:none;color:#888;} #wrapFootRight ul li a:hover{text-decoration:underline;} #footer h4{color:#24292b;font-weight:normal;padding-bottom:15px;text-shadow:1px 1px 0px #000;} #footer p.copy{clear:both;font-size:0.75em;text-align:right;color:#09C;padding:45px 0px 15px 0px;} #footer p.copy a{color:#09C;text-decoration:none;border-bottom:1px solid #09C;} #footer p.copy a:hover{border-bottom:2px solid #09C;} #footer h3{font-size:0.8em;background:#333;} #don input[type=submit]{ border: none; background: none; cursor: pointer; color: #EB4802; border-bottom: 1px solid #EB4802; padding: 0; margin: 0; } #don input[type=submit]:hover, #don input[type=submit]:focus{ border-bottom-width: 2px; } /*----------------------------------------------------------------------------*/ /* RECHERCHE */ #formulaire_recherche{background: #51C3FA;font-size:.8em;padding:10px;text-align:right;} #formulaire_recherche label{color:rgba(0,0,0,.5);} #recherche{padding:3px;margin-right:2px;border:1px solid transparent;background-clip:padding-box;} #recherche:hover, #recherche:focus{border:1px solid rgba(0,0,0,.5);} #recherche + input{padding:2px;background: #09c;color:white;border:1px solid rgba(0,0,0,.2);text-shadow:0 -1px 0 rgba(0,0,0,.2);box-shadow:0 1px 0 rgba(255,255,255,.2),0 1px 0 rgba(255,255,255,.2) inset;} #recherche + input:hover, #recherche + input:focus{background:#09a7db;} #recherche + input:active{background:#0486b1;} #content_recherche .nbPage, #content_recherche .pagination{text-align:right;font-size:.8em;color:#ccc;} #content_recherche .nbPage a, #content_recherche .pagination a{color:#51C3FA;}