1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88
| /*initialisation et prérequis_________________________________________________*/
@charset "UTF-8";
@font-face
{
font-family: "alegreya";
src: url('polices/alegreya-Regular.ttf');
}
html
{
overflow-y: scroll; /*force la scrollbar, passe le 1366 en 1349*/
}
img, object, embed, canvas, video, audio, picture /*arrengement medias multiterminaux*/
{
max-width: 100%;
height: auto;
}
body
{
position: relative;
width:733px;/*la taille par raport au background*/
margin-top: 163px;
margin-left: auto; /*ideal => 308px -> 308/1349*/
margin-right: auto; /*Idem droite*/
margin-bottom: 0;
}
/*fin initialisation et prérequis_________________________________________________*/
/*menu haut_______________________________________________________________________*/
#haut a /*parametrage du texte*/
{
text-decoration: none;
font: 1.4em, "alegreya", Helvetica, Arial, sans-serif;
color: #FFFFFF;
}
.bouton /* par rapport a body, 4 bouttons espacé de 3 x ?? px en 1349*/
{
float: left;
font-size: 1.4em; /*22.4 px = 16 * 1.4 */
width: 24.465240642%; /**/
padding-top: 1%; /*permet le centrage vertical*/
text-align: center;
margin-right: 0.71301247733%; /*espace entre les bouttons*/
background: linear-gradient( to top, rgba(255,255,255,0), rgba(61,61,61,65), rgba(25,25,25,100), rgba(61,61,61,35), rgba(255,255,255,0));
border-radius: 10%;
}
#last .bouton /*bricolage de centrage dans l'entéte pour le dernier element*/
{
margin-right: 0;
}
/*decoration bouttons*/
/*triangle de deroulement*/
/*animation survol*/
/* rendre visible les sousmenus*/
.bouton:hover
{
background: linear-gradient( to top,rgba(255,255,255,0), rgba(61,61,122,30), #000033, rgb(61,61,61), rgba(150,150,150,0));
}
/*apparition sous menu*/
/*#sousmenu1 .bouton
{
z-index: 1;
visibility:hidden;
display: none;
clear: left;
}*/
/*fin menu haut___________________________________________________________________*/
/*corp____________________________________________________________________________*/
#corp
{
float: top;
text-align: center;
color: rgb(153,153,153);
width: 100%;
height: auto;
background-color: rgb(00,00,51);
}
/*fin corp________________________________________________________________________*/
/*menu bas________________________________________________________________________*/
#bas a
{
background-color: rgb(187,187,187);
float: left;
width: 20%;
text-align: center;
} |
Partager