html{height:100%}
body{background-color:#161922;height:100%;text-align:center;color:#E0E3EB;margin:0;padding:0;word-wrap:break-word;}
body,td,a{font-family:"Trajan Pro";font-size:9pt}
a{color:#999999;text-decoration:none;}
a img{border:0}
/*
*/
/* MENU HAUT */
#rubriques{text-align:right}
#rubriques ul a{color:#FFFFFF;font-size:11pt;display:block}
#rubriques ul a:hover{color:#FFCC00;background-color:#242937}
ul.horiz {margin: 0; padding: 0; list-style-type: none;z-index:100}
ul.horiz > li {float: right;margin: 0}
/* MENU DEROULANTS */
li.drop {position: relative;z-index:200}
li.drop ul {padding:0;margin:0; list-style-type: none;}
li.drop > ul {display: none;position: absolute;z-index:200;background-color: #242937;border: 1px solid #161922;padding:7px }
li.drop > ul li{width:260px;text-align:left;z-index:200/*padding:0px 0px 0px 25px;margin:0;*/}
#rubriques ul li.drop > ul li a{font-size:9pt}
/*
a.rub{font-size:11pt}
*/
a.rub{padding:0 10px}
.pied a{margin:0 3%}
.pied a{font-size:7pt}
.pied a.avantageweb{float:left}
a:hover{color:#ffffff;}
.corps a{color:#336699;}
.corps a:hover{color:#CC3300;}
img.logo{display: block; margin: 0 3%;}
table#page{height:95%;width: 100%;max-width: 100%;}
.tete,.pied {height:15%;line-height:20pt/*; padding-left:3%;padding-right:3%*/}
.tete {vertical-align:bottom;text-align: left;}
.pied {vertical-align:top;text-align: right}
.corps{background:#FFFFFF url('stephane-herve-createur-mode/monogramme-blanc.jpg') no-repeat scroll 10% 10%;color:#333333;padding:auto 3%}
.colonneBiographie1 {float:left;margin:3% 3% 3% 15%;text-align:left;width:40%}
.colonneCollection1 {float:left;margin:3% 1% 3% 10%;text-align:left;width:25%}
.colonneCollection2 {float:left;margin:3% 1% 3% 3%;width:270px}
.colonneCollection3 {float:left;margin:3% 1% 3% 3%}
.colonneCollection1 h1{font-size:23pt;line-height:23pt}
.colonneCollection2 img {margin-right: 14px; margin-bottom: 14px}
img{max-width:100%;/*display:block;*/ }
td img.large100{display: block; margin: 0;width: 100%; max-width: none; }
/* MEDIA : style spécifique pour Grands écrans --------------------- */
/* MEDIA : style spécifique pour Grands écrans --------------------- */
@media screen and (min-width: 1025px) {
body{}
}
/* Un message personnalisé */
body:before {
content: "Version Grand écran";
display: block;
color: #464E6A;
text-align: center;
font-size:8px
}
/* MEDIA : iPads, Tablette ----------------------------------------- */
/* MEDIA : iPads, Tablette ----------------------------------------- */
/* MEDIA : iPads, Tablette ----------------------------------------- */
/* MEDIA : iPads, Tablette ----------------------------------------- */
/* MEDIA : iPads, Tablette ----------------------------------------- */
@media screen and (min-width: 641px) and (max-width: 1024px) {
/* Un message personnalisé */
body:before {
content: "Version iPad à 1024";
display: block;
color: #464E6A;
text-align: center;
font-size:8px
}
.colonneCollection1 {margin:3% 0% 1% 10%;width:50%}
.colonneCollection2 {margin:3% 5% 0 0;float:right;}
.colonneCollection3 {margin:3% 0% 3% 10%;float:left;}
/*
#contents{
width: 40%;
float:left;
}
#right{
width:100%;
float:none;
clear:both;
}
#right .widget {
display:inline-block;
vertical-align:top;
width:40%;
}
*/
}
/* MEDIA : iPhones, Smartphone -------------------------------------- */
/* MEDIA : iPhones, Smartphone -------------------------------------- */
/* MEDIA : iPhones, Smartphone -------------------------------------- */
/* MEDIA : iPhones, Smartphone -------------------------------------- */
/* MEDIA : iPhones, Smartphone -------------------------------------- */
@media screen and (max-width: 640px) {
/* passer tous les éléments de largeur fixe en largeur automatique */
body, element1, element2 {
width: auto;
margin: 0;
padding: 0;
}
body{background:#161922 url('stephane-herve-createur-mode/monogramme.gif') no-repeat center;
}
.smarts{float:none;width:90%;margin:3% 4% 3% 6%;clear:both;
}
.colonneCollection1 h1{font-size:18pt;line-height:18pt}
.colonneCollection3 {float:left;margin:3% 0 0 4%}
#rubriques{text-align:left}
#rubriques ul a{color:#FFFFFF;font-size:11pt;display:block}
ul.horiz > li {margin: 0;float: left;/*float: none*/}
li.drop > ul {display: none;position: absolute;/*top:-1px;left:30px;*/background-color: #242937;border: 1px solid #161922;padding:7px }
.pied {height:5%; vertical-align:top;line-height:10pt;text-align: center/*;padding-left:3%;padding-right:3%*/}
.pied a{font-size:5pt}
.pied a.avantageweb{float:none}
/* fixer une largeur maximale de 100 % aux éléments potentiellement problématiques */
img, table, td, blockquote, code, pre, textarea, input, iframe, object, embed, video {
max-width: 100%;
}
/* conserver le ratio des images et empêcher les débordements de boîtes dûs aux border ou padding */
img, video {
height: auto;
width: auto;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
/*
td img.large100{
display: block; margin: 0;width: 100%; max-width: none;
}
*/
img.logo{
display: block; margin: 0 3%;width: 94%; max-width: none;
}
img.dansCorpsBlanc{
width: 100%; max-width: none;
}
/* gestion des mots longs */
textarea, table, td, th, code, pre, samp {
word-wrap: break-word; /* passage à la ligne forcé */
-webkit-hyphens: auto; /* césure propre */
-moz-hyphens: auto;
hyphens: auto;
}
.tete,.pied {
word-wrap: none; /* pas de passage à la ligne forcé */
-webkit-hyphens: none; /* pas de césure*/
-moz-hyphens: none;
hyphens: none;
}
/* passage à la ligne spécifique pour les éléments à châsse fixe : */
/*
code, pre, samp {
white-space: pre-wrap;
}
*/
/* Passer à une seule colonne (à appliquer aux éléments multi-colonnes) : */
/*
element1, element2 {
float: none;
width: auto;
}
*/
/* masquer les éléments superflus : */
.hide_mobile {
display: none !important;
}
/* Un message personnalisé */
body:before {
content: "Version Smartphone";
display: block;
color: #464E6A;
text-align: center;
font-size:8px
}
/*
#left{
float:none;
width:100%;
}
#contents{
width: 100%;
float:none;
}
*/
}