Styles
Maku'
Messages : 61Points : 596Date d'inscription : 12/09/2014Age : 32Localisation : Dijon
Sujet: Styles
Lun 5 Sep - 9:22
Code: /*********************************************FOND ET BANNIERE***************************************************/ body { background-image: url(http://img15.hostingpics.net/pics/749621Fond1.png); background-attachment:scroll; } .bodylinewidth { width:800px; background-color:black; padding-top:20px; padding-right:0px; padding-left:0px; padding-bottom:0px; } .bodyline { background-position:top-center; background-repeat:no-repeat; background-color:#6794a9; padding-top:0px; padding-right:0px; padding-left:0px; padding-bottom:0px; border-right:#787476 3px solid; border-left:#787476 3px solid; } /************************************************NAVIGATION*******************************************************/ .mainmenu img { display:none; } #navig { width: 950px; margin: auto; text-align: center; } #navigation { position: fixed; z-index: 998; width: 100%; background-color: #acd0e0; border-bottom: 2px solid #787476; margin-top: -10px; margin-left: -10px; padding: 5px; } a.mainmenu { font-family: 'Amatic SC', cursive; color:#787476; text-transform:small-caps; letter-spacing:2px; font-size:20px; } a.mainmenu:hover { color:white; } /************************************************PAGE D'ACCEUIL***************************************************/ /*CENTRAL*/ .centre { width:780px; height:400px; background-image:url(http://img11.hostingpics.net/pics/936409PAFond.png); border:5px #787476 solid; box-shadow: 0px 0px 5px #acd0e0; border-radius: 10px 10px 10px 10px; overflow:hidden; } .titrePA { font-family: 'Amatic SC', cursive; color:#5F8295; text-transform:small-caps; letter-spacing:2px; font-size:15px; } .txtPA { width:300px; height:280px; border:2px #787476 solid; border-radius: 10px 10px 10px 10px; background-color:#acd0e0; overflow:auto; text-align:justify; font-family: 'Libre Baskerville', serif; font-size:10px; padding:5px; color:#5F8295; } .txtPA a { color:#5F8295; text-decoration:underline; } .txtPA a:hover { color:white; } .txtPA p { text-align:justify; } /*INFOBULLES*/ /*Contexte*/ #C_conteneur { position:relative; left:0px; height:190px; width:200px; overflow:visible; margin-left:-580px; } #C_conteneur img { opacity:0.5; transition:1s; } #C_conteneur img:hover { opacity:1; height:190px; width:200px; } #C_conteneur #contexte { opacity:0.5; transition:1s; } #C_conteneur #contexte { opacity:1; transition:1s; } #C_conteneur #C_infobulle { position:absolute; top:10px; left:200px; width:380px; height:280px; opacity:0; visibility:hidden; } #C_conteneur:hover #C_infobulle { opacity:1; visibility:visible; z-index:999; } /*News*/ #N_conteneur { position:relative; left:0px; height:190px; width:200px; overflow:visible; margin-left:580px; margin-top:-400px; } #N_conteneur img { opacity:0.5; transition:1s; } #N_conteneur img:hover { opacity:1; height:190px; width:200px; } #N_conteneur #news { opacity:0.5; transition:1s; } #N_conteneur #news { opacity:1; transition:1s; } #N_conteneur #N_infobulle { position:absolute; top:10px; left:-380px; width:380px; height:280px; opacity:0; visibility:hidden; } #N_conteneur:hover #N_infobulle { opacity:1; visibility:visible; z-index:999; } /*Staff*/ #S_conteneur { position:relative; left:0px; height:190px; width:200px; overflow:visible; margin-left:-580px; margin-top:20px; } #S_conteneur img { opacity:0.5; transition:1s; } #S_conteneur img:hover { opacity:1; height:190px; width:200px; } #S_conteneur #staff { opacity:0.5; transition:1s; } #S_conteneur #staff { opacity:1; transition:1s; } #S_conteneur #S_infobulle { position:absolute; top:-200px; left:200px; width:380px; height:280px; opacity:0; visibility:hidden; } #S_conteneur:hover #S_infobulle { opacity:1; visibility:visible; z-index:999; } /*vignettes avec slide du staff*/ #adminslide div { width:100px; height:100px; background-color:#6794a9; color:white; position:relative; text-align:center; overflow:hidden; } #adminslide a { color:white; text-decoration:none; } #adminslide a:hover { color:silver; } #adminslide img { left: 0; position: absolute; top: 0; transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; -webkit-transition: all 1s; opacity:1; height:100px; width:100px; } #adminslide div:hover img { transform: translateX(100px); -moz-transform: translateX(100px); -o-transform: translateX(100px); -webkit-transform: translateX(100px); height:100px; width:100px; } /*Navigation Rapide*/ #L_conteneur { position:relative; left:0px; height:190px; width:200px; overflow:visible; margin-left:580px; margin-top:20px; } #L_conteneur img { opacity:0.5; transition:1s; } #L_conteneur img:hover { opacity:1; height:190px; width:200px; } #L_conteneur #liens { opacity:0.5; transition:1s; } #L_conteneur #liens { opacity:1; transition:1s; } #L_conteneur #L_infobulle { position:absolute; top:-200px; left:-380px; width:380px; height:280px; opacity:0; visibility:hidden; } #L_conteneur:hover #L_infobulle { opacity:1; visibility:visible; z-index:999; } /*PARTENAIRES*/ .boxpart { margin:auto; width:380px; height:30px; border:#787476 2px solid; border-bottom:none; background-color:#acd0e0; margin-top:-30px; border-radius:10px 10px 0px 0px; transition:1s; } .boxpart:hover { height:110px; margin-top:-110px; transition:1s; } .boxpart img { opacity:0.7; box-shadow: 0px 0px 5px #787476; width:88px; height:31px; overflow:hidden; } .boxpart img:hover { opacity:1; } /*COTES*/ .widget { background-color:#acd0e0; box-shadow: 0px 0px 5px #787476; width:225px; height:25%; overflow:hidden; text-align:justify; padding:5px; color:#5F8295; } .miniwidget { background-color:#acd0e0; box-shadow: 0px 0px 5px #787476; width:225px; height:8%; overflow:hidden; color:#5F8295; } .widget a { color:black; transition:1s; } .widget a:hover { color:white; transition:1s; } .widget marquee { text-align:justify; } .widget span { display:block; text-align:center; } .indicdroite { position:fixed; top:50px; right:50px; z-index:900; } .indicgauche { position:fixed; top:50px; left:50px; z-index:900; } /*GAUCHE*/ .onglet_gauche { position:fixed; width:275px; height:100%; background-color:#acd0e0; top:0px; left:-255px; transition:1s; margin-top:20px; border-right:#787476 2px solid; z-index:990; } .onglet_gauche:hover { background-color:#6794a9; left:0px; transition:1s; } /*DROITE*/ .onglet_droite { position:fixed; width:275px; height:100%; background-color:#acd0e0; top:0px; right:-255px; transition:1s; margin-top:20px; border-left:#787476 2px solid; z-index:990; } .onglet_droite:hover { background-color:#6794a9; right:0px; transition:1s; } /*******************************************************QEEL******************************************************/ /*image de fond*/ .fond_qeel { background-image:url(http://img11.hostingpics.net/pics/604884QEEL.png); width:800px; height:518px; overflow:hidden; margin-bottom:10px } /*boite de gauche*/ .present { width:180px; height:250px; background-color:#6794a9; margin-top:150px; margin-left:10px; font-size:10px; text-align:justify; padding:2px; border-radius:15px 15px 15px 15px; color:#c7c6c6; overflow:auto; } /*boite de droite*/ .past { width:180px; height:250px; background-color:#6794a9; margin-top:150px; margin-left:0px; font-size:10px; text-align:justify; padding:2px; border-radius:15px 15px 15px 15px; color:#c7c6c6; overflow:auto; } /*ONGLETS JAVASCRIPT*/ .contenu_onglet { display:none; } .onglet { /* Permet de mettre en forme tous les onglets (enfin la partie à clicker). Par exemple, de tous les entourer. */ text-decoration:underline; } .onglet:hover { font-weight:bolder; } .onglet_0 { /* Permet de mettre en forme tous les onglets inactifs. PAr exemple, leur donner une couleur ou couleur de fond particulière. */ } .onglet_1 { /* Permet de mettre en forme l'onglet actif. Par exemple, lui donner une couleur ou couleur de fond particulière. */ font-size:12px; } #onglet_un { /* Changez NOM par le nom de l'onglet à modifier. Cela permet de mettre en forme un onglet en particulier. */ color:#ECB16D; } #onglet_deux { /* Changez NOM par le nom de l'onglet à modifier. Cela permet de mettre en forme un onglet en particulier. */ color:#AE0202; } #onglet_trois { /* Changez NOM par le nom de l'onglet à modifier. Cela permet de mettre en forme un onglet en particulier. */ color:#7AC9E1; } #onglet_quatre { /* Changez NOM par le nom de l'onglet à modifier. Cela permet de mettre en forme un onglet en particulier. */ color:#B5B5B5; } #onglet_cinq { /* Changez NOM par le nom de l'onglet à modifier. Cela permet de mettre en forme un onglet en particulier. */ color:#161F94; } #onglet_six { /* Changez NOM par le nom de l'onglet à modifier. Cela permet de mettre en forme un onglet en particulier. */ color:#010101; } #onglet_sept { /* Changez NOM par le nom de l'onglet à modifier. Cela permet de mettre en forme un onglet en particulier. */ color:#FEFEFE; } .contenu_onglet { /* Mise en forme de tous les contenus d'onglets. Utile notamment pour les positionner quelque part */ height:200px; } .contenu_onglet img { float:bottom; } .contenu_onglet p { height:80px; } #contenu_onglet_NOM { /* Changez NOM par le nom du contenu d'onglet à modifier. Cela permet de mettre en forme un contenu d'onglet en particulier. */ } .contenu_onglet span { font-family: 'Amatic SC', cursive; font-size:14px; display:block; text-align:center; } /*dessous*/ .enligne { height:15px; width:250px; background-color:#6794a9; font-size:10px; padding:2px; border-radius:15px 15px 0px 0px; color:#c7c6c6; overflow:auto; margin:auto; margin-top:70px; transition:1s; overflow:hidden; } .enligne:hover { height:120px; margin-top:-35px; transition:1s; } /*titre des boites*/ .titre_qeel { font-family: 'Amatic SC', cursive; text-align:center; font-size:12px; border-bottom:1px dotted #c7c6c6; color:#c7c6c6; } /***************************************************CATEGORIES***************************************************/ /*mise en forme des liens pratiques*/ a.cate_lien { font-family: 'Amatic SC', cursive; color:silver; } a.cate_lien:hover { color:white; } .cate_lien { color:silver; } /*mise en forme des catégories*/ .cate_fond { padding-bottom:25px; background-color:#194f68; border-radius:25px 25px 25px 25px; width:97%; margin:auto; border:5px silver solid; margin-bottom:10px; overflow:hidden; } .cate_titre { font-family: 'Amatic SC', cursive; color:silver; text-transform:small-caps; letter-spacing:2px; display:block; border-bottom:5px silver dotted; } /*mise en forme des forums*/ a.forum_titre { font-family: 'Amatic SC', cursive; color:silver; letter-spacing:2px; } a.forum_titre:hover { color:white; } .forum_desc { font-size:10; text-align:justify; color:silver; } #dernier_message div { width:200px; height:65px; font-size:10px; color:silver; overflow:hidden; position:relative; } #dernier_message img { left: 0; position: absolute; top: 0; transition: all 1s; -moz-transition: all 1s; -o-transition: all 1s; -webkit-transition: all 1s; } #dernier_message div:hover img { transform: translateX(200px); -moz-transform: translateX(200px); -o-transform: translateX(200px); -webkit-transform: translateX(200px); } .sousforums { border-bottom: 3px silver dotted; } /**********************************************PETITS DETAILS CHIANTS*********************************************/ .tablemembre { border-bottom:5px white dotted; border-top:5px white dotted; } .tablemembretop { border-top:5px white dotted; } .tablemembrebot { border-bottom:5px white dotted; } .lignemembre { border-bottom:1px white solid; background-color:#396B87; } .signapreview { width:500px; height:300px; border:white 1px solid; box-shadow:0px 0px 5px white; background-color:#6794a9; margin:10px; } td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom { border:none; } /**********************************************AFFICHAGE DES SUJETS**********************************************/ /*AFFICHAGE DU PROFIL*/ #profilmembre { position:relative; height:350px; width:160px; margin:10px auto; } .avatars { position:absolute; top:0px; left:0px; background-color:silver; width:100%; height:280px; z-index:990; border-right:1px solid white; border-left:1px solid white; } .pseudo { font-family: 'Gloria Hallelujah', cursive; font-size:20px; text-shadow:0px 0px 5px silver; } .infoprofil { width:160px; height:280px; z-index:980; position:absolute; top:60px; left:0px; -moz-transition:all 1s; -o-transition:all 1s; -ms-transition:all 1s; transition:all 1s; border:1px solid white; border-radius: 0px 0px 5px 5px; border-top:none; background-color:silver; color:black; font-family: 'Vollkorn', serif; font-size:12px; line-height:15px; } .infoprofil:hover { top:280px; -moz-transition:all 1s; -o-transition:all 1s; -ms-transition:all 1s; transition:all 1s; } .rang { position:absolute; top:220px; } /*LISTE DES SUJETS DANS LE FORUM*/ .bloc_sujets { background-color:#194f68; border-radius:25px 25px 25px 25px; width:97%; margin:auto; border:5px silver solid; margin-bottom:10px; overflow:hidden; } .sujets { padding: 3px; } .topictitle { font-variant: small-caps; font-size: 12px; font-family:'Gloria Hallelujah', cursive; } .sujets_auteur { display: block; width: 200px; font-size: 11px; } .sujet_last { display: block; width: 180px; height: 40px; border-left: 3px solid silver; border-right: 3px solid silver; padding-top: 10px; font-size: 11px; } .sujets_stats { width: 900px; text-align: right; margin-bottom: 5px; } .sujets_stats_contenu { font-size: 10px; color: silver; } /****************************CODE, SPOILER,ECT*******************************/ .codebox { font-family: 'Give You Glory', cursive; color:white; font-family:12px; width:450px; } .codebox:hover { color:#860000; } .code { color:white; border-top:5px solid white; border-left:5px solid white; border-bottom:2px solid white; border-right:2px solid white; width:450px; } .quote { color:white; border-top:5px solid white; border-left:5px solid white; border-bottom:2px solid white; border-right:2px solid white; font-family:'Rokkitt', serif; font-size:10px; } /*spoiler*/ .spoiler_closed { font-family: 'Rokkitt', serif; font-size: 10px; color: white; line-height: 125%; background-color: black; border-top:5px solid white; border-left:5px solid white; border-bottom:2px solid white; border-right:2px solid white; border-radius:5px 5px 5px 5px; } .spoiler_content { font-family: 'Rokkitt', serif; font-size: 10px; color: white; line-height: 125%; background-color: silver; border-top:5px solid white; border-left:5px solid white; border-bottom:2px solid white; border-right:2px solid white; border-radius:5px 5px 5px 5px; } /**********************************************ELEMENTS DE MESSAGES**********************************************/ /*LISTES*/ /*Deux colonnes*/ ul.liste2 { width:80%; } ul.liste2 li { display:block; width : 50%; height : 20px; float:left; } ul.liste2 li[float="left"] + li { float:none; } /*ANNONCES PRESA ET FICHES DES JOUEURS*/ .cadre_fiches { background: url(http://img15.hostingpics.net/pics/733367FondFiche2.png) repeat; border: 1px white solid; width:500px; text-align:justify; font-size:12px; padding:10px; padding-top:20px; color:black; } .nom { font-family:'Gloria Hallelujah', cursive; font-size:25px; letter-spacing: 4px; font-variant: small-caps; text-shadow: silver 0px 0px 5px; text-align:center; text-decoration: overline underline; } .avatar { width:160px; height:280px; padding:5px; border:1px white solid; border-radius: 5px 5px 5px 5px; } .id { width:325px; height:280px; overflow:auto; } .fiches_titre { font-family:'Gloria Hallelujah', cursive; font-size:14px; letter-spacing: 2px; font-variant: small-caps; text-shadow: silver 0px 0px 5px; text-align:center; text-decoration: underline; } .contenu { width:240px; height:250px; overflow:auto; padding:5px; } .histoire { word-spacing : 5px; } .icône { width:100px; height:100px; padding:5px; border: 1px white solid; border-radius: 5px 5px 5px 5px; } .irl { width:350px; height:100px; overflow:auto; font-size:10px; } .credits { font-size:8px; color:#3E270D } .aurevoir { size:15px; font-weight: bold } .intro { width:300px; margin-left:100px; font-weight:lighter; letter-spacing:-1px; } .rela { text-align:right; font-family:'Gloria Hallelujah', cursive; font-size:14px; letter-spacing: 2px; font-variant: small-caps; text-shadow: #AE9E8C 0px 0px 5px; border-bottom: silver 5px solid; margin-top:10px; } .reladescription { background-color:silver; width:300px; height:80px; overflow:auto; text-align:justify; } .relaid { width:350px; height:200px; overflow:auto; padding:5px; text-align:justify; } /*MISSIONS*/ .cadre_mission { width:500px; background:url(http://img4.hostingpics.net/pics/952174TexturePapier.png) repeat; color:black; margin:auto; } .nom_mission { font-size:30px; font-family:Impact; text-shadow:0px 3px 5px #9A997D; font-variant:small-caps; } .intro_mission { margin-left:100px; margin-right:100px; text-align:justify; } .contenu_mission { margin-left:15px; margin-right:15px; text-align:justify; } .titre_mission { font-size:20px; font-family:Impact; text-shadow:0px 3px 5px #9A997D; line-height:25px; } .paragraphe { margin-top:10px; } .mission500 { width:500px; text-align:justify; margin:auto; } /*JOURNAL*/ .journal { width:550px; background-image:url(http://img4.hostingpics.net/pics/952174TexturePapier.png); color:black; text-align:justify; margin:auto; font-family: 'Ubuntu Mono', courrier; } .journal h1 { font-family: 'Walter Turncoat', cursive; font-size:50px; text-align:center; display:block; border-bottom:dashed 3px black; color:black; height:75px; padding-top:25px; } .journal h2 { font-family: 'Walter Turncoat', cursive; font-size:25px; text-align:center; color:black; } .journal h3 { font-size:15px; text-decoration:underline; color:black; margin-left:10px; margin-bottom:5px; } .duo { display:inline-block; width:250px; height:400px; overflow:auto; margin-left:10px; margin-right:10px; } /*************************************************CHAT BOX*******************************************************/ body.chatbox { background-image: url(http://img11.hostingpics.net/pics/928779FondFiches.png); background-color:#6794a9; color:black; } #chatbox_header { background-color:#6794a9; } #chatbox_header .cattitle strong { display: none; } #chatbox_header .cattitle:before { content: "Dans le Foyer"; font-variant:small-caps; color:white; } #chatbox_header .chatbox-options .genmed, #chatbox_header .chatbox-options, #chatbox_header .chatbox-options a { font-variant:small-caps; color:white; } .chatbox_row_1, .chatbox_row_2, .chatbox_row_3, .chatbox_row_1 a, .chatbox_row_2 a, .chatbox_row_3 a { background-color: #6794a9; color:black; } /*TEST LP*/ .fondPREDEF /*Fond des prédefs*/ { width: 570px; padding-right: 5px; padding-left: 5px; background-color: #E8E1B8; /*Couleur 5*/ text-align: justify; padding-bottom: 10px; padding-top: 5px; border-radius: 11px 11px 0px 0px; -o-border-radius: 11px 11px 0px 0px; -ms-border-radius: 11px 11px 0px 0px; -moz-border-radius: 11px 11px 0px 0px; -khtml-border-radius: 11px 11px 0px 0px; -webkit-border-radius: 11px 11px 0px 0px; font-family: Georgia; } .cadreNom /*Mise en forme du cadre supérieur contenant le nom du prédef*/ { text-align: right; padding-right: 13,5px; border-bottom: 1px dashed #AD5604; /*Couleur 2*/ font-size: 12px; color: #56320A; /*Couleur 3*/ font-family:Trebuchet MS; } .cadreImage /*Mise en forme du cadre de l'avatar*/ { padding: 6px; background-color: #AD5604; /*Couleur 2*/ text-align: justify; } .cadrePres /*Mise en forme du cadre contenant les infos du prédef*/ { width: 370px; overflow: auto; padding-right: 5px; border-radius: 11px 11px 0px 0px; -o-border-radius: 11px 11px 0px 0px; -ms-border-radius: 11px 11px 0px 0px; -moz-border-radius: 11px 11px 0px 0px; -khtml-border-radius: 11px 11px 0px 0px; -webkit-border-radius: 11px 11px 0px 0px; height: 400px; } .fondRELA /*Mise en forme du fond des relations du predef, attention, dans un spoiler*/ { color: #dbdbdb; background-color: #56320A; /*Couleur 3*/ width: 100%; border-left: 5px solid #AD5604; /*Couleur 2*/ border-right: 5px solid #AD5604; /*Couleur 2*/ } .cadreIcone /*Mise en forme du cadre autour de l'icône dans les relations du predef*/ { margin-left: 20px; } .ligneNom /*Mise en forme de la span du nom de la relation*/ { border-left: #AD5604 solid 5px; /*Couleur 2*/ margin-left: 40px; padding-left: 5px; } .cadreLien /*Mise en forme du cadre contenant la description de la relation*/ { overflow: auto; height: 80px; }
Maku'
Messages : 61Points : 596Date d'inscription : 12/09/2014Age : 32Localisation : Dijon
Sujet: Re: Styles
Lun 5 Sep - 9:26
Couleurs du texte (toutes) : #BDBDBD Couleurs de fond : Fond de Page : #FFFFFF Couleur intérieure du cadre du forum, Table Rangée Couleur 1, Table Rangée Couleur 2 et surbrillance, Table Rangée Couleur 3 et séparations : Vide Couleur des citations, codes et boutons, Couleur zones de saisie, menus déroulants et cadre de l'en-tête, Couleur de fond d'un message remercié, Couleur de fond de l'éditeur (Barre de menu), Couleur de fond de l'éditeur (Zone de saisie de texte) : #7FABBD Couleurs de contour, barre de défilement : vide
Maku'
Messages : 61Points : 596Date d'inscription : 12/09/2014Age : 32Localisation : Dijon
Sujet: Re: Styles
Lun 5 Sep - 9:44
Contenu sponsorisé
Sujet: Re: Styles