/* Custom CSS */



li {
    list-style: none;
    text-align: center;
}

.media {
    text-align: center;
    /*
    display: block;
    margin-left: auto;
    margin-right: auto;
    */
    width: auto;
}




.blog-title {
    color: #33819c;
}

#site-head .blog-description,
#site-head.withCenteredImage .blog-description {
    text-shadow: 0px 0px 0px;
}

#site-head .blog-title,
#site-head.withCenteredImage .blog-title {
    text-shadow: 0px 0px 0px;
}

.blog-description {
    color: #33819c;
}


a:hover {
    color: #57571f;
}


#site-head a.btn,
#site-head.withCenteredImage a.btn {
    background-color: #33819c;
    color: white;
}


#site-head a.btn,
#site-head.withCenteredImage a.btn:hover{
    background-color: #1b5669;
    color: white;
}




a.btn {
    color: #33819c;
    background: #f0f0f0;
}

.btn.site-menu {
    color: rgb(180, 69, 69);
    background-color: #22343A;
}

a.btn:hover {
    background-color: #f2f2ec;
}

#header-arrow {
    color: #33819c;
}

.fa.fa-angle-down {
    color: #1b5669;
}


a.fn-item.active {
    color: #33819c;
}

a.fn-item:hover {
    color: #33819c;
}


.post-holder.dark {
    background: #33819c;
    color: white;
    --section-dark-bg-color: #33819c;

}

.post-holder {
    background: #f2efe8;
}

body {
    color: #3A4145;
}


.site-footer {
    color: #BBC7CC;
    background-color: #22343A;
}


.vertical {
    margin: 0;
    padding: 0;
    height: 100%;
    background-image: linear-gradient(125deg, #16222e, #0d2617, #19394d, #471913, #2a0a38);
    background-size: 400%;
    animation: bganimation 15s infinite;
}

@keyframes bganimation {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }

}



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

    #site-head {
        padding: 0%;
    }
}

@media only screen and (max-width: 500px) {
    #site-head {
        padding: 0%;
    }
}