﻿body{
	margin: 0; padding: 0;
	color: ghostwhite;
	background-image : url("../images/background_black_light.jpg");
	background-attachment : fixed;
	color : white;
	font-family : 'Source code pro', Calibri, serif;
}

/*Slideshow*/

/*SLIDESHOW PROMOTION*/

@keyframes slideShow {
	0%, 15%,100% {
		left: 0px; 
	}
	35%, 50% {
		left: -500px; 
	}
	70%, 85% {
		left: -1000px; 
	}
}
#slideshow {
	position: relative;
	margin-left: 2em;
	float:left;
	width:500px;
	height: 300px;
	margin:  20px auto;
	overflow: hidden;
}
#sContent li {
	display: inline;
}
#sContent {
	position: absolute;
	top: 0;
	left: 0;
	width: 1550px;
	margin: 0;            
	padding: 0;
	animation-name: slideShow;
	animation-duration: 20s;
	animation-iteration-count: infinite;
	animation-timing-function: ease-in-out;
}

#sContent p{
	width : 500px;
	height : 500px;
}

/*La bannière*/
header{
	background-image:url("../images/banner.jpg");
	width : 100%;
	height : 225px;
}
header h1{
	font-size : 22pt;
	text-align:center;
	margin-top: 7px;
}
header img{
	margin-top : 15px;
}


/*Le menu*/
nav{ 
	background : rgba(0,0,0,0.6); 
	font-family: 'Raleway', sans-serif;   
	padding : 1em 0em 1em 0em;
}
nav ul{
	display:flex;
	align-items:center;
}
.menu{
	display: inline-block;
	margin : 0em 1em 0em 1em;
	position:relative;
	text-align:center;
}
.menu a{
	display : inline-block;
	font-size:200%;
	text-decoration: none;
	color : white;
}
nav img{ 
	width : 150px;
	padding-left: 1em;
}
.menu a:hover:not(#home){
	color: red;
	font-size : 220%;
	transition:0.3s;
}

h1{
	display:inline-block;
	font-size : 25pt;
	width:100%;
	text-align : center;
}

p{
	display:inline-block;
	text-align : justify;
}

article p{
	padding : 0px 30px 0px 30px;
}
.article-green{
	background : rgba(0,32,25,0.8);
}
#example{
	background:rgba(0,0,0,0.8);
	text-align:center;
}

#example img{
	width:80%;
}
.article-blue{
	background : rgba(2,30,77,0.8);
}

article{
	font-size : 15pt;
	width : 100%;
	text-align:center;

}
.article-join
{
	display: flex;
	flex-direction: row;
	justify-content: center;
	justify-content: space-evenly;
}
div.join {
	width:40%
}
button{
	width: 10%;
    text-align: center;
    margin: auto;
}
input{
	min-width : 200px;
	min-height : 20px;
	margin-bottom : 5px;
}
textarea{
	min-width : 800px;
	min-height : 200px;
}

h2{
	color:red;
	font-size : 30pt;
	padding-left: 2em;
}

.in-column{
	display:flex;
	margin : 5em;
}

.link img{
	width : 10%;
}
.join a{
	display:flex;
	align-items: center;
	justify-content: space-between;
	color : dodgerblue;
	font-weight: bold;
	text-decoration: none;
}
.join a .logofacebook
{
	width:20%;
}
.join a .logotipee
{
	width:15%;
}
.join a .logopaypal
{
	width:15%;
}
h2.contact{
	padding-left:0em;
}
div.about
{
	padding-left:2em;
	padding-right:2em;
	text-align: justify;
	font-weight: bold;
}


#article{
	width : 70%;
	margin:auto;
	font-size : 20pt;
}

.see-more{
	color: DodgerBlue;
	text-decoration:none;
	float:right;
}

.breaking-news{
	display:flex;
	width : 90%;
	margin-top:2em;
	margin-left : 5em;
	font-size:20pt;
	background : rgba(0,0,0,0.8);
	border-radius : 14px;
}
.breaking-news-image{
	margin-left : 10em;
	border-radius : 14px;
}

.breaking-news-green{
	color:Lime;
}
.breaking-news-white{
	color:white;
}
.breaking-news-blue{
	color:MediumTurquoise ;
}