body { background: url("zap_image/Font-Cocktail-2.png") no-repeat fixed right top, #f3f3f3 ; font-family: Arial, Times, Courrier; overflow-y:auto; overflow-x:auto; } @font-face { font-family: myFont; src: url(zap_image/zeronero.ttf); } #title { display: block; position: relative; width: 1260px; height:45px; font-size: 14pt; font-weight: bold; color: black; vertical-align: middle; padding-top:10px; } #google-img { float:left; left:10px; width:20px; } #google-form { float:left; width:440px; } #title-txt { float:left; width:340px; } #qwant-img { float:left; left:10px; width:20px; } #qwant-form { float:left; width:440px; } #button1 { position: absolute; left:1000px; top: 535px; width:50px; height:60px; cursor: pointer; background-image:url(zap_image/calque10.png); } #button2 { position: absolute; left:1050px; top: 535px; width:50px; height:60px; cursor: pointer; background-image:url(zap_image/calque20.png); } #button3 { position: absolute; left:1100px; top: 535px; width:50px; height:60px; cursor: pointer; background-image:url(zap_image/calque30.png); } #button4 { position: absolute; left:1155px; top: 535px; width:50px; height:60px; cursor: pointer; background-image:url(zap_image/calque40.png); } #button1:hover { background-image:url(zap_image/calque1.png); } #button2:hover { background-image:url(zap_image/calque2.png); } #button3:hover { background-image:url(zap_image/calque3.png); } #button4:hover { background-image:url(zap_image/calque4.png); } #LogoAsso { float:left; background-image:url(zap_image/AssoLogo.png); width:220px; height:220px; margin-left:-210px; margin-top:380px; font-size:9pt; background-size: contain; background-repeat: no-repeat;} a { text-decoration: none; color:black; } a:hover { text-decoration: none; color:#990000; font-weight: normal; } .myButton { -moz-box-shadow:inset 0px 1px 0px 0px #ffffff; -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff; box-shadow:inset 0px 1px 0px 0px #ffffff; background-color:#ebebeb; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; border:1px solid #e8e8e8; display:inline-block; cursor:pointer; color:#777777; font-family:Arial; font-size:12px; padding:4px 20px; height: 25px; text-decoration:none; text-shadow:0px 1px 0px #ffffff; } .myButton:hover { background-color:#e6e6e6; } .myButton:active { position:relative; top:1px; } .myInput { width:250px; } #calque1 { position: relative; width: 1260px; height:595px; display: block; } #menu1, #menu2, #menu4, #menu5, #menu6, #menu7 { float:left; width:225px; padding-top:10px; margin-left:14px; border: 1px solid #b6babf; background: #ffffff; background-repeat:no-repeat; } #menu1:before, #menu2:before, #menu4:before, #menu5:before, #menu6:before , #menu7:before { content: " "; top: 10px; position: absolute; width:205px; z-index: -10; box-shadow: -7px 0 10px #555; transform: rotate(-1deg); } #menu1 { background-image:url(zap_image/R-Menu.png); height:364px; } #menu2 { background-image:url(zap_image/O-Menu.png); height:584px; margin-left:5px; } #menu4 { background-image:url(zap_image/G-Menu.png); height:413px; } #menu5 { background-image:url(zap_image/V-Menu.png); height:150px; margin-top:434px; margin-left:-227px; } #menu6 { background-image:url(zap_image/B-Menu.png); height:584px; } #menu7 { background-image:url(zap_image/Y-Menu.png); height:300px; margin-top:-600px; margin-left:980px; } #menu1:before { left: 25px; height:359px; } #menu2:before { left: 265px; height:579px; } #menu4:before { left: 505px; height:408px; } #menu5:before { left: 505px; height:145px; margin-top:429px; } #menu6:before { left: 745px; height:579px; } #menu7:before { left: 985px; height:295px; } #config {float:left; width:225px; padding-top:10px; margin-left:14px; } #toptitle { margin-left:67px; margin-top:-27px; float:left; font-size: 11pt; font-weight: bold; text-align: left; vertical-align: middle; height:35px; width:120px; } #subtitle { margin-left:20px; margin-top:10px; float:left; font-size: 10pt; font-weight: bold; text-align: left; vertical-align: middle; width:150px; height:15px; } #tdimg { margin-left:15px; float:left; width:41px; vertical-align: middle; } #tdmen { float:left; width:135px; margin-top:5px; font-size: 9pt; font-weight: normal; text-decoration: none; vertical-align: middle; text-align:left; } #tdjre { float:left; width:16px; margin-left:14px; height:16px; background-image:url(zap_image/JAVA.png); } #tdobc { float:left; width:16px; margin-left:14px; height:16px; background-image:url(zap_image/OBJC.png); } #tdang { float:left; width:16px; margin-left:14px; height:16px; background-image:url(zap_image/ANGU.png); } #tdtom { float:left; width:16px; margin-left:14px; height:16px; background-image:url(zap_image/TOM.png); } #tdoff { float:left; width:16px; margin-left:14px; } #REF { margin-left:-140px; margin-top:-9px; width:36px; height:36px; background-image:url(zap_image/l-REF.png); } #REC { margin-left:-140px; margin-top:-9px; width:36px; height:36px; background-image:url(zap_image/l-REC.png); } #SVE { margin-left:-140px; margin-top:-9px; width:36px; height:36px; background-image:url(zap_image/l-SVE.png); } #GFC { margin-left:-140px; margin-top:-9px; width:36px; height:36px; background-image:url(zap_image/l-GFC.png); } #GRH { margin-left:-140px; margin-top:-9px; width:36px; height:36px; background-image:url(zap_image/l-GRH.png); } #GLO { margin-left:-140px; margin-top:-9px; width:36px; height:36px; background-image:url(zap_image/l-GLO.png); } #TEC { margin-left:-140px; margin-top:-9px; width:36px; height:36px; background-image:url(zap_image/l-TEC.png); } .r-light { padding-top:3px; height:25px; } .o-light { padding-top:3px; height:31.5px; } .p-light { padding-top:3px; height:25px; } .g-light { padding-top:3px; height:27px; } .v-light { padding-top:3px; height:27px; } .b-light { padding-top:3px; height:26px; } .b2-light { padding-top:3px; height:22px; } .y-light { padding-top:3px; height:27px; } .r-light, .o-light, .p-light, .g-light, .v-light, .b-light, .b2-light, .y-light { float:left; width:225px; cursor:not-allowed; color:grey; } div[id*="ico-"][id*="-1"] { display:none; } img[id^="img-"] { border:0px; height:26px; width:26px; } #calc { position: absolute; left:1000px; top: 360px; display:none; width:190px; height:130px; } img.desaturate{ filter: grayscale(100%); }