Bienvenue en Enfer Adminלּ Psychopathic Devil לּ
Un peu plus sur moi Date d'inscription : 11/04/2010 Messages : 378 Localisation : ssdssff Pièces de Pouvoir d'Hadès :
| Sujet: CSS retro 80 Sam 4 Juin - 20:32 | |
| CSS Retro 80 - Code:
-
.bodylinewidth{ width: 800px!important; margin-top:-9px; margin-bottom:-9px; }
.code{ max-width: 500px; }
a:link{text-decoration:none!important;}
/*INFOBULLE*/ a.infobulle { position: relative; }
a.infobulle span { display: none; /* ceci masque l'infobulle */
} a.infobulle:hover { background: none; /* correction d'un bug IE */ z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
} a.infobulle:hover span { display: inline; /* ceci affiche l'infobulle */ position: absolute;
white-space: wrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
top: -10px; /* on positionne notre infobulle */ left: 40px;
background: #e5e5e5; /* arrière-plan de l'infobulle */ color: grey; /* texte dans l'infobulle */ font-size: 10px; font-variant: normal; text-align: justify; text-transform: none; text-decoration: none; padding: 4px; width: auto; height: auto;
/* bordures de votre infobulle*/ border-radius: 10px;}
.bodyline{ /* -moz-box-shadow:1px 1px 10px #200f11; -webkit-box-shadow:1px 1px 10px #200f11; box-shadow:1px 1px 10px #200f11;*/ padding: 0px; /*background: ;*/ }
/*Redimensionnement des gif dans le profil automatique*/ .postdetails.poster-profile img { max-width:208px; display:block; }
/**** CODAGE DES FICHES ****/ .info2{ color: #a67b67; font-size: 12px; }
/* fiche pv */ .cadre_vous{ background:lightgrey; width:480px; height:auto; padding: 10px; text-align: justify; color: #312f34; }
.dispo_pv2{ letter-spacing:4px; font-size: 10px; text-align: center; background-color: lightgrey; width: 450px; }
.lien_pv2{ background: #808080; width: 490px; height: 100px; padding: 5px; position: relative; }
.lien_pv2 img{ position: absolute; left: 5px; top: 5px; }
.lien_pv2_description{ position: absolute; left: 110px; top: 5px; height: 100px; overflow: auto; color: #312f34; text-align: justify; }
/* ---Fiche présentation --- */ .image_presa{ width: 500px; -webkit-border-bottom-left-radius: 250px; -webkit-border-bottom-right-radius: 250px; -moz-border-radius-bottomleft: 250px; -moz-border-radius-bottomright: 250px; border-bottom-left-radius: 250px; border-bottom-right-radius: 250px; }
.nom_prenom_fiche{ font-family: 'Satisfy', cursive; color: black; font-size: 40px; text-shadow: 1px 1px 2px #474747; line-height: -50px; }
.feat{ text-align: center; font-size: 10px; color: grey; background: lightgrey; }
.trait_cara{ color: grey; font-size: 10px; width: 400px; font-style : italic; }
.cadre_info{ background: lightgrey; width: 450px; padding: 5px; color: grey; text-align: justify; }
.info{ color: purple; font-size: 12px; }
.icons_fiche{ width: 100px; }
.titre_partie_fiche{ font-family: 'Waiting for the Sunrise', cursive; font-size: 40px; }
.grand_cadre_question{ background: lightgrey; text-align: justify; color: grey; padding-left:30px; padding-right:30px; padding-top:10px; padding-bottom: 10px; }
.question{ color: black; font-weight: bold; }
.credit{ color: lightgrey; font-size: 10px; }
/* --- Fiche basique --- */ .image_haut{ width: 500px; -webkit-border-top-left-radius: 250px; -webkit-border-top-right-radius: 250px; -moz-border-radius-topleft: 250px; -moz-border-radius-topright: 250px; border-top-left-radius: 250px; border-top-right-radius: 250px; }
.fond_fiche{ width: 500px; background: white; }
.titre_fiche{ font-family: 'Satisfy', cursive; color: black; font-size: 70px; background: grey; text-shadow: 1px 1px 2px #474747; }
.texte_fiche{ text-align: justify; color: grey; padding-left:30px; padding-right:30px; }
.credit_fiche{ color: lightgrey; font-size: 10px; }
/* Fiche autre*/ .titlefiche{ font-family: 'Satisfy', cursive; color: black; font-size: 70px; background: grey; text-shadow: 1px 1px 2px #474747; }
.textelibre{ text-align: justify; color: grey; padding-left:30px; padding-right:30px; }
.imagebas{ width: 500px; -webkit-border-bottom-left-radius: 250px; -webkit-border-bottom-right-radius: 250px; -moz-border-radius-bottomleft: 250px; -moz-border-radius-bottomright: 250px; border-bottom-left-radius: 250px; border-bottom-right-radius: 250px; }
/* --------------------------------- QEEL --------------------------------- */
.transparent .row1 { background-color: transparent; } .transparent .gensmall { font-size:12px; overflow: auto; height: 150px!important; display: block; }
#qeel_position { position: relative; margin:auto; background: #454bbd ; width: 750px; height: 390px; }
#qeel_titre { background-image:url(http://img11.hostingpics.net/pics/323766qeel.png); width : 750px; height: 158px; text-align: center; margin-left: auto; margin-right: auto; }
.qeel_colonne1 { font-size: 12px; text-align: justify; width: 255px; height: 345px; padding:10px; }
.qeel_centre { background:transparent; }
.qeel_colonne2 { width: 255px; height: 345px; padding:10px; text-align:center; font-size:12px; }
.qeel_bloc1{ width: 670px; padding:20px; background:#6273c7; overflow:auto; position: absolute; top : 20px; left: 20px; font-size: 11px; }
.qeel_bloc2{ width: 200px; padding:10px; height: 190px; background:#6273c7; overflow:auto; position: absolute; top : 160px; left: 20px; font-size: 11px; text-align: justify }
.qeel_bloc3{ width: 200px; padding-left: 10px; padding-right: 10px; height: 210px; background:#6273c7; overflow:auto !important; text-align: justify; position: absolute; overflow: auto; top: 160px; right: 20px; font-size: 11px!important; }
.top_partenaires{ font-size: 15px; color: #fff; font-family: "Kaushan Script",cursive; text-align: center; }
.blocpa { width: 220px; padding:10px; height: 190px; background:#6273c7; position: absolute; left : 265px; top: 160px; }
.img-zoom { width: 50px; /*largeur image réduite*/
/* Effet de transition du changement de valeur */ -moz-transition: width 1s linear; -o-transition: width 1s linear; -webkit-transition: width 1s linear; transition: width 1s linear; }
.img-zoom:hover { width: 100px; /*largeur image agrandie*/ }
a.lien_qeel{ text-transform: lowercase; font-size: 10px; color: #e785ef; }
a.lien_qeel:hover{ color: #fff; }
.qeel_groupe { position: relative; overflow: visible; display: inline; margin-left: 38px; left: 70px;
}
.name_gp{ font-family: "Kaushan Script",cursive; font-size: 15px; }
.qeel_groupe1 { position: relative; height: 60px; width: 60px; border-radius:100px; overflow: visible; margin:auto; background-image: url(http://www.damaged-human.org/crepuscolo/Creazioni/icon/stock/st_56.jpg); }
.nom_groupe{ font-size : 15px; font-weigth: bold; text-transform : uppercase; text-align: center; font-family: 'Shadows Into Light', cursive; color: #fa4c4c; }
.sous-groupe{ font-size : 12px; text-align: center; text-transform : lowercase; font-style: italic; color: #ac97be; }
.image_gauche{ width: 100px; float: left; margin-right: 8px; margin-bottom: 8px; }
.qeel_groupe .infobulle { position: absolute; top: 25px; left: 25px; width: 250px; height: auto; background:#484949; opacity: 0; visibility: hidden; transition: 0.5s; padding:10px; marging-bottom: 6px; border-radius:30px; font-size: 12px; text-align: justify; line-height: 11px; }
.qeel_groupe:hover .infobulle { opacity: 1; visibility: visible; z-index: 100; transition: 0.5s; }
/* --------------------------------- QEEL --------------------------------- */
/* --------------------------------- PROFIL deroulant --------------------------------- */ .profilmasque { background-color: #454bbd; width: 200px; padding: 10px; font-size: 11px; margin:auto; font-family: Verdana,Arial,Helvetica,sans-serif; }
.profil1 { width: 200px; font-size: 20px; font-family: 'Miniver', cursive; background-color: #454bbd ; border: none; color: #fefefe; }
.avatar_profil { width: 200px; height: 320px; }
.pseudo{ font-family: 'Pacifico', cursive; font-size: 25px; text-align: center!important; display: block; line-height: 20px; padding-top: 3px; }
.texte_ava{ text-align: center; font-size:14px; background: #454bbd; color: #d66ade; padding-left: 10px; padding-right: 10px; padding-top: 7px; width: 150px; margin-left: 33px; font-family: "Kaushan Script",cursive; -webkit-border-top-left-radius: 50px; -webkit-border-top-right-radius: 50px; -moz-border-radius-topleft: 50px; -moz-border-radius-topright: 50px; border-top-left-radius: 50px; border-top-right-radius: 50px; }
.fondavatar { background-color : #454bbd; font-family: 'Shadows Into Light', cursive; padding: 10px; margin-left: 8px; margin-right: 8px; }
.fond_pseudo{ background-color : #454bbd; width: 220px; margin: auto; }
.rang{ font-size: 11px; text-align: center; color: #fff; font-family: georgia; letter-spacing: 1px; text-transform: uppercase; }
.info_profil{ background-color : #454bbd; width: 214px; margin: auto; padding-left: 6px; }
/* --------------------------------- FIN PROFIL --------------------------------- */
.derniers_sujets { margin-top: 3px; /* pour faire un léger espace entre la ligne des "messages & sujets" et "dernier message posté" */ padding: 3px; /* pour ne pas que le texte se colle aux bords du cadre */ width: 130px;
/* après on peut rajouter ce qu'on veut : une bordure, une image de fond, des coins arrondis un peu originaux... */ background: #787a6e; border-radius:0 10px 0 10px; -moz-border-radius:0 10px 0 10px; -webkit-border-radius:0 10px 0 10px; } /* fin nombre de sujet et message*/
/* --------------------- NAVIGATION / TOOLBAR ---------------------- */
/* Style général */ .generated_nav_bar { position: fixed; left: 0; right: 0; z-index: 999; top: 0;
background:#393A95; border-bottom: 3px solid #c1378c; box-shadow: 0 0 5px #000; text-align: center; white-space: nowrap; line-height: 30px; }
/* Liens dans la navbar */ .generated_nav_bar .mainmenu { color: #c179c6 ; font-family: Corbel; font-size: 12px; font-weight: lighter; margin: 5px; border: none; font-variant: small-caps; letter-spacing: 1px; }
#fa_toolbar { margin-top: -30px; /* On cache la toolbar en haut */ font-variant: small-caps; }
/* bouton pour ouvrir fermer la toolbar */ #fa_toolbar_hidden, #fa_toolbar #fa_hide, #fa_toolbar_hidden { display: none!important;}
/* rond avec l.avatar */ .fa_avatar { background: #969DC1; width: 50px; height: 50px; position: fixed; border-radius: 50%; top: 7px; left: 130px; z-index: 999; border: 2px solid #25262b; box-shadow: 0 0 5px black; overflow: hidden; }
/* centrage avatatar */ .fa_avatar img { width: 100%; position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
/* placement crédits Toolbar NE PAS ENLEVER ! ! ! */ #fa_left { position: fixed; top: 2px; left: 7px; }
a#fa_notifications {display:none!important;}
/* Menu welcome */ #fa_menu { position: fixed; top: 0px; left: 185px; }
/* Adaptations pour les petits écrans */ @media screen and (max-width: 1360px) { .fa_avatar + .generated_nav_bar { padding-left: 285px; } }
@media screen and (min-width: 1360px) and (max-width: 1510px) { .fa_avatar + .generated_nav_bar { padding-left: 200px; } }
/* On enleve la partie gauche de la zone Welcome*/ #fa_usermenu { display: none; }
/* Style de la zone welcome*/ #fa_menu #fa_menulist { padding-left: 10px; border: 0; left: 0!important; }
#fa_toolbar #fa_welcome { width: 150px; line-height: 1.2; padding-top: 10px; }
#fa_notifications, #fa_welcome { color: #222825!important; font-family: Corbel; font-size: 12px; font-variant: small-caps; letter-spacing: 1px; }
#fa_menu #fa_menulist :link, #fa_menu #fa_menulist :visited { color: inherit!important; } #fa_menu #fa_menulist a:hover, #fa_notifications:hover, #fa_welcome:hover { color: #ffffff!important; }
#fa_menu #fa_menulist, #fa_toolbar #fa_right.welcome #fa_menu #fa_welcome, #fa_toolbar #fa_right #notif_list { background: #74796D!important; color: #222825!important; }
#fa_toolbar #fa_right #notif_list li, #fa_toolbar #fa_right #fa_notifications + #notif_list li .contentText a { color: inherit!important; }
#fa_right #fa_menu #fa_menulist, #fa_toolbar #fa_right #fa_notifications + #notif_list { display: block; visibility: hidden; -webkit-transition: all 600ms; transition: all 600ms; opacity: 0; overflow: hidden; }
#fa_right.welcome #fa_menu #fa_menulist, #fa_toolbar #fa_right.notification #fa_notifications + #notif_list { visibility: visible; opacity: 1; } #fa_toolbar #fa_right #notif_list li hr { border-color: #222825!important; }
#fa_toolbar #fa_right #fa_menu .fa_separator { background: #222825; }
#fa_right #fa_menu #fa_menulist li { -webkit-transform: translateX(-245px); -ms-transform: translateX(-245px); transform: translateX(-245px); -webkit-transition: all 300ms 50ms; transition: all 300ms 50ms; }
#fa_right.welcome #fa_menu #fa_menulist li { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }
/* Animation menu Welcome */ #fa_right #fa_menu #fa_menulist li:nth-child(2) {-webkit-transition-delay: 100ms;transition-delay: 100ms;} #fa_right #fa_menu #fa_menulist li:nth-child(3) {-webkit-transition-delay: 150ms;transition-delay: 150ms;} #fa_right #fa_menu #fa_menulist li:nth-child(4) {-webkit-transition-delay: 200ms;transition-delay: 200ms;} #fa_right #fa_menu #fa_menulist li:nth-child(5) {-webkit-transition-delay: 250ms;transition-delay: 250ms;} #fa_right #fa_menu #fa_menulist li:nth-child(6) {-webkit-transition-delay: 300ms;transition-delay: 300ms;} #fa_right #fa_menu #fa_menulist li:nth-child(7) {-webkit-transition-delay: 350ms;transition-delay: 350ms;} #fa_right #fa_menu #fa_menulist li:nth-child(8) {-webkit-transition-delay: 400ms;transition-delay: 400ms;} #fa_right #fa_menu #fa_menulist li:nth-child(9) {-webkit-transition-delay: 450ms;transition-delay: 450ms;} #fa_right #fa_menu #fa_menulist li:nth-child(10) {-webkit-transition-delay: 500ms;transition-delay: 500ms;} #fa_right #fa_menu #fa_menulist li:nth-child(11) {-webkit-transition-delay: 550ms;transition-delay: 550ms;} #fa_welcome { -webkit-transition: all 300ms; transition: all 300ms;}
/* Boutons connexion / enregistrement de la toolbar */ #fa_right a[href$="login"], #fa_right a[href$="register"], ul#notif_list, li.see_all, li.unread, div.fa_notification, a.fa_icon{ display: none!important; }
/* ------------------------ MISE EN FORME DES LISTES DE SUJETS ------------------------ */
.bloc_sujets{ width: 800px; margin: auto; /*background: #5E584C;*/ border: 1px solid #ececec; box-shadow: 0px 0px 3px #868686; -o-box-shadow: 0px 0px 3px #868686; -moz-box-shadow: 0px 0px 3px #868686; -webkit-box-shadow: 0px 0px 3px #868686; -htm-box-shadow: 0px 0px 3px #868686; }
.sujets{ background: #6273c7; border: 1px solid #ffffff; padding: 3px; display: block; margin-bottom: 5px; }
.topictitle{ font-variant: small-caps; font-size: 12px; }
.sujets_auteur{ display: block; width: 200px; font-size: 11px; margin-top: 12px; color: #dfdfdf; }
.sujet_last{ display: block; width: 180px; height: 40px; background: #f4f4f4; padding-top: 10px; font-size: 11px; }
.sujets_stats{ margin-top:5px; }
.sujets_stats_contenu{ font-size: 9px; color: #dfdfdf; font-style: italic; } /* --------------------- FIN MISE EN FORME DES LISTES DE SUJETS ---------------- */
/* --------------------------------- CATEGORIES --------------------------------- */ .avatar_posteur img{ padding: 5px; height: 135px; width: auto; position: relative; border-radius:0px 40px 40px 0px; }
.partie_gauche{ background: #6273c7; border-radius:40px 0px 0px 40px; width: 180px; }
.image_nouveau { /*transform: rotate(5deg);*/ margin-left: auto; margin-right: auto; float: left; border-radius:40px 0px 0px 40px; }
.last_mess { /*display: block;*/ text-align: center; font-size: 11px; color: #F0F0ED; width: 115px; float: right; padding-top: 10px; }
.last_mess a{ text-align: center; font-size: 11px; color: #e785ef; }
.messages_post{ font-size: 10px; COLOR: #FFF; text-align: center; padding-top: 25px; }
.description_fow{ height: 110px; overflow:auto; width: 440px; background: #6273c7; font-size: 11px; margin-left: 5px; margin-right: 5px; color: #cebdc7; }
.description_fow p{ padding-left: 10px; padding-right:10px; text-align: justify; }
.sous_fow_lien{ background: #6359d3; width: 435px; margin-left: 5px; height: 35px; overflow: auto; padding-left: 5px; }
.sous_fow_lien a { color: #fff!important; }
.partie_droite{ background: #6273c7; border-radius:0px 40px 40px 0px; width: 95px; }
.titrecategorie h2 { top: 25px /*1.5em*/; position: relative; font-size: 40px; font-family: 'Special Elite', cursive; color: #c1378c!important; letter-spacing: 1px !important; z-index: 1; /*text-shadow: 1px 1px 1px #010500;*/ border-bottom: 5px solid #fff; }
.cate_titre { text-align: center; margin: auto; background-color: #454bbd ; width: 800px; height: 210px; }
.categorie { width: 800px; margin: auto; background-color: #454bbd!important; margin-top: -100px; }
/* Forum */
.forum { width: 750px; margin-left: auto; margin-right: auto; margin-top: 5px; margin-bottom: 5px; /*background: #666666;*/ position: relative; padding: 2px; z-index: 2; }
a.forumlink { position: relative; display: block; width: 100%; color: #c179c6!important; text-align: center; font-family: 'Kaushan Script', cursive; font-size: 22px; margin-top: -15px; letter-spacing: 1px; transform: all; -moz-transform: all; -o-transform: all; -htm-transform: all; -webkit-transform: all; transition: 1s; -moz-transition: 1s; -o-transition: 1s; -htm-transition: 1s; -webkit-transition: 1s; }
a.forumlink:hover { letter-spacing: 2px; color: #c1378c!important; text-decoration: none !important; transform: all; -moz-transform: all; -o-transform: all; -htm-transform: all; -webkit-transform: all; transition: 1s; -moz-transition: 1s; -o-transition: 1s; -htm-transition: 1s; -webkit-transition: 1s; }
/* Description */ .description { width: 340px; height: 100px; overflow: auto; background-color: #fefefe; text-align: justify; font-family: arial; font-size: 11px; color: #645b6b; }
/* Bloc derniers messages */
.bloccate { width: 120px; }
.stats_last { display: block; width: 160px; height: 75px; margin-left: -200px; margin-top: 30px; background: #E3A6A6; padding: 10px; border: 1px solid #2E2E2E; box-shadow: 2px 2px 10px #2E2E2E; -moz-box-shadow: 2px 2px 10px #2E2E2E; -webkit-box-shadow: 2px 2px 10px #2E2E2E; }
.stats { display: block; text-align: center; font-size: 10px; color: #7E2727; border-bottom: 1px solid #7E2727; padding-bottom: 4px; margin-bottom: 4px; }
/*--------------------------------- FIN CATEGORIES --------------------------------- */ |
|