/*
Theme Name: smspay
Description: Wordpress theme for smspay.
Author: Michael M Langitan
Version: 0.1
Requires at least: 5.0
Requires PHP: 7.0
*/

*,
*:after,
*::before {
    box-sizing: border-box;
    margin:0;
    padding:0;
}
html{
    font-size:16px;
}
body{
    background: #fff;
    font-family: 'Nunito', sans-serif;
    color:#222;
    overflow-x: hidden;
    position: relative;
}
a:hover{
    color: #2E55A5;
}
.text-dark a.text-reset:hover{
    color: #2E55A5!important;
}
/* GENERAL */
.bg-none{
    background: none!important;
}
.bg-accent{
    background: #2E55A5!important;
}
.bg-action{
    background: #FFC97C!important;
}
.bg-darkblue{
    background: #3617E3!important;
}
.bg-darkerblue{
    background: #0F2634!important;
}
.text-accent{
    color:#2E55A5!important;
}
.text-action{
    color:#FFC97C!important;
}
.text-darkblue{
    color:#3617E3!important;
}
.text-flatblue{
    color:#2E55A5;
}
.text-dark{
    color:#0F2634!important;
}
.text-warning{
    color:#F7D250!important;
}
.btn-outline-accent{
    border:1px solid #2E55A5;
    color:#2E55A5;
    background: none;
}
.btn-outline-accent:hover{
    background: #2E55A5;
    color:#fff;
}
.overflow-visible{
    overflow:visible;
}
.object-fit-cover{
    object-fit:cover;
}
.object-fit-contain{
    object-fit:contain;
}
.radius-0{
    border-radius: 0;
}
.radius-50{
    border-radius:50%;
}
.radius-rounded{
    border-radius:50px;
}
.border-bottom-accent{
    border-bottom-color:#2E55A5;
}
.border-bottom-1{
    border-bottom-width: 1px;
}
.border-bottom-2{
    border-bottom-width: 2px;
}
.no-underline{
    text-decoration: none!important;
}
.btn .fa-plus:before{
    content:"\f068";
}
.btn.collapsed .fa-plus:before{
    content:"\f067";
}
.accordion .btn-toggle{
    font-weight:bold;
    padding:5px 0;
    outline:none!important;
    box-shadow: none!important;
    width:100%;
    text-align:left;
    border-bottom:2px solid #2E55A5;
    border-radius:0;
    color:#2E55A5;
}
.accordion .btn-toggle .fa{
    float:right;
}
.accordion .btn-toggle.collapsed{
    color:#0F2634;
    border-bottom-color:#0F2634
}
.accordion .btn-toggle:hover{
    color:#2E55A5;
}
.accordion .card-header{
    padding:5px 0;
}
.accordion img{
    max-width: 100%;
    height:auto!important;
}
.row-faq{
    padding:10px 0;
}
.row-faq-question{
    background:#FAFBFF;
    border-left:5px solid #0D47A1;
}
.row-faq-question .row-faq-title{
    color:#0D47A1;
}
.row-faq-answer{
    background:#fff;
    border-left:5px solid #939393;
}
.row-faq-answer .row-faq-title{
    color:#939393;
}
.row-faq ul,
.row-faq ol{
    margin-left:20px;
}
.content-min-height {
    min-height: 465px;
}
/* NAVBAR */
#navbar{
    position: sticky;
    position: -webkit-sticky;
    top:0;
    z-index: 999;
    transition: .3s ease;
    padding: 50px 0 15px 0;
    background:#fff;
}
#navbar .navbar-brand{
    margin:0;
    transition:.3s ease;
    position: relative;
}
#navbar .navbar-brand img{
    transition:.3s ease;
    position: absolute;
    bottom:0;
    left:0;
    transform: translateX(calc(-100% - 30px));
}
#navbar .navbar-nav{
    margin:0 -10px;
}
#navbar .navbar-nav > li{
    padding:0 10px;
    position: relative;
}
#navbar .navbar-nav > li > a{
    font-size: 18px;
    color:#333;
    font-weight: bold;
    padding:0;
    height: 60px;
    line-height: 60px;
}
#navbar .navbar-nav > li.menu-item-has-children:after{
    content:"\f0d7";
    font-family: 'Fontawesome';
    position: absolute;
    top:50%;
    right:0;
    transform: translateY(-50%);
}
#navbar .navbar-nav > li.menu-item-has-children a{
    padding-right:10px;
}
#navbar .navbar-nav > li.active > a,
#navbar .navbar-nav > li.current_page_item > a,
#navbar .navbar-nav > li.current-page-ancestor > a{
    border-bottom: 3px solid #2E55A5;
    color:#2E55A5;
}
#navbar .navbar-nav > li > a:hover{
    color:#2E55A5;
}
#navbar .navbar-nav > li > ul{
    position: absolute;
    top:100%;
    left:0;
    background: #fff;
    padding:10px 0;
    box-shadow:0 20px 20px -20px #0002;
    border-radius:0 0 5px 5px;
    display: none;
    min-width:200px;
    z-index: 999;
}
#navbar .navbar-nav > li ul {
    list-style: none;
    margin:0;
}
#navbar .navbar-nav > li > ul ul {
    padding-left: 25px;
}
#navbar .navbar-nav > li:hover > ul{
    display: block;
}
#navbar .navbar-nav > li > ul > li > a{
    white-space: nowrap;
    color:#0F2634;
    padding:10px 15px;
}
#navbar .navbar-nav > li > ul li > a:hover{
    background:#f5f5f5;
}
.search-form{
    border:2px solid #0F2634;
    border-radius:50px;
    overflow: hidden;
}
.search-form .form-control,
.search-form .btn{
    border:none;
    outline:none!important;
    box-shadow:none!important;
    background:none;
    padding:0 15px;
    height:30px!important;
}
.search-form .btn{
    color:#aaa;
    padding:0 15px;
    height:30px!important;
    line-height:30px!important;
}
#navbar.float{
    padding:5px 0;
    box-shadow:0 10px 30px -10px #0001;
}
#navbar.float .navbar-brand{
    margin:0;
}
#navbar.float .navbar-brand img{
    height:30px!important;
}

/* Section Heading */
.section-heading{
    z-index:99;
    background:#fff;
    transition: .3s ease;
}
.section-heading .col-text{
    transition: .3s ease;
}
.section-heading .col-text h2,
.section-heading .col-text p{
    transition: .3s ease;
    margin:0;
}
.section-heading .col-text h2{
    font-size:28px!important;
}
.section-heading .col-text p{
    margin:0;
}
.section-heading .col-button img{
    height:60px;
}
.section-heading .btn{
    border-radius:15px;
    font-weight:bold;
    /*font-size:24px;*/
    letter-spacing:1.5px;
    transition: .3s ease;
}
.section-heading .inner{
    transition: .5s;
}
.section-heading.float .inner{
    padding:15px 0!important;
    position: fixed;
    z-index:99;
    top:69px;
    left:0;
    right:0;
    background:#fff;
}
.section-heading.float .col-text{
    transform:none!important;
    opacity:1!important;
    transition:none!important;
}
.section-heading.float .col-text h2{
    font-size:20px;
    margin:0!important;
}
.section-heading.float .col-button{
    transform:none!important;
    opacity:1!important;
    transition:none!important;
}
.section-heading.float .btn{
    /*font-size:16px;*/
    padding:10px 30px!important;
    border-radius:10px;
}

/*Footer*/
footer{
    background:#0F2634;
    color:#fff;
    font-weight: 300;
}
footer h5{
    font-weight:bold;
}
footer a{
    color:#fff;
}
footer a:hover{
    color:#2E55A5;
    text-decoration: none;
}
footer .social-link a{
    display:inline-block;
    width:40px;
    height:40px;
    line-height:40px;
    padding:0;
    border:2px solid #fff;
    border-radius:50%;
    text-align:center;
    color:#fff;
    margin:0 10px 5px 0;
    transition:.3s ease;
    font-size:20px;
}
footer .social-link a:hover{
    background:#fff;
    color:#0F2634;
}
footer .widget {
    padding: 5px 0;
}

/*Post Article*/
.post-article .post-thumbnail {
    margin-bottom: 20px;
    overflow: hidden;
}
.post-article .post-thumbnail img {
    max-width: 100%;
}
.post-article .post-content p {
    text-align: justify;
}
.post-article .post-date {
    color: #797979;
    font-size: 12px;
}
.post-article .post-title {
    border-left: 5px solid #d95b5d;
    padding-left: 15px;
}

/*Category Page*/
.category-page {
    margin-top: 50px;
    margin-bottom: 50px;
}
.category-page .widget {
    margin-bottom: 20px;
}
.category-page .widget_categories ul {
    list-style: none;
}
.category-page .widget_categories ul a {
    display: block;
    text-decoration: none;
    color: #6c757d;
    border: 1px solid #6c757d;
    padding: 5px 10px;
    margin-bottom: 10px;
}
.category-page .widget_categories ul a:hover {
    background-color: #6c757d;
    color: #f5f5f5;
}
.category-page .widget_search .screen-reader-text{
    display: none;
}
.category-page .widget_search form {
    border: 1px solid #c9d4dd;
    position: relative;
}
.category-page .widget_search input[type="text"],
.category-page .widget_search input[type="submit"] {
    padding: 5px;
}
.category-page .widget_search input[type="text"] {
    border: none;
    width: 100%;
    outline: none;
}
.category-page .widget_search input[type="submit"] {
    border: none;
    background-color: #fff;
    position: absolute;
    right: 0;
}
.category-page .post-thumbnail {
    margin-bottom: 20px;
    overflow: hidden;
}
.category-page .post-thumbnail img {
    max-width: 100%;
}

/* Animated */
.animate__animated.animate_FL.animate__fadeInLeft,
.animate__animated.animate_FR.animate__fadeInRight{
    visibility: visible;
}
/* Responsive of Animated */
@media (min-width: 992px) {
    .animate__animated.animate_FL,
    .animate__animated.animate_FR{
        visibility: hidden;
    }
}

/* Responsive */
@media (max-width: 1440px){
    .section-heading .btn{
        padding:15px 30px!important;
        font-size:18px;
        margin-top:5px;
    }
    .section-heading .col-button img{
        height:50px;
    }
}
@media (max-width: 1366px){
    #navbar .navbar-nav > li > a{
        font-size:15px;
    }
}
@media (max-width: 1200px){
    #navbar .navbar-nav > li > a{
        font-size:14px;
    }
    .navbar .navbar-search{
        max-width:200px;
    }
}
@media (max-width: 1024px){
    #navbar .navbar-nav > li > a{
        font-size:12px;
    }
    .navbar .navbar-search{
        max-width:150px;
    }
}
@media (max-width: 768px){
    #navbar{
        padding:15px!important;
    }
    #navbar.float{
        padding:15px!important;
    }
    .navbar-toggler{
        border:none;
        outline:none!important;
    }
    .navbar-toggler span{
        display: block;
        width: 30px;
        height: 2px;
        border-radius: 3px;
        background-color: #1C1D1E;
        margin: 7px 0;
        transition: all 0.4s;
    }
    .navbar-toggler[aria-expanded="true"] span {
        display: none;
    }
    .navbar-toggler[aria-expanded="true"] span:first-child {
        display: block;
        transform: rotate(45deg) translate(9px, 7px);
    }
    .navbar-toggler[aria-expanded="true"] span:last-child {
        display: block;
        transform: rotate(-45deg) translate(-1px, 2px);
    }
    #navigation .navbar-nav > li{
        padding:0;
    }
    #navigation .navbar-nav > li > a{
        padding:0 15px;
        border-radius:5px;
        font-size:16px;
        height:50px;
        line-height:50px;
    }
    #navbar .navbar-brand{
        margin-top:0;
    }
    #navbar .navbar-brand img{
        height:50px;
        position: relative;
        transform: translateX(0);
    }
    .btn-search{
        padding:0 15px;
        font-size:20px;
        background:none!important;
        border:none!important;
        outline:none!important;
    }
    .navbar-mobile-search{
        position:fixed;
        top:0;
        left:0;
        right:0;
        z-index:999;
        background:#fff;
        box-shadow:0px 1px 3px #0001;
    }
    .navbar-mobile-search .form-control,
    .navbar-mobile-search .btn{
        height:52px;
        border:none!important;
        box-shadow:none!important;
        outline:none!important;
    }
    #navbar .navbar-nav > li.active > a,
    #navbar .navbar-nav > li.current_page_item > a,
    #navbar .navbar-nav > li.current-page-ancestor > a{
        border:none;
        background:#2E55A5;
        color:#fff;
    }
    #navigation .navbar-nav > li > ul{
        position: relative;
        top:auto;
        left:auto;
        box-shadow:none;
        background:#f5f5f5;
        padding:10px;
    }
    #navbar .navbar-nav > li.menu-item-has-children:after{
        height:60px;
        line-height:60px;
        padding:0 20px;
        z-index:999;
        transform:none;
        top:0;
    }
    #navbar .navbar-nav > li.active:after,
    #navbar .navbar-nav > li.current_page_item:after,
    #navbar .navbar-nav > li.current-page-ancestor:after{
        color:#fff;
    }
    #navbar .navbar-nav > li.menu-item-has-children:after .navbar-light .navbar-toggler{
        border:none;
    }
    .section-heading{
        top:0;
    }
    .section-heading .col-text{
        margin-left:0;
    }
    .section-heading.float .inner{
        top:71px;
    }
    .section-heading h2{
        font-size:20px!important;
    }
}
@media (max-width: 480px){
    #navbar{
        position:fixed;
        top:0;
        left:0;
        right:0;
        z-index:999;
        padding:5px 15px!important;
        box-shadow: none;
    }
    .navbar-brand img{
        height:30px!important;
    }
    #navigation{
        position: fixed;
        margin:0;
        top:51px;
        left:0;
        right:0;
        bottom:0;
        background:#fff;
        height:auto;
        display:block;
        padding:15px;
        overflow:auto;
        opacity:0;
        visibility: hidden;
        transform:translateX(100px);
        transition: .3s ease;
    }
    #navigation.show{
        opacity:1;
        visibility: visible;
        transform: translateX(0);
    }
    #navbar .navbar-nav{
        margin:0!important;
    }
    #navbar .navbar-nav > li.menu-item-has-children:after{
        height:50px;
        line-height:50px;
    }
    .search-form .form-control,
    .search-form .btn{
        height:auto!important;
    }
    .section-heading{
        position: relative;
        top:auto;
    }
    .section-heading .inner {
        padding-top: 130px;
    }
    .section-heading .col-button{
        position:fixed;
        top:52px;
        left:0;
        right:0;
        background:#fff;
        padding:15px;
        box-shadow:0 10px 40px -10px #0003;
        text-align:center;
    }
    .section-heading .col-button .btn{
        width:100%;
        border-radius:5px;
        font-size:16px;
        padding:10px 15px!important;
    }
    .section-heading .col-button a{
        width:100%;
        text-align:center;
    }
    .section-heading .col-button a img{
        height:50px;
    }
    .search-results-page {
        margin-top: 70px;
    }
    .category-page {
        margin-top: 80px;
        margin-bottom: 50px;
    }

    .mobile-margin-top {
        margin-top: 70px;
    }
}

@media (max-width: 575px) {
    .undisplayed-content-page form,
    .search-results-page form,
    .page-error-404 form {
        margin: 0 15px;
    }
}