/*## PAGE: page, frame, wide ##*/
/*## PART_CONTAINER_CLASS: , content, container, row, gradientWhiteGrayGreen, gradientWhiteGray, icon cart, icon simulation, icon contact, breadcrumb, grid-col-1, grid-col-2, grid-col-3, grid-col-4, grid-col-5, grid-col-6, grid-col-7, grid-col-8, grid-col-9, grid-col-10, grid-col-11, grid-col-12 ##*/

/*#region common*/

html {
    scroll-behavior: smooth;
    margin: 0;
}

body {
    display: flex;
    min-height: 100vh;
    flex: 1 0 100%;
    flex-direction: column;
    font-family: RobotoRegular;
    font-size: 14px;
    transition: .5s all;
    line-height: 24px
}

p {
    margin: 0;
    flex: 1 0 100%;
    text-align: justify;
}

    p.teasing {
        font-family: OswaldLight;
        font-style: italic;
        font-size: 18px;
    }

.gradientWhiteGrayGreen {
    background-image: linear-gradient(var(--cnam-white-color), var(--cnam-light-gray-color), var(--cnam-medium-green-color));
}

.gradientWhiteGray {
    background-image: linear-gradient(var(--cnam-white-color), var(--cnam-light-gray-color) 40%);
}

.puce {
    display: list-item !important;
}

.center {
    text-align: center;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

.vertical-center,
.vCenter {
    align-items: center;
}

.hidden {
    visibility: hidden;
}

.justify,
.rtejustify {
    text-align: justify;
}

input,
input::placeholder {
    font-family: RobotoRegular;
    font-size: 16px;
    color: var(--cnam-gray-color);
}

    input:focus {
        outline: none;
    }

/*#region icons*/

.fa-print:before {
    font-size: x-large;
}

span.icon, .cart-icon {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    width: 32px;
    height: 32px;
    line-height: 32px;
    margin: auto 5px;
}

    span.icon.full {
        width: 100%;
        height: 130px;
    }

    span.icon.half {
        width: 100%;
        height: 100px;
    }

    span.icon.small {
        width: 16px;
        height: 16px;
    }

    span.icon.medium {
        width: 25px;
        height: 22px;
    }

    span.icon.cart {
        background-image: url(Images/emptyCart.png)
    }

    span.icon.simulation {
        background-image: url(Images/simulation.png)
    }

    span.icon.contact {
        background-image: url(Images/contact.png)
    }

    span.icon.training {
        background-image: url(Images/training.png);
        width: 200px;
    }

    span.icon.datadock {
        background-image: url(Images/datadock.png)
    }

    span.icon.ministere {
        background-image: url(Images/ministere.png)
    }

    span.icon.bretagne {
        background-image: url(Images/bretagne.png)
    }

    span.icon.information {
        background-image: url(Images/information.png);
        display: inline-flex;
    }
    /*Icônes modalités en gris*/
    span.icon.gray-modalite-1 {
        background-image: url(Images/gray-modalite-1.png);
        display: inline-flex;
    }

    span.icon.gray-modalite-2 {
        background-image: url(Images/gray-modalite-2.png);
        display: inline-flex;
    }

    span.icon.gray-modalite-3 {
        background-image: url(Images/gray-modalite-3.png);
        display: inline-flex;
    }

    span.icon.gray-modalite-4 {
        background-image: url(Images/gray-modalite-4.png);
        display: inline-flex;
    }

    span.icon.gray-modalite-7 {
        background-image: url(Images/gray-modalite-7.png);
        display: inline-flex;
    }

    span.icon.gray-modalite-16 {
        background-image: url(Images/gray-modalite-16.png);
        display: inline-flex;
    }

    span.icon.gray-modalite-17 {
        background-image: url(Images/gray-modalite-17.png);
        display: inline-flex;
    }
    /*Icônes modalités non modifiés*/
    span.icon.modalite-1 {
        background-image: url(Images/modalite-1.png);
    }

    span.icon.modalite-2 {
        background-image: url(Images/modalite-2.png);
    }

    span.icon.modalite-3 {
        background-image: url(Images/modalite-3.png);
    }

    span.icon.modalite-4 {
        background-image: url(Images/modalite-4.png);
    }

    span.icon.modalite-7 {
        background-image: url(Images/modalite-7.png);
    }

    span.icon.modalite-16 {
        background-image: url(Images/modalite-16.png);
    }

    span.icon.modalite-17 {
        background-image: url(Images/modalite-17.png);
    }

    span.icon.period-First {
        background-image: url(Images/period-First.png)
    }

    span.icon.period-Second {
        background-image: url(Images/period-Second.png)
    }

    span.icon.period-Annual {
        background-image: url(Images/period-Annual.png)
    }

/*#endregion icons*/

/*#region boutons*/

.floatingButton {
    position: fixed;
    bottom: -60px;
    display: flex;
    justify-content: center;
    width: 100%;
    background: var(--cnam-light-gray-alpha-color);
    border-top: 1px solid #DDD;
    transition: 0.5s all
}

    .floatingButton.raised {
        transform: translateY(-60px);
    }

    .floatingButton .container {
        justify-content: left;
        padding: 0;
    }

    .floatingButton .btn {
        flex: 0;
        border-radius: 10px;
        margin: 5px;
    }

.btn.view-cart {
    display: none;
}

    .btn.view-cart.view-cart-active {
        display: flex;
    }



.btn {
    display: flex;
    flex: 1 0 0;
    align-items: center;
    justify-content: center;
    padding: 5px;
    max-height: 50px;
    font-size: 18px;
    cursor: pointer;
    outline: none;
    border-radius: 0;
    color: white;
    font-family: OswaldLight;
    border-radius: 10px;
    border: 1px solid transparent;
}

#resetButton.btn {
    font-size: 14px;
    margin: 5px;
    padding: 0px;
}

    .btn.focus, .btn:focus {
        color: white;
        text-decoration: none;
    }

    .btn.btn-cnam-green {
        color: #CCC;
        font-family: OswaldLight;
        font-size: 18px;
        background: none;
        border-radius: 0px;
    }

        .btn.btn-cnam-green:hover {
            background-color: #f4f1f0;
            color: var(--cnam-medium-gray-color);
        }

        .btn.btn-cnam-green.btn-active {
            background-color: var(--cnam-white-color);
            color: var(--cnam-black-color);
            cursor: default;
            font-family: OswaldMedium;
        }

    .btn:hover {
        background-color: var(--cnam-easy-gray-color);
    }

    .btn.btn-shadow {
        box-shadow: 2px 2px 10px var(--cnam-gray-color);
    }

    .btn.btn-flex-0 {
        flex: 0 0 0;
    }

    .btn.btn-primary, 
    .btn.btn-cart,
    .btn.btn-secondary {
        padding: 10px 20px;
        max-height: 50px;
    }

    .btn.btn-default {
        background-color: var(--cnam-red-color) !important;
        border: 1px solid var(--cnam-red-color) !important;
    }

    .btn.btn-default:hover {
        color: var(--cnam-red-color) !important;
        background-color: var(--cnam-easy-gray-color) !important;
    }

        .btn.btn-default.ui-state-disabled:hover {
            color: var(--cnam-white-color) !important;
            background-color: var(--cnam-red-color) !important;
            border: 1px solid var(--cnam-red-color) !important;
        }

        }

    .btn.btn-secondary {
        padding: 5px 10px;
    }

    .btn.btn-red {
        background-color: var(--cnam-red-color);
    }

        .btn.btn-red .icon.cart {
            background-image: url(Images/emptyCartWhite.png);
            margin-right: 2px;
        }

        .btn.btn-red:hover {
            background-color: var(--cnam-easy-gray-color);
            color: var(--cnam-red-color);
            border: 1px solid var(--cnam-red-color);
        }

            .btn.btn-red:hover .icon.cart {
                background-image: url(Images/emptyCart.png);
            }

    .btn.btn-dark-red {
        background-color: var(--cnam-dark-red-color);
    }

        .btn.btn-dark-red:hover {
            background-color: var(--cnam-easy-gray-color);
            color: var(--cnam-dark-red-color);
            border: 1px solid var(--cnam-dark-red-color);
        }

    .btn.btn-green {
        background-color: var(--cnam-green-color);
    }

        .btn.btn-green:hover {
            background-color: var(--cnam-easy-gray-color);
            color: var(--cnam-green-color) !important;
            border: 1px solid var(--cnam-green-color);
        }

    .btn.btn-gray {
        background-color: var(--cnam-gray-color);
        color: var(--cnam-white-color);
    }

		.btn.btn-gray:hover {
			background-color: var(--cnam-easy-gray-color);
			color: var(--cnam-gray-color);
			border: 1px solid var(--cnam-gray-color);
		}

    .btn.inactive {
        background-color: var(--cnam-light-gray-color);
		color: var(--cnam-medium-gray-color);
        cursor: default;
        pointer-events: none;
		border: 1px solid var(--cnam-light-medium-gray-color);
    }

		.btn.inactive > span.icon.cart {
			background-image: url(Images/emptyCart-inactif.png);
		}

    .btn.no-btn {
        border: none;
        background: none;
    }




/*#endregion boutons*/


/*#region section / container */

section {
    display: flex;
    flex: 1 0 100%
}

.flex-initial {
    flex: initial;
}

.flex-no-wrap {
    flex-wrap: unset !important;
}

.flex-0 {
    display: flex !important;
    flex: 0 0 0 !important;
    flex-wrap: wrap;
}

.flex-1 {
    display: flex;
    flex: 1 0 0;
    flex-wrap: wrap;
}

.flex-1-100 {
    display: flex;
    flex: 1 0 100%;
    flex-wrap: wrap;
    align-content: flex-start;
}

.flex-column-1 {
    display: flex;
    flex: 1 0 0;
    flex-direction: column;
}

.flex-2 {
    display: flex;
    flex: 2 0 0;
    flex-wrap: wrap;
    align-content: flex-start;
}

.flex-2-100 {
    display: flex;
    flex: 2 0 100%;
    flex-wrap: wrap;
}

.flex-3 {
    display: flex;
    flex: 3 0 0;
    flex-wrap: wrap;
}

.flex-3-100 {
    display: flex;
    flex: 3 0 100%;
    flex-wrap: wrap;
}

.flex-4 {
    display: flex;
    flex: 4 0 0;
    flex-wrap: wrap;
}

.flex-4-100 {
    display: flex;
    flex: 4 0 100%;
    flex-wrap: wrap;
}

.flex-5 {
    display: flex;
    flex: 5 0 0;
    flex-wrap: wrap;
}

.flex-5-100 {
    display: flex;
    flex: 5 0 100%;
    flex-wrap: wrap;
}

.flex-6 {
    display: flex;
    flex: 6 0 0;
    flex-wrap: wrap;
}

.flex-6-100 {
    display: flex;
    flex: 6 0 100%;
    flex-wrap: wrap;
}

.flex-end {
    justify-content: flex-end !important;
}

.flex-start {
    justify-content: flex-start !important;
}

.block {
    display: block;
}

.content {
    display: flex;
    flex-grow: 1;
    margin: 0;
    padding: 5px 0 0 0;
    flex-wrap: wrap;
    align-items: flex-start;
}

.container {
    display: flex;
    flex: 1 0 100%;
    flex-wrap: wrap;
    margin: 0 auto;
    max-width: 1024px;
}

.top {
    margin-top: 10px;
}

.bot {
    margin-bottom: 10px;
}

/*#endregion section / container */

/*#region titles*/

h1,
h2,
h3 {
    /*display: flex;*/
    flex: 1 0 100%;
    font-family: OswaldLight;
}

h1 {
    font-size: 24px;
    margin-bottom: 20px;
}

h2 {
    font-size: 22px;
    margin-bottom: 15px;
}

h3 {
    font-size: 20px;
    margin-bottom: 10px;
}

.title-1 {
    font-size: 24px;
    display: flex;
    flex: 1 0 100%;
    font-family: OswaldLight;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
    margin: 0.67em 0;
}

.title-2 {
    font-size: 18px;
    display: flex;
    flex: 1 0 100%;
    line-height: 1.1;
    color: inherit;
    font-family: OswaldLight;
    margin: 0.83em 0;
}

.title-3 {
    font-size: 16px;
    margin-bottom: 10px;
    display: flex;
    flex: 1 0 100%;
    line-height: 1.1;
    font-family: OswaldLight;
    margin: 1em 0;
}

.titleBackground {
    background-color: var(--cnam-green-color);
    transform: rotate(-1deg);
	border: 1px solid var(--cnam-green-color);
}
    .titleBackground > h1, .titleBackground > h2 {
        color: var(--cnam-white-color);
        padding: 20px;
        transform: rotate(1deg);
        margin: 0;
    }

a:hover > .titleBackground {
	background-color: var(--cnam-light-gray-color);
}
	a:hover > .titleBackground > h2 {
		color: var(--cnam-green-color);
	}


.mainTitle {
    display: flex;
    flex: 1 0 100%;
}

    .mainTitle h1 {
        padding: 10px 0 0 0;
        font-weight: bold;
        /*white-space: nowrap;*/
        border-top: 2px solid var(--cnam-black-color);
        color: var(--cnam-red-color);
        font-size: 27px;
        margin-top: 0px;
    }

        .mainTitle h1 > span {
            font-size: 18px;
            margin-left: 5px;
            margin-top: 8px;
        }

    .mainTitle div {
        align-items: center;
    }

.listDiscTitle {
    flex: 1 0 100%;
}

    .listDiscTitle h2 {
        margin: 10px 0;
        font-family: OswaldMedium;
        font-size: 20px;
    }

        .listDiscTitle h2::before {
            color: var(--cnam-red-color);
            font-weight: bold;
            display: inline-block;
            width: 16px;
            content: "\2022";
        }

/*#endregion titles*/

/*#region link*/

a {
    font-family: RobotoRegular;
    font-size: 14px;
    color: var(--cnam-black-color);
    border-bottom: 2px solid var(--cnam-green-color);
}

    a:visited {
        color: inherit;
    }

    a:focus,
    a:hover {
        color: var(--cnam-red-color);
    }

.noBorder {
    border: none !important;
}

a.small {
    font-size: 12px;
    margin-left: 10px;
}

a.ui-dialog-titlebar-close {
    border: none;
}

/*#endregion link*/

/*#region breadcrumb*/

.breadcrumb {
    display: flex;
    align-items: center;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 5px auto;
    font-family: OswaldRegular;
    font-size: 13px;
    max-width: 1024px;
    flex-wrap: wrap;
    padding: 0 10px;
}

    .breadcrumb a {
        border-bottom: none;
        font-family: OswaldRegular;
        font-size: inherit;
    }

    .breadcrumb i:not(:first-child) {
        padding: 0 10px;
    }

    .breadcrumb li.active {
        color: var(--cnam-medium-gray-color);
    }

    .breadcrumb li:not(:last-child):not(:first-child) a {
        color: var(--cnam-gray-color);
    }

        .breadcrumb li:not(:last-child):not(:first-child) a:hover {
            color: var(--cnam-medium-gray-color);
        }

/*#endregion breadcrumb*/

/*#region background color*/

.backgroundGray {
    background-color: var(--cnam-light-gray-color);
}

.backgroundMediumGray {
    background-color: var(--cnam-light-medium-gray-color);
}

.backgroundEasyGray {
    background-color: var(--cnam-easy-gray-color);
}

.backgroundWhite {
    background-color: var(--cnam-white-color);
}

.backgroundLightGreen {
    background-color: var(--cnam-light-green-color);
}

.backgroundEasyGreen {
    background-color: var(--cnam-easy-green-color)
}

.backgroundMediumGreen {
    background-color: var(--cnam-medium-green-color);
}

.backgroundGreen {
    background-color: var(--cnam-green-color);
}

.backgroundSable {
    background-color: var(--cnam-sable-color);
}

/*#endregion background color*/

/*#region displayPost*/

.displayPosts-Calendar,
.displayPosts-Calendar .displayPosts-list {
    display: flex;
    flex: 1 0 100%;
}

    .displayPosts-Calendar .displayPosts-list ul {
        display: flex;
        flex: 1 0 100%;
        margin: 0;
        padding: 0;
        list-style: none;
        flex-wrap: wrap;
    }

        .displayPosts-Calendar .displayPosts-list ul li {
            display: flex;
            flex: 1 0 0;
            text-align: left;
            float: none;
            width: auto;
            height: auto;
            margin: 0 10px;
            background: transparent;
        }

            .displayPosts-Calendar .displayPosts-list ul li:first-child {
                margin: 0 10px 0 0;
            }

            .displayPosts-Calendar .displayPosts-list ul li:last-child {
                margin: 0 0 0 10px;
            }

    .displayPosts-Calendar div.displayPosts-list ul li .padding-wrapper {
        position: static;
        height: auto;
        width: auto;
        background: none;
    }

    .displayPosts-Calendar .displayPosts-list ul li .padding-wrapper a figure img {
        display: flex;
        min-width: 0;
        z-index: auto;
        box-shadow: none;
        -webkit-box-shadow: none;
    }

    .displayPosts-Calendar .displayPosts-list ul li .padding-wrapper .post {
        position: static;
        left: auto;
        bottom: auto;
        background: none;
        height: auto;
        width: auto;
        min-height: 0;
        padding: 20px 0 0 0;
    }

        .displayPosts-Calendar .displayPosts-list ul li .post .post-title {
            height: auto;
        }

        .displayPosts-Calendar .displayPosts-list ul li .padding-wrapper .post .post-content {
            height: auto;
            margin-bottom: 20px;
        }

        .displayPosts-Calendar .displayPosts-list ul li .padding-wrapper .post .more {
            position: static;
            border: none;
            width: auto;
            display: flex;
            margin: 0;
            padding: 0;
            left: auto;
            bottom: auto;
            height: 24px;
        }

        .displayPosts-Calendar .displayPosts-list ul li .padding-wrapper .post .post-title h3,
        .displayPosts-Calendar .displayPosts-list ul li .padding-wrapper .post .post-title h3 a {
            color: inherit;
            position: static;
            font-family: OswaldBold;
            text-transform: none;
            line-height: 1.1;
            font-size: 22px;
            font-weight: 500;
            height: auto;
        }

            .displayPosts-Calendar .displayPosts-list ul li .padding-wrapper .post .post-title h3 a {
                border: none;
                font-size: 18px;
            }

/*#endregion displayPost*/

/*#region gallery*/

/*surcharge gallery*/

.galleryWebPart .galleryWebPartContainer .galleryWebPartDescription {
    margin: 5% 0 0 0;
    font-family: OswaldBold;
    font-size: 25px;
}

    .galleryWebPart .galleryWebPartContainer .galleryWebPartDescription p {
        text-align: center;
    }

.galleryWebPart .galleryWebPartContainer {
    justify-content: center;
    display: flex;
    padding: 2% 1% !important;
}

    .galleryWebPart .galleryWebPartContainer .galleryWebPartImage {
        flex: 0 0 200px !important;
        min-width: 0 !important;
        border-radius: 50%;
        border: 1px solid var(--cnam-green-color);
    }

div.galleryWebPart > div.galleryWebPartContainer > div.galleryWebPartImage {
}

/*#endregion gallery*/

/*#region textColumn*/
.text-column-2 {
    display: block;
    column-count: 2;
}

.text-column-3 {
    display: block;
    column-count: 3;
}

/*#endregion textColumn*/

/*#region padding */

.padding-5 {
    padding: 5px;
}

.padding-10 {
    padding: 10px;
}

.padding-0-10p {
    padding: 0 10%;
}

.padding-20 {
    padding: 20px;
}

.padding-sides-20 {
    padding: 0 20px;
}

.padding-30 {
    padding: 30px;
}

.padding-40 {
    padding: 40px;
}

.padding-50 {
    padding: 50px;
}

.padding-right-5 {
    padding-right: 5px;
}

.padding-right-10 {
    padding-right: 10px;
}

.padding-right-15 {
    padding-right: 15px;
}

.padding-right-20 {
    padding-right: 20px;
}

/*#endregion padding*/

/*#region margin */

.margin-sides {
    margin: 0 4px;
}

.margin-sides-10 {
    margin: 0 10px;
}

.margin-left-10 {
    margin-left: 10px;
}

.margin-top-bot-5-auto {
    margin: 5px auto;
}

.margin-top-bot-20 {
    margin: 20px 0;
}

.margin-10 {
    margin: 10px;
}

.margin-20 {
    margin: 20px;
}

.margin-30 {
    margin: 30px;
}

.margin-40 {
    margin: 40px;
}

.margin-50 {
    margin: 50px;
}

/* pour le content lorsque header avec annonce*/
.margin-top-70 {
    margin-top: 70px;
}
/*#endregion margin*/

/*#region color*/

.white {
    color: var(--cnam-white-color)
}

.black {
    color: var(--cnam-black-color)
}

.red {
    color: var(--cnam-red-color)
}

.light-gray {
    color: var(--cnam-light-gray-color)
}

.medium-gray {
    color: var(--cnam-medium-gray-color)
}

.gray {
    color: var(--cnam-gray-color)
}

.light-green {
    color: var(--cnam-light-green-color)
}

.medium-green {
    color: var(--cnam-medium-green-color)
}

.green {
    color: var(--cnam-green-color)
}

/*#endregion color*/

/*#region fontFam*/

.oswaldBold {
    font-family: OswaldBold;
}

.oswaldLight {
    font-family: OswaldLight;
}

.oswaldMedium {
    font-family: OswaldMedium;
}

.oswaldRegular {
    font-family: OswaldRegular;
}

.robotoRegular {
    font-family: RobotoRegular;
}

.robotoSlabRegular {
    font-family: RobotoSlabRegular;
}

/*#endregion fontFam*/

/*#region border*/

.border-bottom-red {
    border-bottom: 1px solid var(--cnam-red-color);
    margin-bottom: 20px;
}

.border-bottom-green {
    border-bottom: 1px solid var(--cnam-green-color);
    padding-bottom: 20px;
}

/*#endregion border*/

/*#endregion common*/

/*#region header*/

header.default {
    position: fixed;
    width: 100%;
    background: white;
    /*height: 140px;*/
    z-index: 10;
}

header.minimized {
    /*transform: translateY(-4.0625rem);*/
}

/*#region headerTop*/

header a {
    border: none;
}

header .logo {
    background-image: url('Images/logo.png');
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
    margin: 5px 0 5px;
}

header .search {
    padding: 0 20px;
}

header .search-form > form {
    border: 2px solid var(--cnam-light-gray-color);
}

header .search .grid-container,
header .search .grid-container .row,
header .search .grid-container .row .grid-col,
header .search .grid-container .row .grid-col .search-form,
header .search .grid-container .row .grid-col .search-form form {
    display: flex;
    flex: 1 0 100%;
}

    header .search .grid-container .row .grid-col .search-form form input {
        display: flex;
        flex: 1 0 90%;
        padding: 10px;
        border: none;
    }

    header .search .grid-container .row .grid-col .search-form form button {
        display: flex;
        flex: 1 0 10%;
        align-items: center;
        justify-content: center;
        border-radius: 0;
        margin: 0;
        padding: 0;
        color: var(--cnam-red-color);
        background-color: var(--cnam-white-color);
    }

        header .search .grid-container .row .grid-col .search-form form button span {
            color: var(--cnam-black-color);
            font-weight: bold;
            height: auto;
        }

header h1 {
    color: var(--cnam-black-color);
    font-size: 22px;
    margin-bottom: 10px;
}

header .phone {
    flex: 1 1 100%;
    font-family: OswaldBold;
    font-size: 18px;
    color: var(--cnam-black-color);
    align-items: center;
    margin-top: 15px;
}

    header .phone span {
        font-family: OswaldLight;
        color: var(--cnam-gray-color);
        font-size: 12px;
    }

header .cnamnet a {
    font-family: OswaldMedium;
    font-size: 16px;
    border-bottom: 2px solid var(--cnam-green-color);
}

header button {
    flex: 1 0 0;
    /*background-color: var(--cnam-light-gray-color);*/
    border: none;
    /*font-size: 14px;*/
    padding: 5px;
    background-color: var(--cnam-green-color);
    color: white;
    border-radius: 10px;
    font-family: OswaldLight;
    font-size: 18px;
    outline: none;
    cursor: pointer;
}

.ojc-cart {
    display: flex;
    align-items: center;
    transition: 0.5s ease-in-out;
    /*flex: 0 0 64px;
    width: 64px;*/
}

    .ojc-cart a {
        text-decoration: none;
        border: none;
        display: flex;
        /*flex: 1 0 0;*/
        width: 64px;
    }

        .ojc-cart a .cart-icon {
            width: 64px;
            background-image: url(Images/cart.png);
            flex: 0 0 64px;
        }

        .ojc-cart a .cart-count {
            font-size: 12px;
            font-style: normal;
            position: relative;
            top: -3px;
            left: -22px;
            color: white;
            background: black;
            height: 20px;
            width: 20px;
            text-align: center;
            border-radius: 10px;
            flex: 0 0 20px;
            line-height: 20px;
        }

    .ojc-cart.grow {
        /*transform: scale(1.2);*/
        animation: bounce 0.5s ease infinite
    }

@keyframes bounce {
    from {
        transform: translate(0, -8px);
    }

    50% {
        transform: translate(0, 0);
    }

    to {
        transform: translate(0, -8px);
    }
}

/*#endregion headerTop*/

/*#region headerBot*/

/*#region menu*/

header .mainMenu {
    border: 1px solid #DDD;
}

/*#region menuLvl0*/

header ul.menu {
    display: flex;
    flex: 1 0 100%;
    align-items: center;
    list-style: none;
    position: relative;
    margin: 0;
    padding: 0;
    height: 40px;
}

    header ul.menu span.icon {
        display: none;
    }

    header ul.menu > li {
        display: flex;
        align-items: center;
        height: 100%;
        cursor: pointer;
        flex-wrap: wrap;
    }

    header ul.menu > li:hover {
        background-color: var(--cnam-menu-1-color);
        transition: 0.5s ease all;
    }

        header ul.menu > li > a {
            font-family: OswaldBold;
            font-size: 18px;
            padding: 10px 18px;
            color: var(--cnam-red-color);
            border: none;
            transition: 0.5s ease all;
        }

        header ul.menu > li:hover > a {
            color: var(--cnam-black-color);
            transition: 0.5s ease all;
        }

        header ul.menu > li > a:hover {
            color: var(--cnam-red-color);
            transition: 0.5s ease all;
        }

/*#endregion menuLvl0*/

    /*#region menuLvl1*/

    header ul.menu > li.simple-menu > ul {
        display: none;
    }

    header ul.menu > li.simple-menu:hover > ul {
        display: block;
        position: absolute;
        top: 40px;
        padding: 0;
        background-color: var(--cnam-menu-1-color);
        animation: fadeIn 0.5s;
        transition: 0.5s ease all;
    }

        header ul.menu > li.simple-menu:hover > ul > li {
            list-style: none;
        }

        header ul.menu > li.simple-menu:hover > ul > li:hover {
            background-color: var(--cnam-menu-2-color);
            transition: 0.5s ease all;
        }

            header ul.menu > li.simple-menu > ul > li > a {
                font-family: OswaldMedium;
                font-size: 16px;    
                display: block;
                padding: 10px 18px;
            }

    /*#endregion menuLvl1*/

    /*#region menuLvl1*/

    header ul.menu > li.big-menu > ul {
        display: none;
        flex-wrap: wrap;
        position: absolute;
        left: 0;
        top: 40px;
        width: 1024px;
        height: 450px;
        padding: 0;
        list-style: none;
        z-index: 1;
        background-color: var(--cnam-menu-1-color);
        align-content: flex-start;
        transition: 0.5s ease all;    
        overflow-y: auto;
        overflow-x: hidden;
    }

        header ul.menu > li.big-menu.services-menu > ul {
            left: 485px;
            width: 540px;
        }

        header ul.menu > li.big-menu:hover > ul {
            display: flex;
            animation: fadeIn 0.5s;
        }

        header ul.menu > li.big-menu > ul > li {
            display: flex;
            flex: 1 0 100%;
            align-items: center;
        }

        header ul.menu > li.big-menu:hover > ul > li:first-child {
            background-color: var(--cnam-menu-2-color);
            border-right: none;
            transition: 0.5s ease all;
        }

        header ul.menu > li.big-menu > ul:hover > li:first-child {
            background-color: var(--cnam-menu-1-color);
        }

        header ul.menu > li.big-menu > ul > li:hover {
            background-color: var(--cnam-menu-2-color) !important;
            border-right: none;
            transition: 0.5s ease all;
        }

            header ul.menu > li.big-menu > ul > li:hover > a {
                color: var(--cnam-black-color);
                transition: 0.5s ease all;
            }

            header ul.menu > li.big-menu > ul > li > a {
                border: none;
                font-family: OswaldMedium;
                font-size: 16px;
                width: 260px;
                align-items: center;
                display: flex;
                padding: 10px 0 10px 15px;
                justify-content: space-between;
            }

            header ul.menu > li.big-menu > ul > li > a:hover {
                color: var(--cnam-red-color);
                transition: 0.5s ease all;
            }

            header ul.menu > li.big-menu > ul > li.has-children > a:after {
                content: "\f054";
                font: normal normal normal 14px/1 FontAwesome;
                float: right;
                line-height: 30px;
            }

    /*#endregion menuLvl1*/

        /*#region menuLvl2*/

        header ul.menu > li.big-menu > ul > li > ul {
            display: none;
            transition: 0.5s ease all;
            column-count: 3;            
            column-gap: 20px;
            column-rule: 1px solid var(--cnam-light-gray-alpha-color);
            column-fill: balance;
            position: absolute;
            list-style: none;
            left: 280px;
            top: 0;
            width: 744px;
            background-color: var(--cnam-menu-2-color);
            z-index: 2;
            padding: 10px;
            min-height: 450px;
        }

        header ul.menu > li.big-menu.services-menu > ul > li > ul {
            width: 260px;
            column-count: unset;
        }

        header ul.menu > li.big-menu:hover > ul > li:first-child > ul {
            display: inline-block;
        }

        header ul.menu > li.big-menu:hover > ul:hover > li:first-child > ul {
            display: none;
        }

        header ul.menu > li.big-menu:hover > ul:hover > li:hover > ul {
            display: inline-block;
        }

            header ul.menu > li.big-menu > ul > li > ul > li {
                break-inside: avoid;
            }

                header ul.menu > li.big-menu > ul > li > ul > li > a {
                    border: none;
                    font-family: OswaldMedium;
                    color: var(--cnam-black-color);
                    font-size: 15px;
                    line-height: 18px;
                    transition: 0.5s ease all;
                }
                header ul.menu > li.big-menu.services-menu > ul > li > ul > li > a {
                    padding: 10px 18px;
                    display: block;
                    line-height: unset;
                }

                    header ul.menu > li.big-menu > ul > li > ul > li > a:hover {
                        color: var(--cnam-red-color);
                        transition: 0.5s ease all;
                    }

        /*#endregion menuLvl2*/

            /*#region menuLvl3*/

            header ul.menu > li.big-menu > ul > li > ul > li > ul {
                padding: 5px 0 5px 15px;
                list-style-type: disc;
            }

                header ul.menu > li.big-menu > ul > li > ul > li > ul > li {
                    line-height: 18px;
                    padding: 0 10px 0 0;
                }

                    header ul.menu > li.big-menu > ul > li > ul > li > ul > li > a {
                        border: none;
                        font-family: RobotoRegular;
                        color: var(--cnam-black-color);
                        font-size: 14px;
                        line-height: 20px;
                        transition: 0.5s ease all;
                    }

                        header ul.menu > li.big-menu > ul > li > ul > li > ul > li > a:hover {
                            color: var(--cnam-red-color);
                            transition: 0.5s ease all;
                        }

            /*#endregion menuLvl3*/

/*#endregion menu*/

/*#region news*/

.blog-text > div {
    display: flex;
    flex: 1 0 100%;
    font-family: OswaldLight;
    color: var(--cnam-black-color);
    font-size: 22px;
    margin-bottom: 10px;
    margin-top: 0.67em;
}

header .blog {
    display: flex;
    flex: 1 0 100%;
    flex-wrap: wrap;
}

    header .blog .blogPostFragment {
        display: flex;
        flex: 1 0 100%;
        line-height: initial;
    }

        header .blog .blogPostFragment > div {
            display: flex;
            flex: 1 0 100%;
            padding: 0 20px;
            align-items: center;
            font-family: RobotoRegular;
            line-height: 20px;
        }

            header .blog .blogPostFragment > div > div {
                flex: 0 0 250px;
                margin: 0;
                align-items: center;
                color: var(--cnam-green-color);
                font-family: OswaldLight;
                font-size: 22px;
            }

            header .blog .blogPostFragment > div > p {
                flex: 2 0 0;
                margin: 0;
            }

/*#endregion news*/

/*#endregion headerBot*/

/* #region header.minimized */


header.minimized > div:first-child {
    padding: 5px;
}

header.minimized > div .bot {
    margin-bottom: 0;
}

header.minimized .logo {
    margin: 0;
}

header.minimized .search {
    flex: 6;
}

    header.minimized .search .blog-post {
        display: none;
    }

header.minimized .header-top-right {
    flex: 2;
}

    header.minimized .header-top-right .phone {
        display: none;
        /*margin: 0px;*/
    }

header.minimized .annonce {
    display: none;
}

header.minimized .cnamnet {
    display: none;
}

/* #endregion header.minimized*/


/*#endregion header*/

/*#region content*/

/*#region search*/

.searchFilter {
    display: flex;
    flex: 1 0 0;
    padding-right: 20px;
    border-right: 1px solid var(--cnam-black-color);
}

    .searchFilter button#filterButton {
        display: none;
    }

    .searchFilter h2 {
        color: var(--cnam-red-color);
        border-top: 2px solid var(--cnam-red-color);
        margin: 0 10px 10px 0;
        padding: 10px 0 0 0;
    }

    .searchFilter div {
        font-size: 16px;
        font-family: RobotoSlabRegular;
        font-weight: 600;
    }

    .searchFilter p {
        font-weight: 500;
    }

    .searchFilter ul {
        list-style: none;
        padding-left: 5%;
    }

    .searchFilter .filterList {
        padding-left: 0;
    }

        /* For the selectors */
        .searchFilter .filterList > li > span {
            padding-left: 5%;
            display: block;
        }

        .searchFilter .filterList .options li {
            display: flex;
        }

        .searchFilter .filterList .options label {
            padding-left: 10px;
            font-size: 14px;
            font-weight: 400;
            width: 90%;
        }

    .searchFilter .ojcControl {
        flex: 1 0 100%;
    }


.searchResults {
    display: flex;
    flex: 2 0 0;
    padding: 0 2%;
    flex-wrap: wrap;
    align-content: flex-start;
}

    .searchResults .searchOrder {
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        font-family: OswaldLight;
        border-bottom: 1px solid var(--cnam-light-medium-gray-color);
    }


        .searchResults .searchOrder .resultsCount {
            font-weight: 600;
        }        
        
        .searchResults .searchOrder .orderCriteriaBlock {
            white-space: nowrap;
        }

        .searchResults .searchOrder .orderCriteriaBlock label {
            font-weight: inherit;
            margin-bottom: 0;
        }

        .searchResults .searchOrder .ojcSelect2 {
            display: inline-flex;
            font-weight: 600;
        }
            .searchResults .searchOrder .ojcSelect2 .select2-container--default .select2-selection--single {
                border: none;
                background: none;
            }
                .searchResults .searchOrder .ojcSelect2 .select2-container--default .select2-selection--single:focus {
                    outline-color: var(--cnam-green-color);
                }

    .searchResults .mainGridTable {
        border: none;
        background: transparent;
    }

        .searchResults .mainGridTable table.datagrid > tbody {
            padding: 0;
        }

        .searchResults .mainGridTable .datagrid-striped > tbody > tr:nth-child(odd) > td,
        .searchResults .mainGridTable .datagrid-striped > tbody > tr:nth-child(odd) > th,
        .searchResults .mainGridTable .datagrid-striped > tbody > tr:nth-child(even) > td,
        .searchResults .mainGridTable table.datagrid > tbody .item {
            background: transparent;
        }

            .searchResults .mainGridTable table.datagrid > tbody .item td {
                border-top: none;
                padding: 0;
            }

    .searchResults .searchResultItem {
        display: flex;
        flex: 1 0 100%;
        padding: 1% 0 2% 0;
        border-bottom: 2px solid var(--cnam-medium-green-color);
        flex-wrap: wrap;
    }

        .searchResults .searchResultItem > h3 {
            margin: 1% 0;
        }

            .searchResults .searchResultItem > h3 > a {
                font-size: 22px;
                border-bottom: none;
                font-family: OswaldLight;
            }

        .searchResults .searchResultItem > p {
            flex: 1 0 100%;
            font-size: 14px;
            text-align: justify;
        }

        .searchResults .searchResultItem > .searchResultItemFooter {
            display: flex;
            flex: 1 0 100%;
            justify-content: space-between;
            align-items: center;
            margin: 10px 0 0 0;
        }

        .searchResults .searchResultItem > div.searchResultItemFooter > a {
            font-size: 14px;
        }

        .searchResults .searchResultItem > div.searchResultItemFooter > div.searchResultItemFooterSelect > a {
            display: flex;
        }

            .searchResults .searchResultItem > div.searchResultItemFooter > div.searchResultItemFooterSelect > a > span {
                display: flex;
                align-items: center;
                margin: 0 0 0 10px;
            }

/*#endregion search*/

/*#region homePage*/

/*#region mapList*/

.mapList h2 {
    align-items: center;
    margin-left: 10px;
}

.mapList nav {
    display: flex;
}

.mapList ul {
    font-family: OswaldBold;
    display: flex;
    flex: 1 0 100%;
    flex-wrap: wrap;
    margin: 0;
}

    .mapList ul li {
        display: list-item;
        flex: 1 0 100%;
        font-size: 18px;
        margin: auto;
    }

        .mapList ul li.active,
        .mapList ul li.active a,
        .mapList ul li:hover a,
        .mapList ul li:hover {
            color: var(--cnam-red-color);
        }

        .mapList ul li a {
            border: none;
            font-size: 18px;
            font-family: OswaldMedium;
        }

.foad a {
    font-size: 18px;
    font-family: OswaldMedium;
}

/*#endregion mapList*/

/*#endregion homePage*/


    .caption p {
        display: flex;
        align-items: center;
        font-size: 12px;
        padding-right: 10px;
        flex: initial;
    }

/*#region product*/

.productIllustration {
    /* min-height: 250px; */
}

    .productIllustration .productMedia {
        margin-right: 20px;
        min-height: 250px;
    }

        .productIllustration .productMedia img {
            max-width: 100%;
        }

    .productIllustration .productStat {
        align-items: flex-start;
    }

        .productIllustration .productStat p {
            flex: 1 0 100%;
            vertical-align: baseline;
            font-size: 14px;
            font-family: OswaldLight;
            font-style: italic;
            padding: 10px 15px;
            flex-wrap: wrap;
        }

            .productIllustration .productStat p span {
                font-size: 20px;
                display: flex;
                flex: 1 0 100%;
                font-style: normal;
            }

.productTab .anchor {
    display: block;
    height: 100px;
    width: 100%;
    margin-top: -100px;
    visibility: hidden;
}

.productTab ul {
    list-style: none;
}

    .productTab ul li::before {
        content: "\2022";
        color: var(--cnam-red-color);
        font-weight: bold;
        display: inline-block;
        width: 16px;
    }

    .productTab ul li a {
        font-size: 16px;
        font-family: OswaldRegular;
        line-height: 24px;
    }

        .productTab ul li a:hover {
            border-bottom: 2px solid var(--cnam-green-color);
        }

.productInformation {
    display: block;
}

    .productInformation button{
        flex: 1 0 100%;
    }

    .productInformation .backgroundGray {
        height: 80%;
    }

.productTab .productTabLine {
    margin-top: 20px;
    justify-content: flex-start;
}

.productTab .productTabLine .btn {
    margin: 0;
}

.productTab .productTabLine button:last-child {
    margin-right: 0;
}

.productTab .planning-sessions {
    width: 100%;
}

div.mainGridTable > table.background-gray thead tr th,
table.productTabCosts thead tr th {
    background-color: var(--cnam-light-medium-gray-color);
    color: var(--cnam-black-color);
    font-family: RobotoSlabRegular !important;
    text-align: center;
    vertical-align: middle;
    font-weight: bold !important;
}

div.mainGridTable > table.background-gray tbody tr td,
div.mainGridTable > table.background-gray thead tr th,
table.productTabCosts tbody tr td,
table.productTabCosts > thead > tr > th {
    border: 1px solid var(--cnam-light-medium-gray-color) !important;
}

div.mainGridTable > table.background-gray thead tr th,
table.productTabCosts > thead > tr > th {
    font-size: 12px;
}

div.mainGridTable > table.background-gray tbody tr td,
table.productTabCosts tbody tr td {
    font-size: 12px;
}

.datagrid-striped > tbody > tr:nth-child(odd) > td, .datagrid-striped > tbody > tr:nth-child(odd) > th {
    background-color: var(--cnam-white-color);
}

/*#region productCosts*/

table.productTabCosts {
    width: 100%;
    border-collapse: collapse;
}

    table.productTabCosts > tbody > tr > td {
        text-align: center !important;
    }

    table.productTabCosts thead th {
        padding: 5px 10px;
        font-weight: normal;
    }



/*#endregion productCosts*/

    /*#region diploma tabProgram*/

.diploma .selector {
    margin: 0 0 0 10px;
    padding: 5px;
    border-radius: 5px;
}

.diploma input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    border-radius: 4px;
    height: 20px;
    width: 20px;
    background: #fff;
    border: 2px solid var(--cnam-light-medium-gray-color);
}

    .diploma input[type="checkbox"]:checked::before {
        font-family: FontAwesome;
        content: '\f00c';
        display: block;
        color: var(--cnam-green-color);
        font-size: 25px;
        margin: -8px 0px 0px -2px;
    }

.diploma table {
    border-collapse: collapse;
    border: 1px solid var(--cnam-light-medium-gray-color);
    width: 100%;
}

    .diploma table tbody tr.entete td,
    .diploma table thead tr th {
        border-top: 1px solid var(--cnam-light-medium-gray-color);
        padding: 5px 10px;
        text-transform: uppercase;
    }

.diploma table tbody tr.product td {
	border-top: 1px solid var(--cnam-light-medium-gray-color);
	padding: 0px 10px;
}

    .diploma table thead tr th {
        font-family: OswaldLight;
        font-weight: normal;
        text-align: center;
    }

    .diploma table tbody tr td div {
        justify-content: center;
    }

	.diploma table tbody tr td h2 {
		margin: 0px;
	}

		.diploma table tbody tr td h2 a {
			font-family: OswaldMedium;
			color: var(--cnam-red-color);
			border-bottom: none;
			line-height: 22px;
		}

			.diploma table tbody tr td h2 a span {
				font-family: OswaldRegular;
				font-size: 14px;
			}

    .diploma table tbody tr .checkbox {
        height: 50px;
    }

.diploma table tbody td[colspan="6"] {
    font-family: OswaldMedium;
    background-color: var(--cnam-green-color);
    color: var(--cnam-black-color);
}

.diploma .competenciesBlockTab table tbody td[colspan="6"] {
	background-color: var(--cnam-easy-gray-color);
}


.diploma table tbody td.backgroundEasyGray[colspan="6"] {
    background-color: var(--cnam-easy-gray-color);
    padding: 0 10px;
    text-transform: none;
}

.column-flex {
    display: flex;
    flex-direction: column;
    margin-right: 2px;
}

.space-between {
    justify-content: space-between;
}

.flex-1-100 .flex-1.block:first-child p {
    padding-right: 20px;
}
.diploma input#allChecked {
    vertical-align: bottom;
}
		/*#endregion diploma tabProgram*/
	
    /*#endregion product*/

/*#region teachingCenterInformation*/

.teachingCenterInformation {
    display: block;
    padding: 0 10px;
}

    .teachingCenterInformation div {
        margin: 15px 0px 15px 0px;
        display: flex;
        flex: 1 0 100%;
        font-size: 22px;
        line-height: 1.1;
    }

    .teachingCenterInformation p {
        margin-bottom: 6px;
    }

        .teachingCenterInformation p:not(.oswaldMedium) {
            font-size: 14px;
        }

/*#endregion teachingCenterInformation*/

/*#region offers*/

.teachingCenterOffer {
    border: 1px solid var(--cnam-black-color);
    padding: 50px 30px;
    display: flex;
    flex-wrap: wrap;
    margin-right: 20px;
    justify-content: center;
    align-items: center;
}

    .teachingCenterOffer div {
        font-size: 36px;
        justify-content: center;
        margin-top: 0;
        display: flex;
        flex: 1 0 100%;
        font-weight: 500;
        line-height: 1.1;
        margin-bottom: 15px;
    }

/*#endregion offers*/

/*#region Pole*/

.poleDiplomaLevel {
    display: flex;
    flex: 1 0 100%;
}

    .poleDiplomaLevel input {
        display: none;
    }

    .poleDiplomaLevel > ul {
        display: flex;
        flex: 1 0 100%;
        flex-wrap: wrap;
        margin: 0;
        padding: 0;
    }

        .poleDiplomaLevel > ul > li {
            flex: 1 0 100%;
            margin: 5px 0;
            list-style: none;
            border-right: 1px solid var(--cnam-green-color);
            border-bottom: 1px solid var(--cnam-green-color);
        }

            .poleDiplomaLevel > ul > li > h2 {
                margin: 0;
                font-family: inherit
            }

                .poleDiplomaLevel > ul > li > h2 > label {
                    display: flex;
                    flex: 1 0 100%;
                    justify-content: space-between;
                    align-items: center;
                    font-weight: bold;
                    cursor: pointer;
                    margin: 0 0 10px 0;
                    color: var(--cnam-red-color);
                    font-size: 16px;
                }

                    .poleDiplomaLevel > ul > li > h2 > label span {
                        padding: 0 20px;
                    }

            .poleDiplomaLevel > ul > li > input:checked ~ ul {
                display: none;
            }

            .poleDiplomaLevel > ul > li > input:checked ~ h2 > label > span {
                transform: rotate(180deg);
            }

            .poleDiplomaLevel > ul > li > ul {
                padding: 0 10px 10px 10px;
            }

                .poleDiplomaLevel > ul > li > ul > li {
                    list-style: none;
                    margin: 5px 0;
                }

                    .poleDiplomaLevel > ul > li > ul > li > a {
                        font-family: RobotoSlabRegular;
                        border: none;
                    }

                        .poleDiplomaLevel > ul > li > ul > li > a::before {
                            color: var(--cnam-red-color);
                            font-weight: bold;
                            display: inline-block;
                            width: 16px;
                            content: "\2022";
                        }

/*#endregion Pole*/

/*#region Cart*/

.input-group {
    display: flex;
    flex: 1 0 100%;
    justify-content: space-between;
    margin: 10px 0;
    flex-wrap: wrap;
}

	.input-group input,
	.input-group select,
	.input-group option,
	.input-group span input {
		font-family: RobotoRegular;
		padding: 10px;
		border: 2px solid var(--cnam-light-gray-color);
		font-size: 14px;
		height: 42px;
		width: 100%;
	}

    .input-validation-error {
        border: 1px solid var(--cnam-red-color) !important;
    }

		.input-group input[type="radio"],
		.input-group input[type="checkbox"] {
			width: inherit;
		}

        .input-group input::placeholder,
        .input-group select::placeholder,
        .input-group option::placeholder {
            font-size: 14px;
            font-family: RobotoRegular;
        }

    .input-group .input-field {
        display: flex;
        flex-direction: column;
        flex: 1 0 0;
        padding: 0 20px 0 0;
        min-width: 200px;
    }


    .input-group .input-row {
        display: flex;
        flex-direction: row;
        flex: 1 0 0;
        padding: 0 20px 0 0;
        align-items: center;
    }

        .input-group .input-row label {
            margin: 0;
            white-space: nowrap;
        }

        .input-group#PayByCC .input-row label {
            font-weight: normal;
        }

		.input-group .input-row input[type="radio"] {
			margin: auto 5px;
		}

        .input-group .input-field span {
            height: 42px !important;
        }

            .input-group .input-field span.select2-selection__rendered {
                display: flex;
                align-items: center;
            }

            .input-group .input-field span.select2-selection--single {
                font-family: RobotoRegular;
                border: 2px solid var(--cnam-light-gray-color);
                font-size: 14px;
                border-radius: 0;
                outline: none;
            }

.select2-dropdown {
    border-radius: 0;
    border: 2px solid var(--cnam-light-gray-color);
}

    .select2-dropdown .select2-results__option--highlighted {
        background-color: var(--cnam-green-color) !important;
        color: var(--cnam-white-color) !important;
    }

    .select2-dropdown .select2-results__option {
        font-size: 14px;
    }

.select2-container--default .select2-selection--single {
    height: 42px;
}

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        line-height: 42px;
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 41px;
    }

.input-group .input-field .field-validation-error {
    margin: 10px 0 0 0;
}

.toolbar-button {
    display: flex;
    flex: 1 0 100%;
    justify-content: space-between;
    margin: 30px 0;
}

    .toolbar-button.flex-start button:only-child {
        margin-left: unset;
    }

    .toolbar-button button:only-child,
    .toolbar-button input:only-child {
        margin-left: auto
    }

#simulation .simulation-content {
    display: flex;
    flex: 1 0 100%;
    flex-wrap: wrap;
}

    #simulation .simulation-content > form {
        flex: 1 0 100%;
    }

    #simulation .simulation-content > .detail {
        font-size: 12px;
    }

#simulation table#cart-simulation {
    width: 100%;
    border-radius: 10px;
    border-spacing: 10px;
    font-family: RobotoRegular;
    margin: 0 0 10px 0;
}

    #simulation table#cart-simulation > tbody > tr > td {
        border: 1px solid var(--cnam-green-color);
        padding: 2px;
        border-radius: 10px;
        text-align: center;
    }

    #simulation table#cart-simulation table {
        width: 100%;
    }

        #simulation table#cart-simulation table tr {
            display: flex;
        }

            #simulation table#cart-simulation table tr td,
            #simulation table#cart-simulation table tr th {
                flex: 1 0 0;
            }

            #simulation table#cart-simulation table tr:nth-child(2) td:nth-child(1) {
                flex: 0 0 0;
            }

#simulation table .removeCompetenciesBlockProduct,
#simulation table .removeButton {
    border: none;
}

#simulation .financing-simulation {
    display: flex;
    flex: 1 0 100%;
    flex-wrap: wrap;
    margin: 0 0 10px 0;
}

    #simulation .financing-simulation div {
        display: flex;
        flex: 1 0 100%;
        justify-content: flex-end;
    }

    /*#simulation .financing-simulation #Individual-simulation p,
    #simulation .financing-simulation .total p {
        background-color: var(--cnam-green-color);
        color: var(--cnam-white-color);
    }*/


        #simulation .financing-simulation div p {
            display: flex;
            padding: 5px;
            width: 330px;
            justify-content: flex-end;
            /* padding-right: 40px; */
            align-items: center;
        }

        #simulation .financing-simulation div p span {
            display: flex;
            width: 100px;
            justify-content: center;
            border-bottom: 1px solid var(--cnam-green-color);
            margin: 0 0 0 10px;
            align-items: center;
            padding: 5px 0;
        }

		#simulation .financing-simulation div#Individual-simulation p span {
			background-color: var(--cnam-green-color);
			color: var(--cnam-white-color);
		}

#simulation .wizard {
    display: flex;
    flex: 1 0 100%;
    flex-wrap: wrap;
}

    #simulation .wizard .title-1 {
        flex: 1 0 0;
        justify-content: flex-start;
        align-items: center;
        padding: 0 0 0 60px;
        font-family: 'OswaldBold';
        font-size: 36px;
    }

#simulation .wizard .logo {
    background-image: url(Images/logo.png);
    flex: 1 0 100%;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 200px;
    height: 100px;
    background-size: contain;
    margin: 0 auto;
}

    #simulation .wizard .step {
        display: flex;
        flex: 3 0 0;
        height: 100px;
        padding: 0;
        position: relative;
        margin: 0 10px;
    }

        #simulation .wizard .step:before {
            top: 35px;
            bottom: 0;
            position: absolute;
            content: " ";
            width: 100%;
            height: 2px;
            background-color: var(--cnam-green-color);
        }

        #simulation .wizard .step li {
            list-style: none;
            display: flex;
            flex: 1 0 0;
            justify-content: center;
            align-items: center;
            flex-direction: column;
        }

            #simulation .wizard .step li.active span {
                background-color: var(--cnam-medium-green-color);
                color: var(--cnam-white-color);
            }

            #simulation .wizard .step li span {
                border: 2px solid var(--cnam-green-color);
                width: 32px;
                height: 32px;
                border-radius: 50%;
                display: flex;
                justify-content: center;
                align-items: center;
                margin-bottom: 10px;
                background-color: var(--cnam-white-color);
                z-index: 1;
            }

#simulation .simulation-content[name^="step"] {
    display: none;
}

#simulation .simulation-content.active {
    display: flex;
}


#simulation .simulation-content .title-1 {
    font-size: 20px;
    line-height: 1em;
    margin-top: 30px;
}

#simulation .simulation-content .ojcGrid {
	width: 100%
}

#simulation .simulation-content .mainGridTable table tfoot {
    display: none;
}

#simulation .simulation-content table.datagrid > thead > tr.colHeader > th {
	background-color: var(--cnam-light-gray-color);
}

#simulation form {
    width: 100%
}

#simulation .select2-selection__clear {
    margin: auto 5px;
}

.select2-dropdown .select2-results__option--highlighted,
table.datagrid .selected,
table.datagrid .selected > td,
table.datagrid .selected > th {
    background-color: var(--cnam-light-gray-alpha-color) !important;
    color: black !important;
}

    .cart-footer p {
        padding: 10px 0;
    }

    .cart-footer a, 
    .cart-footer a:visited {
        color: black;
    }

.cart-header .ojc-cart {
    display: none;
}

#simulation .simulation-content .user-action {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 10px;
}
#simulation .simulation-content .user-action > button {
	flex: 0 0 200px;
}


/*#endregion Cart*/

/*#region DiplomaCursus*/

.diplomaCursus > .wizard .logo {
    height: 4em;
    background-position: left !important;
}

.diplomaCursus > .wizard .step li span {
    margin-top: 15px;
}

.diplomaCursus .wizard {
    height: auto !important;
}

.diplomaCursus .simulation-content {
    margin-top: 5%;
}

.diplomaCursus .flex-1-100 > button {
    height: 50px;
}

.diplomaCursus .ojc-checkboxgrid.ojcControl table thead,
.diplomaCursus .ojc-checkboxgrid.ojcControl table tbody tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.diplomaCursus .ojc-checkboxgrid.ojcControl {
    display: flex;
    flex: 1 0 0;
    flex-wrap: wrap;
}

    .diplomaCursus .ojc-checkboxgrid.ojcControl table {
        border-collapse: collapse;
        text-align: center;
        color: var(--cnam-light-medium-gray-color);
    }

        .diplomaCursus .ojc-checkboxgrid.ojcControl table thead,
        .diplomaCursus .ojc-checkboxgrid.ojcControl table tbody tr {
            display: table;
            width: 100%;
            table-layout: fixed;
        }

        .diplomaCursus .ojc-checkboxgrid.ojcControl table tbody {
            display: block;
            max-height: 600px;
            overflow-y: scroll;
            border-bottom-style: solid;
            border-color: var(--cnam-light-medium-gray-color);
            scrollbar-width: thin;
        }

            .diplomaCursus .ojc-checkboxgrid.ojcControl table tbody::-webkit-scrollbar {
                width: 5px;
            }

            .diplomaCursus .ojc-checkboxgrid.ojcControl table tbody::-webkit-scrollbar-thumb {
                background-color: var(--cnam-green-color);
            }

            .diplomaCursus .ojc-checkboxgrid.ojcControl table tbody::-webkit-scrollbar-track {
                background-color: var(--cnam-light-gray-color);
            }

    .diplomaCursus .ojc-checkboxgrid.ojcControl thead {
        border-right-style: solid;
        border-color: var(--cnam-light-medium-gray-color)
    }

    .diplomaCursus .ojc-checkboxgrid.ojcControl thead th {
        padding: 5px 10px;
        border-left-style: solid;
        border-top-style: solid;
        color: var(--cnam-medium-gray-color);
        border-color: var(--cnam-light-medium-gray-color)
    }

        .diplomaCursus .ojc-checkboxgrid.ojcControl thead tr:first-child th:nth-child(3),
        .diplomaCursus .ojc-checkboxgrid.ojcControl thead tr:first-child th:nth-child(4) {
            border-left-width:5px;
        }

        .diplomaCursus .ojc-checkboxgrid.ojcControl thead tr:last-child th:nth-child(4),
        .diplomaCursus .ojc-checkboxgrid.ojcControl thead tr:last-child th:nth-child(6) {
            border-left-width: 5px;
        }

    .diplomaCursus .ojc-checkboxgrid.ojcControl td {
        padding: 5px 10px;
        border-top-style: solid;
        border-left-style: solid;
        border-color: var(--cnam-light-medium-gray-color);
    }

        .diplomaCursus .ojc-checkboxgrid.ojcControl tr td[colspan="2"],
        .diplomaCursus .ojc-checkboxgrid.ojcControl tr td:not([colspan="2"]):nth-child(2n+0) {
            border-left-width: 5px;
        }

    .diplomaCursus .ojc-checkboxgrid.ojcControl tr.event td:nth-child(2) {
        border-left-color: var(--cnam-black-color);
        border-left-width: 2px;
    }

    .diplomaCursus .ojc-checkboxgrid.ojcControl th:first-child {
        border: none;
        width: 25%;
    }

    .diplomaCursus .ojc-checkboxgrid.ojcControl td.header {
        padding: 0;
        border-right-color: var(--cnam-light-medium-gray-color) !important;
    }

        .diplomaCursus .ojc-checkboxgrid.ojcControl td.header > .title-3 {
            text-decoration: none;
        }

    .diplomaCursus .ojc-checkboxgrid.ojcControl td:first-child {
        color: var(--cnam-black-color);
        border-right-style: solid;
        width: 25%;
    }

    .diplomaCursus .ojc-checkboxgrid.ojcControl tr.event td:first-child {
        border-right-color: var(--cnam-black-color);
    }

    .diplomaCursus .ojc-checkboxgrid.ojcControl tr.eventGroup td.lineHeader {
        border-left-color: var(--cnam-light-medium-gray-color);
        padding: 10px;
    }

        .diplomaCursus .ojc-checkboxgrid.ojcControl tr.eventGroup td.lineHeader a {
            font-family: oswaldMedium;
            font-size: 16px;
            color: var(--cnam-black-color);
        }

    .diplomaCursus .ojc-checkboxgrid.ojcControl tr.eventGroup td.header {
        text-align: initial;
        font-size: 18px;
    }

        .diplomaCursus .ojc-checkboxgrid.ojcControl tr.eventGroup td.header div.title-4 {
            color: var(--cnam-red-color);
        }

    .diplomaCursus .ojc-checkboxgrid.ojcControl tr.event td:last-child {
        border-right-style: solid;
    }

    .diplomaCursus .ojc-checkboxgrid.ojcControl td > .title-3 {
        font-size: 18px;
        text-decoration: underline;
    }

    .diplomaCursus .ojc-checkboxgrid.ojcControl td:first-child > div > span {
        padding: 5px 10px;
        text-decoration: underline;
    }

    .diplomaCursus .ojc-checkboxgrid.ojcControl tr td input[type="checkbox"] {
        border-radius: 4px;
        height: 25px;
        width: 25px;
        background: #fff;
        border: 4px solid var(--cnam-green-color);
        -webkit-appearance: none;
        margin: 0;
    }

        .diplomaCursus .ojc-checkboxgrid.ojcControl tr td input[type="checkbox"]:checked::before {
            font-family: FontAwesome;
            content: '\f00c';
            display: block;
            color: var(--cnam-green-color);
            font-size: 30px;
            margin: -10px 0px 0px -2px;
        }

.btn.view-diplomaCursus {
    display: none;
}

.btn.view-diplomaCursus-active {
    display: flex;
}

.lineHeader {
    text-align: left;
}

/*#endregion DiplomaCursus*/

/*#region Posts actus*/
.content .blog {
    background-color: var(--cnam-white-color);
    display: flex;
    flex: 1 0 100%;
    flex-wrap: wrap;
    margin: 0 auto;
    max-width: 1024px;
    padding: 0 10px;
}

.customActus {
    display: flex;
    flex: 1 0 100%;
    flex-wrap: wrap;
}

.content .blog > .customActus {
    border-bottom: 2px solid var(--cnam-medium-green-color);
}

.customActus div {
    flex: 1 0 60%;
    display: flex;
    flex-wrap: wrap;
    margin: 10px 0;
    padding: 0 10px;
    align-content: flex-start;
}

.customActus img {
    flex: 1 0 40%;
    object-fit: contain;
    margin: 10px auto;
    max-height: 250px;
    max-width: 250px;
}

.customActus h1 {
    padding: 10px 0 0 0;
    font-weight: bold;
    border-top: 2px solid var(--cnam-black-color);
    color: var(--cnam-red-color);
    font-size: 27px;
    margin-top: 0px;
}

.customActus h2 {
    font-weight: bold;
    color: var(--cnam-red-color);
    font-size: 22px;
    margin: 10px 0;
}

.customActus p.signature {
    padding: 10px 0px;
    text-align: right;
}

.content .nextPosts {
    padding: 10px 0px;
    display: flex;
    justify-content: center;
    background-color: var(--cnam-white-color);
    display: flex;
    flex: 1 0 100%;
    flex-wrap: wrap;
    margin: 0 auto;
    max-width: 1024px;
}

    .content .nextPosts a {
        color: var(--cnam-white-color);
        border-bottom: none;
    }
/*#endregion Posts actus*/

/*#region sitemap*/
.sitemap a {
    border-bottom: none;
    font-family: OswaldLight;
}

/*#endregion sitemap*/
/*#endregion content*/
/*#region footer*/
footer {
    background-color: var(--cnam-white-color);
    display: flex;
    font-size: 12px;
}

    footer .content {
        min-height: 160px;
        padding: 0;
    }

    footer ul.menu {
        padding: 0;
        list-style: none;
        display: flex;
        flex-wrap: wrap;
        margin: 0;
    }

        footer ul.menu > li {
            flex: 1 0 50%;
            line-height: 12px;
            display: flex;
            align-items: center;
            height: auto;
        }

        footer ul.menu > li:nth-child(2n) {
            padding: 0 0 0 35px;
        }

            footer ul.menu > li:hover {
                color: var(--cnam-dark-red-color);
            }

            footer ul.menu > li:first-child {
                margin-top: 0px;
            }

            footer ul.menu > li > a {
                font-family: RobotoRegular;
                border: none;
                font-size: 12px;
                color: var(--cnam-white-color);
                line-height: 16px;
            }

                footer ul.menu > li > a:hover {
                    color: var(--cnam-red-color);
                }

                footer ul.menu > li > a > span.icon {
                    display: none;
                }

    footer div.title-3 {
        color: var(--cnam-white-color);
        font-family: OswaldMedium;
        font-size: 16px;
    }

    footer a,
    footer a:visited {
        color: var(--cnam-white-color);
    }

        footer a:hover,
        footer a:visited:hover {
            color: var(--cnam-red-color);
        }

/*#endregion footer*/

/*#region cookies*/

.ojc_consent {
    background: var(--cnam-green-color);
    font-family: RobotoRegular;
    font-size: 14px;
    display: block;
    padding: 10px;
    box-sizing: unset;
    animation: fadeBar 1s 1s both;
    z-index: 10;
    position: fixed;
    left: 0;
    text-align: center;
    bottom: 0;
    right: 0;
    color: var(--cnam-white-color);
}

    .ojc_consent p a {
        display: inline-block;
        border-bottom: 1px solid var(--cnam-red-color);
    }

        .ojc_consent p a:hover {
            color: var(--cnam-red-color);
            transition: all 0.5s ease;
        }


    .ojc_consent .ojc_action_bar button {
        letter-spacing: unset;
        font-family: OswaldLight;
        border-radius: 10px;
        margin: 0;
        background: var(--cnam-red-color);
        text-shadow: unset;
        box-shadow: unset;
        border: 1px solid var(--cnam-red-color);
        color: var(--cnam-white-color);
        line-height: unset;
        padding: 5px 25px;
        font-size: 16px;
        transition: all 0.5s ease;
        outline: none;
    }

    .ojc_consent .ojc_action_bar button#ojc_learn_more {
        background: none;
    }

        .ojc_consent .ojc_action_bar button:hover, 
        .ojc_consent .ojc_action_bar button#ojc_learn_more:hover {
            background: var(--cnam-easy-gray-color);
            color: var(--cnam-black-color);
            transition: all 0.5s ease;
        }

/*#endregion cookies*/

/*#region variables*/

:root {
    --cnam-red-color: #b21128;
    --cnam-dark-red-color: #5e0a16;
    --cnam-green-color: #53a38a;
    --cnam-medium-green-color: #9accbc;
    --cnam-light-green-color: #c2e0d8;
    --cnam-easy-green-color: #e6f1df;
    --cnam-black-color: #000000;
    --cnam-gray-color: #323232;
    --cnam-medium-gray-color: #646464;
    --cnam-light-medium-gray-color: #bcbcbc;
    --cnam-light-gray-color: #e8e1e0;
    --cnam-easy-gray-color: #eeeeee;
    --cnam-light-gray-alpha-color: #e8e1e0dd;
    --cnam-white-color: #ffffff;
    --cnam-sable-color: #edecde;
    --cnam-brown-color: #857761;
    --cnam-menu-1-color: hsla(161, 30%, 70%, 1);
    --cnam-menu-2-color: #c2e0d8;
}

/*#endregion variables*/

/*#region font*/

@font-face {
    font-family: 'OswaldBold';
    src: url('Fonts/Oswald-Bold.ttf');
}

@font-face {
    font-family: 'OswaldLight';
    src: url('Fonts/Oswald-Light.ttf');
}

@font-face {
    font-family: 'OswaldMedium';
    src: url('Fonts/Oswald-Medium.ttf');
}

@font-face {
    font-family: 'OswaldRegular';
    src: url('Fonts/Oswald-Regular.ttf');
}

@font-face {
    font-family: 'RobotoRegular';
    src: url('Fonts/Roboto-Regular.ttf');
}

@font-face {
    font-family: 'RobotoSlabRegular';
    src: url('Fonts/RobotoSlab-Regular.ttf');
}

/*#endregion font*/

/*#region media*/

@media screen and (max-width: 768px) {
}

/*#endregion media*/

/*#region override jquery*/

ul.ui-autocomplete.ui-corner-all.ui-menu.ui-widget.ui-widget-content {
    z-index: 10 !important;
    max-width: 500px !important;
    max-height: 500px;
    border: 2px solid var(--cnam-easy-gray-color);
    overflow-y: scroll;
    overflow-x: hidden;
    padding: 0;
}

.ui-menu .ui-menu-item {
    border-bottom: 2px solid var(--cnam-easy-gray-color);
}

    .ui-menu .ui-menu-item a {
        padding: 5px;
        border: none;
        font-family: RobotoRegular;
    }

        .ui-menu .ui-menu-item a.ui-state-focus {
            border: none;
            margin: 0;
            background: var(--cnam-easy-gray-color);
            color: var(--cnam-red-color);
            cursor: pointer;
            padding-left: 10px;
        }

/*#endregion override jquery*/

/*#region override framework*/

.productTab .mainGridTable {
    padding: 0px;
    border: none;
}
    .productTab .mainGridTable > table {
        border-collapse: collapse;
    }

        .productTab .mainGridTable > table span {
            display: block;
        }

        .productTab .mainGridTable > table tbody tr td {
            font-size: 14px;
        }

        .productTab .mainGridTable > table tbody tr td,
        .productTab .mainGridTable > table thead tr th {
            border: 1px solid var(--cnam-medium-green-color);
            padding: 5px;
        }

        .productTab .mainGridTable > table thead tr th {
            background-color: var(--cnam-green-color);
            color: var(--cnam-white-color);
            font-family: OswaldMedium !important;
            font-weight: normal !important;
        }

/* popup */
.dialog .dialog-header .dialog-close:hover, .dialog .dialog-header .dialog-close.focus {
    cursor: pointer;
    box-shadow: inset -16px 0 0 0 var(--cnam-red-color), inset 16px 0 0 0 var(--cnam-red-color);
    color: #fff;
}
.dialog .toolbar .btn
{
    padding: 10px 20px;
}
    .dialog .toolbar .btn.btn-primary {
        background-color: var(--cnam-green-color);
        border: 1px solid var(--cnam-green-color);
    }
        .dialog .toolbar .btn.btn-primary:hover {
            color: var(--cnam-green-color) !important;
            background-color: var(--cnam-easy-gray-color);
        }

.ojcSelect2 li.select2-selection__choice {
    font-size: 12px;
}

.ojc-checkboxgrid {
    outline: none;
}

/*#endregion override framework*/

/*#region cpf*/

div.diplome-cpf {
    padding: 5px;
    color: var(--cnam-white-color);
    font-size: 14px;
    background: var(--cnam-green-color);
    position: relative;
    height: 40px;
    flex: 1 0 0;
    max-height: 170px;
}

span.cpf-icon {
    background-image: url(Images/cpf.png);
    background-repeat: no-repeat;
    background-position: left;
    padding: 5px 0 5px 25px;
    margin: 0;
    display: flex;
}

div.cpf-hover {
    display: none;
}

div.diplome-cpf:hover div.cpf-hover {
    display: block;
    position: absolute;
    top: 40px;
    right: 0;
    left: 0;
    z-index: 500;
    cursor: pointer;
}

div.diplome-cpf > div.cpf-hover > a {
    display: block;
    padding: 0 10px;
    line-height: 30px;
    color: var(--cnam-white-color);
    background: var(--cnam-green-color);
    border: 1px solid var(--cnam-medium-green-color);
    font-size: inherit;
    font-family: inherit;
}

    div.diplome-cpf > div.cpf-hover > a:hover {
        background-color: var(--cnam-light-green-color);
        color: var(--cnam-medium-gray-color) !important;
    }

/*#endregion cpf*/

/*#region video*/

p.flex-1-100 > iframe {
    height: 50vh !important;
}

/*#endregion video*/

/*#region icon in tab*/

span.padding-2em {
    padding-left: 1.8em;
    width: 22px;
    height: 20px;
}

a.a-icon {
    font-family: RobotoSlabRegular;
    padding: 0 4em;
    border-bottom: none;
}

/*#endregion icon in tab*/

/*#region contact*/
.contact {
}

    .contact textarea {
        height: 150px !important;
        width: 100% !important;
        border-radius: 5px;
        font-family: RobotoRegular;
        outline: none;
    }

    .contact input {
        width: 100%;
        border-radius: 5px;
        padding: 10px;
        border: 2px solid var(--cnam-light-gray-color);
        font-size: 14px;
        height: 42px;
    }

    .contact input[type='checkbox'] {
        width: initial;
        height: initial;
    }

    .contact .btn {
        margin: 5% auto;
        border-radius: 10px;
        padding: 10px;
    }

/*#region login - account */

.login, .modifAccount {
    margin: 0 30% 5% 30%;
    width: 100%;
}

span.account:before {
    content: "Votre compte";
    font-family: OswaldLight;
}


.login input, .modifAccount input {
    width: 100%;
    border-radius: 5px;
    padding: 10px;
    border: 2px solid var(--cnam-light-gray-color);
    font-size: 14px;
    height: 42px;
}

.login input[type='checkbox'] {
    width: initial;
    height: initial;
}

.login button, .modifAccount button {
    margin: 10px auto;
    font-size: 23px;
    border-radius: 10px;
}

div.loginButton > a {
    flex: 1 0 0;
    border: none;
    padding: 10px;
    background-color: var(--cnam-green-color);
    color: white;
    border-radius: 10px;
    font-family: OswaldLight;
    font-size: 19px;
}

.register a {
    color: var(--cnam-white-color);
    font-size: 20px;
}

#simulation .flex-2 {
    display: flex !important;
    flex: 2 0 0 !important;
    flex-wrap: wrap !important;
}

.text-align-left {
    text-align: left !important;
}

.text-align-right {
    text-align: right !important;
}

#simulation div.flex-4 {
    justify-content: flex-end !important;
}

    #simulation div.flex-4 > button {
        display: block !important;
        flex: 0 !important;
        font-size: 20px;
        margin: 5px;
    }

/*#endregion login - account */

/*#endregion contact*/

/* #region RegistrationTicket*/

.registration-cart tr th, .registration-cart tr td {
    text-align: left;
    padding-left: 5px;
    padding-right: 5px;
}

#PaymentByInstalments {
	margin:0;
}

#PaymentByInstalments .input-row {
	flex: 1 0 100%;
}

	#PaymentByInstalments .input-row input {
		height: inherit;
	}
	#PaymentByInstalments .input-row label {
		font-weight: normal;
	}
#PayByCC .input-row {
	font-size: 16px;
	flex: 1 0 100%;
}

/* #endregion RegistrationTicket */
/*#region responsive */
@media screen and (max-width: 768px) {
    body {
        font-size: 12px !important;
    }

    header > .flex-1-100 {
        padding: 5px;
        flex: 1;
        order: 2;
    }

    .blog-post {
        display: none;
    }
}

/*#region responsive - header*/

@media screen and (max-width: 1024px) {
    body {
        font-size: 14px;
    }

    a {
        font-size: 16px;
    }

    footer .gradientWhiteGray {
        display: none;
    }
}

@media screen and (max-width: 768px) {

    header button {
        border-radius: 0;
        flex: 0 0 48px;
        width: 48px;
    }

    a {
        font-size: 14px;
    }

        a.burger {
            background-image: url(Images/burger.png);
            background-repeat: no-repeat;
            background-size: contain;
            background-position: center;
            display: block;
            transition: all .5s;
            height: 30px;
            width: 30px;
            margin: 5px;
        }

            a.burger.open {
                transform: rotate(90deg);
                transition: 0.5s ease all;
            }

    header .search .grid-container .row .grid-col .search-form form button span {
        margin: 0;
    }

    header .search .grid-container .row .grid-col .search-form form button {
        flex: 1 0 15%;
    }

    header .search .grid-container .row .grid-col .search-form form input {
        flex: 1 0 85%;
    }

    header .search {
        padding: 0;
        order: 3;
        flex: 1 100%;
    }

    header ul.menu {
        display: none;
    }

        header ul.menu.open {
            display: flex;
            flex-wrap: wrap;
            height: auto;
            text-align: unset;
            position: unset;
            top: unset;
            left: unset;
            width: unset;
            transition: unset;
        }

        header ul.menu.open * {
            transition: none !important;
            animation: none !important;
        }

            header ul.menu.open > li {
                display: flex;
                flex: 1 0 100%;
                height: auto;
                padding: 0;
            }

                header ul.menu.open > li > a {
                    flex: 1 0 100%;
                    padding: 5px;
                    justify-content: space-between;
                    align-items: center;
                    display: flex;
                }

                header ul.menu.open > li > a:hover {
                    color: var(--cnam-black-color);
                }

                header ul.menu.open li.has-children a:after {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    width: 30px;
                    height: 30px; 
                    line-height: unset;
                    float: unset;
                }

                header ul.menu.open > li.has-children > ul > li.has-children > a,
                header ul.menu.open > li.has-children > a {
                    pointer-events: none;
                }

                header ul.menu.open > li > ul {
                    flex: 1 0 100%;
                    width: auto !important;
                    margin: 0 !important;
                    height: auto;
                    top: unset !important;
                    border: none;
                    left: unset !important;
                    padding: 0;
                    overflow: unset;
                    position: unset !important;
                }

        header ul.menu > li.simple-menu:hover > ul:hover > li > ul,
        header ul.menu > li.big-menu:hover > ul:hover > li > ul,
        header ul.menu > li.big-menu:hover > ul > li:first-child > ul,
        ul.menu.open li:hover ul,
        header ul.menu > li.big-menu:hover > ul,
        header ul.menu > li.simple-menu:hover > ul,
        header ul.menu > li.big-menu:hover > ul:hover > li:hover > ul {
            display: none;
        }

        header ul.menu.open > li > ul > li {
            flex-wrap: wrap;
            height: auto;
            padding: 5px;
        }

                    header ul.menu.open > li:hover > ul > li:first-child {
                        background-color: var(--cnam-menu-1-color);
                    }

                        header ul.menu.open > li > ul > li > a {
                            width: unset;
                            flex: 1 0 100%;
                            padding: 0 5px;
                        }

                        header ul.menu.open > li > ul > li > a:hover {
                            color: var(--cnam-black-color);
                        }

                        header ul.menu.open > li > ul > li > ul {
                            display: none;
                            top: unset;
                            left: unset;
                            width: auto;
                            column-count: unset;
                            height: auto;
                            min-height: unset;
                            flex: 1 0 100%;
                            flex-wrap: wrap;
                            position: relative
                        }

                            header ul.menu.open > li > ul > li > ul > li {
                                flex: 1 0 100%;
                                height: auto;
                            }

    header.default {
        position: static;
    }
                                header ul.menu.open > li > ul > li > ul > li > a {
                                    display: flex;
                                    padding: 5px 10px;
                                }

                                header ul.menu.open > li > ul > li > ul > li > ul {
                                    display: none !important;
                                }

    header .row {
        margin: 0;
    }

    span.account:before {
        content: "\f007";
        font-family: inherit;
    }

    header .phone {
        font-size: 16px;
        flex: 4 0 0;
    }

    header div.container.backgroundEasyGray {
        display: none;
    }

    .header-top-right {
        flex: 1 0 100%;
        margin-top: 10px;
    }

    .blog-text > div {
        font-size: 18px;
    }

    body > div.content {
        margin-top: 0 !important;
    }
}

@media screen and (max-width: 426px) {

    header input, input::placeholder {
        font-size: 12px;
    }
}


/*#endregion responsive - header*/

            /*#region breadcrumb*/

            @media screen and (max-width: 768px) {

                .breadcrumb li {
                    text-overflow: ellipsis;
                    max-width: 60px;
                    display: inline-block;
                    white-space: nowrap;
                    overflow: hidden;
                }
            }

            /*#endregion breadcrumb*/

            /*#region home*/

            @media screen and (max-width: 768px) {

                .video .overlayDiploma {
                    right: 10%;
                }

                .video .overlaySimulation {
                    right: 1%;
                    top: 40%;
                }

                .flex-column-1.backgroundWhite.padding-50 {
                    padding: 0 0 10px 0;
                    flex: 1 0 100%;
                }

            }

            @media screen and (max-width: 426px) {

                .displayPosts-Calendar .displayPosts-list ul li {
                    flex: 1 0 100% !important;
                    margin: 0 !important;
                }
            }

            /*#endregion home*/

            /*#region footer*/

            @media screen and (max-width: 1024px) {
                div.pane_content {
                    padding: 0 0 10px 0;
                }

                .container {
                    padding: 0 10px;
                }

                    .container .container{
                        padding: 0;
                    }

                .searchResults {
                    padding: 0;
                }

                footer ul.menu > li > a {
                    font-size: 12px;
                }
            }

            @media screen and (max-width: 768px) {
                .customActus img {
                    flex: 1 0 100%;
                }

                .customActus div {
                    flex: 1 0 100%;
                }

                footer .container > .flex-1-100 > .flex-1 {
                    flex: 1 0 50%;
                }

    header .container.bot {
        margin: 0;
    }

    header + .flex-1-100 {
        padding: 5px 0 0 0;
    }

                header .logo {
                    margin: 0 5px 0 0;
                    height: 38px;
                }

    header .header-top-right {
        margin: 0px;
        flex: 0 0 60%;
        align-items: center;
        justify-content: flex-end;
    }

    header .header-top-right .phone {
        display: none;
    }

    header .header-top-right > div.flex-1-100 {
        display: none;
    }

                        header .header-top-right > div.flex-1-100 > p.cnamnet {
                            display: flex;
                            justify-content: flex-end;
                        }

                            header .header-top-right > div.flex-1-100 > p.cnamnet a {
                                font-size: 12px;
                            }

    header .header-top-right > button {
        flex: 0 0 50px;
        border-radius: 10px;
    }

    header .mainMenu {
        flex: 0;
        order: 1;
        border: none;
    }

    header .mainMenu .container {
        padding: 0;
    }

                header ul.menu > li.has-children > a:after,
                header ul.menu > li > ul > li.has-children > a:after {
                    content: "\f054";
                    font: normal normal normal 14px/1 FontAwesome;
                    float: right;
                    line-height: 30px;
                }
            }

            @media screen and (max-width: 425px) {
                .displayPosts-Calendar .displayPosts-list ul li {
                    flex: 1 0 100% !important;
                    margin: 10px 0 0 0 !important;
                }

                ul.ui-autocomplete.ui-corner-all.ui-menu.ui-widget.ui-widget-content {
                    max-width: 250px !important;
                }

                .mapList + .flex-2 {
                    flex: 1 0 100%;
                    margin: 10px auto;
                }

                .foad > .flex-1 {
                    margin: 10px auto;
                }

                    .foad > .flex-1:first-child {
                        margin: 0;
                    }
            }

            @media screen and (max-width: 375px) {
                ul.ui-autocomplete.ui-corner-all.ui-menu.ui-widget.ui-widget-content {
                    max-width: 230px !important;
                }

            }

            @media screen and (max-width: 320px) {
                ul.ui-autocomplete.ui-corner-all.ui-menu.ui-widget.ui-widget-content {
                    max-width: 200px !important;
                }

            }

            /*#endregion footer*/

            /*#region pages*/

            @media screen and (max-width: 1024px) {

                .planning-sessions .mainGridTable {
                    max-width: 1024px;
                }

                div.diplome-cpf {
                    font-size: 10px;
                }

                .flex-6 > .informations {
                    padding: 20px;
                }
            }

            @media screen and (max-width: 768px) {

                .searchFilter p {
                    font-size: 12px;
                }

                .searchFilter .filterList .options label {
                    font-size: 12px;
                }

                .searchFilter .title-2 {
                    font-size: 14px;
                    margin: 5px;
                }

    button.btn {
        font-size: 15px;
        flex: 1;
        margin: 0 5px 5px 5px;
    }

    span.icon {
        width: 20px;
        height: 20px;
        line-height: 20px;
    }

    .fa-print:before {
        font-size: inherit;
    }

                .planning-sessions .mainGridTable {
                    max-width: 768px;
                }


    .productSheet > .margin-10 {
        margin: 0px;
    }

                .productTab > .flex-1-100.padding-20 table thead {
                    display: none;
                }

                    .productTab > .flex-1-100.padding-20 table tr {
                        display: block;
                        margin-bottom: 40px;
                    }

                    .productTab > .flex-1-100.padding-20 table td {
                        display: block;
                        text-align: right !important;
                    }

                        .productTab > .flex-1-100.padding-20 table td span.icon {
                            margin: 0px 0px 0px auto;
                        }

                        .productTab > .flex-1-100.padding-20 table td:before {
                            content: attr(title);
                            float: left;
                            font-weight: bold;
                        }

    .productTab .productTabLine .btn {
        flex: 0;
        padding: 5px 10px;
    }

    .productTab ul {
        padding-left: 5px;
    }

    .productInformation {
        flex: 1 0 100% !important;
    }


    .searchResults .datagrid > tfoot #sp_2 {
        display: none;
    }

    .searchResults .datagrid > tfoot .ui-pg-table {
        margin-right: auto;
    }

        .searchResults .datagrid > tfoot .ui-pg-table .pageSizeSelector {
            display: none;
        }

    .floatingButton .btn {
        margin-right: 0;
    }
}

            @media screen and (max-width: 565px) {

                .mainTitle h1 {
                    font-size: 20px;
                }

                    .mainTitle h1 > span {
                        font-size: 14px;
                        margin-top: 5px;
                    }

                .mainTitle > .flex-1 > button {
                    font-size: 0;
                    margin: 5px 0;
                }

                    .mainTitle > .flex-1 > button > span {
                        margin-right: 0
                    }

                .searchFilter {
                    border: none;
                    flex: 1 0 100%;
                }

                    .searchFilter h2 {
                        display: none;
                    }
            }

			@media screen and (max-width: 425px) {

				.searchResults {
					padding: 0;
				}

					.searchResults h3 {
						font-size: 16px;
						margin: 5px 0;
					}

					.searchResults .searchResultItem {
						padding: 5px 0;
					}

						.searchResults .searchResultItem > p {
							font-size: 12px;
						}

						.searchResults .searchResultItem > .searchResultItemFooter {
							margin: 0;
						}

				.productIllustration > .flex-1 {
					flex: 1 0 100%;
					margin: 2% 0;
				}

				.productTab > .flex-1-100.padding-20 {
					padding: 5px;
					overflow: auto;
					margin: auto;
					width: 80vw;
				}

				.flex-1-100 > .block {
					flex: 1 0 100%;
					margin: 2% 0;
				}

				.mainTitle h1 > span {
					font-size: 12px;
					margin-top: 7px;
				}

				.flex-6 > .informations {
					padding: 10px;
				}

				.flex-6 .padding-20 {
					padding: 10px;
				}

				.mainTitle h1 {
					font-size: 18px;
				}

				.searchFilter {
					border-right: none;
				}

				.login, .modifAccount {
					margin: 0 20%;
				}

				.planning-sessions .mainGridTable {
					max-width: 425px;
				}
			}

            /*#endregion pages*/

            /*#region villes*/

            @media screen and (max-width: 768px) {

                h2 {
                    justify-content: center;
                }

                .teachingCenterInformation {
                    text-align: center;
                }

                .city {
                    flex: 1 0 100%;
                }

                .galleryWebPart .galleryWebPartContainer .galleryWebPartImage {
                    height: 140px !important;
                    flex: 0 0 140px !important;
                }
            }

            @media screen and (max-width: 425px) {
                .teachingCenterOffer {
                    padding: 30px 20px;
                    margin-right: 10px;
                }

                    .teachingCenterOffer > div {
                        font-size: 25px;
                    }

                .galleryWebPart .galleryWebPartContainer .galleryWebPartImage {
                    height: 105px !important;
                    flex: 0 0 105px !important;
                }
            }
            /*#endregion villes*/

            /*#endregion responsive */

/* #region autocomplete field */

ul.autocomplete-list-form {
    position: absolute;
    list-style: none;
    background: white;
    margin: 0;
    z-index: 11;
    padding: 0;
    border: 1px solid var(--cnam-light-gray-color);
}

ul.autocomplete-list {
    position: absolute;
    list-style: none;
    background: white;
    margin-top: 40px;
    z-index: 11;
    padding: 0;
    border: 1px solid var(--cnam-light-gray-color);
}

    ul.autocomplete-list-form > li,
    ul.autocomplete-list > li {
        padding: 2px 10px;
        cursor: pointer;
    }

        ul.autocomplete-list-form > li:hover,
        ul.autocomplete-list > li:hover {
            background: var(--cnam-light-gray-color);
        }

        ul.autocomplete-list-form > li.autoComplete_selected,
        ul.autocomplete-list > li.autoComplete_selected {
            background: var(--cnam-light-green-color);
        }

        ul.autocomplete-list-form > li .autoComplete_highlighted,
        ul.autocomplete-list > li .autoComplete_highlighted {
            color: var(--cnam-red-color);
        }

/* #endregion */

/* #region animations */

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* #endregion animations */

/* #region Registration ticket */

#registrationTicketsPreviousDiplomasGrid .mainGridTable table thead tr th:nth-child(1) {
    width: 50%;
}
#registrationTicketsPreviousDiplomasGrid .mainGridTable table thead tr th:nth-child(2),
#registrationTicketsPreviousDiplomasGrid .mainGridTable table thead tr th:nth-child(3) {
    width: 25%;
}

#registrationTicketsPreviousDiplomasGrid .toolbar .btn {
	display: inline-block;
	padding: 10px 20px;
	color: var(--cnam-white-color) !important;
	background-color: var(--cnam-green-color) !important;
	border: 1px solid white !important;
	font-size: 16px;
}

	#registrationTicketsPreviousDiplomasGrid .toolbar .btn:hover {
		color: var(--cnam-green-color) !important;
		background-color: var(--cnam-white-color) !important;
		border: 1px solid var(--cnam-green-color) !important;
	}
	#registrationTicketsPreviousDiplomasGrid .toolbar .btn.ui-state-disabled:hover {
		color: var(--cnam-white-color) !important;
		background-color: var(--cnam-green-color) !important;
		border: 1px solid white !important;
	}

.simulation-content#step4 table.datagrid > tbody > tr > td {
	padding: 0 20px 0 6px;
}

#registrationTicketsProductsGrid .mainGridTable table thead tr th:last-child {
    min-width: 70px;
}

/* #endregion Registration ticket */
