html
{
    height: 101%;
    font-size: 100%;
    padding: 0;
    margin: 0
}

body
{
    text-align: justify;
    word-wrap: break-word;
    overflow-wrap: break-word;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-print-color-adjust: exact;
    background: rgb(189, 173, 222);
    word-wrap: break-word;
    color: rgb(0, 0, 0);
    margin: 0 auto;
    padding: 0
}

.sr-only
{
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.bg-blog
{
    background: rgb(128, 103, 183)
}

.txt-blog
{
    color: rgb(205 34 110);
}

.btn-blog
{
    background: rgb(149, 131, 186);
    color: rgb(255, 255, 255)
}

.btn-blog:hover
{
    background: rgb(105, 90, 135);
    color: rgb(255, 255, 255)
}

.btn-outline-blog
{
    background: transparent;
    border: 1px solid rgb(105, 90, 135)
}

.btn-outline-blog:hover
{
    background: rgb(105, 90, 135);
    color: rgb(255, 255, 255)
}

.blog
{
    max-width: 100%;
    background: rgb(229, 218, 249);
    box-shadow: 0px 0px 5px 3px rgba(85, 85, 85, 0.53);
    -webkit-box-shadow: 0px 0px 5px 3px rgba(85, 85, 85, 0.53);
    -moz-box-shadow: 0px 0px 5px 3px rgba(85, 85, 85, 0.53);
    margin: 0 auto
}

.blog::after
{
    clear: both;
    content: "";
    display: table
}

.blog .navbar-logo
{
    border: 1px solid rgb(255, 255, 255);
    border-radius: 150px
}

.blog .jumbotron
{
    height: 380px;
    color: rgb(255, 255, 255);
    border-bottom: 15px solid rgb(128, 103, 183);
    background: rgb(189, 173, 222);
    background-image: linear-gradient(to right, rgba(255, 0,0, 0.4), rgba(0, 0, 255, 0.4)), url("images/header.webp");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-bottom: 0px
}

.blog .body
{
    height: 100%;
    min-height: 100vh;
    line-height: 1.6em;
    margin: 1.5em 0 2em 0;
    display: block
}

.blog .body .lien
{
    color: rgb(77, 77, 77);
    text-decoration: none
}

.blog .body .lien:hover
{
    color: rgb(146, 146, 146)
}

.blog .body .carousel-img
{
    width: 100%;
    height: 500px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.blog .body .rounded-size
{
    width: 120px;
    height: 120px
}

.blog .body .card-img-logo
{
    top: -60px;
    position: relative;
    text-align: center;
    margin-bottom: -50px
}

.blog .body .card-img-bg
{
    width: 100%;
    height: 200px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.blog .body .card-img-bg-big
{
    width: 100%;
    height: 300px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.blog .body .card-text-home
{
    height: 90px
}

.blog .body .form-control-color
{
    max-width: 100%
}

.blog .body .nav-link-tabs
{
    display: inline
}

@media screen and (max-width: 576px)
{
    .blog .body .nav-link-tabs
    {
        display: none
    }
}

.blog .body .pagination
{
    margin-bottom: 0px
}

.blog .body pre[class="quote"]
{
    word-wrap: break-word;
    white-space: pre-wrap;
    border-left: 10px solid rgb(186, 143, 0);
    background: rgb(39, 40, 34);
    border-radius: 3px;
    padding: 15px
}

.blog .body pre[class="quote"] pre[class="quote"]
{
    background: rgb(59, 59, 58)
}

.blog .body pre[class="quote"] blockquote
{
    color: rgb(248, 248, 242)
}

.blog .body pre[class="code"]
{
    border-left: 10px solid rgb(0, 140, 186);
    background: rgb(39, 40, 34);
    padding: 0.35rem 1rem;
    border-radius: 3px
}

.blog .body pre[class="code"] code
{
    display: block;
    max-height: 400px;
    overflow: auto;
    white-space: wrap;
    color: rgb(248, 248, 242)
}

.blog .body .youtube
{
    position: relative;
    padding-bottom: 56.10%;
    height: 0;
    overflow: hidden
}

.blog .body .youtube iframe,
.blog .body .youtube object,
.blog .body .youtube embed
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.blog .prefooter
{
    background: rgb(128, 103, 183);
    color: rgb(255, 255, 255)
}

.blog .footer
{
    background: rgb(46, 46, 46);
    text-align: center;
    color: rgb(255, 255, 255)
}

.blog .footer .img-mobile
{
    max-width: 100%;
    max-height: 100%;
    height: auto
}

.blog .footer .lien
{
    color: rgb(255, 255, 255);
    text-decoration: none
}

.blog .footer .lien:hover
{
    color: rgb(143, 113, 202);
    text-decoration: none
}

::-webkit-scrollbar
{
    width: 5px;
    height: 5px
}

::-webkit-scrollbar-thumb
{
    background: rgb(143, 113, 202);
    border-radius: 0px
}

::-webkit-scrollbar-thumb:hover
{
    background: rgb(167, 143, 214)
}

::-webkit-scrollbar-track
{
    background: rgb(0, 0, 0);
    border-radius: 0px;
    box-shadow: inset 3px 3px 21px 0px rgb(255, 255, 255)
}

@media screen and (max-width: 768px)
{
    .blog .jumbotron
    {
        height: 200px
    }
    
    .blog .footer .img-mobile
    {
        max-width: 50%;
        max-height: 50%
    }
}

.grecaptcha-badge
{
    visibility: hidden
}