@font-face {
font-family: arixelles;
src: url("../../font/fondamentalschool/arixelles.otf") format("opentype");
}

@charset "utf-8";
html {
  font: 90%/1.4 'arixelles', Helvetica, Arial, Verdana, sans-serif;
  margin: 0;
  padding: 0;
}

body {
  font: 90%/1.4 'arixelles', Helvetica, Arial, Verdana, sans-serif;
  margin: 0;
  padding: 0;
  color: #000;
  background: url(../../img/fondamentalschool/bg.jpg) no-repeat center top fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  body {
    font: 80%/1.4 'arixelles', Helvetica, Arial, Verdana, sans-serif;
  }
}

.lignes_obliques_haut {
  background: url(../../img/fondamentalschool/bg_top.png) top repeat-x fixed;
  z-index:0;
  width:100%;
  height:540px;
  position:fixed;
  top : 0;
}

.libelle {
  height:24px;
  clear:both;
}

.lignes_obliques_bas {
  background: url(../../img/fondamentalschool/bg_bottom.png) bottom repeat-x fixed;
  z-index:0;
  width:100%;
  height:540px;
  position:fixed;
  bottom : 0;
}
tr.border_bottom td {
  border-bottom:1pt solid black;
}
/* ~~ Sélecteurs d'éléments/balises ~~ */
ul, ol, dl {
  padding: 0;
  margin: 0;
}
.content ul, .content ol {
  padding: 0 15px 15px 40px; /* cette marge intérieure reflète la marge intérieure droite dans les en-têtes et la règle de paragraphe ci-dessus. Une marge intérieure a été placée en bas, afin d'assurer un espace entre les autres éléments des listes, et à gauche pour créer le retrait. Vous pouvez les régler comme bon vous semble. */
}

h1, h2, h3, h4, h5, h6, p {
  margin-top: 0;
  padding-right: 15px;
  padding-left: 15px;
  font-weight:500;
  font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}
h1 {
  font-size:175%;
}
h2 {
  font-size:130%;
}

.gallerie img{
  width: 100%;
}
a{
  color:#000;
}

a img {
  border: none;
}

a:link {
  text-decoration: none;
}
a:visited {
  text-decoration: none;
}
a:hover, a:active, a:focus {
  text-decoration: none;
}

/* ~~ CONTENEURS ~~ */

/* ~~ Pied de page ~~ */
.footer {
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
  display:block;
  font-size:11px;
  clear: both;
}

/* ~~ Principaux ~~ */
table {
  border-spacing:0px;
}

.contentcontainer {
  width: 95%;
  max-width: 1300px;
  min-width: 780px;
  background: url(../../img/fondamentalschool/bg_whitepixel.png) repeat scroll;
  height:700px;
  margin: 0 auto auto auto;
  display:block;
  position:fixed;
  padding-bottom: 100px;
}
.voileBlanc {
  background: url(../../img/fondamentalschool/bg_whitepixel.png) repeat;
  color:#000000 !important;
}
.container {
  width: 95%;
  max-width: 1300px;
  min-width: 780px;
  margin: 0 auto 0 auto;
  position:relative;
}

.header {
  position:relative;
}

.content {
  padding: 10px 0px 120px 0px;
  width: 100%;
  float: left;
  position: relative;
}

.centerbar {
  float: left;
  width: 25%;
  padding-bottom: 10px;
}
.centerbar2 {
  float: left;
  width: 20%;
  padding-bottom: 10px;
}
.contentobject {
  margin:5px 5px 5px 5px;
  min-height:450px;
  position:relative;
}

.contentobject img {
  position:absolute;
  width:100%;
  -webkit-filter: brightness(100%);
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  -ms-transition: all 0.5s ease;
  transition: all 0.5s ease;
  border-radius: 39px;
}

.contentobject img:hover {
    -webkit-filter: brightness(120%);
}

.contentobject p {
  position:absolute;
}

.bloc {
  display:block;
  width:150px;
/*  height:50px;*/
  color:#FFF;
}

.bloctitre {
  display:block;
  width:25%;
  height:35px;
  color:#FFF;
  padding:0px;
  margin: 0;
}

.blocmenu {
  display:block;
  height:35px;
  padding:0px;
  margin:0;
}

.rowtable {
  height:30px;
  line-height:30px;
  padding:0;
  margin:0;
}

.blocicon {
  width:30px;
  height:30px;
  border:0px solid #555;
  margin:5px;
  cursor:pointer;
  background-color:#555;
  background-position:center center;
  background-repeat:no-repeat;
  background-size:auto 15px;
  float:right;
}

.bloctelephone {
  width:200px;
  height:30px;
  line-height:30px;
  border:0px solid #555;
  margin:5px;
  float:right;
  font-size:20px;
  font-weight:900;
  color:#111;
  text-align:right;
}

.facebook {
  background-image:url(../../img/fondamentalschool/facebook.png);
}

.home {
  background-image:url(../../img/fondamentalschool/home.png);
}

.grand {
  font-size:180%;
  font-weight:200;
  font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.moyen {
  font-size:150%;
  font-weight:400;
  font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.normalmoyen {
  font-size:110%;
  font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.normal {
  font-size:100%;
  font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.normalpetit {
  font-size:90%;
  font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.petit {
  font-size:75%;
  font-family: 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.gras {
  font-weight:700;
}

.espace {
  padding-top:10px;
  padding-bottom:5px;
}

.espaceexterieur {
  margin:2px;
}

.espaceexterieurgrand {
/*  height:70px;*/
  padding-top: 15px;
  padding-bottom: 15px;
}

.espaceseparateur {
  margin:2px;
}

.bloc a {
  color:#FFF;
  text-align:right;
}

.blanc {
  background-color:#FFFFFF;
  color:#000000;
}

.beigeclair {
  background-color:#F5F5DC;
}

.beige {
  background-color:#C8AD7F;
}
.grisclair {
  background-color:#EEEEEE;
}

.gris {
  background-color:#AAAAAA;
}

.grisfonce {
  background-color:#555555;
  color:#FFFFFF !important;
}

.vert {
  background-color:#56aa22;
}

.bleu {
  background-color:#4395e8;
}

.mauve {
  background-color:#9966cc;
}

.jaune {
  background-color:#ffcd1c;
}

.rouge {
  background-color:#ff3a1c;
}

.blocMauve {
  right:-2px;
  top: 537px;
  margin-top:0%;
  width: 226px !important;
  /* text-align: right; */
}

.blocBleu {
  right:-50px;
  margin-top:215%;
}

.blocRouge {
  width: 50%;
  right: 125px;
}

.droiteHaut {
  margin-left:105px;
  width:70%;
}

.droite {
  margin-left:150px;
  width:70%;
}

.gauche {
  margin-left:15px;
  text-align:left;
}

.dedans {
  right:0px;
  top:20px;
  width:70%;
}

.bas {
  margin-top:240%;
}

/* ~~ MENU ~~ */
#menu {
    margin: 70px auto 0 auto;
    padding-left: 15px;
    padding-right: 0px;
  list-style-type: none;
  height:30px;
  text-align: justify;
  font-weight: 500;
  font-size: 90%;
  float:right;
  z-index:10;
}

#menu:after {
    display: inline-block;
}

#menu li {
  display: inline;
    position: relative;
  border:1px !important;
  border-bottom:0px;
  padding:15px;
  transition: all 0.5s ease;
}

#menu li .submenu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    min-width: 240px;
    margin: 0;
    padding: 0;
    list-style: none;
    background: #fff;
}

#menu li:hover {
  background:#ffcd1c;
  background-position:center top;
  background-repeat:no-repeat;
  border: 0px solid #e9b71a;
  border-bottom: 0px;
  cursor:pointer;
}

#menu li a {
  color:#363636;
  padding: 0px;
  text-decoration:none;
}

#menu li:hover > .submenu {
    display: block;
}

#menu li .submenu li {
    float: none;
    display: block;
    width: 100%;
    white-space: nowrap;
}

#menu li .submenu li a {
    display: block;
}

#menu li {
    position: relative;
}

#menu li.has-submenu > a {
    cursor: pointer;
}

#menu li .submenu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    margin: 0;
    padding: 0;
    min-width: 220px;
    list-style: none;
    background: #ffffff;
}

#menu li:hover > .submenu {
    display: block;
}

#menu li .submenu li {
    display: block;
    float: none;
    width: 100%;
    padding: 15px 0;
}

#menu li .submenu li a {
    display: block;
    white-space: nowrap;
    padding: 0 0 0 15px;
}

/* ~~~~ Menu vertical ~~~~*/

.menuvertical {
    padding: 0px;
  list-style-type: none;
  cursor:pointer;
  z-index:10;
}

.menuvertical:after {
    display: inline-block;
}

.menuvertical li {
  display : block;
  border:1px !important;
  border-bottom:0px;
  padding:15px;
  transition: all 0.5s ease;
}

.menuvertical li:hover {
  background:#CCCCCC;
  color:#FFF;
  background-position:center top;
  background-repeat:no-repeat;
  border: 0px solid #e9b71a;
  border-bottom: 0px;
}

.menuvertical li a {
  padding: 0px;
  text-decoration:none;
}

.menuvertical li:hover a {
  color:#FFF;
  padding: 0px;
  text-decoration:none;
}

.centreH {
    margin: 0 auto 0 auto;
  text-align: center;
}

.centreV {
    margin: auto 0 auto 0;
}

.bordtop {
  border-top: 1px solid #666;
}

.bordbottom {
  border-bottom: 1px solid #666;
}

/* ~~ Styles de liste de navigation (peuvent être supprimés si vous optez pour un menu de survol prédéfini tel que Spry) ~~ */
ul.nav {
  list-style: none; /* entraîne la suppression du marqueur de liste */
  border-top: 1px solid #666; /* crée la bordure supérieure des liens ; les autres sont placées à l'aide d'une bordure inférieure sur la balise LI */
  margin-bottom: 15px; /* crée l'espace entre la navigation et le contenu en dessous */
}
ul.nav li {
  border-bottom: 1px solid #666; /* crée la séparation des boutons */
}
ul.nav a, ul.nav a:visited { /* le regroupement de ces sélecteurs garantit que vos liens conservent leur apparence de bouton, même après avoir été activés */
  padding: 5px 5px 5px 15px;
  display: block; /* attribue au bloc de liens des propriétés qui lui font remplir toute la balise LI qui le contient. Force la zone entière à réagir à un clic de souris. */
  text-decoration: none;
  background: #8090AB;
  color: #000;
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* modifie la couleur de l'arrière-plan et du texte pour les navigateurs à la souris et au clavier. */
  background: #6F7D94;
  color: #FFF;
}

.center {
  text-align:center;
}

/* ~~ classes flottant/effacement diverses ~~ */
.fltrt {  /* cette classe peut servir à faire flotter un élément depuis la droite sur votre page. L'élément flottant doit précéder l'élément à côté duquel il doit apparaître sur la page. */
  float: right;
  margin-left: 8px;
}
.fltlft { /* cette classe peut servir à faire flotter un élément depuis la gauche sur votre page. L'élément flottant doit précéder l'élément à côté duquel il doit apparaître sur la page. */
  float: left;
  margin-right: 8px;
}
.clearfloat { /* cette classe peut être placée sur une div <br /> ou vide, en tant qu'élément final suivant la dernière div flottante (dans le #container) si le paramètre #footer est supprimé ou retiré du #container */
  clear:both;
  height:0;
  font-size: 1px;
  line-height: 0px;
}
.centpourcent{
  width:100%;
}

/* ~~ Formulaire ~~ */
input {
  padding:5px;
  margin:5px;
  border:0px;
  font-size:110%;
  font: 100%/1.4 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}
input[type=submit] {
  padding:5px;
  margin:5px;
  border:0px;
  font-size:110%;
  font: 100%/1.4 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

input#addresse {
  display:none;
}

progress {
  padding:0px;
  height:2px;
  width:100%;
  border:0px;
}

#holder { /*width:450px;*/ min-height:170px; padding-top:10px; padding-bottom:10px; padding-left:10px; margin-left:10px; font-size:70px; background:#eee; border:dashed 10px #ddd; color:#999999 }
#dropper.over { background:#ddd; border-color:pink; }
#dropper > div.help { padding:30px 0 0 30px; color:#aaa; font-size:80px; text-shadow:#ccc 1px 1px 2px; }
#dropper > div.help:not(:first-child) { display:none; }

input.files.hidn { position:absolute; visibility:hidden; }
#file-list > p { margin:5px 0; padding:3px; border:solid 5px lightblue; }

.files {
  padding: 30px 70px;
  background: lightblue;
  border-radius: 20%/50%;
}
.files.over {
  background: black;
  color: white;
}

/* ugh */
#dropper:after {
  clear: both;
  content: '.';
  display: block;
  font-size: 0px;
  height: 0px;
  line-height: 0;
  visibility: hidden;
}

textarea{
  width:500px;
  max-width:500px;
  height:150px;
  padding:5px;
  margin:5px;
  border:0px;
  font-size:110%;
  font: 100%/1.4 'arixelles',Verdana, Arial, Helvetica, sans-serif;
}

.error-message {
  color:#FF0000;
}

/* ~~ Calendrier ~~ */

.calender { padding:10px;}
.calender .year{ font-size:45px; float:left; width:210px;}
.inactive{ color:#888888; }
.active{ color:#ff3a1c; }
.calender .relative{ position:relative;}
.calender .months{}
.calender .month{ margin-top:12px;}
.calender .months ul{ list-style:none; margin:0px; padding:0px;}
.calender .months ul li a{ float:left; margin:-1px; padding:0px 15px 0px 0px; color:#888888; text-decoration:none; font-size:20px; font-weight:bold; text-transform:uppercase;}
.calender .months ul li a:hover, .months ul li a.active{ color:#ff3a1c;}
.calender table{ border-collapse:collapse;}
.calender table td{ border:1px solid #EEEEEE; background-color:#FFF; height:80px; width:70px;}
.calender table td.today{ border:2px solid #56aa22; height:80px;}
.calender table td.padding{ border:none;background: none;}
.calender table td.padding:hover{ border:none; background: none; cursor:default}
.calender table td:hover{ background:#DFDFDF; cursor:pointer;}
.calender table th{ font-weight:normal; color:#A8A8A8;}
.calender table td .day{ position:absolute; color:#000; bottom:-40px; right:5px;  font-weight:normal; font-size:24.3pt;}
.calender table td .weekday{ position:absolute; color:#BBBBBB; bottom:-40px; right:5px; font-weight:normal; font-size:24.3pt;}
.calender table td .events{ position:relative; width:70px; height:0px; margin:-39px 0px 0px; padding:0px;}
.calender table td .events li{ width:20px; height:20px; float:left; margin-left:1px; margin-top:1px; overflow:hidden; text-indent:-3000px;}
.type1{ background:#56aa22; }
.type2{ background:#ff7a00; }
.type3{ background:#4395e8; }
.type4{ background:#ffcd1c; }
.type5{ background:#F90505; }
.type6{ background:#555555; }
.type7{ background:#EEEEEE; }
.calender table td:hover .events{ position:absolute; right:20px; top:66px; width:30%; width-max:442px; list-style:none; margin:0px;}
.calender table td:hover .events li{ height:90px; font-weight:normal; border-bottom:0px solid #D6D6D6; text-indent:0; margin-right:20px; background:none; width:90%; max-width:442px; padding:5px;}

.calender table td:hover .events li.type1{ border-left:5px solid #56aa22; background:#FFF }
.calender table td:hover .events li.type2{ border-left:5px solid #ff7a00; background:#FFF }
.calender table td:hover .events li.type3{ border-left:5px solid #4395e8; background:#FFF }
.calender table td:hover .events li.type4{ border-left:5px solid #ffcd1c; background:#FFF }
.calender table td:hover .events li.type5{ border-left:5px solid #F90505; background:#FFF }
.calender table td:hover .events li.type6{ border-left:5px solid #555555; background:#FFF }
.calender table td:hover .events li.type7{ border-left:5px solid #EEEEEE; background:#FFF }

.calender table td:hover .events li:first-child{ border-top:0px solid #D6D6D6;}
.calender table td .daytitle{ display:none;}
.calender table td:hover .daytitle{ position:absolute; right:20px; top:21px; width:30%; width-max:442px; list-style:none; margin:0px; padding:0px; color:#56aa22; font-size:20px; display:block; font-weight:normal;}
.white-popup {
  position: relative;
  background: #FFF;
  padding: 20px;
  width:50%;
  min-width: 500px;
  max-width: 700px;
  margin: 15px auto;
  border: 1px #000 solid;
}
#popup_calendrier .relative{ display:none;}
#popup_calendrier .daytitle{ right:20px; top:21px; width-max:442px; list-style:none; margin:0px; margin-bottom:10px; padding:0px; color:#56aa22; font-size:20px; display:block; font-weight:normal;}
#popup_calendrier .events{ list-style:none; margin:0px;}
#popup_calendrier .events li{ font-weight:normal; border-bottom:1px solid #D6D6D6; text-indent:0; margin:5px; background:none; width:90%; max-width:442px; padding:5px;}
#popup_calendrier .events li.type1{ border-left:5px solid #56aa22; background:#FFF }
#popup_calendrier .events li.type2{ border-left:5px solid #ff7a00; background:#FFF }
#popup_calendrier .events li.type3{ border-left:5px solid #4395e8; background:#FFF }
#popup_calendrier .events li.type4{ border-left:5px solid #ffcd1c; background:#FFF }
#popup_calendrier .events li.type5{ border-left:5px solid #F90505; background:#FFF }
#popup_calendrier .events li.type6{ border-left:5px solid #555555; background:#FFF }
#popup_calendrier .events li.type7{ border-left:5px solid #EEEEEE; background:#FFF }
#popup_calendrier .events li:first-child{ border-top:0px solid #D6D6D6;}

.clear{ clear:both;}

.fs-hero { position:relative; overflow:hidden; border-radius:24px; min-height:200px; background-size:cover; background-position:center; color:#fff; }

/* ===== Responsive adjustments for fondamentalschool ===== */
@media screen and (max-width: 1100px) {
  .container,
  .contentcontainer {
    width: calc(100% - 24px);
    min-width: 0;
    max-width: none;
  }

  #menu {
    float: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 4px 0;
    width: 100%;
    height: auto;
    margin: 16px 0 0 0;
    padding: 0;
    text-align: right;
  }

  #menu li {
    display: block;
    padding: 10px 12px;
  }

  #menu li .submenu {
    min-width: 200px;
  }

  .bloctelephone {
    width: auto;
    margin: 5px 10px 5px 5px;
    font-size: 18px;
  }

  .blocicon {
    margin: 5px 5px 5px 0;
  }
}

@media screen and (max-width: 820px) {
  html,
  body {
    overflow-x: hidden;
  }

  .container,
  .contentcontainer {
    width: calc(100% - 16px);
    min-width: 0;
    max-width: none;
  }

  .contentcontainer {
    position: relative;
    height: auto;
    min-height: 75vh;
    padding-bottom: 24px;
  }

  .contentcontainer { display: none }

  .content {
    padding: 10px 0 24px 0;
    background-color: rgba(255,255,255,0.75);
    float: none;
  }

  .header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .bloctelephone {
    float: none;
    order: 2;
    width: auto;
    height: auto;
    margin: 0 0 6px auto;
    line-height: 1.2;
    font-size: 18px;
  }

  .blocicon {
    float: none;
    order: 3;
  }

  #menu {
    order: 4;
    float: none;
    justify-content: center;
    width: 100%;
    margin: 12px 0 0 0;
    text-align: center;
  }

  #menu li {
    padding: 8px 10px;
    font-size: 14px;
  }

  #menu li .submenu {
    position: static;
    display: none;
    min-width: 0;
    width: 100%;
    box-shadow: none;
    border-radius: 12px;
    margin-top: 6px;
    overflow: hidden;
  }

  #menu li:hover > .submenu,
  #menu li:focus-within > .submenu {
    display: block;
  }

  .footer {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: 16px;
  }

  .slideshow-wrapper {
    width: 100%;
  }

  .slideshow-wrapper .home-slideshow {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    width: 100%;
  }

  .slideshow-wrapper .centerbar2 {
    float: none;
    width: 50% !important;
    padding: 8px;
    box-sizing: border-box;
  }

  .slideshow-wrapper .contentobject {
    margin: 0 !important;
    min-height: 0;
    height: auto;
    aspect-ratio: 0.78;
    overflow: hidden;
    border-radius: 32px;
  }

  .slideshow-wrapper .contentobject img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 32px;
  }

  .slideshow-wrapper .contentobject p.bloc {
    position: absolute;
    top: 0 !important;
    bottom: auto !important;
    margin: 0 !important;
    width: auto !important;
    max-width: calc(100% - 16px);
    min-width: 110px;
    padding: 12px 20px;
    line-height: 1.1;
    font-size: 30px;
    z-index: 2;
  }

  .slideshow-wrapper .contentobject p.bloc.vert,
  .slideshow-wrapper .contentobject p.bloc.jaune {
    left: 0 !important;
    right: auto !important;
    border-radius: 0 32px 32px 32px !important;
    text-align: left;
  }

  .slideshow-wrapper .contentobject p.bloc.bleu,
  .slideshow-wrapper .contentobject p.bloc.rouge,
  .slideshow-wrapper .contentobject p.bloc.mauve {
    left: auto !important;
    right: 0 !important;
    border-radius: 32px 0 32px 32px !important;
    text-align: right;
  }

  .slideshow-wrapper .contentobject p.bloc.blocMauve {
    top: auto !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    max-width: 100%;
    min-width: 0;
    text-align: center;
    border-radius: 0 0 32px 32px !important;
  }
}

@media screen and (max-width: 560px) {
  .container,
  .contentcontainer {
    width: calc(100% - 12px);
  }

  .bloctelephone {
    font-size: 16px;
  }

  .blocicon {
    width: 26px;
    height: 26px;
    background-size: auto 13px;
  }

  #menu {
    justify-content: flex-start;
    gap: 0;
  }

  #menu li {
    width: 50%;
    box-sizing: border-box;
    padding: 8px 6px;
    text-align: center;
  }

  .slideshow-wrapper .centerbar2 {
    width: 50% !important;
    padding: 6px;
  }

  .slideshow-wrapper .contentobject {
    aspect-ratio: 0.74;
    border-radius: 26px;
  }

  .slideshow-wrapper .contentobject img {
    border-radius: 26px;
  }

  .slideshow-wrapper .contentobject p.bloc {
    min-width: 90px;
    max-width: calc(100% - 10px);
    padding: 10px 14px;
    font-size: 21px;
  }

  .slideshow-wrapper .contentobject p.bloc.vert,
  .slideshow-wrapper .contentobject p.bloc.jaune {
    border-radius: 0 26px 26px 26px !important;
  }

  .slideshow-wrapper .contentobject p.bloc.bleu,
  .slideshow-wrapper .contentobject p.bloc.rouge,
  .slideshow-wrapper .contentobject p.bloc.mauve {
    border-radius: 26px 0 26px 26px !important;
  }

  .slideshow-wrapper .contentobject p.bloc.blocMauve {
    border-radius: 0 0 26px 26px !important;
  }
}


.pt-20 { padding-top: 20px; }
.pb-20 { padding-bottom: 20px; }
.pt-40 { padding-top: 40px; }
.pb-40 { padding-bottom: 40px; }
.pt-60 { padding-top: 60px; }
.pb-60 { padding-bottom: 60px; }
.pt-100 { padding-top: 100px; }
.pb-100 { padding-bottom: 100px; }
.pt-200 { padding-top: 200px; }
.pb-200 { padding-bottom: 200px; }
.pt-300 { padding-top: 300px; }
.pb-300 { padding-bottom: 300px; }
.pt-400 { padding-top: 400px; }
.pb-400 { padding-bottom: 400px; }
.mt-60 { margin-top: 60px; }
.mb-60 { margin-bottom: 60px; }
.mt-40 { margin-top: 40px; }
.mb-40 { margin-bottom: 40px; }
.mt-20 { margin-top: 20px; }
.mb-20 { margin-bottom: 20px; }
.mt-100 { margin-top: 100px; }
.mb-100 { margin-bottom: 100px; }
.mt-200 { margin-top: 200px; }
.mb-200 { margin-bottom: 200px; }
.mt-300 { margin-top: 300px; }
.mb-300 { margin-bottom: 300px; }