@charset "utf-8";

/* Image de fond - lien à changer dans le HTML */
body{background-color: slategrey; background-size: cover; background-position: center top; background-attachment: fixed; background-repeat: no-repeat; margin: 0}


/* Header */
.header{width:100%;background-image: linear-gradient(to left,#0E3C78,black); background-position: center top; padding-top: 10px; height: 60px; position: fixed}
.contentheader{width : 800px; margin: 0 auto}
.logo{width: 50%; float:left; height: 30px; line-height: 4px}
.logo{font-family: 'Source Sans Pro', sans-serif; line-height:0px; clear:both;}
.logo h2{color: #0096D7; font-size:16px; font-style:italic; font-weight: 300}
.logo a{color: #B0D6E6; font-size:24px; font-weight: 700; text-decoration: none}
.menu{width: 40%; float: right; height: 30px; text-align: right; font-family: 'Source Sans Pro', sans-serif;}
.menu li{list-style-type: none; display: inline; padding-right: 20px}
.menu a{color: #0096D7; font-weight: 700; text-decoration: none}


/* Partie principale */

/* Placement */
.main{width:100%}
.content{padding-top: 70px; width:800px; margin: 0 auto}
.content{font-family: 'Source Sans Pro', sans-serif}
.article{background-color: white; border-top-left-radius: 8px; border-top-right-radius: 8px; padding: 20px}

/* Header Article - Titre jeu et Lieu de conception */
.articleheader{}
.articleheader h4{color: grey; font-weight: 700; font-size:18px; text-align: right; line-height: 0px}
.articleheader hr{width: 100%; height: 2px; background-color: deepskyblue; border: 0; float: left}
.titre{width: 60%; height: 30px; float: left}
.lieu{width:40%; height: 30px; text-align: right; float: left}

/* Header partie texte de l'article - Infos et icones */
.textesheader{}
.infos{width: 40%; float:left ; height: 80px}
.play{width:60%; float:right; height: 80px; text-align: right; vertical-align: middle}

/* Corps de l'article */
.textes{width:55%; float: left}
.screenshot{width: 40%; padding-top: 0px; float: right; text-align: center}

/* Aspect */
.content h1{color: #0096D7; font-weight: 700; line-height: 0px}
.content h2{color: #0096D7; font-weight: 700; font-size:18px; text-align: center; line-height: 0px}
.content h3{color: grey; font-weight: 700; font-size:18px; line-height: 20px}
/*.content h4{color: grey; font-weight: 700; font-size:18px; line-height: 20px; text-align: right}*/
blockquote{background-color: deepskyblue; padding: 5px;border-radius: 5px;text-align: center; color: white}
.comment{font-style: italic; color: grey}
.comment hr{height: 1px; background-color: silver; border: 0}
.credits{text-align: center}

/* Preview */
.row{display:inline-block; padding: 10px; vertical-align: top}
.top{display:inline-block; padding: 10px; vertical-align: top; text-align: left}
.toptext{display:inline-block; padding: 10px; vertical-align: top; text-align: center}
.toptitle{text-align: center; line-height: 10px; padding-bottom: 0px}
.toptitle h1{color: #0096D7; font-weight: 700; line-height: 0px; text-align: left}
.preview{display: table-row}
.previewimage{}
.previewtext{text-align: center; line-height: 5px; padding-bottom: 30px}
.previewtext h3{line-height:0px}