/*
Theme Name: November Zero
Theme URI: https://mantrabrain.com/downloads/november-zero/
Author: Mantrabrain
Author URI: https://mantrabrain.com
Description: November Zero is simple and responsive multipurpose WordPress theme. November Zero can be used  to build any  type of business  website, Landing pages, Portfolios, Photography and Creative sites, One Page , Hotel , Restaurant , Blog , Law Firm , Medical  and many more. November Zero is fully responsive, well designed and   translation ready.
Version: 1.0.7
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, two-columns, right-sidebar, custom-background, custom-menu, featured-images, theme-options, translation-ready, custom-logo, photography, threaded-comments, e-commerce, portfolio
Text Domain: november-zero

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

November Zero is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/* Ajout */
.div-accueil-blanc, .div-accueil-rouge{
    padding-top: 25px;
    text-align: center;
    font-size: 16px;
    padding-left: 250px;
    padding-right: 250px;
}


.div-accueil-rouge {
    background-color: #ab1012;
    padding-bottom: 20px;
    color: #e8e7e7;
}

.div-accueil-blanc h2, .div-accueil-rouge h2, .contact-section .content h2 {
    font-weight: bold;
    font-size: 40px;
    text-align: center;
    padding-bottom: 20px;
}

.div-accueil-blanc h2, .contact-section .content h2 {
    color: #6e6e6e;
}

.div-accueil-rouge h2 {
    color: #e8e7e7;
}

.div-accueil-blanc .separator {
    background-color: #ab1012;
    width: 180px;
    height: 1px;
    margin: 15px auto 21px;
    clear: both;
}

.div-accueil-blanc .separator span {
    width: 30px;
    height: 4px;
    margin: 0px auto;
    display: block;
    position: relative;
    bottom: 2px;
    background-color: #ab1012;
}

.div-accueil-blanc table {
    border-collapse: collapse;
}

.div-accueil-blanc 

.div-accueil-blanc tr th {
    color: #e8e7e7;
    background-color: #ab1012;
}

.div-accueil-blanc th, .div-accueil-blanc td {
    border: 1px solid black;
    line-height: 35px;
    padding: 5px;
}

.div-accueil-rouge .separator {
    background-color: #ffffff;
    width: 180px;
    height: 1px;
    margin: 15px auto 21px;
    clear: both;
}

.div-accueil-rouge .separator span {
    width: 30px;
    height: 4px;
    margin: 0px auto;
    display: block;
    position: relative;
    bottom: 2px;
    background-color: #ffffff;
}

#apercu-avantages {
    line-height: 5;
    font-size: 20px;
    font-weight: 600;
    text-decoration: underline;
    color: #e8e7e7;
}

.div-accueil-rouge ul li {
    text-align: left;
}

.article-prestas {
    text-align: center;
    width: 31.33%;
    height: 450px;
    min-height: 100%;
    margin: 1%;
    text-align: center;
    border: 1px solid #ffffff;
    border-radius: 0 10px 0 10px;
}

.blog-section#blog {
    position: unset!important;
}

.bg-blog-overlay:after {
    position: unset!important;
}

.contact-section .content, .contact-section .content input{
    margin: 0 auto;
    display: block;
}

.contact-section .content {
    width: 50%;
}

.contact-section .content input[submit] {
    width: 30%;
}

.titre-tab {
    text-align: center;
    color: #6e6e6e;
    text-decoration: underline;
    font-size: 20px;
    padding: 20px;
    line-height: 20px;
    font-weight: bold;
}

.div-accueil-blanc td, .div-accueil-blanc th {
    width: 20%;
}

#texte-qsn {
    width:70%;
    text-align: justify;
}

#qsn {
    margin-bottom: 0px;
}

#texte-garanties {
    margin-bottom: unset;
    text-align: justify;
}

hr {
    width: 5%;
}

.titre-prestas h3{
    font-size: 26px;
}

.div-accueil-rouge .col-3 {
    grid-column-gap: 60px;
}

#avis {
    padding-top: unset;
    margin-top: 0px;
}

#avis .titre-section {
    margin-top: 0px;
}

.div-accueil-rouge a {
    color:#e8e7e7;
    text-decoration: underline;
}

blockquote {
    text-align: left;
    font-style: italic;
}

.span-header {
    color: #fafaf6;
    margin-right: 10px;
    width: 30%;
}

.bouton-header {
    border: 1px solid #ab1012;
    background: #fafaf6;
    border-radius: 10px;
}

.bouton-header a {
    color: #ab1012;
    float: right;
}

#ancre-presentation p {
    text-align: justify;
}

#texte-prestations {
    text-align: justify;
}

.blog-artical-content {
    max-height: 100%;
}

.ancre {
    display: block;
    height: 130px;
    margin-top: -130px;
    visibility: hidden;
}

.kyn-container {
    max-width: 1333px;
    overflow: hidden;
    padding-top: 50px;
    margin: auto;
    width: 100%;
}

.kyn-bloc {
    float: left;
    width: 31%;
    margin: 1%;
    border-radius: 20px;
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    min-width: 350px;
    max-width: 500px;
    min-height: 250px;
    height: auto;
    font-size: 18px;
    font-family: 'Arial';
    background-color: #fff;
    position: relative;
}

.kyn-bloc a:hover {
    color: #ffffff;
}

.gestion-paie {
    background: linear-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) ), url(https://www.vsa-paye.fr/wp-content/uploads/2019/07/bulletin-de-paie-gournay-93.jpg) no-repeat;
    background-size: cover;
}

.admin-perso {
    background: linear-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) ), url(https://www.vsa-paye.fr/wp-content/uploads/2019/07/gestion-de-personnel-gournay-93.jpg) no-repeat;
    background-size: cover;
}

.dsn-pas {
    background: linear-gradient( rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1) ), url(https://www.vsa-paye.fr/wp-content/uploads/2019/07/dsn-prelevement-source-gournay-93.jpg) no-repeat;
    background-size: cover;
}

.kyn-content-img {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 200px;
    height: 100%;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

.titre-presentation {
    background-color: #ab1012;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    padding: 8px;
    height: 70px;
    min-height: 100%;
}

.titre-presentation h3, #gestion-dsn {
    font-weight: bold;
}

.titre-presentation h3 {
    font-size: 14px;
}

.titre-presentation a {
    color: #e8e7e7;
}

#presentation {
    padding-bottom: 20px;
    padding-left: 250px;
    padding-right: 250px;
}

#ancre-bloc-pres {
    padding-top: 0px;
    padding-left: 50px;
    padding-right: 50px;
}


.page-header {
    background: linear-gradient(
        rgba(0, 0, 0, 0.35), 
        rgba(0, 0, 0, 0.35)
        ),url(https://www.vsa-paye.fr/wp-content/uploads/2019/06/main-vsa-paye.png)!important;
    background-size:cover;
    background-repeat:no-repeat;
    height: 170px!important;
}

.page-header h2 {
    font-family: "Roboto Slab", sans-serif;
    font-weight: bold;
    font-size: 30px;
    color: #fefefe;
}

article.post:hover, article.page:hover {
    box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.05)
}

#primary-menu li {
    font-size: 16px;
}

.sub-menu li a{
    color: #ab1012!important;
}

.menu-item-454 {
    background-color: #ffffff!important;
    border-radius: 10px;
    border-bottom: 0px solid transparent!important;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.menu-item-454 a {
    color: #ab1012!important;
}

#top-header-phrase {
    color:#666;
    font-size: 14px; 
    font-weight:700;
}

.top-menu-gauche {
    margin-top: -15px!important;
}

.ms-theme-cubic {
    padding: 0!important;

}

#blogseemorebtn:hover {
    color: #ab1012;
}

.mobile-menu span {
    color: #fafaf6;
}

.site-navigation-wrapper {
    -webkit-box-flex: 6;
    flex: 6;
}

#mySidenav {
    background: linear-gradient(
        rgba(0, 0, 0, 0.35), 
        rgba(0, 0, 0, 0.35)
        ),url(https://www.vsa-paye.fr/wp-content/uploads/2019/06/main-vsa-paye.png)!important;
    background-repeat: no-repeat;
    background-size: cover;
}

#separator-actu {
    background-color: #fafaf6;
    width: 180px;
    height: 1px;
    margin: 35px auto 21px;
    clear: both;
}

#separator-actu span {
    width: 30px;
    height: 4px;
    margin: 0px auto;
    display: block;
    position: relative;
    bottom: 2px;
    background-color: #fafaf6;
}

#separator-contact {
    background-color: #ab1012;
    width: 180px;
    height: 1px;
    margin: 35px auto 21px;
    clear: both;
}

#separator-contact span {
    width: 30px;
    height: 4px;
    margin: 0px auto;
    display: block;
    position: relative;
    bottom: 2px;
    background-color: #ab1012;
}

nav {
    display: block;
}

.bg-dark {
    background-color: unset!important;
}

.col-2, .col-3 {
    max-width: unset!important;
}

.div-accueil-blanc {
    background-image: url(https://www.vsa-paye.fr/wp-content/uploads/2019/06/main-vsa-paye.png)!important;
    background-repeat: no-repeat!important;
    background-size: cover!important;
    background-attachment: fixed!important;
}

.contact-section {
    background-image: url(https://www.vsa-paye.fr/wp-content/uploads/2019/06/main-vsa-paye.png)!important;
    background-repeat: no-repeat!important;
    background-size: cover!important;
}

 
html {
    scroll-behavior: smooth;
}


/*Kynova*/
.entry-content p, .entry-content li {
    text-align: justify;
}

.entry-content iframe {
    margin: auto;
    display: block;
}


.entry-footer {
    display: none;
}

.article-wrap .blog-title {
    min-height: 106px !important;
}



/*---*/



@media screen and (max-width: 1615px) {
    #presentation {
        padding-left: 20px!important;
        padding-right: 20px!important;
    }
}

@media screen and (max-width: 1390px) {
    .div-accueil-blanc, .div-accueil-rouge {
        padding-left: 30px;
        padding-right: 30px;        
    }
}

@media screen and (max-width: 1215px) {
    .kyn-bloc {
        min-width: unset; 
    }
}

@media screen and (max-width: 1200px) {
    #primary-menu li {
        font-size: 12px;
    }
}

@media screen and (min-width: 990px) and (max-width: 1200px) {
    .blog-artical-content {
        height: 500px;
        max-height: 100%;
    }
}

@media screen and (max-width: 1025px) {
    .top-menu-gauche {
        float: right;
        margin-top: -60px!important;
    }
}


@media screen and (min-width: 1020px) {
    #texte-qsn {
        width: 100%;
    }
}

@media screen and (max-width: 1020px) {
    .bouton-header {
        margin-bottom: 5px;
    }

    .div-accueil-blanc, .div-accueil-rouge {
        padding-left: 30px;
        padding-right: 30px;        
    }

    .article-wrap p, #ancre-tarifs p {
        text-align: justify;
    }

    #texte-qsn {
        width: unset;
    }

    #ancre-tarifs table {
        margin: 0 auto;
        display: block;
        width: 70%;
    }
}

@media screen and (max-width: 1010px) {
    #gestion-dsn h3 {
        font-size: 12px;
    }
}

@media screen and (max-width: 1000px) {
    .kyn-bloc {
        margin: 0 auto;
        margin-bottom: 15px;
        display: block;
        width: 100%;
        max-width: unset;
    }
}

@media screen and (max-width: 765px) {
    footer#colophon {
        text-align: center!important;
    }

    .bg-dark{
        background-color: #ab1012;
    }

    #primary-menu, .sub-menu {
        list-style: none!important;
    }

    #primary-menu {
        padding: 0px;
        margin: 0px;
    }

    .sub-menu {
        padding-left: 0px;
        margin-left: 0px;
    }

    #primary-menu li a {
        color: #ffffff;
        font-size: 12px!important;
    }

    .sub-menu li a{
        color: #ffffff!important;
    }

    .navbar-dark .navbar-toggler {
        background-color: #ab1012;
    }

    #menu-item-454 {
        background-color: #ab1012!important;
    }

    #menu-item-454 a{
        color: #ffffff!important;
    }

    .mobile-menu {
        margin-left: 70px;
        margin-top: 30px;
    }

    .navbar {
        margin-bottom: 0;
    }

    .header-flex .site-branding {
        margin: 0 auto;
        display: block;
    }

    .mobile-menu {
        margin: 0 auto;
        display: block;
    }

    .custom-logo-link {
        margin : 0;
    }

    #top-nav {
        display: inline!important;
    }

    .top-header-right {
        margin: 0 auto;
        display: block;
        height: 45px;
    }

    .top-menu-gauche {
        display: none;
    }

}

@media screen and (max-width: 520px) {
    .tab-tarifs th, .tarif-bulletin,  .tab-tarifs td{
        font-size: 12px;
    }
}

@media screen and (max-width: 450px) {
    .tab-tarifs th, .tarif-bulletin, .tab-tarifs td{
        font-size: 10px;
        word-break: break-word;
    }

    .custom-logo {
        width: 220px;
    }
}

@media screen and (max-width: 340px) {
    #top-nav li a {
        font-size : 9px;
    }
}











