/*
    Author: Johan HAUDIQUET
    Version: 1.0
*/

    /*------------------------
        Général
    ------------------------*/

    a {
        font-weight: bold;
    }
    select {
        padding: 0 !important;
    }
    .button.black:hover, .button.black.active, .button.black:focus {
        background-color: #555555;
        border-color: #555555;
    }
    .page-section-ptb {
        padding: 40px 0;
    }
    .page-title-name p {
        color: #FFFFFF !important;
        padding: 0 !important;
        margin: 0 !important;
        font-weight: bold;
        line-height: 2.5em;
    }
    .no-border {
        border: none !important;
    }
    .table thead {
        background-color: #666666;
        color: #FFFFFF;
    }

    .login-errormsg {
        text-align: center;
        color: #cc0000;
        font-weight: 600;
    }

    /* Limit content width */
    .page-section-ptb img {
        max-width: 100%;
        height: auto;
    }

    /* Force footer to the bottom of the screen */
    .t-container .wrapper {
        min-height: 100vh;
        display: flex;
        flex-direction: column;
    }

    .t-container .wrapper .page-section-ptb {
        flex: 1;
    }

    .frame {
        margin-bottom: 24px;
    }

    /* @see https://assistance.opentalent.fr/browse/V8-2578 */
    .form-inline {
        margin-bottom: 6px;
    }
    /*------------------------
        Barre réseau
    ------------------------*/

    .topbar {
        background-color: #FFFFFF;
        padding: 8px 0;
    }

    .topbar ul li,
    .topbar ul li p,
    .topbar ul li i,
    .topbar ul li a {
        color: #888888;
    }

    .topbar img {
        max-height: 20px;
    }

    .topbar-call ul li a {
        margin: 0;
    }

    .topbar-call img {
        -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
        filter: grayscale(100%);
    }

    .topbar-call img:hover {
        -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
        filter: grayscale(0%);
    }

    .reseau-opentalent img {
        margin-top: 3px;
    }

    .reseau img {
        margin-top: -4px;
    }

    #notice-cmf {
        display: none;
    }

    .topbar-social {
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
    }

    .topbar .social-bar {
        display: flex;
        flex-direction: row;
        margin: 0 16px;
        top: -3px;
        position: relative;
    }

    .topbar .social-logo {
        height: 20px;
        width: 20px;
        font-size: 20px;
        margin: 0 4px;
        padding: 0 4px;
    }

    /*------------------------
        Menu
    ------------------------*/

    #logo_cmf {
        display: none;
    }
    .mega-menu .menu-links > li > a:hover,
    .hoverTrigger > a,
    .mega-menu .menu-links > li.active > a {
        color: #FFFFFF !important;
    }
    @media(max-width:991px) {
        .mega-menu .menu-links > li > a:hover,
        .hoverTrigger > a,
        .mega-menu .menu-links > li.active > a {
            color: #323232 !important;
        }
    }
    .active > a {
        font-weight: bold !important;
    }
    .hoverTrigger > ul > .hoverTrigger > a {
        color: #323232 !important;
    }

    .mega-menu .drop-down-multilevel {
        border: solid 1px rgba(75, 75, 75, .2);
        box-shadow: 4px 4px 2px 1px rgba(75, 75, 75, .2);
    }

    .mega-menu .menu-logo img {
        box-shadow: 2px 2px 3px 2px rgba(0, 0, 0, 0.3);
        border: solid white 3px;
        background-color: white;
    }

    @media (min-width: 1025px) {
        .mega-menu .menu-logo img {
            height: 60px;
        }

        .mega-menu .menu-logo {
            padding: 15px 0 15px;
        }
    }

    /* **** Fix mega menu issues ***** */

    /* Fix bug with long menus */
    .mega-menu .menu-bar {
        width: 80%;
    }

    @media screen and (max-width: 900px) {
        .mega-menu .menu-bar {
            width: 100%;
        }

        .mega-menu .drop-down-multilevel {
            width: 100% !important;
        }
    }

    .mega-menu > section.menu-list-items .menu-bar {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-end;
    }

    @media screen and (min-width: 900px) {
        .mega-menu > section.menu-list-items .menu-bar {
            min-height: 90px;
        }
    }

    .mega-menu .menu-bar a {
        text-align: center;
    }

    .mega-menu > section.menu-list-items .menu-bar > ul {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
    }

    @media(min-width:991px) {
        .mega-menu > section.menu-list-items .menu-bar > ul {
            display: flex !important;
        }
    }

    .mega-menu > section.menu-list-items .menu-bar > ul > li {
        position: relative;
        min-height: 45px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .mega-menu .drop-down-multilevel {
        width: auto;
        min-width: 240px;
    }

    .menu-list-items {
        height: auto !important;
        min-height: 90px;
    }

    /* Prevent hidden submenus to overflow from the screen */
    body {
        overflow-x: hidden;
    }
    /* Force 1st-level dropdown to align
    on the left if they are too close to the
    screen right edge */
    .mega-menu .dropdown-align-left {
        right: 0 !important;
    }
    /* Force 2nd-level dropdown to be displayed
    on the left if they are too close to the
    screen right edge */
    .mega-menu .dropdown-left {
        top: 0 !important;
        right: 100% !important;
        left: auto !important;
    }

    /*------------------------
        Prochains évènements
    ------------------------*/

    .events .card a {
        height: 100%;
        display: flex;
        flex-direction: column;
    }

    .events .img-container {
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: center;
        background-color: rgba(255, 255, 255, 20%);
    }

    .events .card .p-4 {
        flex-direction: column;
        justify-content: flex-start;
        height: max-content;
    }

    .events .card img {
        border: 1px solid;
        width: 100%;
    }

    .more-events {
        text-align: center;
    }

    .more-events .fa {
        padding: 0.5em 0;
    }

    .more-events h3 {
        padding-bottom: 1em;
    }

    .cmf-events img {
        width: 90px !important;
        margin: 1.5em;
        border: 0px !important;
    }

    /*------------------------
        Partenaires
    ------------------------*/

    .partners-list > .static {
        display: flex;
        flex-direction: row;
        justify-content: center;
        flex-wrap: wrap;
    }

    .partners-list > .static .item {
        margin: 0 3px;
    }

    .partners-list img {
        max-height: 80px;
    }

/*------------------------
    Members and MembersCa
------------------------*/

.ot-members h3 {
    color: #000000;
    text-align: left;
    font-weight: bold;
    font-size: 21px;
    padding: 6px;
    display: flex;
    border-bottom: solid 1px #cccccc;
}

.ot-members .ot-members-list {
    list-style: none;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: start;
    justify-content: center;
    padding: 0;
}

.ot-members .ot-member {
    margin: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 160px;
}

.ot-members .ot-member-image {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 198px;
    width: 100%;
    border: 1px solid #737373;
    margin: 0;
}

.ot-members .ot-member img {
    max-width: 158px;
    max-height: 196px;
    height: auto;
    width: auto;
}

.ot-members .ot-member img.default {
    width: 100%;
    z-index: 0;
}

.ot-members .ot-member-name {
    min-height: 84px;
    width: 100%;
    background: #666666;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.ot-members .ot-member-name * {
    font-size: 15px;
    color: #ffffff;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 12px;
}

/*------------------------
    Social
------------------------*/
.share-bar {
    width: 100%;
    height: 36px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    font-weight: 600;
}

.share-bar>* {
    margin: 0 6px;
}

.share-bar h5 {
    color: #666666;
    font-size: 16px;
    font-weight: 600;
}

.share-bar a:hover {
    text-decoration: none;
}

.share-bar a .fa {
    font-size: 16px;
    margin-right: 3px;
}


/*------------------------
    Pied de page
------------------------*/

    .footer .footer-text p {
        color: #FFFFFF !important;
    }
    .footer .footer-text a {
        color: #FFFFFF !important;
    }
    .footer .footer-social ul li a:hover {
        color: #FFFFFF !important;
    }
    .footer .copyright {
        padding: 30px 0 10px !important;
    }

    /*------------------------
        Modals en général
    ------------------------*/

    .modal-footer {
        justify-content: center;
    }

    .modal-footer-network {
        padding: 0;
    }

    .modal-footer-network img {
        margin: 0 1em;
    }

    /*------------------------
        Modal de connexion
    ------------------------*/

    .loginModal{
        max-width: 450px;
    }

    .loginModal-title p {
        width: 100%;
        padding: 0 0 0.5em 0;
        text-align: center;
        font-size: 2.5em;
    }

    .loginModal-content {
        padding: 3em 2em 0 2em;
    }

    .login-form {
        padding-bottom: 0 !important;
    }

    .login-footer {
        padding: 1em 0;
    }

    .login-footer img {
        padding: 0 2em;
    }

    /*------------------------
        Modal CMF
    ------------------------*/

    .cmfModal-title p {
        width: 100%;
        padding: 0 1em 1em 1em;
        text-align: center;
    }

    .cmfModal-content {
        padding: 3em 2em 0 2em;
    }

    .cmf-bg {
        /*background-color: #c50538;*/
    }

    /*------------------------
        Modal Opentalent
    ------------------------*/

    .opentalentModal-title p {
        width: 100%;
        padding: 0 1em 1em 1em;
        text-align: center;
    }

    .opentalentModal-content {
        padding: 3em 2em 0 2em;
    }

    .opentalent-bg {
        background-color: #323232;    }


    /*------------------------
        Blog
    ------------------------*/

    .blog-entry .entry-image img {
        padding: 2em 2em 0 2em;
    }
    .blog-share i {
        padding: 0 0.4em;
    }


    /*------------------------
        Forms
    ------------------------*/
    .error {
        color: #e60000;
    }


    /*------------------------
        Contact
    ------------------------*/

    .contact-form {
        margin-top: 24px;
    }

    .contact-form .section-field {
        width: 100%;
    }

    .contact-form h2 {
        margin-bottom: 12px;
    }

    .postal-adress {
        width: 100%;
        margin: 45px auto auto;
    }

    .postal-adress h2 {
        margin-bottom: 12px;
    }

    /*------------------------
    News
    ------------------------*/
    .ot-news {
        padding: 48px;
    }

    .ot-news .article {
        max-width: 640px;
    }

    .ot-news .header {
        margin-bottom: 12px;
    }

    .ot-news .page-navigation {
        font-size: 16px;
    }

    .ot-news .f3-widget-paginator li {
        margin-left: 4px;
    }

    .news-list-view img {
        max-width: 225px;
    }

/*============================
    CORRECTIFS
==============================
    Permet de résoudre des
    problèmes d'affichage
============================*/

    /*------------------------
        Menu
    ------------------------*/

    .default {
    /*  Corrige le menu pour qu'il ne masque plus le haut du slider
        sur les écrans dont la résolution est supérieure à 992px. */
        position: relative !important;
    }

    .mega-menu .drop-down-multilevel a {
    /*  Annule l'auto-capitalisation définie par le template d'origine. */
        text-transform: initial !important;
    }

    /*------------------------
        Pied de page
    ------------------------*/

    .footer .footer-text p {
    /*  Retire la marge originale qui permettait d'avoir un footer
        sur deux lignes au lieu d'une seule. */
        padding-top: 0 !important;
    }

    .footer {
        display: flex;
        flex-direction: column;
        padding-bottom: 10px;
    }

    .footer .footer-line-1 .copyright {
        padding-bottom: 0 !important;
        display: flex;
        flex-direction: row;
        align-items: center;
    }

    .footer .footer-line-2 {
        display: flex;
        flex-direction: row;
        justify-content: center;
        height: 36px;
        align-items: center;
        color: #FFFFFF;
        font-size: 14px;
        padding-bottom: 10px;
    }

    .footer .footer-line-2 ul {
        list-style: none;
        display: flex;
        flex-direction: row;
    }

    .footer .footer-line-2 ul .social-logo {
        margin: 0 6px;
        padding: 0 6px;
    }

    .footer .footer-line-2 ul .social-logo a {
        color: #f2f2f2;
    }

    .footer .footer-line-2 ul .social-logo a * {
        margin: 0 3px;
    }

/*------------------------
    Breadcrumb
------------------------*/
.breadcrumb {
    padding-left: 60px;
    list-style: none;
    display: flex;
    flex-direction: row;
    font-weight: bold;
    /*background: none;*/
}

.breadcrumb li {
    margin: 0 3px;
    font-size: 12px;
}

.breadcrumb li a {
    margin: 0 2px;
    font-size: 12px;
}

.breadcrumb li::before {
    /*content: "> ";*/
    font-family: "FontAwesome";
    content: "\f105";
    color: #bfbfbf;
    margin: 0 2px;
}

.breadcrumb li:first-child::before {
    content: "";
}

.breadcrumb > li:last-child {
    color: #808080;
}


/*============================
Slick carousels
============================*/
    /* centered */
    .carousel {
       margin: 0 auto;
    }

    .carousel-img {
        height: auto;
    }

    .slick-track {
        overflow: hidden;
    }

    .slick-slide img {
        max-width: initial;
    }

    /*Default CSS, in case slick is not loaded or activated*/
    .carousel .carousel-img {
       width: 100%;
       display: none;
    }

    .carousel div:first-child > .carousel-img {
        display: inline;
    }
    .carousel div.slick-slide .carousel-img {
        display: inline;
    }

    /* vertically center*/
    .slick-slide div {
       background-color: #f2f2f2;
       display: flex !important;
       align-items:center;
    }

    /*arrows color*/
    .slick-prev:before, .slick-next:before {
       color: #2b2b2b;
    }

    /* Special: Carousel content preview on backend*/
    .be-carousel-preview {
       word-wrap: break-word;
    }

    .be-carousel-img-preview {
        margin-right: 4px;
        margin-bottom: 4px;
    }


/*============================
Next events (homepage)
============================*/

.events .card-container {
    margin-bottom: 24px;
}

/*============================
Events pages
============================*/

/* All events page from ot_widget*/
.ot-all-events {
   display: flex;
   flex-direction: row;
}

.ot-all-events .events-controls {
    order: 1;
    flex: 1;
}

.ot-all-events .events-results {
    order: 0;
    flex: 1;
}

.ot-all-events .events-controls, .events-results {
    display: flex;
    flex-direction: column;
    margin: 0 1.5em;
}

.ot-all-events .event-search {
    display: flex;
    flex-direction: column;
    margin-bottom: 2em;
}

.ot-all-events h3 {
    font-size: 1.2em;
    font-weight: bold;
}

.ot-all-events .event-search form {
    display: flex;
    flex-direction: column;
}

.ot-all-events .event-search form input,
.ot-all-events .event-search form button {
    margin-bottom: 1em;
    line-height: 1.4em;
    font-size: 1.1em;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 6px 12px;
}

.ot-all-events .event-search form button {
    border: solid 2px #cccccc;
}

.ot-all-events .event-search form button:hover {
    background-color: #d8edf3;
    cursor: pointer;
}

.ot-all-events #event-map {
    height: 400px;
    width: 100%;
    align-self: flex-end;
}

.ot-all-events .event {
    display: flex;
    flex-direction: column;
    border-bottom: solid 2px #cccccc;
    border-radius: 4px;
    padding: 1em;
    justify-content: space-around;
}

.ot-all-events .event-preview {
    display: flex;
    flex-direction: row;
    align-items: center;
}

.ot-all-events .event-preview .event-poster {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ot-all-events .event-preview .event-poster img {
    width: auto;
    max-width: 100%;
    min-width: 40%;
    height: auto;
    margin-right: 4em;
}

.ot-all-events .event-preview .event-summary {
    flex: 2;
    display: flex;
    flex-direction: column;
}

.ot-all-events .event-preview .event-summary > span {
    margin-bottom: 0.5em;
}

.ot-all-events .event-preview .event-name {
    font-size: 1.4em;
    color: #333333;
    font-weight: bold;
}

.ot-all-events .event-preview .event-loc-date {
    font-size: 1.1em;
    color: #4d4d4d;
    font-weight: bold;
}

.ot-all-events .event-preview .event-description {
    color: #4d4d4d;
}

.ot-all-events .event-see {
    align-self: stretch;
    padding: 0.4em 0.8em;
    font-size: 1.1em;
    margin-top: 0.4em;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.ot-all-events .event-see:hover {
    text-decoration: none;
    font-weight: bold;
}

/*============================
Event's details pages
============================*/

.ot-show-event {
    display: flex;
    flex-direction: column;
}

.ot-show-event header {
    display: flex;
    flex-direction: row;
    padding: 0.5em;
    margin-bottom: 2em;
    align-items: center;
}

.ot-show-event header h2 {
    flex: 1;
}

.ot-show-event .go-back {
    font-weight: bold;
}

.ot-show-event .go-back:hover {
    color: #4d4d4d;
    text-decoration: none;
}

.ot-show-event .event-content {
    display: flex;
    flex-direction: row;
    margin-bottom: 2em;
    padding: 2em;
}

.ot-show-event .event-content .event-poster {
    flex: 1;
    max-width: 30%;
    margin-right: 5%;
}

.ot-show-event .event-poster img {
    width: auto;
    max-width: 100%;
    min-width: 40%;
    height: auto;
    margin: 1.4em;
}

.ot-show-event .event-summary {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.ot-show-event .event-name {
    font-weight: 800;
}

.ot-show-event .event-dates {
    color: #4d4d4d;
    margin-top: 0.5em;
}

.ot-show-event .event-loc {
    color: #4d4d4d;
    margin-top: 0.5em;
    display: flex;
    flex-direction: row;
}

.ot-show-event .event-url {
    text-decoration: none;
    color: #4d4d4d;
    margin-top: 0.5em;
    display: flex;
    flex-direction: row;
}

.ot-show-event .event-description {
    margin-top: 2em;
}

.ot-show-event .event-map-container {
    padding: 3.2em;
}

.ot-show-event #event-map {
    height: 400px;
    width: 100%;
    align-self: center;
}

@media (max-width: 600px) {
    .ot-show-event header {
        flex-direction: column;
        margin: 12px 0;
    }

    .ot-show-event .event-content {
        flex-direction: column;
    }

    .ot-show-event .event-content .event-poster {
        align-self: center;
        margin: 0 0 12px 0;
        max-width: none;
        width: 100%;
        display: flex;
        align-items: center;
    }
}


/*============================
Events preview
============================*/




/*============================
Latest news
============================*/

section.news div.news {
    width: 100%;
}

section.news .news-list-view {
    display: flex;
    flex-direction: row;
    justify-content: center;
}

@media (max-width: 600px) {
    section.news .news-list-view {
        flex-direction: column;
    }
}

section.news .news-list-view .article {
    margin: 10px 24px;
}

section.news footer {
    width: 100%;
}

section.news .no-news-found {
    color: #4d4d4d;
}

/*============================
Structures page
============================*/
.ot-structures iframe {
    border: none;
    width: 100%;
    max-width: 100%;
    height: 2400px;
}

/*============================
Sitemap page
============================*/
.frame-type-menu_sitemap {
    font-size: 16px;
    font-weight: bold;
}

.frame-type-menu_sitemap>ul {
    padding-left: 1.5em;
    list-style: none;
}

.frame-type-menu_sitemap li ul {
    list-style: disc;
    padding-left: 3em;
}

.frame-type-menu_sitemap li ul li ul {
    list-style: square;
    padding-left: 4.5em;
}

.frame-type-menu_sitemap li{
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    color: #979797;
}

/*!*   prevents iframe to oversize the content width*!*/
iframe {
    max-width: 100%;
}

/* Pagination */
.pagination-bar {
    display: flex;
    flex-direction: row;
    margin: 12px auto;
    align-items: center;
}

.pagination-bar a {
    padding: 0 4px;
}

.pagination-bar ul {
    list-style: none;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.pagination-bar li {
    margin: 4px 2px;
    font-size: 16px;
}

.pagination-bar li a {
    padding: 12px;
    color: #333333;
}

.pagination-bar li.current a {
    color: #8c8c8c;
}

/*============================
Legal template
============================*/

.ot-legal {
    width: 60%;
    margin: 0 20% 32px 20%;
}

.ot-legal h3, .ot-legal h4 {
    margin: 2em 0 1em 0;
    font-weight: 600;
}

.ot-legal section {
    padding: 0 2em;
}

.ot-legal strong {
    color: #2b2b2b;
}

.ot-legal p {
    text-align: justify;
}


/*============================
No script warning
============================*/

.no-script-warning {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    background-color: #990000;
    color: #ffffff;
    font-size: 1.2em;
    margin-bottom: 0.5em;
}

.no-script-warning a {
    color: #ffffff;
    text-decoration: underline;
}

/*============================
Error pages (404, 403...)
============================*/
.errpage {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.errpage h3 {
    text-align: center;
}

.errpage p {
    text-align: center;
}


/*============================
Media queries
============================*/

@media screen and (max-width: 900px) {

    /* Hide main carousel */
    #main-carousel {
        display: none;
    }

    /* Events page*/
    .ot-all-events {
        flex-direction: column;
    }

    .ot-all-events .event {
        height: auto;
    }

    .ot-all-events .event-preview {
        flex-direction: column;
    }

    .ot-all-events .event-preview .event-poster img {
        margin-right: 0;
        margin-bottom: 10px;
    }

    .ot-all-events .event-preview .event-name {
        text-align: center;
    }

/* Structures page*/
   .ot-structures {
       flex-direction: column;
   }

    .ot-structures .structure-controls {
        order: 0;
    }

    .ot-structures .structure-results {
        order: 1;
    }

    .ot-structures .structure {
        height: auto;
    }

    /* Contents */

    /* > fix a bug with floating contents and small screens */
    .ce-right .ce-gallery {
        float: none;
    }
}


/**
<--------------------
-- Temporary fix --
Applique la majeure partie des règles par défaut définies dans le fichier sysext/fluid_styled_content/Configuration/TypoScript/Styling/setup.typoscript
et qui, malgré l'inclusion du plugin au template des sites, ne semblent pas s'appliquer aux éléments de contenu.

Voir : https://assistance.opentalent.fr/browse/V8-5242

>>> A supprimer dès qu'une solution à l'inclusion sera trouvée
 */

.ce-align-left { text-align: left; }
.ce-align-center { text-align: center; }
.ce-align-right { text-align: right; }

.ce-table td, .ce-table th { vertical-align: top; }

.ce-textpic, .ce-image, .ce-nowrap .ce-bodytext, .ce-gallery, .ce-row, .ce-uploads li, .ce-uploads div { overflow: hidden; }

.ce-left .ce-gallery, .ce-column { float: left; }
.ce-center .ce-outer { position: relative; float: right; right: 50%; }
.ce-center .ce-inner { position: relative; float: right; right: -50%; }
.ce-right .ce-gallery { float: right; }

.ce-gallery figure { display: table; margin: 0; }
.ce-gallery figcaption { display: table-caption; caption-side: bottom; }
.ce-gallery img { display: block; }
.ce-gallery iframe { border-width: 0; }
.ce-border img,
.ce-border iframe {
    border: 2px solid #000000;
    padding: 0;
}

.ce-intext.ce-right .ce-gallery, .ce-intext.ce-left .ce-gallery, .ce-above .ce-gallery {
    margin-bottom: 10px;
}
.ce-image .ce-gallery { margin-bottom: 0; }
.ce-intext.ce-right .ce-gallery { margin-left: 14px; }
.ce-intext.ce-left .ce-gallery { margin-right: 14px; }
.ce-below .ce-gallery { margin-top: 14px; }

.ce-column { margin-right: 10px; }
.ce-column:last-child { margin-right: 0; }

.ce-row { margin-bottom: 14px; }
.ce-row:last-child { margin-bottom: 0; }

.ce-above .ce-bodytext { clear: both; }

.ce-intext.ce-left ol, .ce-intext.ce-left ul { padding-left: 40px; overflow: auto; }

/* Headline */
.ce-headline-left { text-align: left; }
.ce-headline-center { text-align: center; }
.ce-headline-right { text-align: right; }

/* Uploads */
.ce-uploads { margin: 0; padding: 0; }
.ce-uploads li { list-style: none outside none; margin: 1em 0; }
.ce-uploads img { float: left; padding-right: 1em; vertical-align: top; }
.ce-uploads span { display: block; }

/* Table */
.ce-table { width: 100%; max-width: 100%; }
.ce-table th, .ce-table td { padding: 0.5em 0.75em; vertical-align: top; }
.ce-table thead th { border-bottom: 2px solid #dadada; }
.ce-table th, .ce-table td { border-top: 1px solid #dadada; }
.ce-table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0,0,0,.05); }
.ce-table-bordered th, .ce-table-bordered td { border: 1px solid #dadada; }

/* Space */
.frame-space-before-extra-small { margin-top: 1em; }
.frame-space-before-small { margin-top: 2em; }
.frame-space-before-medium { margin-top: 3em; }
.frame-space-before-large { margin-top: 4em; }
.frame-space-before-extra-large { margin-top: 5em; }
.frame-space-after-extra-small { margin-bottom: 1em; }
.frame-space-after-small { margin-bottom: 2em; }
.frame-space-after-medium { margin-bottom: 3em; }
.frame-space-after-large { margin-bottom: 4em; }
.frame-space-after-extra-large { margin-bottom: 5em; }

/* Frame */
.frame-ruler-before:before { content: ''; display: block; border-top: 1px solid rgba(0,0,0,0.25); margin-bottom: 2em; }
.frame-ruler-after:after { content: ''; display: block; border-bottom: 1px solid rgba(0,0,0,0.25); margin-top: 2em; }
.frame-indent { margin-left: 15%; margin-right: 15%; }
.frame-indent-left { margin-left: 33%; }
.frame-indent-right { margin-right: 33%; }
/* --------------------> */