/*********************************animation csss*******************/
body {
	background: linear-gradient(45deg, #be1d2d 33%, #ffffff 33% 66%,#21301A 66% 100%);
	background-size: 450% 200%;
    /*animation: gradient 30s ease 1;
    animation-delay:5s;*/
    font-family:'GothamRoundedBook';
}

@keyframes gradient {
	0% {
        background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

@font-face {
    font-family: 'GothamRoundedLight';
    src:url('../../ressources/fonts/gothamrnd-light.eot');
    src:url('../../ressources/fonts/gothamrnd-light.eot') format('embedded-opentype'),
        url('../../ressources//fonts/gothamrnd-light.woff') format('woff'),
        url('../../ressources//fonts/gothamrnd-light.ttf') format('truetype'),
        url('../../ressources//fonts/gothamrnd-light.svg#GothamRoundedLight') format('svg');}
@font-face {
    font-family: 'GothamRoundedBold';
    src: url('../../ressources/fonts/gothamrnd-bold.eot');
    src: url('../../ressources/fonts/gothamrnd-bold.eot') format('embedded-opentype'),
         url('../../ressources/fonts/gothamrnd-bold.woff') format('woff'),
         url('../../ressources/fonts/gothamrnd-bold.ttf') format('truetype'),
         url('../../ressources/fonts/gothamrnd-bold.svg#GothamRoundedBold') format('svg');}
@font-face {
    font-family: 'GothamRoundedBook';
    src: url('../../ressources/fonts/gothamrnd-book.eot');
    src: url('../../ressources/fonts/gothamrnd-book.eot') format('embedded-opentype'),
         url('../../ressources/fonts/gothamrnd-book.woff') format('woff'),
         url('../../ressources/fonts/gothamrnd-book.ttf') format('truetype'),
         url('../../ressources/fonts/gothamrnd-book.svg#GothamRoundedBook') format('svg');}
@font-face {
    font-family: 'GothamRoundedMedium';
    src: url('../../ressources/fonts/gothamrnd-medium.eot');
    src: url('../../ressources/fonts/gothamrnd-medium.eot') format('embedded-opentype'),
         url('../../ressources/fonts/gothamrnd-medium.woff') format('woff'),
         url('../../ressources/fonts/gothamrnd-medium.ttf') format('truetype'),
         url('../../ressources/fonts/gothamrnd-medium.svg#GothamRoundedMedium') format('svg');}


/*********************edition des entetes******************/
.header{/*edition de l'entête1*/
    display: flex;
    position: bottom ;
    top: 0px;
    }
.imglogo{
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 7%;
    width: 13%;
    height: 25%;}
#titre{
    font-weight:bold;
    color: white;
    font-size:40px;
    text-align: center;
    margin-top: 6px;
    text-shadow:1px 1px 1px black;
}
#note{
    color: white;
    font-size: 20px;
    text-align: center;
    margin: 7px;
    text-shadow:1px 1px 1px black;
}
ol{
    font-size: 20px;
    text-align: left;
   
    margin-left: 25%;
}
li{
    font-weight:bold;
}

.lien{
    margin: 7px;
}
a{
    background-color: transparent;
    text-decoration: none;
    margin-left: 10px;
}
.icon-barbtn{
    display:inline-table;
    background-color: #21301ae7;
    color: white;
    padding: 5px;
    width: fit-content;
    font-size: 16px;
    /*border: solid 1px #be1d2d;*/
    border-radius: 10px;
}
.arrow {
    border: solid black;
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 3px;
    margin-left: 10px;
    margin-right: 10px;
  }
  
.right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
  }
.left {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
  }
.form {
    width:600px;
    padding: 30px;
    color: #000000;
    border: 1px solid #f1f1f1;
    background: #ffffff7e;
    box-shadow: 0 0 20px 0 #be1d2d, 0 0 20px 0 #000000;
    margin-left: auto;
    margin-right: auto;
}