﻿/* PAGE D'ACCUEIL */
.POK {
margin:auto; margin-top:20px; width:800px; line-height:16px;
}
.POK a{
text-decoration:none !important;
}
/* BIENVENUE */
.welcPOK {
margin-bottom:5px; text-align:center; letter-spacing:5px; font-size:32px; text-transform:uppercase; font-family:Fjalla One;
color:lightgrey;  /* MODIFIABLE */
}
/* FOND PAGE D'ACCUEIL */
.boxPOK {
height:530px; border-radius:150px; text-align:left;
background:lightgrey; /* MODIFIABLE */ 
}
/* BLOC EVENEMENT EN COURS / LIENS / TOP-SITES */
#lksPOK {
position:absolute; margin-top:45px; margin-left:-75px; 
width:230px; height:440px; border-radius:50px; 
background:#191919; /* MODIFIABLE */
}
/* EVENEMENT EN COURS */
.eventPOK {
display:block; margin:10px auto 15px; 
width:200px; height:200px; border-radius:200px; border:10px solid;
border-color:grey; /* MODIFIABLE */
}
/* IMAGE EVENEMENT */
.eventPOK img{
width:200px; height:200px; border-radius:200px;
}
/* CONTENU EVENEMENT EN COURS */
.eventPOK div{
position:absolute; margin-top:-200px; text-align:center;
width:170px; height:150px; padding:50px 15px 0; overflow:hidden; border-radius:200px;
background:black; color:white; /* MODIFIABLE */
opacity:0; transform:rotate(-460deg) scale(0.8); -webkit-transform:rotate(-460deg) scale(0.8); transition:all 0.85s; -webkit-transition:all 0.85s;
}
.eventPOK:hover div{
opacity:1; transform:rotate(0) scale(1); -webkit-transform:rotate(0) scale(1);
}
/* RESUME EVENEMENT */
.eventPOK p{
margin:0;
height:85px; overflow:auto;
text-align:justify; font-size:10px; 
}
/* LIEN EVENEMENT EN COURS */
.eventPOK a{
display:block; margin-top:10px; font-size:14px; 
color:white; 
}
/* LIEN BLOC LIENS */
.lksPOK a{
display:block; margin:5px auto; width:85%; padding:5px 0; 
background:grey; color:white; letter-spacing:1px; /* MODIFIABLE */
text-align:center; text-transform:uppercase; font-family:Fjalla One; font-size:18px;
transition:all 0.65s; -webkit-transition:all 0.65s;
}
/* SURVOL LIEN BLOC LIENS */
.lksPOK a:hover {
letter-spacing:3px; /* MODIFIABLE */
}
.topPOK {
margin-top:10px; text-align:center;
}
/* LIEN TOP-SITE */
.topPOK a{
display:inline-block; margin:0 5px;
width:35px; height:25px; padding-top:10px; border-radius:15px 15px 0 0;
font-size:18px;
background:white; color:black; 
opacity:0.7;
}
.topPOK a:hover {
opacity:1;
}
.topPOK img{
max-height:35px;
}
/* BLOC STAFF */
.staffPOK {
position:absolute; margin-top:345px; margin-left:200px; 
width:650px; height:120px; padding-top:5px; border-radius:45px; overflow:hidden; text-align:left;
background:black; /* MODIFIABLE */ 
}
/* IMAGES STAFF */
.staffPOK div .imgPOK {
width:100px; height:100px; border-radius:100px;
}
.staffPOK div:hover .imgPOK{
width:0px; height:0px; opacity:0;
}
.staffPOK div .imgIIPOK{
width:100px; height:100px; border-radius:100px
}
.staffPOK div:hover .imgIIPOK{
width:650px; height:125px; border-radius:45px;
}
.staffPOK div{
display:inline-block; margin:5px 15px; 
width:100px; height:100px; overflow:hidden; 
transition:all 0.65s; -webkit-transition:all 0.65s;
}
.staffPOK div:hover {
position:absolute; margin-top:-5px; margin-left:0; 
width:650px; height:125px; border-radius:45px; 
}
/* PSEUDONYME / RANG / MP STAFF */
.staffPOK div:hover span{
position:absolute; z-index:5; margin-top:15px; margin-left:-585px; 
width:200px; height:20px; padding:5px;
background:lightblue; color:black; /* MODIFIABLE */
}
/* DESCRIPTION STAFF */
.staffPOK div:hover p{
position:absolute; z-index:3; margin-top:-70px; margin-left:45px; 
width:300px; height:50px; padding:5px; overflow:auto; font-size:11px; text-align:justify;
background:grey; color:black; /* MODIFIABLE */
}
.staffPOK .IIPOK:hover {position:absolute; margin-left:-130px;}
.staffPOK .IIIPOK:hover {position:absolute; margin-left:-260px;}
.staffPOK .IVPOK:hover {position:absolute; margin-left:-390px;}
.staffPOK .VPOK:hover {position:absolute; margin-left:-520px;}
/* CONTEXTE */
.ctxtPOK {
position:absolute; margin-left:200px; margin-top:40px;
width:160px; height:180px; padding:10px; overflow:auto; border-radius:15px;
background:rgba(250,250,250,0.5); box-shadow:inset 0 0 3px rgba(0,0,0,0.3);
font-size:11px; text-align:justify; color:black;
}
/* PARTENAIRES */
.partPOK {
position:absolute; margin-top:55px; margin-left:400px;
width:350px; text-align:center;
}
.partPOK span {
display:block; margin-bottom:25px; width:350px; 
text-align:center; font-family:Fjalla One; font-size:44px; text-transform:uppercase; letter-spacing:7px;
color:black;
}
.partPOK img{
margin:5px; border-radius:50px; border:5px solid;
border-color:black;
filter:grayscale(1); -webkit-filter:grayscale(1); transition:all 0.65s; -webkit-transition:all 0.65s;
}
.partPOK img:hover {
border-color:grey;
filter:grayscale(0); -webkit-filter:grayscale(0);
}
/* PREDEFINIS */
.pfPOK {
position:absolute; margin-top:250px; margin-left:200px; 
width:550px; height:85px; text-align:left;
}
.pfPOK img{
margin:5px; width:75px; height:75px; border-radius:5px;
}
.pfPOK b{
display:block; font-weight:normal; font-size:42px;
}
.pfPOK span{
display:inline-block; vertical-align:top; margin-left:10px; padding-top:15px; 
font-family:Fjalla One; font-size:36px; text-transform:uppercase; text-align:center; line-height:30px;
color:black;
}
/* DISCLAIMER */
.claimPOK {
position:absolute; margin-top:480px; margin-left:180px; 
width:500px; font-size:9px; text-align:justify; line-height:10px;
color:black;
}