:root {
    --pol-black-color: #0e1111;
    --jem-dark-color: #1e2949;
    --jem-grey-color: #32495d;
    --jem-light-color: #f5f6f0;

    --jem-light-color-transparent: rgba(245, 246, 240, 0.7);

    --jem-main-color: #f3ab94;
    --jem-alt-color-1: #2e8396;
    --jem-alt-color-2: #f189a2;
    --jem-hover-color: #42d89e;

    --jem-gold-color: #957C3D;
    --jem-pale-green-color: #9BBEA9;

    --jem-box-shadow : rgba(50,50,93,0.1) 0px 6px 12px -2px, rgba(0,0,0,0.2) 0px 3px 7px -3px;
    /* --jem-box-shadow : rgba(50,50,93,0.25) 0px 4px 8px -1px, rgba(0,0,0,0.3) 0px 1px 3px -1px; */

    --jem-font-size: 16px;

    --jem-radius: 10px;

    --pol-transition: ease 0.4s;

    --jem-font-weight: 400;
    --jem-font-weight-bold: 600;
    --jem-font-weight-extra: 800;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline: none;
    /* font-family: 'Open Sans', sans-serif; */
}

html {
    margin: auto;
/*     font-size: var(--pol-font-size);
    font-weight: var(--pol-font-weight);
    line-height: 1.5;
    color: var(--pol-black-color); */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/***************************************************************************************
* Flexbox
****************************************************************************************/
.pol-flex {
    display: flex;
    flex-wrap: wrap;
}

.pol-flex-between { 
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.pol-flex-end {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.pol-gap-20 {
    gap: 20px;
}

.pol-wrap {
    flex-wrap: wrap;
}

/***************************************************************************************
* Containers et Cards
****************************************************************************************/

.pol-main-container {
    width: 100%;
    max-width:1200px;
    padding: 0 10px;
    margin: auto
}

.pol-card {
    width: 30%;
    margin: 20px 0;
    background-color: white;
}

.pol-card-infos {
    background-color: white;
    padding: 20px;
}

.pol-img-card {
    height: 200px;
    display: block;
}

.pol-img-container {
    width: 100%;
    overflow: hidden;
}

.pol-img {
    height: 100%;
    width: 100%;
    transform: scale(1);
    transition: var(--pol-transition);
    object-fit: cover;
}

.pol-img:hover {
  transform: scale(1.03);
  transition: all 0.4s ease;
}

/***************************************************************************************
* Tailles
****************************************************************************************/

.pol-w30 {
    width: 30%;
}

.pol-w50 {
    width: 50%
}

.pol-w70 {
    width: 70%;
}

.pol-w100 {
    width: 100%;
}

.pol-w200 {
    width: 200px;
}

.pol-w300 {
    width: 300px;
}

/***************************************************************************************
* Custom Bootstrap
****************************************************************************************/

.navbar-light .navbar-toggler {
    color: rgba(0,0,0,0);
    border-color: rgba(255,255,255,0);
}

@media (min-width: 992px) {
    .navbar {
        padding-left: 100px;
    }
}

/***************************************************************************************
* Media Queries
****************************************************************************************/

@media (min-width: 1200px) {
    .desktop-pol-flex-between {
        display: flex;
        justify-content: space-between;
    }

    .desktop-pol-flex-end {
        display: flex;
        justify-content: flex-end;
    }
}

@media (max-width: 1460px) {
    .pol-nav-font {
        font-size: 14px;
    }
}

@media (max-width: 1200px) {
    .pol-card {
        width: 46%;
    }
}

@media (max-width: 992px) {


    .pol-desktop {
        display: none
    }

    .pol-w30,
    .pol-w50,
    .pol-w70,
    .pol-card {
        width: 100%;
    }
}