/** Reset **/
@import url('../css/reset.css');
@import url('../css/punaise.css');

/** Plugins **/
@import url('../../plugins/slick/slick-theme.css');
@import url('../../plugins/slick/slick.css');

@import url('../css/prism-edit.css');

@import url('../../plugins/Morphext/morphext.css');

@import url('../../plugins/chartJs/dist/Chart.css');

@import url('../../plugins/DatePicker/css/datepicker.css');

/** Web Pages **/
@import url('../style/main.css');

@import url('../style/ks/index.css');
@import url('../style/ks/about.css');
@import url('../style/ks/resume.css');

@import url('../style/blog/index.css');
@import url('../style/blog/detail.css');

@import url('../style/legal/index.css');

@import url('../style/works/index.css');
@import url('../style/works/detail.css');

@import url('../style/contact/index.css');
@import url('../style/contact/newsletter.css');

/* Punaise */
@import url('../style/_base/Header.css');
@import url('../style/_base/Footer.css');

/* RESPONSIVE */

/** Webfonts | Google font **/
/* Roboto Serif */
@import url('https://fonts.googleapis.com/css2?family=Roboto+Serif:ital,opsz,wght@0,8..144,100;0,8..144,200;0,8..144,300;0,8..144,400;0,8..144,500;0,8..144,600;0,8..144,700;0,8..144,800;0,8..144,900;1,8..144,100;1,8..144,200;1,8..144,300;1,8..144,400;1,8..144,500;1,8..144,600;1,8..144,700;1,8..144,800;1,8..144,900&display=swap');
/* Nunito */
@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;0,1000;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900;1,1000&display=swap');

/** Webfonts | Webfont **/
@import url('../../webfonts/ProximaNova/stylesheet.css');


:root {
/* Spaces */
--space-top: 80px;

/* Colors */
--co: #1c67bd;
--co-rgb: 28, 103, 189;

--co-light: #36dcfb;
--co-light-rgb: 54,220,251;

--co-gold: rgb(187, 162, 145);
--co-gold-rgb: 203, 176, 158;

--co-1: #ff009d;
--co-1-rgb: 255, 0, 157;

--co-a: #0e305b;
--co-a-rgb: 14, 48, 91;

--co-white: #ffffff;
--co-white-rgb: 255, 255, 255;

--co-dark: rgb(13, 11, 31);
--co-dark-rgb: 13, 11, 31;

--co-black: #000;
--co-black-rgb: 0, 0, 0;

/* BG */
--co-fade: rgb(246, 246, 249);
--co-fade-rgb: 246, 246, 249;

/* Border */
--co-bdr: rgb(232, 232, 232);
--co-bdr-rgb: 232, 232, 232;

/* Texts */
--co-text: #212222;
--co-text-fade: #848484;

/* Shadows */
--shadow_c1: 0 1px 3px 1px rgba(0,0,0,0.05);

/* Pages */
--co-select: rgba(var(--co-light-rgb), .09);
--bg-body: var(--co-white);
}
:root{
    /** FONT PRINCIPAL  **/
    --f: 'Proxima Nova', var(--f-variables);
    --f-1: 'Nunito', var(--f-variables);

    --f-serif: 'Roboto Serif', serif;
    --f-variables: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
@media (max-width: 768px) {
    :root {
        /* Spaces */
        --space-top: 50px;
    }
}

/* Layout */
html, body{
    background-color: var(--co-a);
}
@media (min-width: 1600px) {
    html {
        width: 1600px!important;
        margin:  0 auto!important;

        position: relative!important;

        background-color: #FAF5EE!important;
    }
}
.main-app{
    min-height: 100%;
    width: 100%;
    background: var(--co-white);
}
body.wHdr .main-app{
    padding-top: var(--space-top);
}

body .main-app.bg{
    background-color: var(--co-fade);
}
body .main-app.bg .separe_banner_footer svg path{
    fill: var(--co-fade);
}

/* %%% */

.serif{
    font-family: var(--f-serif);
}


/* %%% */

.pagePa{
    padding-top: 30px;
    padding-bottom: 150px;
}
.pagePa.moPT{
    padding-top: 50px;
}

.pagePa.noPB{
    padding-bottom: 0px;
}

.pagePa.noPT{
    padding-top: 0px;
}

.lock {
    overflow: hidden!important;
}

/*[ D E F A U L T ]
///////////////////////////////////////////////////////////
*/

/* Layout */

.container,
.ti_container,
.content,
.contenu{
    height: 100%;
    margin: 0 auto;
}
.container {
    width: 1150px;
}
.container.wide{
    width: 1300px;
}

.content{
    width: 650px;
}

@media (max-width: 1150px) {
    .container {
        width: 100%;

        padding: 0 10px;
    }
}


/*[ BACKGROUNDS ]
///////////////////////////////////////////////////////////
*/

.bg_gray{
    width: 100%;
    height: 100%;

    position: relative;
}
.bg_gray::after,
.bg_gray::before{
    content: ""!important;

    top: 0!important;
    left: 0!important;
    right: 0!important;

    width: 100%!important;
    height: 100%;

    position: absolute!important;
}
.bg_gray::before{
    background-position: center!important;
    background-size: 50%;
    background-repeat: repeat!important;
    background-attachment: scroll!important;
}
.bg_gray::after{
    background-color: transparent;

    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;

    z-index: 1;
}
.bg_gray > *{
    z-index: 100;
}


/*[ EFFECTS ]
///////////////////////////////////////////////////////////
*/

.blur{
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    -moz-backdrop-filter: blur(10px);
    -o-backdrop-filter: blur(10px);
    -ms-backdrop-filter: blur(10px);
}

.vibrancy{
    -webkit-backdrop-filter: saturate(130%) brightness(90%) blur(10px);
    -ms-backdrop-filter: saturate(130%) brightness(90%) blur(10px);
    -o-backdrop-filter: saturate(130%) brightness(90%) blur(10px);
    -moz-backdrop-filter: saturate(130%) brightness(90%) blur(10px);
    backdrop-filter: saturate(130%) brightness(90%) blur(10px);
}

/*[ P A D D I N G ]
///////////////////////////////////////////////////////////
*/

.section{
    padding-top: 50px;
    padding-bottom: 50px;
}

.ti_section{
    padding-top: 20px;
    padding-bottom: 20px;
}   

.bdy-hero{
    width: 100%;
    height: 100%;
}

.space-top{
    padding-top: var(--space-top);
}

/*[ DISPLAY ]
///////////////////////////////////////////////////////////
*/

._k0e0Ke_flex{
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;

    justify-content: center;
    align-items: center;

    width: 100%;
    height: 100%;
}

._k0a0Ke_{
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;

    justify-content: space-between;
    align-items: center;

    width: 100%;
    height: 100%;
}

._k0e0Ke_flex_W{
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-moz-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
    flex-wrap: wrap;

    width: 100%;
    height: 100%;
}

.k0e0Ke_I_flex{
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;

    justify-content: flex-end;
    align-items: center;

    width: 100%;
    height: 100%;
}

.no-sk{
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

/* Grid */

.grid{
    display: grid;
    align-items: flex-start;
    grid-column-gap: 10px;
    justify-content: flex-start;
}

.grid_2,
.grid_2s{
    grid-template-columns: auto auto;
}

.grid_3,
.grid_3s{
    grid-template-columns: auto auto auto;
}

.grid_4,
.grid_4s{
    grid-template-columns: auto auto auto auto;
}

.grid_5,
.grid_5s{
    grid-template-columns: auto auto auto auto auto;
}