/*
Theme Name: Keishu Kawai Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ASTERIUM
Author URI:  https://www.asterium.fr/
Template: salient
Version: 1.0
*/

:root {
  --brown: #695b46;
  --brown-dark: #463D2E;
  --black: #000;
  --white: #fff;
  --green: #3F6D0B;
  --brown-light: #efeeeb;
  --grey: #ccc;
  --grey-light: #f5f5f5;
}


/* IBM Plex */
@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/IBMPlexSans-Light.woff2") format("woff2"),
       url("./fonts/IBMPlexSans-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/IBMPlexSans-LightItalic.woff2") format("woff2"),
       url("./fonts/IBMPlexSans-LightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/IBMPlexSans-Regular.woff2") format("woff2"),
       url("./fonts/IBMPlexSans-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/IBMPlexSans-Italic.woff2") format("woff2"),
       url("./fonts/IBMPlexSans-Italic.woff") format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/IBMPlexSans-SemiBold.woff2") format("woff2"),
       url("./fonts/IBMPlexSans-SemiBold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/IBMPlexSans-SemiBoldItalic.woff2") format("woff2"),
       url("./fonts/IBMPlexSans-SemiBoldItalic.woff") format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/IBMPlexSans-Bold.woff2") format("woff2"),
       url("./fonts/IBMPlexSans-Bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Sans";
  src: url("./fonts/IBMPlexSans-BoldItalic.woff2") format("woff2"),
       url("./fonts/IBMPlexSans-BoldItalic.woff") format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}



*,
body {
  font-family: "IBM Plex Sans";
}
h1,
h2,
h3,
h4 {
  font-family: "IBM Plex Sans";
  margin-bottom: 26px;
  text-transform: capitalize;
}

h1 {
  color: var(--brown) !important;
}
h2 {
  color: var(--brown) !important;
}
h3 {
  color: var(--brown);
}

/**** Common ****/

a.bouton {
  padding: 8px 20px 10px 24px;
  border: 1px solid var(--brown);
  border-radius: 80px;
  color: var(--black);
  display: block;
  max-width: fit-content;
}
@media (min-width: 1200px) {
  a.bouton:hover {
    border: 1px solid var(--white);
    background: transparent url("./images/arrow-right-grey.png") no-repeat;
    background-position: 100% center;
  }
}
.chapeau {
  font-size: 28px;
  font-weight: 400;
}
.legende {
  font-style: italic;
}
/* UL > Li */
.wpb_text_column .wpb_wrapper li {
  list-style: circle;
}
table tr, table td {
    font-size: 16px !important;
}


/* HEADER -------------------------------------------------------------------------------------------------- */
/* Menu principal */
#top nav .sf-menu .sub-menu .current_page_item span {
    color: var(--white);
}
#top nav .sf-menu .sub-menu li:hover span {
    color: var(--white);
}
#top nav .sf-menu span {
    text-transform: uppercase;
    color: var(--brown);
}



/* Accueil ------------------------------------------------------------------------------------- */
#home_title h1 {
    margin-bottom: 0 !important;
}
.home_cta .vc_col-sm-4 .vc_column-inner .wpb_wrapper {
    position: relative;
}
    .home_cta .vc_col-sm-4 .vc_column-inner .wpb_wrapper a.nectar-button {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateY(-50%);
        transform: translateX(-50%);
    }
.lesson {
    border: 1px solid var(--brown-light);
    border-radius: 5px;
}
@media (max-width: 999px) {
    .lesson .vc_col-sm-6.column_image {
        height: 300px;
    }
}



/* NEWS ------------------------------------------------------------------------------------------*/
/* News list */
#liste_actualites {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 30px 0;
}
    #liste_actualites .actu_element {
      flex: 0 0 100%;
      border-top: 8px solid var(--blue);
      display: flex;
      flex-direction: column;
      gap: 10px;
    }
        #liste_actualites .actu_element .actu_image {
          width: 100%;
          height: 260px;
          display: flex;
          overflow: hidden;
          border-top-left-radius: 8px;
          border-top-right-radius: 8px;
        }
        #liste_actualites .actu_element .actu_image img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          transition: 0.3s ease-in-out;
        }
        @media (min-width: 1200px) {
            #liste_actualites .actu_element:hover .actu_image img {
                transform: scale(1.1);
            }
        }
@media (min-width: 921px) {
    #liste_actualites {
        gap: 0;
    }
    #liste_actualites .actu_element {
        flex: 0 0 30%;
    }
}

/* News - single */
.single-post span.meta-category {
    display: none;
} 





/* Contact form footer */
.gdpr {
    padding: 30px 0 0 0;
    font-size: 14px;
    line-height: 17px;
    font-style: italic;
    max-width: 90%;
}




/* Footer ------------------------------------------------------------------------------------------- */
#footer-outer .widget h4 {
    font-size: 22px !important;
}
#menu-footer {

}
#menu-social-network li {
    display: inline-block;
}
    #menu-social-network li a {
        text-indent: -9999px;
        width: 32px;
        height: 32px;
        margin: 0 6px 0 0;
    }
        #menu-social-network li.instagram a {
          display: block;
          background: transparent url("./images/icone_insta.png") no-repeat;
          background-size: 32px;
        }