/*les commentaires se déclarent comme ceci
 également sur plusieurs lignes en mettant une étoile en début de ligne pour la lisibilité
*/

$cd-txt: #6300a0 ;
$cd-box: #ffffff ;
$cd-danger: #b20a37 ;

input[type=submit] {
  cursor: pointer;
}
input
{
    &:focus {
		border: 3px solid #6300a0;
    }
	&:hover {
		cursor: pointer;
	}
	&:not(:focus):invalid {
                background-color: #b20a37 ;
                border: 2px solid #b20a37 ;
                color: #fff;
				cursor: wait;
            }
	&:active {
		cursor: wait;
	}
}
body{
	font-family : 'Century Gothic', calibri, serif;
	font-size: 17px;
	margin:10px;
	padding:0px;
}
P{
		font-weight:normal;
		color:blue;
		font-size: 17px;
		text-align:left;
}
T{
		font-weight:normal;
		color:red;
		font-size: 18px;
		text-align:left;
}

header
{
    /* background: url('images/separateur.png') repeat-x bottom; */
    display: flex;
    justify-content: space-between;
    align-items: flex-end; 
	top:0px;
}

footer{
	height:80px;
	padding-top: 30px;
	text-align:left;
	background-color:#c5c5c5;
	border-top:2px solid #AAA;
}

nav{
	width:100%;
	background-color: #424558;
}

nav a{
	 display: inline-block; 
	text-decoration: none;
	padding: 20px 30px;
	color: #FFF;
	text-transform: uppercase;
	font-size : 15px;
}
nav li{
	list-style-type: none;
	float :left;
}
nav ul{
	margin: 0px;
	padding:0px;
}


 .table{
	display: table;
	margin: 0 auto;
}/*
définition des différents class des menus*/
.menu-news:hover{
	border-top: 5px solid #4c8;
	background-color: RGBa(000,112,000,0.90);
}
.menu-ind:hover{
	border-top: 5px solid #4c8;
	background-color: RGBa(64,200,130,0.15);
}
.menu-plan:hover{
	border-top: 5px solid #f1dc4f;
	background-color: RGBa(241,211,79,0.15);
}
.menu-even:hover{
	border-top: 5px solid #0070bb;
	background-color: RGBa(000,112,192,0.15);
}
.menu-con:hover{
	border-top: 5px solid #e44d26;
	background-color: RGBa(228,77,38,0.15);
}
/* les liens seront en vert*/
a{
	color : green;
	font-weight:bold;
}
/* on peut appliquer un style identique en même tempt à plusieurs éléments séparé par un ;*/
h1{
	font-size:20px;
	font-weight:normal;
	text-align:left;
}
h2{
	color:blue;
	font-weight:bold;
}
h3{
    background-color:black;
    color:white;
    font-size:17px;
    margin-bottom:0px;
	margin-top:0px;
}
h4 {
    background-color:black;
    color:white;
    font-size:13px;
}

pright{
	float:right;
}

body{
	font-family:"Open Sans",Georgia, serif;
}
/* défintion des section*/
section{
	width:100%;
	min-height:300px;
	padding-bottom:10px;
	margin-bottom:10px;
}
/* défintion des propriétés left et right qui sont déclarée en html par class*/
.left{
	float:left;
	width:30%;
}
.right{
	float:right;
	width:70%;
}
 .sec{
	margin: auto;
}
/* mise e forme du tableau*/
/* bordure du tableau */
td, th{
	border : 1px solid black;
	padding: 10px 15px;
}
table{
	/* en faisant ce la on supprime l'espace entre chaque cellule*/
	border-collapse : collapse;
}
/* format de la première ligne par utilisation balise th */
th{
	background-color: RGB(168,197,36);
	color:#FFF;
	text-transform:eppercase;
}
thead,tfoot{
	background-color: RGB(168,197,36);
	color:#FFF;
	text-transform:eppercase;
}
.ligne-impaire{
	background-color: #EEE;
}
.ligne-paire{
	background-color: #EEE;
}
.en-tete{
	background-color: RGB(168,197,36);
}

.news p{
    
	background-color:#CCCCCC;
    margin-top:0px;
}
.news{
    width:70%;
    margin:auto;
}
.textBleuClair{
	color:aqua;
}
.textNormal{
	font-weight : normal ;
}
/////////////////////////////////////////
/*formulaire*/
//////////////////////////


.container2 {
  background-color: rgb(237, 246, 247);
}

.form {
  &__group {
      & input {
      border: 2px solid $cd-box;
      border-radius: 100rem;
      color: $cd-txt;
      font-family: 'Montserrat', sans-serif;
      font-size: 2.5rem;
      outline: none;
      padding: .5rem 1.5rem;
      width: 100%;
      &:focus {
          border: 2px solid $cd-txt;
          }
      }
  }
}