AccueilAccueil  CalendrierCalendrier  FAQFAQ  RechercherRechercher  MembresMembres  GroupesGroupes  S'enregistrerS'enregistrer  ConnexionConnexion  
UNE PARTIE DES CODES APPARTIENT A CAMILLE (WILD DRAGON) ET LE HEADER A ERIKOIEN
FORUM FOUTOIR

Partagez | 
 

 TOF -------

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage

Admin
avatar

Messages : 126
Date d'inscription : 21/12/2013
Localisation : là où on fait des quiches lorraines
Age : 21

MessageSujet: TOF -------   Mer 10 Fév - 15:56

Code:
<meta charset="UTF-8" />        <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible" /> <link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Oswald" />          <style>
      @import url(http://fonts.googleapis.com/css?family=Titillium+Web:300);
@import url(http://weloveiconfonts.com/api/?family=entypo);
*, *:before, *:after {
  margin:0;
  padding:0;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}
#gal {
  position:relative;
  width:320px;
  height:200px;
  margin:0 auto;border-radius : 3px;
  top:20px;
  background:#F0E9DB;
  -webkit-transform:translate3d(0, 0, 0);
  -moz-transform:   translate3d(0, 0, 0);
  -ms-transform:    translate3d(0, 0, 0);
  -o-transform:     translate3d(0, 0, 0);
  transform:        translate3d(0, 0, 0);
}
#gal:after {
  content:'';
  position:absolute;
  bottom:190px;
  right:0;
  left:0;
  width:100%;
  height:1px;
  background:#F8F4ED;
  z-index:3;
}
#gal ul {list-style-type:none;}
input[type="radio"], input[type="radio"] + label {
  position:absolute;
  bottom:185px;
  display:block;
  width:10px;
  height:10px;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  border-radius:50%;
  cursor:pointer;
}
input[type="radio"] {
  opacity:0;
  z-index:9;
}
input[value="one"], input[value="one"] + label {left:35px;}
input[value="two"], input[value="two"] + label {left:120px;}
input[value="three"], input[value="three"] + label {left:200px;}
input[value="four"], input[value="four"] + label {left:280px;}
input[type="radio"] + label {
  background:rgba(248, 244, 237, 0.6);
  z-index:7;
  -webkit-box-shadow:0px 0px 0px 0px rgba(255, 255, 255, 0.5);
  -moz-box-shadow:0px 0px 0px 0px rgba(255, 255, 255, 0.5);
  box-shadow:0px 0px 0px 0px rgba(255, 255, 255, 0.5);
  -webkit-transition:all .3s;
  -moz-transition:all .3s;
  -o-transition:all .3s;
  transition:all .3s;
}
[class*="entypo-"]:before {
  position:absolute;
  font-family: 'entypo', sans-serif;
}
figure[class*="entypo-"]:before {
  left:10px;
  top:5px;
  font-size:2rem;
  color:rgba(255,255,255,0.6);
  z-index:1;
  -webkit-transition:color .1s;
  -moz-transition:color .1s;
  -o-transition:color .1s;
  transition:color .1s;
}
a[class*="entypo-"]:before {
  top:8px;
  left:9px;
  font-size:1.5rem;
  color:white;
}
a:hover[class*="entypo-"]:before {
  color:white;
}
figure, figure img, figcaption {
  position:absolute;
  top:0;
  right:75px;
}
figure {
  bottom:0;
  left:0;
  width:320px;border-radius : 3px;
  height:200px;
  display:block;
  overflow:hidden;
}
figure img {
  bottom:0;
  left:0;
  display:block;
  width:320px;border-radius : 0px 3px 3px 0px;
  height:200px;
  z-index:1;
  -webkit-transform:translateX(600px);
  -moz-transform:translateX(600px);
  -ms-transform:translateX(600px);
  -o-transform:translateX(600px);
  transform:translateX(600px);
  -webkit-transition:all .15s .15s, z-index 0s;
  -moz-transition:all .15s .15s, z-index 0s;
  -o-transition:all .15s .15s, z-index 0s;
  transition:all .15s .15s, z-index 0s;
}
figcaption {
  display:block;
  width:170px;
  height:200px;
  padding-top:20px;
  background:rgba(241, 236, 231, 0.8);
  background-size:600px 600px;
  background-repeat:no-repeat;
  background-position:-300px -150px;
  text-align:center;
  z-index:3;
  -webkit-transform:translateX(300px);
  -moz-transform:translateX(300px);
  -ms-transform:translateX(300px);
  -o-transform:translateX(300px);
  transform:translateX(300px);
  -webkit-transition:all .35s;
  -moz-transition:all .35s;
  -o-transition:all .35s;
  transition:all .35s;
}

figcaption nav ul {display:block;padding-top:10px;}
figcaption nav ul li {display:inline-block;margin-left:5px;}
figcaption nav ul li a {
  position:relative;
  display:block;
  width:40px;
  height:40px;
  background:rgba(255,255,255,0.2);
  text-decoration:none;
  color:white;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  border-radius:50%;
  -webkit-box-shadow:inset 0px 0px 0px 0px rgba(255,255,255,0);
  -moz-box-shadow:inset 0px 0px 0px 0px rgba(255,255,255,0);
  box-shadow:inset 0px 0px 0px 0px rgba(255,255,255,0);
  -webkit-transition:all .15s;
  -moz-transition:all .15s;
  -o-transition:all .15s;
  transition:all .15s;
}
figcaption nav ul li a:hover {
  background:rgba(255,255,255,0);
  -webkit-box-shadow:inset 0px 0px 0px 2px rgba(255,255,255,1);
  -moz-box-shadow:inset 0px 0px 0px 2px rgba(255,255,255,1);
  box-shadow:inset 0px 0px 0px 2px rgba(255,255,255,1);
}
figcaption p {
  padding:5px 5px;
  font-family:arial;
font-size:10px;
  color:black; text-align:justify;line-height:10px;
}
input[type="radio"]:hover + label {
  background:rgba(255,255,255,0.6);
}
input[type="radio"]:checked + label {
  background:rgba(255,255,255,1);
  -webkit-box-shadow:0px 0px 0px 5px rgba(255,255,255,0.3);
  -moz-box-shadow:0px 0px 0px 5px rgba(255,255,255,0.3);
  box-shadow:0px 0px 0px 5px rgba(255,255,255,0.3);
}
input[type="radio"]:checked + label:before {}
input[type="radio"]:checked ~ figure img {
  z-index:2;
  -webkit-transform:translatex(0px);
  -moz-transform:translatex(0px);
  -ms-transform:translatex(0px);
  -o-transform:translatex(0px);
  transform:translatex(0px);
  -webkit-transition:all .15s, z-index 0s;
  -moz-transition:all .15s, z-index 0s;
  -o-transition:all .15s, z-index 0s;
  transition:all .15s, z-index 0s;
}
input[type="radio"]:checked ~ figure[class*="entypo-"]:before {
  z-index:3;
  color:rgba(255,255,255,0.5);
  -webkit-transition:color .5s;
  -moz-transition:color .5s;
  -o-transition:color .5s;
  transition:color .5s;
}
input[type="radio"]:checked ~ figure figcaption {
  z-index:8;
  -webkit-transform:translateX(0px);
  -moz-transform:translateX(0px);
  -ms-transform:translateX(0px);
  -o-transform:translateX(0px);
  transform:translateX(0px);
  -webkit-transition:all .35s, .7s;
  -moz-transition:all .35s, .7s;
  -o-transition:all .35s, .7s;
  transition:all .35s, .7s;
}

     /* LIENS */
a:link,a:active,a:visited { text-decoration: none;color:#C95B57;-webkit-transition: all 1.5s ease; /* pour navigateur webkit */
-moz-transition: all 1.5s ease; /* pour navigateur mozilla */
-o-transition: all 1.5s ease; /* pour navigateur opera */
transition: all 1.5s ease; /* pour les navigateurs récents */ }
a:hover { text-decoration: none !important; color:#E1B977;} /*enlève le soulignement des liens*/
a { outline: none !important; }
bb {
  color:#85673A;font-family:Oswald;font-size:11px;text-transform:uppercase;
}

cc {
  color:#2B73AE;font-family:Oswald;font-size:11px;text-transform:uppercase;
}
    ff {
  color:#C52142;font-family:Oswald;font-size:11px;text-transform:uppercase;
}

ee {
  color:#4AA289;font-family:Oswald;font-size:11px;text-transform:uppercase;
}        
          </style>              
<div id="gal">
  <nav class="galnav">    </nav>
 <ul>
      
 <li>
        <input checked="checked" value="one" name="btn" type="radio" />        <label for="btn"></label>        <figure>          <img src="http://www.zupimages.net/up/14/51/yid2.png" />          <figcaption>              <nav role="navigation">                </nav></figcaption></figure>
 <p>
 <cc>YOU CAN'T HIDE YOURSELF IN THE WATER - </cc>Ras-de-marée destructeur dominé d'un ciel de nuages gris noirci à l'horizon et sabré d'éclairs. Un océan agité aux vagues menaçantes qui ondulent, se répandant en ondes doucereuses et élégantes jusqu'à la plage. Des rouleaux déchaînés viennent se briser contre les rocs côtiers et s'élèvent dans l'air comme cherchant à exprimer la colère divine d'un Poséidon courroucé.  <a href="http://twist-of-fate.forumactif.org/t15-quelle-est-ma-destinee">(lire la suite)</a>
 </p><figure><figcaption><nav role="navigation">                              </nav>            </figcaption>        </figure>      
 </li>
      
 <li>
        <input value="two" name="btn" type="radio" />        <label for="btn"></label>         <figure class="entypo-forward">          <img src="http://www.zupimages.net/up/14/51/v7sc.png" />          <figcaption>              <nav role="navigation">                </nav></figcaption></figure>
 <p>
 <bb>the crying earth the weeping shores - </bb> Des pics rocheux, escarpés, pointant le ciel. Une montagne plusieurs fois millénaire qui domine l'horizon, imperturbable, inerte. Une terre sans âge, robuste, qui a essuyé moultes ouragans, incendies, tempêtes, tremblements, gardant sur sa peau la mémoire et la mélancolie, cette sagesse des événements passés. Des pierres aux parois lissées par l'eau, les coups, mais résistante, tenace.   <a href="http://twist-of-fate.forumactif.org/t15-quelle-est-ma-destinee">(lire la suite)</a>                  
 </p><figure class="entypo-forward"><figcaption><nav role="navigation">                               </nav>            </figcaption>        </figure>      
 </li>
      
 <li>
        <input value="three" name="btn" type="radio" />        <label for="btn"></label>        <figure class="entypo-forward">          <img src="http://www.zupimages.net/up/14/51/m7q3.png" />          <figcaption>              <nav role="navigation">                </nav></figcaption></figure>
 <p>
 <ff>come on put your hands into the fire - </ff> Le feu crépite dans l'âtre, ondulant sensuellement en arabesques harmonieuses sous les yeux des curieux, de ceux qui tentent de frôler cette danse rougeoyante du bout des doigts, de l'accaparer. Mais il suffit qu'une flamme souffle et l'index s'éloigne immédiatement craignant la chaleur brûlante, le courroux de l'élément viril incarnant la puissance et la force ainsi que la destruction.   <a href="http://twist-of-fate.forumactif.org/t15-quelle-est-ma-destinee">(lire la suite)</a>                
 </p><figure class="entypo-forward"><figcaption><nav role="navigation"></nav>            </figcaption>        </figure>      
 </li>
      
 <li>
        <input value="four" name="btn" type="radio" />        <label for="btn"></label>         <figure class="entypo-forward">          <img src="http://www.zupimages.net/up/14/51/4vi8.png" />          <figcaption>               <nav role="navigation">                </nav></figcaption></figure>
 <p>
 <ee>IT'S LIKE LIVING IN A WORLD WITH NO AIR - </ee> Un souffle d'air, une légère brise, qui vient soulever avec frivolité des feuilles mortes, passant ensuite entre les cheveux d'une jeune fille, il poursuit sa route abstraite à travers le monde, sans cesser de voyager, de découvrir, de parcourir. Il s'échappe aussi vite qu'il est arrivé, en courant d'air, il passe sous une porte, se faufile, semble partout et nulle part, comme invisible, impossible à attraper, à suivre, à connaître.  <a href="http://twist-of-fate.forumactif.org/t15-quelle-est-ma-destinee">(lire la suite)</a>                
 </p><figure class="entypo-forward"><figcaption><nav role="navigation">              </nav>            </figcaption>        </figure>      
 </li>
      
 </ul><nav class="galnav">  </nav>
</div>
[/quote]
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://doiwannaknow.frbb.net

Admin
avatar

Messages : 126
Date d'inscription : 21/12/2013
Localisation : là où on fait des quiches lorraines
Age : 21

MessageSujet: Re: TOF -------   Mer 10 Fév - 15:56

smogogo a écrit:
A. Khalisah Al-Zahâr a écrit:
Bonjour/Bonsoir petits créateurs de génie, nous venons passer une petite commande pour un forum city basé sur le destin, le karma, les âme-soeurs etc... En espérant que la commande vous inspirera !

» Photo(s) : Alors pour la version d'ouverture nous aimerions mettre l'accent sur les couples et donc nous vous proposons des images de duos. Vous pouvez en mettre un, plusieurs, comme vous le sentez. Vous pouvez choisir d'autres couples avec d'autres célébrités si vous le souhaitez, du moment qu'ils sont par paires

CÉLÉBRITÉS
Spoiler:
 

FONDS EN VRAC

Spoiler:
 

PNG EN VRAC

Spoiler:
 

» Type (animé, minimaliste, pro, fantaisiste) : Au choix, aléatoire, simple, un header de scène ou pas, avec animation ça peut être sympas mais sans ça nous plaira tout autant !
» Texte principal : TWIST OF FATE
» Texte en plus : Saison une : Paris je t'aime ou She's a beast, I call her karma
» Dimensions : Header de fond, donc 1600px de largeur, pour la hauteur c'est comme vous voulez mais avec un fondu en tout cas pour qu'il n'y ait pas de démarcations avec le forum
» Couleurs de la création :
https://s-media-cache-ak0.pinimg.com/736x/71/e8/9a/71e89a7beac4cbe1f5fa4fb8758f89f5.jpg
https://s-media-cache-ak0.pinimg.com/736x/c2/f3/42/c2f342283652ee24ddccae7071e88451.jpg
https://s-media-cache-ak0.pinimg.com/736x/19/b2/27/19b22797eaf58347de35b306be15fbdd.jpg
https://s-media-cache-ak0.pinimg.com/736x/60/e7/a4/60e7a487a83f2a21d926a98ac50a174b.jpg
https://s-media-cache-ak0.pinimg.com/736x/15/4a/01/154a012944168c05d6aea21498b52d37.jpg
» Ambiance : Alors le forum change de ville au fil des saisons et pour l'ouverture celui-ci est basé à Paris, comme c'est une version qui sera centrée sur les couples n'ayez pas peur d'être un peu cliché, sans tomber dans la mièvrerie avec des petits cœurs partout évidement xD mais jouez sur l'ambiance parisienne, l'image que s'en font généralement les gens. Donc une atmosphère feutrée, romantique, un peu rétro peut-être, bourgeoise, élégante, colorée mais douce, un Paris bohème et un brin idéalisé ça nous va !
Pour plus d'inspiration :
http://weheartit.com/phillharmonics/collections/54788521-paris
http://weheartit.com/phillharmonics/collections/24645296-this-is-a-story-about-love
» Personne(s) citée(s) : Phantasmagoria, uc
» Lien où sera mis le design :
nous préférons ne pas donner le lien directement sur le sujet mais nous vous le donnerons volontiers par mp si nécessaire !
» Exemples :
http://img4.hostingpics.net/pics/736847GMA2.png
http://www.zupimages.net/up/15/04/i3oa.png
» Autre ? : Merci à toutes celles et tous ceux qui tenteront !
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://doiwannaknow.frbb.net

Admin
avatar

Messages : 126
Date d'inscription : 21/12/2013
Localisation : là où on fait des quiches lorraines
Age : 21

MessageSujet: Re: TOF -------   Mer 10 Fév - 15:56

smogogo a écrit:
A. Khalisah Al-Zahâr a écrit:
PNG POUR LA PA ET LE QEEL

Je met ici du coup les trucs coutures/mode que je t'ai passé sur skype histoire que tu ais tout à porté de main :32:

http://www.polyvore.com/sew_what/collection?id=1999261
http://www.polyvore.com/vintage_items/collection?id=3007363
http://www.polyvore.com/sewing_kit/collection?id=4056941
http://www.polyvore.com/vintage_items/collection?id=4026038
http://www.polyvore.com/cgi/thing?id=54221557
http://www.polyvore.com/cgi/thing?id=46114612
http://www.polyvore.com/pink/set?id=132258581
http://www.polyvore.com/lady-annadu_album_elements_for_scrap/thing?id=81914947
http://www.polyvore.com/film_noir_heirrese/set?id=127559094
http://www.polyvore.com/set_eye_makeup/collection?id=3414980
http://www.polyvore.com/makeup_sets/collection?id=2562800
http://www.polyvore.com/mac_2012_gift_sets/collection?id=1971128
http://www.polyvore.com/flacons/set?id=100753125
http://www.polyvore.com/roaring_20s_powder_room_cosmetics/collection?id=2778939
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://doiwannaknow.frbb.net

Admin
avatar

Messages : 126
Date d'inscription : 21/12/2013
Localisation : là où on fait des quiches lorraines
Age : 21

MessageSujet: Re: TOF -------   Mer 10 Fév - 15:57

idée pour organiser
http://www.plandeparis.info/plans-de-paris/plan-de-paris.jpg
http://larondedenuit.forumactif.org/
http://littleblackdress.frbb.net/
http://ohparis.super-forum.net/
http://paris-a-tout-prix.forumactif.org/
http://oohlala-paris.forum-canada.net/
http://parisien.fr1.co/
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://doiwannaknow.frbb.net

Contenu sponsorisé


MessageSujet: Re: TOF -------   

Revenir en haut Aller en bas
 

TOF -------

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Maybe I'm Too Busy Being Yours To Fall for Somebody New. :: Votre 1ère catégorie :: Codes-