/*

Project : Pierfrancesco
Author  : Marine Bléhaut
Version : v.1.0.0
Date    : 12/30/2018

*/
@font-face {
    font-family: 'RobotoCondensed-Bold';
    src: url('RobotoCondensed-Bold.eot?#iefix') format('embedded-opentype'),  
        url('../fonts/RobotoCondensed-Bold/RobotoCondensed-Bold.woff') format('woff'), 
        url('../fonts/RobotoCondensed-Bold/RobotoCondensed-Bold.ttf')  format('truetype'), 
        url('../fonts/RobotoCondensed-Bold/RobotoCondensed-Bold.svg#RobotoCondensed-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'RobotoCondensed-Light';
    src: url('../fonts/RobotoCondensed-Light/RobotoCondensed-Light.eot?#iefix') format('embedded-opentype'),  
        url('../fonts/RobotoCondensed-Light/RobotoCondensed-Light.woff') format('woff'), 
        url('../fonts/RobotoCondensed-Light/RobotoCondensed-Light.ttf')  format('truetype'), 
        url('../fonts/RobotoCondensed-Light/RobotoCondensed-Light.svg#RobotoCondensed-Light') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'RobotoCondensed-Regular';
    src: url('../fonts/RobotoCondensed-Regular/RobotoCondensed-Regular.eot?#iefix') format('embedded-opentype'),  
        url('../fonts/RobotoCondensed-Regular/RobotoCondensed-Regular.woff') format('woff'), 
        url('../fonts/RobotoCondensed-Regular/RobotoCondensed-Regular.ttf')  format('truetype'), 
        url('../fonts/RobotoCondensed-Regular/RobotoCondensed-Regular.svg#RobotoCondensed-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Overpass-Thin';
    src: url('../fonts/Overpass/Overpass-Thin.eot?#iefix') format('embedded-opentype'),  
        url('../fonts/Overpass/Overpass-Thin.woff') format('woff'), 
        url('../fonts/Overpass/Overpass-Thin.ttf')  format('truetype'), 
        url('../fonts/Overpass/Overpass-Thin.svg#Overpass-Thin') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Overpass-Bold';
    src: url('../fonts/Overpass/Overpass-Bold.eot?#iefix') format('embedded-opentype'),  
        url('../fonts/Overpass/Overpass-Bold.woff') format('woff'), 
        url('../fonts/Overpass/Overpass-Bold.ttf')  format('truetype'), 
        url('../fonts/Overpass/Overpass-Bold.svg#Overpass-Thin') format('svg');
    font-weight: normal;
    font-style: normal;
}



@font-face {
    font-family: 'Montserrat-ExtraLight';
    src: url('../fonts/Montserrat/Montserrat-ExtraLight.eot?#iefix') format('embedded-opentype'),  
        url('../fonts/Montserrat/Montserrat-ExtraLight.woff') format('woff'), 
        url('../fonts/Montserrat/Montserrat-ExtraLight.ttf')  format('truetype'), 
        url('../fonts/Montserrat/Montserrat-ExtraLight.svg#Overpass-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Montserrat-Light';
    src: url('../fonts/Montserrat/Montserrat-Light.eot?#iefix') format('embedded-opentype'),  
        url('../fonts/Montserrat/Montserrat-Light.woff') format('woff'), 
        url('../fonts/Montserrat/Montserrat-Light.ttf')  format('truetype'), 
        url('../fonts/Montserrat/Montserrat-Light.svg#Overpass-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Montserrat-Regular';
    src: url('../fonts/Montserrat/Montserrat-Regular.eot?#iefix') format('embedded-opentype'),  
        url('../fonts/Montserrat/Montserrat-Regular.woff') format('woff'), 
        url('../fonts/Montserrat/Montserrat-Regular.ttf')  format('truetype'), 
        url('../fonts/Montserrat/Montserrat-Regular.svg#Overpass-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PlayfairDisplay-Regular';
    src: url('../fonts/Playfair_Display/PlayfairDisplay-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PlayfairDisplay-Bold';
    src: url('../fonts/Playfair_Display/PlayfairDisplay-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'PlayfairDisplay-Black';
    src: url('../fonts/Playfair_Display/PlayfairDisplay-Black.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face { 
	
	font-family: 'SourceSansPro-Light';
    src: url('../fonts/Source_Sans_Pro/SourceSansPro-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
/*--------------------------------------------*/
/* GLOBAL */
/*--------------------------------------------*/

html {
    box-sizing: border-box;
    font-size: 100%;
	scroll-behavior: smooth;
}
*, *:before, *:after {
    box-sizing: inherit;
}

body {
    font-family: 'SourceSansPro-Light';
    position: relative;
    font-size: 1em; /* soit 16px */
    line-height: 1.5;
    font-weight: 400;
    color: #76787c;
    background-color: #fff;
}

/* Typographie */
/*------------------------*/
h1, .h1-like,
h2, .h2-like,
h3, .h3-like,
h4, .h4-like,
h5, .h5-like,
h6, .h6-like {
    font-weight: 200;
    color: #1c1f26;
    line-height: 1.5;
    margin: 0 0 0.625em 0;
}

h1, .h1-like {
    font-size: 1em;
	font-family: 'PlayfairDisplay-Regular';
}

h2, .h2-like {
    font-size: 1.2em;
    font-family: 'PlayfairDisplay-Regular';
    color:#06313D ;
}
h3, .h3-like {
    font-size: 1.8em;
    font-family: 'PlayfairDisplay-Regular';
}
h4, .h4-like {
    font-size: 1.25em;
	font-family: 'Overpass-Thin';
	font-weight:900;
}
h5, .h5-like {
    font-size: 1.125em;
	 font-family: 'Overpass-Thin';
}
h6, .h6-like {
    font-size: 1.1em;
	
}
p, .p-like {
    margin: 0 0 0.725em 0;
    color:#282828;
    font-family: 'SourceSansPro-Light';
    font-size: 1.1em;
}

.bold{
	font-weight:900;
}

/* singlep */
/*------------------------*/

.h_single h1 {
    font-size: 1.3em !important;
	font-family: 'PlayfairDisplay-Regular';
}

.h_single h2 {
    font-size: 1.6em !important;
    font-family: 'PlayfairDisplay-Regular';
    color:#06313D ;
}
.h_single h3 {
    font-size: 1.2em !important;
    font-family: 'PlayfairDisplay-Regular';
}
 .h_single h4 {
    font-size: 1.25em !important;
	 font-family: 'Overpass-Thin';
}
.single_p p{
    margin: 0 0 0.725em 0;
    color:#282828;
    font-family: 'SourceSansPro-Light';
    font-size: 1.1em !important;
}

ul{margin: 0 0 0.785em 0;
    color: #282828;
    font-family: 'SourceSansPro-Light';
    font-size: 1.1em;}

/* links */
/*------------------------*/

a {
    color: #343e84;
    font-family: 'SourceSansPro-Light';
    font-weight: 900;
	text-decoration:none !important;
}


/* table */
/*---------------------------*/
table {
    width: 100%;
    margin: 0.625em 0;
    table-layout: fixed;
    border-collapse: collapse;
}
tr,
td,
th {
    vertical-align: middle;
}
thead th {
    padding: 0.625em 0;
    border-bottom: 2px solid #c1c1c4;
    text-align: left;
    font-weight: 700;
}
tbody td {
    padding: 0.625em;
    border-bottom: 1px solid #c1c1c4;
}
tbody tr:nth-child(even) {
    background: #E7E7E7;
}


/* Forms */
/* -----------------------------------------------------*/
form ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
input,
label,
select {
    display: block;
    font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif;
    font-size: 1em;
}

label {
    margin-bottom: .35938em;
    font-weight: 700;
    cursor: pointer;
}

label.required:after {
    content: " *";
}

textarea,
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="month"],
input[type="time"],
input[type="week"],
select[multiple="multiple"] {
    box-sizing: border-box;
    width: 100%;
    margin-bottom: .71875em;
    padding: .625em;
    border: 1px solid #32373ca3;
    border-radius: 20px;
    font-family: "HelveticaNeue-Light","Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif;
    font-size: 1em;
    background-color: #fff;
    box-shadow: none;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

textarea:hover,
input[type="email"]:hover,
input[type="number"]:hover,
input[type="password"]:hover,
input[type="search"]:hover,
input[type="tel"]:hover,
input[type="text"]:hover,
input[type="url"]:hover,
input[type="color"]:hover,
input[type="date"]:hover,
input[type="datetime"]:hover,
input[type="datetime-local"]:hover,
input[type="month"]:hover,
input[type="time"]:hover,
input[type="week"]:hover,
select[multiple="multiple"]:hover {
    border-color: #ceced0;
}

textarea:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="url"]:focus,
input[type="color"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
select[multiple="multiple"]:focus {
    border-color: #D35F60;
    outline: none;
    box-shadow: 0 0 5px rgba(205,75,77,.7);
}

textarea {
    resize: vertical;
}

input[type="checkbox"],
input[type="radio"] {
    display: inline;
    margin-right: .71875em;
}

input[type="file"] {
    width: 100%;
    margin-bottom: .71875em;
    padding-bottom: .23958em;
}
input[type="submit"] {
    cursor: pointer;
}
select {
    width: auto;
    margin-bottom: .71875em;
    max-width: 100%;
}

fieldset {
    margin: 0 0 .71875em 0;
    padding: 1.4375em;
    border: 1px solid #e8e8e9;
    border-radius: 0;
    background: #fafafa;
}

::-webkit-input-placeholder {
    color: #c8c9ca;
}

:-moz-placeholder {
    color: #c8c9ca;
}

::-moz-placeholder {
    color: #c8c9ca;
}

:-ms-input-placeholder {
    color: #c8c9ca;
}
/*input[id="nom"], input[id="prenom"] {
    display: inline-block;
    width: 75%;
}
 label[for="nom"], label[for="prenom"] {
    display: inline-block;
    width: 20%;
}
*/
/* Grouping content */
/*------------------------*/

img,
audio,
video {
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}
audio {
    min-height: 35px;
}

figure {
    margin: 0;
}
/* browsehappy */
/*------------------------*/
.browsehappy {
    background-color: #5ab1ab;
    color: #324b4b;
    padding: 20px;
    margin: 20px 0;
    border:10px solid;
    text-align: center;
}
.browsehappy a {
    color: #fff;
    text-decoration: underline;
}
.browsehappy a:hover {
    color: #fff;
    text-decoration: none;
}

/* iframe responsive */
/*------------------------*/
.box-iframe {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}
.box-iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/* buttons */
/*------------------------*/
.btn {
    position: relative;
    display: inline-block;
    background-color: #fff;
    color: #0B4660;
   border: 1px solid #0B4660;
    border-radius: 20px;
    padding: 0 1.25em;
    line-height: 2.5;
    white-space: nowrap;
}

.btn-header {
    position: relative;
    display: inline-block;
	color: #fff;
	background-color: #d7d7d7a8;
    line-height: 2.5;
	  
    border-radius: 20px;
    padding: 0 1.25em;
    font-weight: 900;
    white-space: nowrap;
	  -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.btn-header:hover {
    position: relative;
    display: inline-block;
	color: #000!important;
	background-color:#fff;
    border-radius: 20px;
    padding: 0 1.25em;
    line-height: 2.5;
    white-space: nowrap;
}
.btn--small {
    font-size: 0.75em;
}
.btn--large {
    font-size: 1.5em;
}

.btn--secondary {
    color: #fff;
    background-color: #0B4660;
}

.btn--special {
	border: 2px solid #3d4b7df7;
    color: #3d4b7df7;
    font-weight: 900;
    font-size: 0.6em;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.btn--special:hover{
     background-color: #3d4b7df7 !important;
    color: #fff !important;
    border: 2px solid #3d4b7df7 !important;

}

.infopratiques {
	font-size:1.2em;
	font-family: 'Overpass-Thin';
    font-weight: 900;
    text-transform: uppercase;
 
    border-radius: 20px;
    padding: 5px;
    text-align:center;

}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: red;
  color: white;
  background-color:#495673;
  border: 1px solid #000;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#myBtn:hover {
  background-color: #495673;
}
#contact {
     -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    
}

/*--------------------------------------------*/
/* POLICE */
/*--------------------------------------------*/

.font-light {
    color:#fff !important;
}

/*--------------------------------------------*/
/* GRID CSS */
/*--------------------------------------------*/

.grid:before,
.grid:after {
    display: block;
    content: '';
    clear: both;
}


.grid {
    margin-left: -10px;
    margin-right: -10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}

.grid-container {
  display: grid;
  
  grid-template-rows:  200px;

  background-color: #2196F3;
  padding: 10px;
}

[class*="col-"] {
    width: 100%;
}
.grid [class*="col-"] {

    float: left;
    padding-left: 10px;
    padding-right: 10px;
}
.col-m-1 {
    width: 8.333%;
}
.col-m-2 {
    width: 16.667%;
}
.col-m-3 {
    width: 25%;
}
.col-m-4 {
    width: 33.333%;
}
.col-m-5 {
    width: 41.667%;
}
.col-m-6 {
    width: 50%;
}
.col-m-7 {
    width: 58.333%;
}
.col-m-8 {
    width: 66.667%;
}
.col-m-9 {
    width: 75%;
}
.col-m-10 {
    width: 83.333%;
}
.col-m-11 {
    width: 91.667%;
}
.col-m-12 {
    width: 100%;
}


.order-m-1 {
    order: 1;
}
.order-m-2 {
    order: 2;
}
.order-m-3 {
    order: 3;
}
.order-m-4 {
    order: 4;
}
.order-m-5 {
    order: 5;
}
.order-m-6 {
    order: 6;
}
.order-m-7 {
    order: 7;
}
.order-m-8 {
    order: 8;
}
.order-m-9 {
    order: 9;
}
.order-m-10 {
    order: 10;
}
.order-m-11 {
    order: 11;
}
.order-m-12 {
    order: 12;
}

@media (max-width: 481px) {
.offset-m-1 {
    margin-left: 8.333%;
}
.offset-m-2 {
    margin-left: 16.667%;
}
.offset-m-3 {
    margin-left: 25%;
}
.offset-m-4 {
    margin-left: 33.333%;
}
.offset-m-5 {
    margin-left: 41.667%;
}
.offset-m-6 {
    margin-left: 50%;
}
.offset-m-7 {
    margin-left: 58.333%;
}
.offset-m-8 {
    margin-left: 66.667%;
}
.offset-m-9 {
    margin-left: 75%;
}
.offset-m-10 {
    margin-left: 83.333%;
}
.offset-m-11 {
    margin-left: 91.667%;
}
.offset-m-12 {
    margin-left: 100%;
}
}

/* grid tablet view */
@media (min-width: 481px) {
    .col-t-1 {
        width: 8.333%;
    }
    .col-t-2 {
        width: 16.667%;
    }
    .col-t-3 {
        width: 25%;
    }
    .col-t-4 {
        width: 33.333%;
    }
    .col-t-5 {
        width: 41.667%;
    }
    .col-t-6 {
        width: 50%;
    }
    .col-t-7 {
        width: 58.333%;
    }
    .col-t-8 {
        width: 66.667%;
    }
    .col-t-9 {
        width: 75%;
    }
    .col-t-10 {
        width: 83.333%;
    }
    .col-t-11 {
        width: 91.667%;
    }
    .col-t-12 {
        width: 100%;
    }



    .order-t-1 {
        order: 1;
    }
    .order-t-2 {
        order: 2;
    }
    .order-t-3 {
        order: 3;
    }
    .order-t-4 {
        order: 4;
    }
    .order-t-5 {
        order: 5;
    }
    .order-t-6 {
        order: 6;
    }
    .order-t-7 {
        order: 7;
    }
    .order-t-8 {
        order: 8;
    }
    .order-t-9 {
        order: 9;
    }
    .order-t-10 {
        order: 10;
    }
    .order-t-11 {
        order: 11;
    }
    .order-t-12 {
        order: 12;
    }



    .offset-t-1 {
        margin-left: 8.333%;
    }
    .offset-t-2 {
        margin-left: 16.667%;
    }
    .offset-t-3 {
        margin-left: 25%;
    }
    .offset-t-4 {
        margin-left: 33.333%;
    }
    .offset-t-5 {
        margin-left: 41.667%;
    }
    .offset-t-6 {
        margin-left: 50%;
    }
    .offset-t-7 {
        margin-left: 58.333%;
    }
    .offset-t-8 {
        margin-left: 66.667%;
    }
    .offset-t-9 {
        margin-left: 75%;
    }
    .offset-t-10 {
        margin-left: 83.333%;
    }
    .offset-t-11 {
        margin-left: 91.667%;
    }
    .offset-t-12 {
        margin-left: 100%;
    }

}/* end of grid tablet view */


/* grid desktop view */
@media (min-width: 769px) {
    .col-d-1 {
        width: 8.333%;
    }
    .col-d-2 {
        width: 16.667%;
    }
    .col-d-3 {
        width: 25%;
    }
    .col-d-4 {
        width: 33.333%;
    }
    .col-d-5 {
        width: 41.667%;
    }
    .col-d-6 {
        width: 50%;
    }
    .col-d-7 {
        width: 58.333%;
    }
    .col-d-8 {
        width: 66.667%;
    }
    .col-d-9 {
        width: 75%;
    }
    .col-d-10 {
        width: 83.333%;
    }
    .col-d-11 {
        width: 91.667%;
    }
    .col-d-12 {
        width: 100%;
    }


    .order-d-1 {
        order: 1;
    }
    .order-d-2 {
        order: 2;
    }
    .order-d-3 {
        order: 3;
    }
    .order-d-4 {
        order: 4;
    }
    .order-d-5 {
        order: 5;
    }
    .order-d-6 {
        order: 6;
    }
    .order-d-7 {
        order: 7;
    }
    .order-d-8 {
        order: 8;
    }
    .order-d-9 {
        order: 9;
    }
    .order-d-10 {
        order: 10;
    }
    .order-d-11 {
        order: 11;
    }
    .order-d-12 {
        order: 12;
    }



    .offset-d-1 {
        margin-left: 8.333%;
    }
    .offset-d-2 {
        margin-left: 16.667%;
    }
    .offset-d-3 {
        margin-left: 25%;
    }
    .offset-d-4 {
        margin-left: 33.333%;
    }
    .offset-d-5 {
        margin-left: 41.667%;
    }
    .offset-d-6 {
        margin-left: 50%;
    }
    .offset-d-7 {
        margin-left: 58.333%;
    }
    .offset-d-8 {
        margin-left: 66.667%;
    }
    .offset-d-9 {
        margin-left: 75%;
    }
    .offset-d-10 {
        margin-left: 83.333%;
    }
    .offset-d-11 {
        margin-left: 91.667%;
    }
    .offset-d-12 {
        margin-left: 100%;
    }
}/* end of desktop tablet view */

/* 
/* helpers */
/*------------------------*/




.v-top {
    vertical-align: top;
}
.v-middle {
    vertical-align: middle;
}
.v-bottom {
    vertical-align: bottom;
}

.txt-right {
    text-align: right;
}

.txt-left {
    text-align: left;
}

.txt-center {
    text-align: center;
}


.txt-light {
    color: #fff;
}
.txt-medium {
    color: #ddd;
}
.txt-dark {
    color: #333;
}

.bg-light {
    background-color: #fff;
    padding-top: 0;
    padding-bottom: 0;
}
.bg-medium {
    background-color: #ecf5ff;
    padding-top: 0;
    padding-bottom: 0;
}
.bg-dark {
    background-color: #161b3ef7 !important;
    padding-top: 40px;
    padding-bottom: 40px;
}
.center-box {
    float: none!important;
    margin-left: auto!important;
    margin-right: auto!important;
    
}

.round-box {
    border-radius: 50%;
}
.round-box-mid{
	border-radius:30%;
}

.ul-clean {
    padding-left: 0;
    margin-top: 0;
    margin-bottom: 0;
    list-style-type: none;
}

.m-0 {
  margin: 0 !important;
}

.mt-0,
.my-0 {
  margin-top: 0 !important;
}

.mr-0,
.mx-0 {
  margin-right: 0 !important;
}

.mb-0,
.my-0 {
  margin-bottom: 0 !important;
}

.ml-0,
.mx-0 {
  margin-left: 0 !important;
}

.m-1 {
  margin: 0.25rem !important;
}

.mt-1,
.my-1 {
  margin-top: 0.25rem !important;
}

.mr-1,
.mx-1 {
  margin-right: 0.25rem !important;
}

.mb-1,
.my-1 {
  margin-bottom: 0.25rem !important;
}

.ml-1,
.mx-1 {
  margin-left: 0.25rem !important;
}

.m-2 {
  margin: 0.5rem !important;
}

.mt-2,
.my-2 {
  margin-top: 0.5rem !important;
}

.mr-2,
.mx-2 {
  margin-right: 0.5rem !important;
}

.mb-2,
.my-2 {
  margin-bottom: 0.5rem !important;
}

.ml-2,
.mx-2 {
  margin-left: 0.5rem !important;
}

.m-3 {
  margin: 1rem !important;
}

.mt-3,
.my-3 {
  margin-top: 1rem !important;
}

.mr-3,
.mx-3 {
  margin-right: 1rem !important;
}

.mb-3,
.my-3 {
  margin-bottom: 1rem !important;
}

.ml-3,
.mx-3 {
  margin-left: 1rem !important;
}

.m-4 {
  margin: 1.5rem !important;
}

.mt-4,
.my-4 {
  margin-top: 1.5rem !important;
}

.mr-4,
.mx-4 {
  margin-right: 1.5rem !important;
}

.mb-4,
.my-4 {
  margin-bottom: 1.5rem !important;
}

.ml-4,
.mx-4 {
  margin-left: 1.5rem !important;
}

.m-5 {
  margin: 3rem !important;
}

.mt-5,
.my-5 {
  margin-top: 3rem !important;
}

.mr-5,
.mx-5 {
  margin-right: 3rem !important;
}

.mb-5,
.my-5 {
  margin-bottom: 3rem !important;
}

.ml-5,
.mx-5 {
  margin-left: 3rem !important;
}

.p-0 {
  padding: 0 !important;
}

.pt-0,
.py-0 {
  padding-top: 0 !important;
}

.pr-0,
.px-0 {
  padding-right: 0 !important;
}

.pb-0,
.py-0 {
  padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
  padding-left: 0 !important;
}

.p-1 {
  padding: 0.25rem !important;
}

.pt-1,
.py-1 {
  padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
  padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
  padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
  padding-left: 0.25rem !important;
}

.p-2 {
  padding: 0.5rem !important;
}

.pt-2,
.py-2 {
  padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
  padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
  padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
  padding-left: 0.5rem !important;
}

.p-3 {
  padding: 1rem !important;
}

.pt-3,
.py-3 {
  padding-top: 1rem !important;
}

.pr-3,
.px-3 {
  padding-right: 1rem !important;
}

.pb-3,
.py-3 {
  padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
  padding-left: 1rem !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.pt-4,
.py-4 {
  padding-top: 1.5rem !important;
}

.pr-4,
.px-4 {
  padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
  padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
  padding-left: 1.5rem !important;
}

.p-5 {
  padding: 3rem !important;
}

.pt-5,
.py-5 {
  padding-top: 3rem !important;
}

.pr-5,
.px-5 {
  padding-right: 3rem !important;
}

.pb-5,
.py-5 {
  padding-bottom: 3rem !important;
}

.pl-5,
.px-5 {
  padding-left: 3rem !important;
}

.m-n1 {
  margin: -0.25rem !important;
}

.mt-n1,
.my-n1 {
  margin-top: -0.25rem !important;
}

.mr-n1,
.mx-n1 {
  margin-right: -0.25rem !important;
}

.mb-n1,
.my-n1 {
  margin-bottom: -0.25rem !important;
}

.ml-n1,
.mx-n1 {
  margin-left: -0.25rem !important;
}

.m-n2 {
  margin: -0.5rem !important;
}

.mt-n2,
.my-n2 {
  margin-top: -0.5rem !important;
}

.mr-n2,
.mx-n2 {
  margin-right: -0.5rem !important;
}

.mb-n2,
.my-n2 {
  margin-bottom: -0.5rem !important;
}

.ml-n2,
.mx-n2 {
  margin-left: -0.5rem !important;
}

.m-n3 {
  margin: -1rem !important;
}

.mt-n3,
.my-n3 {
  margin-top: -1rem !important;
}

.mr-n3,
.mx-n3 {
  margin-right: -1rem !important;
}

.mb-n3,
.my-n3 {
  margin-bottom: -1rem !important;
}

.ml-n3,
.mx-n3 {
  margin-left: -1rem !important;
}

.m-n4 {
  margin: -1.5rem !important;
}

.mt-n4,
.my-n4 {
  margin-top: -1.5rem !important;
}

.mr-n4,
.mx-n4 {
  margin-right: -1.5rem !important;
}

.mb-n4,
.my-n4 {
  margin-bottom: -1.5rem !important;
}

.ml-n4,
.mx-n4 {
  margin-left: -1.5rem !important;
}

.m-n5 {
  margin: -3rem !important;
}

.mt-n5,
.my-n5 {
  margin-top: -3rem !important;
}

.mr-n5,
.mx-n5 {
  margin-right: -3rem !important;
}

.mb-n5,
.my-n5 {
  margin-bottom: -3rem !important;
}

.ml-n5,
.mx-n5 {
  margin-left: -3rem !important;
}

.m-auto {
  margin: auto !important;
}

.mt-auto,
.my-auto {
  margin-top: auto !important;
}

.mr-auto,
.mx-auto {
  margin-right: auto !important;
}

.mb-auto,
.my-auto {
  margin-bottom: auto !important;
}

.ml-auto,
.mx-auto {
  margin-left: auto !important;
}

@media (min-width: 320px) {
  .m-xs-0 {
    margin: 0 !important;
  }
  .mt-xs-0,
  .my-xs-0 {
    margin-top: 0 !important;
  }
  .mr-xs-0,
  .mx-xs-0 {
    margin-right: 0 !important;
  }
  .mb-xs-0,
  .my-xs-0 {
    margin-bottom: 0 !important;
  }
  .ml-xs-0,
  .mx-xs-0 {
    margin-left: 0 !important;
  }
  .m-xs-1 {
    margin: 0.25rem !important;
  }
  .mt-xs-1,
  .my-xs-1 {
    margin-top: 0.25rem !important;
  }
  .mr-xs-1,
  .mx-xs-1 {
    margin-right: 0.25rem !important;
  }
  .mb-xs-1,
  .my-xs-1 {
    margin-bottom: 0.25rem !important;
  }
  .ml-xs-1,
  .mx-xs-1 {
    margin-left: 0.25rem !important;
  }
  .m-xs-2 {
    margin: 0.5rem !important;
  }
  .mt-xs-2,
  .my-xs-2 {
    margin-top: 0.5rem !important;
  }
  .mr-xs-2,
  .mx-xs-2 {
    margin-right: 0.5rem !important;
  }
  .mb-xs-2,
  .my-xs-2 {
    margin-bottom: 0.5rem !important;
  }
  .ml-xs-2,
  .mx-xs-2 {
    margin-left: 0.5rem !important;
  }
  .m-xs-3 {
    margin: 1rem !important;
  }
  .mt-xs-3,
  .my-xs-3 {
    margin-top: 1rem !important;
  }
  .mr-xs-3,
  .mx-xs-3 {
    margin-right: 1rem !important;
  }
  .mb-xs-3,
  .my-xs-3 {
    margin-bottom: 1rem !important;
  }
  .ml-xs-3,
  .mx-xs-3 {
    margin-left: 1rem !important;
  }
  .m-xs-4 {
    margin: 1.5rem !important;
  }
  .mt-xs-4,
  .my-xs-4 {
    margin-top: 1.5rem !important;
  }
  .mr-xs-4,
  .mx-xs-4 {
    margin-right: 1.5rem !important;
  }
  .mb-xs-4,
  .my-xs-4 {
    margin-bottom: 1.5rem !important;
  }
  .ml-xs-4,
  .mx-xs-4 {
    margin-left: 1.5rem !important;
  }
  .m-xs-5 {
    margin: 3rem !important;
  }
  .mt-xs-5,
  .my-xs5 {
    margin-top:3rem !important;
  }
  .mr-xs-5,
  .mx-xs-5 {
    margin-right: 3rem !important;
  }
  .mb-sm-5,
  .my-sm-5 {
    margin-bottom: 3rem !important;
  }
  .ml-xs-5,
  .mx-xs-5 {
    margin-left: 3rem !important;
  }
  .p-xs-0 {
    padding: 0 !important;
  }
  .pt-xs-0,
  .py-xs-0 {
    padding-top: 0 !important;
  }
  .pr-xs-0,
  .px-xs-0 {
    padding-right: 0 !important;
  }
  .pb-xs-0,
  .py-xs-0 {
    padding-bottom: 0 !important;
  }
  .pl-xs-0,
  .px-xs-0 {
    padding-left: 0 !important;
  }
  .p-xs-1 {
    padding: 0.25rem !important;
  }
  .pt-xs-1,
  .py-xs-1 {
    padding-top: 0.25rem !important;
  }
  .pr-xs-1,
  .px-xs-1 {
    padding-right: 0.25rem !important;
  }
  .pb-xs-1,
  .py-xs-1 {
    padding-bottom: 0.25rem !important;
  }
  .pl-xs-1,
  .px-xs-1 {
    padding-left: 0.25rem !important;
  }
  .p-xs-2 {
    padding: 0.5rem !important;
  }
  .pt-xs-2,
  .py-xs-2 {
    padding-top: 0.5rem !important;
  }
  .pr-xs-2,
  .px-xs-2 {
    padding-right: 0.5rem !important;
  }
  .pb-xs-2,
  .py-xs-2 {
    padding-bottom: 0.5rem !important;
  }
  .pl-xs-2,
  .px-xs-2 {
    padding-left: 0.5rem !important;
  }
  .p-xs-3 {
    padding: 1rem !important;
  }
  .pt-xs-3,
  .py-xs-3 {
    padding-top: 1rem !important;
  }
  .pr-xs-3,
  .px-xs-3 {
    padding-right: 1rem !important;
  }
  .pb-xs-3,
  .py-xs-3 {
    padding-bottom: 1rem !important;
  }
  .pl-xs-3,
  .px-sx-3 {
    padding-left: 1rem !important;
  }
  .p-xs-4 {
    padding: 1.5rem !important;
  }
  .pt-xs-4,
  .py-xs-4 {
    padding-top: 1.5rem !important;
  }
  .pr-xs-4,
  .px-xs-4 {
    padding-right: 1.5rem !important;
  }
  .pb-xs-4,
  .py-xs-4 {
    padding-bottom: 1.5rem !important;
  }
  .pl-xs-4,
  .px-xs-4 {
    padding-left: 1.5rem !important;
  }
  .p-xs-5 {
    padding: 3rem !important;
  }
  .pt-xs-5,
  .py-xs-5 {
    padding-top: 3rem !important;
  }
  .pr-xs-5,
  .px-xs-5 {
    padding-right: 3rem !important;
  }
  .pb-xs-5,
  .py-xs-5 {
    padding-bottom: 3rem !important;
  }
  .pl-xs-5,
  .px-xs-5 {
    padding-left: 3rem !important;
  }
  .m-xs-n1 {
    margin: -0.25rem !important;
  }
  .mt-xs-n1,
  .my-xs-n1 {
    margin-top: -0.25rem !important;
  }
  .mr-xs-n1,
  .mx-xs-n1 {
    margin-right: -0.25rem !important;
  }
  .mb-xs-n1,
  .my-xs-n1 {
    margin-bottom: -0.25rem !important;
  }
  .ml-xs-n1,
  .mx-xs-n1 {
    margin-left: -0.25rem !important;
  }
  .m-xs-n2 {
    margin: -0.5rem !important;
  }
  .mt-xs-n2,
  .my-xs-n2 {
    margin-top: -0.5rem !important;
  }
  .mr-xs-n2,
  .mx-xs-n2 {
    margin-right: -0.5rem !important;
  }
  .mb-xs-n2,
  .my-xs-n2 {
    margin-bottom: -0.5rem !important;
  }
  .ml-xs-n2,
  .mx-xs-n2 {
    margin-left: -0.5rem !important;
  }
  .m-xs-n3 {
    margin: -1rem !important;
  }
  .mt-xs-n3,
  .my-xs-n3 {
    margin-top: -1rem !important;
  }
  .mr-xs-n3,
  .mx-xs-n3 {
    margin-right: -1rem !important;
  }
  .mb-xs-n3,
  .my-xs-n3 {
    margin-bottom: -1rem !important;
  }
  .ml-xs-n3,
  .mx-xs-n3 {
    margin-left: -1rem !important;
  }
  .m-xs-n4 {
    margin: -1.5rem !important;
  }
  .mt-xs-n4,
  .my-xs-n4 {
    margin-top: -1.5rem !important;
  }
  .mr-xs-n4,
  .mx-xs-n4 {
    margin-right: -1.5rem !important;
  }
  .mb-xs-n4,
  .my-xs-n4 {
    margin-bottom: -1.5rem !important;
  }
  .ml-xs-n4,
  .mx-xs-n4 {
    margin-left: -1.5rem !important;
  }
  .m-xs-n5 {
    margin: -3rem !important;
  }
  .mt-xs-n5,
  .my-xs-n5 {
    margin-top: -3rem !important;
  }
  .mr-xs-n5,
  .mx-xs-n5 {
    margin-right: -3rem !important;
  }
  .mb-xs-n5,
  .my-xs-n5 {
    margin-bottom: -3rem !important;
  }
  .ml-xs-n5,
  .mx-xs-n5 {
    margin-left: -3rem !important;
  }
  .m-xs-auto {
    margin: auto !important;
  }
  .mt-xs-auto,
  .my-xs-auto {
    margin-top: auto !important;
  }
  .mr-xs-auto,
  .mx-xs-auto {
    margin-right: auto !important;
  }
  .mb-xs-auto,
  .my-xs-auto {
    margin-bottom: auto !important;
  }
  .ml-xs-auto,
  .mx-xs-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 576px) {
  .m-sm-0 {
    margin: 0 !important;
  }
  .mt-sm-0,
  .my-sm-0 {
    margin-top: 0 !important;
  }
  .mr-sm-0,
  .mx-sm-0 {
    margin-right: 0 !important;
  }
  .mb-sm-0,
  .my-sm-0 {
    margin-bottom: 0 !important;
  }
  .ml-sm-0,
  .mx-sm-0 {
    margin-left: 0 !important;
  }
  .m-sm-1 {
    margin: 0.25rem !important;
  }
  .mt-sm-1,
  .my-sm-1 {
    margin-top: 0.25rem !important;
  }
  .mr-sm-1,
  .mx-sm-1 {
    margin-right: 0.25rem !important;
  }
  .mb-sm-1,
  .my-sm-1 {
    margin-bottom: 0.25rem !important;
  }
  .ml-sm-1,
  .mx-sm-1 {
    margin-left: 0.25rem !important;
  }
  .m-sm-2 {
    margin: 0.5rem !important;
  }
  .mt-sm-2,
  .my-sm-2 {
    margin-top: 0.5rem !important;
  }
  .mr-sm-2,
  .mx-sm-2 {
    margin-right: 0.5rem !important;
  }
  .mb-sm-2,
  .my-sm-2 {
    margin-bottom: 0.5rem !important;
  }
  .ml-sm-2,
  .mx-sm-2 {
    margin-left: 0.5rem !important;
  }
  .m-sm-3 {
    margin: 1rem !important;
  }
  .mt-sm-3,
  .my-sm-3 {
    margin-top: 1rem !important;
  }
  .mr-sm-3,
  .mx-sm-3 {
    margin-right: 1rem !important;
  }
  .mb-sm-3,
  .my-sm-3 {
    margin-bottom: 1rem !important;
  }
  .ml-sm-3,
  .mx-sm-3 {
    margin-left: 1rem !important;
  }
  .m-sm-4 {
    margin: 1.5rem !important;
  }
  .mt-sm-4,
  .my-sm-4 {
    margin-top: 1.5rem !important;
  }
  .mr-sm-4,
  .mx-sm-4 {
    margin-right: 1.5rem !important;
  }
  .mb-sm-4,
  .my-sm-4 {
    margin-bottom: 1.5rem !important;
  }
  .ml-sm-4,
  .mx-sm-4 {
    margin-left: 1.5rem !important;
  }
  .m-sm-5 {
    margin: 3rem !important;
  }
  .mt-sm-5,
  .my-sm-5 {
    margin-top: 3rem !important;
  }
  .mr-sm-5,
  .mx-sm-5 {
    margin-right: 3rem !important;
  }
  .mb-sm-5,
  .my-sm-5 {
    margin-bottom: 3rem !important;
  }
  .ml-sm-5,
  .mx-sm-5 {
    margin-left: 3rem !important;
  }
  .p-sm-0 {
    padding: 0 !important;
  }
  .pt-sm-0,
  .py-sm-0 {
    padding-top: 0 !important;
  }
  .pr-sm-0,
  .px-sm-0 {
    padding-right: 0 !important;
  }
  .pb-sm-0,
  .py-sm-0 {
    padding-bottom: 0 !important;
  }
  .pl-sm-0,
  .px-sm-0 {
    padding-left: 0 !important;
  }
  .p-sm-1 {
    padding: 0.25rem !important;
  }
  .pt-sm-1,
  .py-sm-1 {
    padding-top: 0.25rem !important;
  }
  .pr-sm-1,
  .px-sm-1 {
    padding-right: 0.25rem !important;
  }
  .pb-sm-1,
  .py-sm-1 {
    padding-bottom: 0.25rem !important;
  }
  .pl-sm-1,
  .px-sm-1 {
    padding-left: 0.25rem !important;
  }
  .p-sm-2 {
    padding: 0.5rem !important;
  }
  .pt-sm-2,
  .py-sm-2 {
    padding-top: 0.5rem !important;
  }
  .pr-sm-2,
  .px-sm-2 {
    padding-right: 0.5rem !important;
  }
  .pb-sm-2,
  .py-sm-2 {
    padding-bottom: 0.5rem !important;
  }
  .pl-sm-2,
  .px-sm-2 {
    padding-left: 0.5rem !important;
  }
  .p-sm-3 {
    padding: 1rem !important;
  }
  .pt-sm-3,
  .py-sm-3 {
    padding-top: 1rem !important;
  }
  .pr-sm-3,
  .px-sm-3 {
    padding-right: 1rem !important;
  }
  .pb-sm-3,
  .py-sm-3 {
    padding-bottom: 1rem !important;
  }
  .pl-sm-3,
  .px-sm-3 {
    padding-left: 1rem !important;
  }
  .p-sm-4 {
    padding: 1.5rem !important;
  }
  .pt-sm-4,
  .py-sm-4 {
    padding-top: 1.5rem !important;
  }
  .pr-sm-4,
  .px-sm-4 {
    padding-right: 1.5rem !important;
  }
  .pb-sm-4,
  .py-sm-4 {
    padding-bottom: 1.5rem !important;
  }
  .pl-sm-4,
  .px-sm-4 {
    padding-left: 1.5rem !important;
  }
  .p-sm-5 {
    padding: 3rem !important;
  }
  .pt-sm-5,
  .py-sm-5 {
    padding-top: 3rem !important;
  }
  .pr-sm-5,
  .px-sm-5 {
    padding-right: 3rem !important;
  }
  .pb-sm-5,
  .py-sm-5 {
    padding-bottom: 3rem !important;
  }
  .pl-sm-5,
  .px-sm-5 {
    padding-left: 3rem !important;
  }
  .m-sm-n1 {
    margin: -0.25rem !important;
  }
  .mt-sm-n1,
  .my-sm-n1 {
    margin-top: -0.25rem !important;
  }
  .mr-sm-n1,
  .mx-sm-n1 {
    margin-right: -0.25rem !important;
  }
  .mb-sm-n1,
  .my-sm-n1 {
    margin-bottom: -0.25rem !important;
  }
  .ml-sm-n1,
  .mx-sm-n1 {
    margin-left: -0.25rem !important;
  }
  .m-sm-n2 {
    margin: -0.5rem !important;
  }
  .mt-sm-n2,
  .my-sm-n2 {
    margin-top: -0.5rem !important;
  }
  .mr-sm-n2,
  .mx-sm-n2 {
    margin-right: -0.5rem !important;
  }
  .mb-sm-n2,
  .my-sm-n2 {
    margin-bottom: -0.5rem !important;
  }
  .ml-sm-n2,
  .mx-sm-n2 {
    margin-left: -0.5rem !important;
  }
  .m-sm-n3 {
    margin: -1rem !important;
  }
  .mt-sm-n3,
  .my-sm-n3 {
    margin-top: -1rem !important;
  }
  .mr-sm-n3,
  .mx-sm-n3 {
    margin-right: -1rem !important;
  }
  .mb-sm-n3,
  .my-sm-n3 {
    margin-bottom: -1rem !important;
  }
  .ml-sm-n3,
  .mx-sm-n3 {
    margin-left: -1rem !important;
  }
  .m-sm-n4 {
    margin: -1.5rem !important;
  }
  .mt-sm-n4,
  .my-sm-n4 {
    margin-top: -1.5rem !important;
  }
  .mr-sm-n4,
  .mx-sm-n4 {
    margin-right: -1.5rem !important;
  }
  .mb-sm-n4,
  .my-sm-n4 {
    margin-bottom: -1.5rem !important;
  }
  .ml-sm-n4,
  .mx-sm-n4 {
    margin-left: -1.5rem !important;
  }
  .m-sm-n5 {
    margin: -3rem !important;
  }
  .mt-sm-n5,
  .my-sm-n5 {
    margin-top: -3rem !important;
  }
  .mr-sm-n5,
  .mx-sm-n5 {
    margin-right: -3rem !important;
  }
  .mb-sm-n5,
  .my-sm-n5 {
    margin-bottom: -3rem !important;
  }
  .ml-sm-n5,
  .mx-sm-n5 {
    margin-left: -3rem !important;
  }
  .m-sm-auto {
    margin: auto !important;
  }
  .mt-sm-auto,
  .my-sm-auto {
    margin-top: auto !important;
  }
  .mr-sm-auto,
  .mx-sm-auto {
    margin-right: auto !important;
  }
  .mb-sm-auto,
  .my-sm-auto {
    margin-bottom: auto !important;
  }
  .ml-sm-auto,
  .mx-sm-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 768px) {
  .m-md-0 {
    margin: 0 !important;
  }
  .mt-md-0,
  .my-md-0 {
    margin-top: 0 !important;
  }
  .mr-md-0,
  .mx-md-0 {
    margin-right: 0 !important;
  }
  .mb-md-0,
  .my-md-0 {
    margin-bottom: 0 !important;
  }
  .ml-md-0,
  .mx-md-0 {
    margin-left: 0 !important;
  }
  .m-md-1 {
    margin: 0.25rem !important;
  }
  .mt-md-1,
  .my-md-1 {
    margin-top: 0.25rem !important;
  }
  .mr-md-1,
  .mx-md-1 {
    margin-right: 0.25rem !important;
  }
  .mb-md-1,
  .my-md-1 {
    margin-bottom: 0.25rem !important;
  }
  .ml-md-1,
  .mx-md-1 {
    margin-left: 0.25rem !important;
  }
  .m-md-2 {
    margin: 0.5rem !important;
  }
  .mt-md-2,
  .my-md-2 {
    margin-top: 0.5rem !important;
  }
  .mr-md-2,
  .mx-md-2 {
    margin-right: 0.5rem !important;
  }
  .mb-md-2,
  .my-md-2 {
    margin-bottom: 0.5rem !important;
  }
  .ml-md-2,
  .mx-md-2 {
    margin-left: 0.5rem !important;
  }
  .m-md-3 {
    margin: 1rem !important;
  }
  .mt-md-3,
  .my-md-3 {
    margin-top: 1rem !important;
  }
  .mr-md-3,
  .mx-md-3 {
    margin-right: 1rem !important;
  }
  .mb-md-3,
  .my-md-3 {
    margin-bottom: 1rem !important;
  }
  .ml-md-3,
  .mx-md-3 {
    margin-left: 1rem !important;
  }
  .m-md-4 {
    margin: 1.5rem !important;
  }
  .mt-md-4,
  .my-md-4 {
    margin-top: 1.5rem !important;
  }
  .mr-md-4,
  .mx-md-4 {
    margin-right: 1.5rem !important;
  }
  .mb-md-4,
  .my-md-4 {
    margin-bottom: 1.5rem !important;
  }
  .ml-md-4,
  .mx-md-4 {
    margin-left: 1.5rem !important;
  }
  .m-md-5 {
    margin: 3rem !important;
  }
  .mt-md-5,
  .my-md-5 {
    margin-top: 3rem !important;
  }
  .mr-md-5,
  .mx-md-5 {
    margin-right: 3rem !important;
  }
  .mb-md-5,
  .my-md-5 {
    margin-bottom: 3rem !important;
  }
  .ml-md-5,
  .mx-md-5 {
    margin-left: 3rem !important;
  }
  .p-md-0 {
    padding: 0 !important;
  }
  .pt-md-0,
  .py-md-0 {
    padding-top: 0 !important;
  }
  .pr-md-0,
  .px-md-0 {
    padding-right: 0 !important;
  }
  .pb-md-0,
  .py-md-0 {
    padding-bottom: 0 !important;
  }
  .pl-md-0,
  .px-md-0 {
    padding-left: 0 !important;
  }
  .p-md-1 {
    padding: 0.25rem !important;
  }
  .pt-md-1,
  .py-md-1 {
    padding-top: 0.25rem !important;
  }
  .pr-md-1,
  .px-md-1 {
    padding-right: 0.25rem !important;
  }
  .pb-md-1,
  .py-md-1 {
    padding-bottom: 0.25rem !important;
  }
  .pl-md-1,
  .px-md-1 {
    padding-left: 0.25rem !important;
  }
  .p-md-2 {
    padding: 0.5rem !important;
  }
  .pt-md-2,
  .py-md-2 {
    padding-top: 0.5rem !important;
  }
  .pr-md-2,
  .px-md-2 {
    padding-right: 0.5rem !important;
  }
  .pb-md-2,
  .py-md-2 {
    padding-bottom: 0.5rem !important;
  }
  .pl-md-2,
  .px-md-2 {
    padding-left: 0.5rem !important;
  }
  .p-md-3 {
    padding: 1rem !important;
  }
  .pt-md-3,
  .py-md-3 {
    padding-top: 1rem !important;
  }
  .pr-md-3,
  .px-md-3 {
    padding-right: 1rem !important;
  }
  .pb-md-3,
  .py-md-3 {
    padding-bottom: 1rem !important;
  }
  .pl-md-3,
  .px-md-3 {
    padding-left: 1rem !important;
  }
  .p-md-4 {
    padding: 1.5rem !important;
  }
  .pt-md-4,
  .py-md-4 {
    padding-top: 1.5rem !important;
  }
  .pr-md-4,
  .px-md-4 {
    padding-right: 1.5rem !important;
  }
  .pb-md-4,
  .py-md-4 {
    padding-bottom: 1.5rem !important;
  }
  .pl-md-4,
  .px-md-4 {
    padding-left: 1.5rem !important;
  }
  .p-md-5 {
    padding: 3rem !important;
  }
  .pt-md-5,
  .py-md-5 {
    padding-top: 3rem !important;
  }
  .pr-md-5,
  .px-md-5 {
    padding-right: 3rem !important;
  }
  .pb-md-5,
  .py-md-5 {
    padding-bottom: 3rem !important;
  }
  .pl-md-5,
  .px-md-5 {
    padding-left: 3rem !important;
  }
  .m-md-n1 {
    margin: -0.25rem !important;
  }
  .mt-md-n1,
  .my-md-n1 {
    margin-top: -0.25rem !important;
  }
  .mr-md-n1,
  .mx-md-n1 {
    margin-right: -0.25rem !important;
  }
  .mb-md-n1,
  .my-md-n1 {
    margin-bottom: -0.25rem !important;
  }
  .ml-md-n1,
  .mx-md-n1 {
    margin-left: -0.25rem !important;
  }
  .m-md-n2 {
    margin: -0.5rem !important;
  }
  .mt-md-n2,
  .my-md-n2 {
    margin-top: -0.5rem !important;
  }
  .mr-md-n2,
  .mx-md-n2 {
    margin-right: -0.5rem !important;
  }
  .mb-md-n2,
  .my-md-n2 {
    margin-bottom: -0.5rem !important;
  }
  .ml-md-n2,
  .mx-md-n2 {
    margin-left: -0.5rem !important;
  }
  .m-md-n3 {
    margin: -1rem !important;
  }
  .mt-md-n3,
  .my-md-n3 {
    margin-top: -1rem !important;
  }
  .mr-md-n3,
  .mx-md-n3 {
    margin-right: -1rem !important;
  }
  .mb-md-n3,
  .my-md-n3 {
    margin-bottom: -1rem !important;
  }
  .ml-md-n3,
  .mx-md-n3 {
    margin-left: -1rem !important;
  }
  .m-md-n4 {
    margin: -1.5rem !important;
  }
  .mt-md-n4,
  .my-md-n4 {
    margin-top: -1.5rem !important;
  }
  .mr-md-n4,
  .mx-md-n4 {
    margin-right: -1.5rem !important;
  }
  .mb-md-n4,
  .my-md-n4 {
    margin-bottom: -1.5rem !important;
  }
  .ml-md-n4,
  .mx-md-n4 {
    margin-left: -1.5rem !important;
  }
  .m-md-n5 {
    margin: -3rem !important;
  }
  .mt-md-n5,
  .my-md-n5 {
    margin-top: -3rem !important;
  }
  .mr-md-n5,
  .mx-md-n5 {
    margin-right: -3rem !important;
  }
  .mb-md-n5,
  .my-md-n5 {
    margin-bottom: -3rem !important;
  }
  .ml-md-n5,
  .mx-md-n5 {
    margin-left: -3rem !important;
  }
  .m-md-auto {
    margin: auto !important;
  }
  .mt-md-auto,
  .my-md-auto {
    margin-top: auto !important;
  }
  .mr-md-auto,
  .mx-md-auto {
    margin-right: auto !important;
  }
  .mb-md-auto,
  .my-md-auto {
    margin-bottom: auto !important;
  }
  .ml-md-auto,
  .mx-md-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 992px) {
  .m-lg-0 {
    margin: 0 !important;
  }
  .mt-lg-0,
  .my-lg-0 {
    margin-top: 0 !important;
  }
  .mr-lg-0,
  .mx-lg-0 {
    margin-right: 0 !important;
  }
  .mb-lg-0,
  .my-lg-0 {
    margin-bottom: 0 !important;
  }
  .ml-lg-0,
  .mx-lg-0 {
    margin-left: 0 !important;
  }
  .m-lg-1 {
    margin: 0.25rem !important;
  }
  .mt-lg-1,
  .my-lg-1 {
    margin-top: 0.25rem !important;
  }
  .mr-lg-1,
  .mx-lg-1 {
    margin-right: 0.25rem !important;
  }
  .mb-lg-1,
  .my-lg-1 {
    margin-bottom: 0.25rem !important;
  }
  .ml-lg-1,
  .mx-lg-1 {
    margin-left: 0.25rem !important;
  }
  .m-lg-2 {
    margin: 0.5rem !important;
  }
  .mt-lg-2,
  .my-lg-2 {
    margin-top: 0.5rem !important;
  }
  .mr-lg-2,
  .mx-lg-2 {
    margin-right: 0.5rem !important;
  }
  .mb-lg-2,
  .my-lg-2 {
    margin-bottom: 0.5rem !important;
  }
  .ml-lg-2,
  .mx-lg-2 {
    margin-left: 0.5rem !important;
  }
  .m-lg-3 {
    margin: 1rem !important;
  }
  .mt-lg-3,
  .my-lg-3 {
    margin-top: 1rem !important;
  }
  .mr-lg-3,
  .mx-lg-3 {
    margin-right: 1rem !important;
  }
  .mb-lg-3,
  .my-lg-3 {
    margin-bottom: 1rem !important;
  }
  .ml-lg-3,
  .mx-lg-3 {
    margin-left: 1rem !important;
  }
  .m-lg-4 {
    margin: 1.5rem !important;
  }
  .mt-lg-4,
  .my-lg-4 {
    margin-top: 1.5rem !important;
  }
  .mr-lg-4,
  .mx-lg-4 {
    margin-right: 1.5rem !important;
  }
  .mb-lg-4,
  .my-lg-4 {
    margin-bottom: 1.5rem !important;
  }
  .ml-lg-4,
  .mx-lg-4 {
    margin-left: 1.5rem !important;
  }
  .m-lg-5 {
    margin: 3rem !important;
  }
  .mt-lg-5,
  .my-lg-5 {
    margin-top: 3rem !important;
  }
  .mr-lg-5,
  .mx-lg-5 {
    margin-right: 3rem !important;
  }
  .mb-lg-5,
  .my-lg-5 {
    margin-bottom: 3rem !important;
  }
  .ml-lg-5,
  .mx-lg-5 {
    margin-left: 3rem !important;
  }
  .p-lg-0 {
    padding: 0 !important;
  }
  .pt-lg-0,
  .py-lg-0 {
    padding-top: 0 !important;
  }
  .pr-lg-0,
  .px-lg-0 {
    padding-right: 0 !important;
  }
  .pb-lg-0,
  .py-lg-0 {
    padding-bottom: 0 !important;
  }
  .pl-lg-0,
  .px-lg-0 {
    padding-left: 0 !important;
  }
  .p-lg-1 {
    padding: 0.25rem !important;
  }
  .pt-lg-1,
  .py-lg-1 {
    padding-top: 0.25rem !important;
  }
  .pr-lg-1,
  .px-lg-1 {
    padding-right: 0.25rem !important;
  }
  .pb-lg-1,
  .py-lg-1 {
    padding-bottom: 0.25rem !important;
  }
  .pl-lg-1,
  .px-lg-1 {
    padding-left: 0.25rem !important;
  }
  .p-lg-2 {
    padding: 0.5rem !important;
  }
  .pt-lg-2,
  .py-lg-2 {
    padding-top: 0.5rem !important;
  }
  .pr-lg-2,
  .px-lg-2 {
    padding-right: 0.5rem !important;
  }
  .pb-lg-2,
  .py-lg-2 {
    padding-bottom: 0.5rem !important;
  }
  .pl-lg-2,
  .px-lg-2 {
    padding-left: 0.5rem !important;
  }
  .p-lg-3 {
    padding: 1rem !important;
  }
  .pt-lg-3,
  .py-lg-3 {
    padding-top: 1rem !important;
  }
  .pr-lg-3,
  .px-lg-3 {
    padding-right: 1rem !important;
  }
  .pb-lg-3,
  .py-lg-3 {
    padding-bottom: 1rem !important;
  }
  .pl-lg-3,
  .px-lg-3 {
    padding-left: 1rem !important;
  }
  .p-lg-4 {
    padding: 1.5rem !important;
  }
  .pt-lg-4,
  .py-lg-4 {
    padding-top: 1.5rem !important;
  }
  .pr-lg-4,
  .px-lg-4 {
    padding-right: 1.5rem !important;
  }
  .pb-lg-4,
  .py-lg-4 {
    padding-bottom: 1.5rem !important;
  }
  .pl-lg-4,
  .px-lg-4 {
    padding-left: 1.5rem !important;
  }
  .p-lg-5 {
    padding: 3rem !important;
  }
  .pt-lg-5,
  .py-lg-5 {
    padding-top: 3rem !important;
  }
  .pr-lg-5,
  .px-lg-5 {
    padding-right: 3rem !important;
  }
  .pb-lg-5,
  .py-lg-5 {
    padding-bottom: 3rem !important;
  }
  .pl-lg-5,
  .px-lg-5 {
    padding-left: 3rem !important;
  }
  .m-lg-n1 {
    margin: -0.25rem !important;
  }
  .mt-lg-n1,
  .my-lg-n1 {
    margin-top: -0.25rem !important;
  }
  .mr-lg-n1,
  .mx-lg-n1 {
    margin-right: -0.25rem !important;
  }
  .mb-lg-n1,
  .my-lg-n1 {
    margin-bottom: -0.25rem !important;
  }
  .ml-lg-n1,
  .mx-lg-n1 {
    margin-left: -0.25rem !important;
  }
  .m-lg-n2 {
    margin: -0.5rem !important;
  }
  .mt-lg-n2,
  .my-lg-n2 {
    margin-top: -0.5rem !important;
  }
  .mr-lg-n2,
  .mx-lg-n2 {
    margin-right: -0.5rem !important;
  }
  .mb-lg-n2,
  .my-lg-n2 {
    margin-bottom: -0.5rem !important;
  }
  .ml-lg-n2,
  .mx-lg-n2 {
    margin-left: -0.5rem !important;
  }
  .m-lg-n3 {
    margin: -1rem !important;
  }
  .mt-lg-n3,
  .my-lg-n3 {
    margin-top: -1rem !important;
  }
  .mr-lg-n3,
  .mx-lg-n3 {
    margin-right: -1rem !important;
  }
  .mb-lg-n3,
  .my-lg-n3 {
    margin-bottom: -1rem !important;
  }
  .ml-lg-n3,
  .mx-lg-n3 {
    margin-left: -1rem !important;
  }
  .m-lg-n4 {
    margin: -1.5rem !important;
  }
  .mt-lg-n4,
  .my-lg-n4 {
    margin-top: -1.5rem !important;
  }
  .mr-lg-n4,
  .mx-lg-n4 {
    margin-right: -1.5rem !important;
  }
  .mb-lg-n4,
  .my-lg-n4 {
    margin-bottom: -1.5rem !important;
  }
  .ml-lg-n4,
  .mx-lg-n4 {
    margin-left: -1.5rem !important;
  }
  .m-lg-n5 {
    margin: -3rem !important;
  }
  .mt-lg-n5,
  .my-lg-n5 {
    margin-top: -3rem !important;
  }
  .mr-lg-n5,
  .mx-lg-n5 {
    margin-right: -3rem !important;
  }
  .mb-lg-n5,
  .my-lg-n5 {
    margin-bottom: -3rem !important;
  }
  .ml-lg-n5,
  .mx-lg-n5 {
    margin-left: -3rem !important;
  }
  .m-lg-auto {
    margin: auto !important;
  }
  .mt-lg-auto,
  .my-lg-auto {
    margin-top: auto !important;
  }
  .mr-lg-auto,
  .mx-lg-auto {
    margin-right: auto !important;
  }
  .mb-lg-auto,
  .my-lg-auto {
    margin-bottom: auto !important;
  }
  .ml-lg-auto,
  .mx-lg-auto {
    margin-left: auto !important;
  }
}

@media (min-width: 1200px) {
  .m-xl-0 {
    margin: 0 !important;
  }
  .mt-xl-0,
  .my-xl-0 {
    margin-top: 0 !important;
  }
  .mr-xl-0,
  .mx-xl-0 {
    margin-right: 0 !important;
  }
  .mb-xl-0,
  .my-xl-0 {
    margin-bottom: 0 !important;
  }
  .ml-xl-0,
  .mx-xl-0 {
    margin-left: 0 !important;
  }
  .m-xl-1 {
    margin: 0.25rem !important;
  }
  .mt-xl-1,
  .my-xl-1 {
    margin-top: 0.25rem !important;
  }
  .mr-xl-1,
  .mx-xl-1 {
    margin-right: 0.25rem !important;
  }
  .mb-xl-1,
  .my-xl-1 {
    margin-bottom: 0.25rem !important;
  }
  .ml-xl-1,
  .mx-xl-1 {
    margin-left: 0.25rem !important;
  }
  .m-xl-2 {
    margin: 0.5rem !important;
  }
  .mt-xl-2,
  .my-xl-2 {
    margin-top: 0.5rem !important;
  }
  .mr-xl-2,
  .mx-xl-2 {
    margin-right: 0.5rem !important;
  }
  .mb-xl-2,
  .my-xl-2 {
    margin-bottom: 0.5rem !important;
  }
  .ml-xl-2,
  .mx-xl-2 {
    margin-left: 0.5rem !important;
  }
  .m-xl-3 {
    margin: 1rem !important;
  }
  .mt-xl-3,
  .my-xl-3 {
    margin-top: 1rem !important;
  }
  .mr-xl-3,
  .mx-xl-3 {
    margin-right: 1rem !important;
  }
  .mb-xl-3,
  .my-xl-3 {
    margin-bottom: 1rem !important;
  }
  .ml-xl-3,
  .mx-xl-3 {
    margin-left: 1rem !important;
  }
  .m-xl-4 {
    margin: 1.5rem !important;
  }
  .mt-xl-4,
  .my-xl-4 {
    margin-top: 1.5rem !important;
  }
  .mr-xl-4,
  .mx-xl-4 {
    margin-right: 1.5rem !important;
  }
  .mb-xl-4,
  .my-xl-4 {
    margin-bottom: 1.5rem !important;
  }
  .ml-xl-4,
  .mx-xl-4 {
    margin-left: 1.5rem !important;
  }
  .m-xl-5 {
    margin: 3rem !important;
  }
  .mt-xl-5,
  .my-xl-5 {
    margin-top: 3rem !important;
  }
  .mr-xl-5,
  .mx-xl-5 {
    margin-right: 3rem !important;
  }
  .mb-xl-5,
  .my-xl-5 {
    margin-bottom: 3rem !important;
  }
  .ml-xl-5,
  .mx-xl-5 {
    margin-left: 3rem !important;
  }
  .p-xl-0 {
    padding: 0 !important;
  }
  .pt-xl-0,
  .py-xl-0 {
    padding-top: 0 !important;
  }
  .pr-xl-0,
  .px-xl-0 {
    padding-right: 0 !important;
  }
  .pb-xl-0,
  .py-xl-0 {
    padding-bottom: 0 !important;
  }
  .pl-xl-0,
  .px-xl-0 {
    padding-left: 0 !important;
  }
  .p-xl-1 {
    padding: 0.25rem !important;
  }
  .pt-xl-1,
  .py-xl-1 {
    padding-top: 0.25rem !important;
  }
  .pr-xl-1,
  .px-xl-1 {
    padding-right: 0.25rem !important;
  }
  .pb-xl-1,
  .py-xl-1 {
    padding-bottom: 0.25rem !important;
  }
  .pl-xl-1,
  .px-xl-1 {
    padding-left: 0.25rem !important;
  }
  .p-xl-2 {
    padding: 0.5rem !important;
  }
  .pt-xl-2,
  .py-xl-2 {
    padding-top: 0.5rem !important;
  }
  .pr-xl-2,
  .px-xl-2 {
    padding-right: 0.5rem !important;
  }
  .pb-xl-2,
  .py-xl-2 {
    padding-bottom: 0.5rem !important;
  }
  .pl-xl-2,
  .px-xl-2 {
    padding-left: 0.5rem !important;
  }
  .p-xl-3 {
    padding: 1rem !important;
  }
  .pt-xl-3,
  .py-xl-3 {
    padding-top: 1rem !important;
  }
  .pr-xl-3,
  .px-xl-3 {
    padding-right: 1rem !important;
  }
  .pb-xl-3,
  .py-xl-3 {
    padding-bottom: 1rem !important;
  }
  .pl-xl-3,
  .px-xl-3 {
    padding-left: 1rem !important;
  }
  .p-xl-4 {
    padding: 1.5rem !important;
  }
  .pt-xl-4,
  .py-xl-4 {
    padding-top: 1.5rem !important;
  }
  .pr-xl-4,
  .px-xl-4 {
    padding-right: 1.5rem !important;
  }
  .pb-xl-4,
  .py-xl-4 {
    padding-bottom: 1.5rem !important;
  }
  .pl-xl-4,
  .px-xl-4 {
    padding-left: 1.5rem !important;
  }
  .p-xl-5 {
    padding: 3rem !important;
  }
  .pt-xl-5,
  .py-xl-5 {
    padding-top: 3rem !important;
  }
  .pr-xl-5,
  .px-xl-5 {
    padding-right: 3rem !important;
  }
  .pb-xl-5,
  .py-xl-5 {
    padding-bottom: 3rem !important;
  }
  .pl-xl-5,
  .px-xl-5 {
    padding-left: 3rem !important;
  }
  .m-xl-n1 {
    margin: -0.25rem !important;
  }
  .mt-xl-n1,
  .my-xl-n1 {
    margin-top: -0.25rem !important;
  }
  .mr-xl-n1,
  .mx-xl-n1 {
    margin-right: -0.25rem !important;
  }
  .mb-xl-n1,
  .my-xl-n1 {
    margin-bottom: -0.25rem !important;
  }
  .ml-xl-n1,
  .mx-xl-n1 {
    margin-left: -0.25rem !important;
  }
  .m-xl-n2 {
    margin: -0.5rem !important;
  }
  .mt-xl-n2,
  .my-xl-n2 {
    margin-top: -0.5rem !important;
  }
  .mr-xl-n2,
  .mx-xl-n2 {
    margin-right: -0.5rem !important;
  }
  .mb-xl-n2,
  .my-xl-n2 {
    margin-bottom: -0.5rem !important;
  }
  .ml-xl-n2,
  .mx-xl-n2 {
    margin-left: -0.5rem !important;
  }
  .m-xl-n3 {
    margin: -1rem !important;
  }
  .mt-xl-n3,
  .my-xl-n3 {
    margin-top: -1rem !important;
  }
  .mr-xl-n3,
  .mx-xl-n3 {
    margin-right: -1rem !important;
  }
  .mb-xl-n3,
  .my-xl-n3 {
    margin-bottom: -1rem !important;
  }
  .ml-xl-n3,
  .mx-xl-n3 {
    margin-left: -1rem !important;
  }
  .m-xl-n4 {
    margin: -1.5rem !important;
  }
  .mt-xl-n4,
  .my-xl-n4 {
    margin-top: -1.5rem !important;
  }
  .mr-xl-n4,
  .mx-xl-n4 {
    margin-right: -1.5rem !important;
  }
  .mb-xl-n4,
  .my-xl-n4 {
    margin-bottom: -1.5rem !important;
  }
  .ml-xl-n4,
  .mx-xl-n4 {
    margin-left: -1.5rem !important;
  }
  .m-xl-n5 {
    margin: -3rem !important;
  }
  .mt-xl-n5,
  .my-xl-n5 {
    margin-top: -3rem !important;
  }
  .mr-xl-n5,
  .mx-xl-n5 {
    margin-right: -3rem !important;
  }
  .mb-xl-n5,
  .my-xl-n5 {
    margin-bottom: -3rem !important;
  }
  .ml-xl-n5,
  .mx-xl-n5 {
    margin-left: -3rem !important;
  }
  .m-xl-auto {
    margin: auto !important;
  }
  .mt-xl-auto,
  .my-xl-auto {
    margin-top: auto !important;
  }
  .mr-xl-auto,
  .mx-xl-auto {
    margin-right: auto !important;
  }
  .mb-xl-auto,
  .my-xl-auto {
    margin-bottom: auto !important;
  }
  .ml-xl-auto,
  .mx-xl-auto {
    margin-left: auto !important;
  }
}


/*
m = margin
a, t, b = all, top, bottom
n, s, m, l = none, small, medium, large
*/
.mavs {
    margin: 5px!important;
}
.man {
    margin: 0!important;
}
.mas {
    margin: 20px!important;
}
.mam {
    margin: 40px!important;
}
.mal {
    margin: 60px!important;
}

.mln {
    margin-left: 0!important;
}
.mls {
    margin-left: 20px!important;
}
.mlm {
    margin-left: 40px!important;
}
.mll {
    margin-left: 60px!important;
}

.mrn {
    margin-right: 0!important;
}
.mrs {
    margin-right: 20px!important;
}
.mrm {
    margin-right: 40px!important;
}
.mrl {
    margin-right: 60px!important;
}


.mtn {
    margin-top: 0!important;
}
.mts {
    margin-top: 20px!important;
}
.mtm {
    margin-top: 40px!important;
}
.mtl {
    margin-top: 60px!important;
}


.mbn {
    margin-bottom: 0!important;
}
.mbs {
    margin-bottom: 20px!important;
}
.mbm {
    margin-bottom: 40px!important;
}
.mbl {
    margin-bottom: 60px!important;
}

.pan {
    padding: 0!important;
}
.pas {
    padding: 20px!important;
}
.pam {
    padding: 40px!important;
}
.pal {
    padding: 60px!important;
}

.ptn {
    padding-top: 0!important;
}
.pts {
    padding-top: 20px!important;
}
.ptm {
    padding-top: 40px!important;
}
.ptl {
    padding-top: 60px!important;
}

.pbn {
    padding-bottom: 0!important;
}
.pbs {
    padding-bottom: 20px!important;
}
.pbm {
    padding-bottom: 40px!important;
}
.pbl {
    padding-bottom: 60px!important;
}

.prn {
    padding-right: 0!important;
}
.prs {
    padding-right: 20px!important;
}
.prm {
    padding-right: 40px!important;
}
.prl {
    padding-right: 60px!important;
}

.pln {
    padding-left: 0!important;
}
.pls {
    padding-left: 20px!important;
}
.plm {
    padding-left: 40px!important;
}
.pll {
    padding-left: 60px!important;
}

/*--------------------------------------------*/
/* CONTENT */
/*--------------------------------------------*/
.wrap {
    max-width: 1024px;
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;
    margin-left: auto;
    margin-right: auto;
}


/* header */
/*------------------------*/
.invisible { 
    opacity:0;
}
#header { /* ou [id="header"] qui vaut 10*/
    background-color: #fff;
    background-image:"http://www.pierfrancescopardini.fr/wp-content/uploads/2014/03/test-e1470138261846.jpg" ;
    
}


/*VIDEO HEADER*/
#myVideo{   background-attachment: fixed;
    position: relative;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
}

.content {
  position: absolute;
    top: 14%;
    color: rgba(255, 255, 255, 0.34);
    width: 100%;
    height: 50%;
    padding: 20px;
    font-size: 2.5em;

}

/* logo */
/*------------------------*/
.logo a {
    display: inline-block;
}
#social {
    text-align: center;
    color:#000;


}
#social li {

    display:inline-block;

}
/* nav */
/*------------------------*/

.menu {
    opacity: 1;
    height: 0;
    overflow: hidden;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
	
    
}
.menu-collapse {
    opacity: 1;
    height: auto;
}
.menu ul {
    margin: 0;
    /*padding: 105px;*/
    list-style-type: none;
}

.menu ul li a{
    font-size: 1em;
	
    
}

.menu a {
    display: block;
    color: #1b3e61;
    padding: 1em;
    text-align: center;
	border-radius:0.5;
	 -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
	
}

.menu .current {
    color: #fff;
	border:0.2px solid #ababab ;
	border-radius:70%;
}

#srinknavbar {
    overflow: hidden;
    background-color: #f1f1f1;
    padding: 10px 10px;
    transition: 0.4s;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 99;
}

/* Burger */
/*------------------------*/
.btn-menu {
    position: absolute;
    top: 20px;
    right: 10px;
    color: #fff;
}

.orderfirst {
   z-index: 4;
}
/* main */
/*------------------------*/




@media (max-width: 481px){ 
	
	.logo{
		display:none;
	}
.banner, .banner-app {
        
    }
    .banner3, .banner2,.banner4, .banner-app, .single-banner {
        background-attachment: fixed;    
		background-position: center !important;
    background-size: cover;
    line-height: 1.75;
    text-align: center;
    }

    .overlay {
        background-color: rgba(0,0,0,0.0);
        padding:0;

    }
    .banner {
        background-image: url('http://localhost/wordpress/wp-content/themes/bpk/img/ocean.jpg');
        padding: 0;
        height:auto;

    }
	


    .banner,.banner2,.banner3,.banner4, .banner-app, .single-banner {

        background-repeat: no-repeat;
        -webkit-background-size: cover; /*Bien prefixer pour un affichage correct sur IOS*/
        background-size: cover;			/* NOTA : si on met un bg attachment fixed 
                                                                                en vue mobile et tablette on fait planter
                                                                                le COVER sur IOS !!! TAKE CARE!!!*/

        background-position: 100%; /* cadrage de l'image*/
    }
    .banner2 {
        background-image: url('https://www.pierfrancescopardini.fr/wp-content/uploads/2019/09/fond-mer-nouveau.jpg');
        padding: 0;
        height:auto;


    }
        .banner3 {
        background-image: url('https://www.pierfrancescopardini.fr/wp-content/themes/bpk/img/abstract_photo_pierfrancesco.jpg');
        padding: 0;
        height:auto;


    }
    .banner4 {
        background-image: url('https://www.pierfrancescopardini.fr/wp-content/themes/bpk/img/abstract_photo_pierfrancesco.jpg');
        padding: 0;
        height:auto;


    }

	.content-header{
			color:#000 !important;
		}
}
@media (min-width: 481px) and (max-width: 769px){ 
    .banner, .banner-app {
        
    }
    .banner3, .banner2,.banner4, .banner-app, .single-banner {
        background-attachment: fixed;
		background-position: center;
    }

    .overlay {
        background-color: rgba(0,0,0,0.0);
        padding:0;

    }
    .banner {
        background-image: url('https://localhost/wordpress/wp-content/themes/bpk/img/ocean.jpg');
        padding: 0;
        height:auto;

    }
	


    .banner,.banner2,.banner3,.banner4, .banner-app, .single-banner {

        background-repeat: no-repeat;
        -webkit-background-size: cover; /*Bien prefixer pour un affichage correct sur IOS*/
        background-size: cover;			/* NOTA : si on met un bg attachment fixed 
                                                                                en vue mobile et tablette on fait planter
                                                                                le COVER sur IOS !!! TAKE CARE!!!*/

        background-position: 100%; /* cadrage de l'image*/
    }
    .banner2 {
        background-image: url('https://www.pierfrancescopardini.fr/wp-content/uploads/2019/09/fond-mer-nouveau.jpg');
        padding: 0;
        height:auto;


    }
        .banner3 {
        background-image: url('https://www.pierfrancescopardini.fr/wp-content/themes/bpk/img/abstract_photo_pierfrancesco.jpg');
        padding: 0;
        height:auto;


    }
    .banner4 {
        background-image: url('http://www.pierfrancescopardini.fr/wp-content/themes/bpk/img/abstract_photo_pierfrancesco.jpg');
        padding: 0;
        height:auto;


    }


}
.no-padding {
    padding: 0;
}
.date {
    color:#848484;
    font-size:0.904em;
}

/*BANNER*/
.bannerpier {
  color:#fff !important;
    font-size: 3em;
}




/*Description*/
.list-description div{
    display: inline-block !important;
}

.border-box{

 border: 2px solid #161b3ef7;

}
.border-left{

 border-left: 3px dotted #000;

}
.border-right{

 border-right: 3px dotted #000;

}

.border-bottom{

 border-bottom: 1px solid #000 ;

}
.border-top{

 border-top: 1px solid #000 ;


}


.fadeborder {
    border-width: 3px 3px 3px 0;
    border-style: solid;
    -webkit-border-image: 
      -webkit-gradient(linear, 0 0, 100% 0, from(white), to(rgba(0, 0, 0, 0))) 1 100%;
    -webkit-border-image: 
      -webkit-linear-gradient(left, white, rgba(0, 0, 0, 0)) 1 100%;
    -moz-border-image:
      -moz-linear-gradient(left, white, rgba(0, 0, 0, 0)) 1 100%; 
    -o-border-image:
      -o-linear-gradient(left, white, rgba(0, 0, 0, 0)) 1 100%;
    border-image:
      linear-gradient(to left, white, rgba(0, 0, 0, 0)) 1 100%;     
}



/*LISTE ARTICLES*/

.list-article li {
   display:inline;

}


.list-article a h3{
    opacity:0;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;


}
.list-article a h2{
    opacity:1;
    color:#fff;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;

}
.list-article a h3:hover{
    color:#000;
    opacity:1;
}

.list-article a img{
    opacity:0.8;

}

/* LISTE CATEGORY*/

.list-category {
	margin: 0;
	padding:0;
	text-align: center;
	
}
.list-category li {
	float:none;
	padding-left: 0;
	padding-right: 0;
}

.list-category a img{
    margin:10px;
	position:relative;

}
.list-category a h2{
    color:#333;
    opacity:1;
	position:absolute;
	
}



/*ARCHIVE*/

.cat-archive{
    display:inline-block;
	margin:0 !important;
	padding:0 !important;
}

.cat-archive a img{
	position:relative;
    opacity:1;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}
.cat-archive a h3 {
	position:absolute;
	top:3em;
}


.cat-archive a:hover img,.cat-archive a:hover {

    opacity:0.5;
	color:#89D9F0 ; 
}


.cat-container {
  position: relative;
  width: 100%;
}

.cat-image {
  width: 100%;
}

.cat-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  opacity: 1;
  transition: .5s ease;
	background-color: #22222247;
	padding:0;
}

.cat-overlay h3 {
	opacity:1;
}

.cat-overlay:hover {
	background-color: #0b0b3db0;
}
.cat-container h3:hover {
  opacity: 1;
}

.cat-text {
  color: white;
  font-size: 1.2em;
  position: absolute;

  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
	font-family: 'SourceSansPro-Light';
	font-weight:900;
}


.single-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  opacity: 1;
  transition: .5s ease;
	background-color: #2222222b;
	padding:0;
}




/* footer */
/*------------------------*/
#footer {
    border-top: 1px solid #adadad;
    padding: 20px 0;
}
#footer ul li {
    display:inline;
}
#footer ul li img {
    width: auto;

}
#footer small {
    text-align: center;
}
.black a {
    color:#000 !important;
}
#totop {
    display: block;
    text-align: center;
    background-color: #89D9F0;
    color: #fff;
    padding: 1em 2em;
    margin: 20px 0;
    border-radius: 10px;
    font-size:1em;
}
.copyright{
    font-size:0.7em !important;
}

/*--------------------------------------------*/
/* RWD */
/*--------------------------------------------*/
@media (max-width: 481px) {
	img {
		
	}
	.img-reduite {
	width:100% !important;	
	}
	.content-header {
		color:#555 !important;
		
	}
	#btn-header:hover {
		color:#444;
	}
	
	h1, .h1-like {
    font-size: 0.8em;
		font-family: 'PlayfairDisplay-Regular';}
}

/* tablet view -------------------------------*/
@media (min-width: 1024px) {

    /* nav */
    /*------------------------*/
    .menu {
        opacity: 1;
        height: auto;
    }
    .logo {
        width:10%;
        height: auto;
    }
    .menu ul {
        margin-top: 1.1em;
    }
    .menu li {
        display: inline-block;
    }
    .menu a {
        padding: 0.5em 0.8em;
    }
    /* burger */
    /*------------------------*/
    .btn-menu {
        display: none;
    }
    /* Main */
    /*------------------------*/
    .img-small {
		width:20% !important;
	}

    /* footer */
    /*------------------------*/
    #footer small {
        text-align: left;
    }
    #totop {
        display: inline;
        text-align: inherit;
        background-color: initial;
        color: #fff;
        padding: 0;
   
        border-radius: 0;
        border-color:#000;
    }

	
	
}/* end of tablet view -----------------------*/



/* desktop view -------------------------------*/
@media (min-width: 769px) {

    /* links */
    /*------------------------*/
    a {
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }


    /* buttons */
    /*------------------------*/
    .btn {
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }
    .btn:hover {
        color: #fff;
        background-color: #0B4660;
    }
    .btn:active {
        top: 1px;
    }
    .btn--secondary:hover {
        color: #ededed;
        background-color: #666;
    }
    /* logo */
    /*------------------------*/
    .logo a {
        -webkit-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }
    .logo a:hover {
        opacity: 0.8;
        
    }
    /* nav */
    /*------------------------*/
    .menu ul {
        margin-top: 1.2em;
    }
	
   
    .menu a:hover {
        color: #999 ; 
		
    }
    /* Main */
    /*------------------------*/
    .banner, .banner-app {
        
    }
    .banner3, .banner2,.banner4, .banner-app, .single-banner {
        background-attachment: fixed;
    }

    .overlay {
        background-color: rgba(0,0,0,0.0);
        padding:0;

    }
    .banner {
        background-image: url('https://localhost/wordpress/wp-content/themes/bpk/img/ocean.jpg');
        padding: 0;
        height:auto;

    }
	


    .banner,.banner2,.banner3,.banner4, .banner-app, .single-banner {

        background-repeat: no-repeat;
        -webkit-background-size: cover; /*Bien prefixer pour un affichage correct sur IOS*/
        background-size: cover;			/* NOTA : si on met un bg attachment fixed 
                                                                                en vue mobile et tablette on fait planter
                                                                                le COVER sur IOS !!! TAKE CARE!!!*/

        background-position: 100%; /* cadrage de l'image*/
    }
    .banner2 {
        background-image: url('https://www.pierfrancescopardini.fr/wp-content/uploads/2019/09/fond-mer-nouveau.jpg');
        padding: 0;
        height:auto;


    }
        .banner3 {
        background-image: url('https://www.pierfrancescopardini.fr/wp-content/themes/bpk/img/abstract_photo_pierfrancesco.jpg');
        padding: 0;
        height:auto;


    }
    .banner4 {
        background-image: url('https://www.pierfrancescopardini.fr/wp-content/themes/bpk/img/abstract_photo_pierfrancesco.jpg');
        padding: 0;
        height:auto;


    }


 
    
    
    /*SINGLE */
 .single-banner {
	 position:relative;
       	background-attachment: fixed;
        padding: 0;
        height:auto;
	 
	 background-repeat: no-repeat;
        -webkit-background-size: cover; /*Bien prefixer pour un affichage correct sur IOS*/
        background-size: cover;			/* NOTA : si on met un bg attachment fixed 
                                                                                en vue mobile et tablette on fait planter
                                                                                le COVER sur IOS !!! TAKE CARE!!!*/

        background-position: 100%; /* cadrage de l'image*/
	 filter: brightness(100%);
    }
	.single-banner-cover {
position:absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  opacity: 0.5;
  transition: .5s ease;
	background-color: #000;
	padding:0;


	}
	
	.single-banner h1 {
		filter: brightness(100%);
	}

    /*LIENS ARTICLES*/

    .list-article li {
        display:inline-block;
        padding: 0 !important;
    }
    .list-article div,.list-article article {
        position:relative;
    }

    .list-article a h3{
        opacity:0;
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
        position:absolute;
        bottom:19%;
        left:0%;
    }
    .list-article a h2{
        opacity:1;
        color:#fff;
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
        position:absolute;
        bottom:19%;
        left:0%;
    }
    .list-article a:hover h3{
        color:#000;
        opacity:1;
    }
    .list-article a:hover h2{
        color:#000;
        opacity:1;
    }

    .list-article a img{
        opacity:1;
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }
    .list-article a:hover img{
        opacity:0.3;

    }

    /* LISTE CATEGORY*/

    .list-category{
        display:inline-block;
        padding: 0 !important;
        margin-left:auto;
        margin-left:auto;
    }
    .list-category a article {
        position:relative;
    }

    .list-category a h2{
        opacity:1;
        color:#000;
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;

    }

    .list-category a:hover h2{
        color:#89D9F0;
        opacity:1;
    }

    .list-category a img{
        margin:10px;
        transform:scale(1);
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

    .list-category a:hover img{

        transform:scale(1.1);

    }


    /* footer */
    /*------------------------*/
    #totop:hover {
        color: #934243;
    }
}/* end of desktop view -----------------------*/




/*SLIDER*/
/*------------------------*/

 /*SLIDE*/



img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  margin: auto;
  position:relative;
  height:300px;
  border-right: 2px solid #000;
}

.mySlides {
display: none;
vertical-align: middle;
padding:1em;
margin:1em;
text-align: right;

}

/* Caption text */
.text {
  color: #000;
  padding: 8px 12px;
  text-align: left;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
}

/* The dots/bullets/indicators */
.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 2.5s;
  animation-name: fade;
  animation-duration: 2.5s;
}

@-webkit-keyframes fade {
  from {opacity: 0.2} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: 0.2} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 480px) {
  .text {font-size: 11px}
  .slideshow-container {
  margin: auto;
  height:600px;
   border-right:  none;
}
.mySlides {

text-align: center;

}
}