html {
  scroll-behavior: smooth;
}

body {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: "Open Sans", sans-serif;
}

ul {
  list-style-type: none;
}

a {
  text-decoration: underline;
  color: inherit;
}
a img {
  max-width: 55px;
  transition: transform 0.05s ease-in;
}
a img:hover {
  transform: scale(1.1);
}
a.coach {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

a.newsShare {
  display: flex;
  align-items: center;
  text-decoration: none;
  transform: translateX(0);
  transition: transform 0.05s ease-in;
}
a.newsShare:hover {
  transform: translateX(2px);
}
a.newsShare img {
  max-width: 35px;
  margin-right: 15px;
}

a.inLink {
  text-decoration: underline;
  font-style: italic;
  color: black;
}

a.footerMentions {
  color: #f6a601;
}

::-moz-selection {
  background-color: #f6a601;
}

::selection {
  background-color: #f6a601;
}

abbr {
  cursor: help;
}

p {
  color: #222222;
  line-height: 2rem;
}

h2,
h3 {
  color: #222222;
}

h2 {
  font-size: 32px;
  border-radius: 2px;
}

h3 {
  font-size: 24px;
}

header .header__reseau {
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
  display: flex;
  justify-content: flex-end;
  background-color: #222222;
}
header .header__reseau ul {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 5px;
  margin-bottom: 5px;
}
header .header__reseau ul li {
  padding-left: 20px;
}
header .header__reseau ul li a {
  color: white;
}
header .header__reseau ul li .svgReseaux {
  display: flex;
  width: 24px;
  height: 24px;
}
header .header__logo {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 10px;
  padding-right: 10px;
  border-bottom: solid 2px grey;
}
header .header__logo img {
  cursor: pointer;
  width: 100px;
  height: 100px;
  max-width: 100px;
  max-height: 100px;
  margin-top: 10px;
  margin-bottom: 10px;
}
header .header__logo img:first-of-type:hover {
  -webkit-animation: animeLogo ease-in-out 0.3s;
  animation: animeLogo ease-in-out 0.3s;
}
header .header__logo #menu {
  display: none;
  width: 56px;
  height: 56px;
}
header .header__principalNavigation {
  padding-left: 10px;
  padding-right: 10px;
  z-index: 1;
  transform: scale3d();
}
header .header__principalNavigation ul {
  display: flex;
  padding: 0;
}
header .header__principalNavigation ul li {
  padding: 10px;
  border-radius: 2px;
  cursor: pointer;
  transition: all 0.05s ease-in;
}
header .header__principalNavigation ul li a {
  display: block;
  text-decoration: none;
}
header .header__principalNavigation ul li:hover {
  background-color: #f6a601;
  color: white;
  transition: all 0.05s ease-in;
}
header .header__principalNavigation ul li:hover a {
  color: white;
  transition: all 0.05s ease-in;
}
header .header__principalNavigation ul li:last-of-type,
header .header__principalNavigation ul li:last-of-type a {
  background-color: #f6a601;
  color: black;
}
header .header__principalNavigation ul li:last-of-type:hover,
header .header__principalNavigation ul li:last-of-type a:hover {
  color: black;
}
header .header__principalNavigation a {
  font-weight: 600;
  letter-spacing: 0.2rem;
  color: #222222;
  transition: all 0.05s ease-in;
}
header .header__principalNavigation a:hover {
  color: white;
  transition: all 0.05s ease-in;
}

.menuFixed {
  position: fixed;
  display: flex;
  justify-content: flex-end;
  width: 100%;
  padding: 0 !important;
  margin-right: 5px;
  background-color: rgba(255, 255, 255, 0.9);
  top: 0;
  z-index: 3;
  transform-origin: top;
  -webkit-animation: animateMenuSlow 0.3s backwards;
  animation: animateMenuSlow 0.3s backwards;
}

@-webkit-keyframes animateMenuSlow {
  0% {
    transform: scale3d(0, 0, 0);
  }
  100% {
    transform: scale3d(0, 1, 0);
  }
}
@keyframes animateMenuSlow {
  0% {
    transform: scale3d(0, 0, 0);
  }
  100% {
    transform: scale3d(0, 1, 0);
  }
}
.imageh1 {
  position: relative;
  background-repeat: no-repeat;
  min-height: 40vh;
}
.imageh1 h1 {
  font-family: "Roboto", sans-serif;
  font-size: 56px;
  color: white;
  position: absolute;
  margin: 0;
  margin-left: 10px;
  top: 50%;
  transform: translateY(-50%);
}
.imageh1 h1 span {
  color: #f6a601;
}

.accueil {
  background: url("../img/aslt76.jpg");
  background-size: cover;
  background-position: 50% 35%;
}

.sports {
  background: url("../img/images-sports.png");
  background-size: cover;
  background-position: 50% 60%;
}

.loisirs {
  background: url("../img/loisirs.jpg");
  background-size: cover;
  background-position: 50% 30%;
}

.contact {
  background: url("../img/contact.jpg");
  background-size: cover;
  background-position: 50% 15%;
}

.presse {
  background: url("../img/presse.jpg");
  background-size: cover;
  background-position: 50% 30%;
}

section.content {
  margin-top: 50px;
  margin-bottom: 50px;
  margin-left: 15%;
  margin-right: 15%;
}
section.content ul {
  line-height: 2rem;
}
section.content section.home {
  display: flex;
  justify-content: space-between;
}
section.content section.home article.association {
  max-width: 75%;
  margin-right: 50px;
}
section.content section.home article.association ul {
  line-height: 2rem;
}
section.content section.home article.association h3 {
  margin-top: 50px;
}
section.content section.home .hotNews {
  background-color: #f6a601;
  margin-top: 60px;
  padding-top: 5px;
  padding-left: 5px;
  padding-bottom: 5px;
  padding-right: 0px;
  width: 50%;
}
section.content section.home h4 {
  color: rgb(133, 20, 75);
}
section.content section.home section.actualites {
  display: flex;
  flex-direction: column;
}
section.content section.home article.nextEvent h2,
section.content section.home article.lastEvent h2,
section.content section.home article.news h2 {
  background-color: #f6a601;
  padding: 5px;
  font-size: 28px;
}
section.content section.home article.nextEvent h4,
section.content section.home article.lastEvent h4,
section.content section.home article.news h4 {
  color: rgb(133, 20, 75);
}

.hotNewsFigure {
  margin: auto;
  text-align: center;
}
.hotNewsFigure .hotNewsImg {
  width: 100%;
  margin: auto;
  max-width: 605px;
}

.separateur {
  width: 30%;
  height: 2px;
  background: linear-gradient(to left, rgba(246, 166, 1, 0), rgb(246, 166, 1));
}

.detailSport {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 50px;
}
.detailSport p {
  width: 65%;
}
.detailSport img {
  width: 30%;
  border-radius: 10px;
  box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0, 0, 0, 0);
}
.detailSport figure {
  text-align: center;
}
.detailSport figure img {
  margin: auto;
  width: 100%;
  border-radius: 10px;
}
.detailSport figure img.verticale {
  max-width: 50%;
}
.detailSport figure figcaption {
  text-align: center;
}

.openable {
  cursor: pointer;
}

.detailLoisirs {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
}

form {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 60%;
  margin: auto;
}
form input,
form textarea {
  padding: 15px;
  width: auto;
  border: solid 1px #222222;
}
form input:focus,
form textarea:focus {
  outline: solid 1px #f6a601;
  border-color: transparent;
}
form label {
  margin-top: 20px;
}
form span {
  display: block;
  color: darkred;
}
form input[type=submit] {
  width: 50%;
  margin: auto;
  margin-top: 20px;
  border: none;
  border-radius: 2px;
  padding: 20px;
  background-color: #f6a601;
  cursor: pointer;
  font-size: 1.05rem;
  transition: all 0.4s ease 0s;
}
form input[type=submit]:hover {
  background: #434343;
  color: white;
  letter-spacing: 2px;
  box-shadow: 5px 40px -10px rgba(0, 0, 0, 0.57);
  transition: all 0.4s ease 0s;
}

.h3Contact {
  margin-top: 50px;
}

.presseImgs {
  width: 100%;
  max-width: 1118px;
  display: flex;
  margin: 50px auto;
}
@media all and (min-width: 800px) {
  .presseImgs {
    max-width: 60%;
  }
}

embed {
  width: 100%;
  height: 1000px;
  margin: 50px auto;
}

.btnDon {
  margin: auto;
  margin-top: 50px;
  margin-bottom: 50px;
  text-align: center;
}

button[name=don] {
  background-color: #f6a601;
  text-transform: uppercase;
  padding: 20px;
  min-width: 250px;
  border-radius: 2px;
  display: inline-block;
  border: none;
  cursor: pointer;
  font-size: 1.01rem;
  transition: all 0.4s ease 0s;
  transition: all 0.05s ease-in;
}
button[name=don]:hover {
  background: #434343;
  color: white;
  letter-spacing: 2px;
  box-shadow: 5px 40px -10px rgba(0, 0, 0, 0.57);
  transition: all 0.4s ease 0s;
}

footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-height: 25vh;
  background-color: #222222;
  color: #f6a601;
}
footer a {
  text-decoration: none;
}
footer ul {
  display: flex;
  padding: 0;
}
footer ul li {
  padding: 10px;
}
footer ul li a img.svgReseaux {
  width: 24px;
  height: 24px;
}
footer section.footerInfo {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
footer section.footerInfo p {
  color: #f6a601;
}
footer section.footerInfo p a {
  text-decoration: none;
}
footer section.footerInfo div.oblique {
  width: 1px;
  height: 15px;
  background-color: #f6a601;
  margin-left: 5px;
  margin-right: 5px;
}
footer section.footerInfo p a {
  color: #f6a601;
}

.clip {
  display: flex;
  justify-content: center;
}
.clip video {
  width: 100%;
}

#upArrow {
  position: fixed;
  display: none;
  z-index: 3;
  right: 30px;
  bottom: 50px;
  width: 36px;
  height: 36px;
  border-radius: 25%;
}
#upArrow:hover {
  cursor: pointer;
  -webkit-animation: animeLogo ease-in-out 0.3s;
  animation: animeLogo ease-in-out 0.3s;
}

.barre {
  text-decoration: line-through;
}

@-webkit-keyframes animeLogo {
  0% {
    transform: scale(1);
  }
  10% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes animeLogo {
  0% {
    transform: scale(1);
  }
  10% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
@media all and (max-width: 1400px) {
  section.content {
    margin-left: 5%;
    margin-right: 5%;
  }
}
@media all and (max-width: 1100px) {
  .home,
  .detailSport {
    flex-direction: column;
  }
  .detailSport p,
  .detailSport img {
    width: 100%;
  }
  .detailSport img.verticale {
    max-width: 50%;
  }
}
@media all and (max-width: 800px) {
  .imageh1 h1 {
    font-size: 32px;
  }
  h2 {
    font-size: 24px;
  }
  h3 {
    font-size: 19px;
  }
  div.header__reseau {
    display: none;
  }
  header div.header__logo img {
    width: 75px;
    height: 75px;
  }
  header div.header__logo #menu {
    width: 40px;
    height: 40px;
  }
  div.header__principalNavigation ul {
    flex-direction: column;
    display: none;
  }
  section.content section.home article.association {
    max-width: 100%;
    margin-right: 0;
  }
  section.content section.home article.association h2.hotNews {
    width: auto;
  }
  section.content section.home section.actualites {
    margin-left: 0;
  }
  form {
    width: 80%;
  }
}
@media all and (max-width: 500px) {
  embed {
    width: 100%;
    height: 300px;
  }
  audio {
    max-width: 260px;
  }
  form {
    width: 100%;
  }
  footer section.footerInfo {
    flex-direction: column;
  }
  footer section.footerInfo .oblique {
    display: none;
  }
}
@media all and (max-width: 400px) {
  audio {
    max-width: 100%;
  }
  fieldset form {
    margin: 0;
  }
  figure {
    margin: 0;
  }
  section.detailSport img {
    padding: 0;
    border: none;
  }
  section.detailSport img.verticale {
    max-width: 100%;
  }
  button[name=don] {
    padding: 15px;
    min-width: 100px;
    margin: auto;
    font-size: 1.05rem;
    letter-spacing: 0.2rem;
    text-transform: capitalize;
  }
}
@media all and (max-width: 300px) {
  fieldset form {
    max-width: 200px;
  }
  fieldset form input[type=submit] {
    font-size: 0.8rem;
  }
}
@media all and (min-width: 801px) and (max-width: 1100px) {
  section.content section.home article.association {
    max-width: 100%;
  }
  section.content section.home article.association h2.hotNews {
    width: 100%;
  }
  section.content section.home section.actualites {
    margin-left: 0;
  }
}

/*# sourceMappingURL=style-26-04-2022.css.map */