﻿body {
    font-family: 'Lato', sans-serif;
}




.col-centered {
    float: none;
    margin: 0 auto;
    border-radius: 10px;
}


.col-img {
  
    border-radius: 5px;
    border:1px solid #eee;
    padding:10px;
}


.boxed {
    border: 1px solid #DEDEDE;
    box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.14);
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    max-width: 100%;
    padding: 16px 18px;
    font-size: 15px;
}

.icon-number {
    background-color: #2ab27b;
    width: 24px;
    text-indent: 8px;
    padding-left: 0px;
    height: 24px;
    line-height: 24px;
    vertical-align: top;
    -webkit-border-radius: 13px;
    -moz-border-radius: 13px;
    border-radius: 13px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    color: #FFFFFF;
    display: inline-block;
    font-weight: 700;
    content: counter(list);
    margin-right: 15px;
    font-size: 14px;
}
.tip {
    border-color: #2D9EE0;
    background-color: #F0F7FB;
    display: block;
    padding: 12px 18px 12px 65px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px;
    border-style: solid;
    line-height: 1.5rem;
    margin-top: 18px;
    margin-bottom: 18px;
    position: relative;
    border: 1px solid #2D9EE0;
}
.note {
    border-color: #2ab27b;
    background-color: #E7F6F0;
    display: block;
    padding: 12px 18px 12px 65px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px;
    border-style: solid;
    line-height: 1.5rem;
    margin-top: 18px;
    margin-bottom: 18px;
    position: relative;
    border: 1px solid #2ab27b;
}
.text-strong{
    font-weight:700;
}
@media screen and (max-width: 1200px){
    .category_container {
        width: 100%;
        max-width: 1140px;
        margin-left: auto;
        margin-right: auto;
        display: flex;
        flex-wrap: wrap;
        padding-left: 10px;
        padding-right: 10px;
        display: table;
    }

    .banner {
        position: relative;
        /*height: 310px;*/
        background: #2986BE;
        background-image: url(transparent.png), linear-gradient(-150deg, #7460ee 0%, #fb3a3a 97%);
        background-size: 380px, contain;
        background-position: center;
        /*padding-top: 121px;*/
        padding: 10px;
    }

        .banner .banner_container {
            max-width: 1140px;
            margin-left: auto;
            margin-right: auto;
            display: flex;
            flex-wrap: wrap;
            padding-left: 10px;
            padding-right: 10px;
            width: 100%;
        }

        .banner .banner_title {
            padding-left: 10px;
            padding-right: 10px;
            flex-basis: 100%;
            color: #FFFFFF;
            font-size: 45px;
            line-height: 60px;
            margin: 0;
            letter-spacing: -1px;
        }


    .banner-subtitle {
        padding-left: 10px;
        padding-right: 10px;
    }
}
    @media screen and (max-width: 1920px) and (min-width: 1200px) {
        .category_container {
            width: 100%;
            max-width: 1140px;
            margin-left: auto;
            margin-right: auto;
            display: flex;
            flex-wrap: wrap;
            padding-left: 10px;
            padding-right: 10px;
            display: table;
        }

        .banner {
            position: relative;
            height: 310px;
            background: #2986BE;
            background-image: url(transparent.png), linear-gradient(-150deg, #7460ee 0%, #fb3a3a 97%);
            background-size: 380px, contain;
            background-position: center;
            padding-top: 121px;

        }

            .banner .banner_container {
                max-width: 1140px;
                margin-left: auto;
                margin-right: auto;
                display: flex;
                flex-wrap: wrap;
                padding-left: 10px;
                padding-right: 10px;
                width: 100%;
            }

            .banner .banner_title {
                padding-left: 10px;
                padding-right: 10px;
                flex-basis: 100%;
                color: #FFFFFF;
                font-size: 45px;
                line-height: 60px;
                margin: 0;
                letter-spacing: -1px;
            }


        .banner-subtitle {
            padding-left: 10px;
            padding-right: 10px;
        }
    }

    @media only screen and (min-width : 1920px) {
        .category_container {
            width: 100%;
            max-width: 1140px;
            margin-left: auto;
            margin-right: auto;
            display: flex;
            flex-wrap: wrap;
            padding-left: 10px;
            padding-right: 10px;
            display: table;
        }

        .banner {
            position: relative;
            height: 310px;
            background: #2986BE;
            background-image: url(transparent.png), linear-gradient(-150deg, #7460ee 0%, #fb3a3a 97%);
            background-size: 380px, contain;
            background-position: center bottom;
            padding-top: 121px;
        }

            .banner .banner_container {
                max-width: 1140px;
                margin-left: auto;
                margin-right: auto;
                display: flex;
                flex-wrap: wrap;
                padding-left: 10px;
                padding-right: 10px;
                width: 100%;
            }

            .banner .banner_title {
                padding-left: 10px;
                padding-right: 10px;
                flex-basis: 100%;
                color: #FFFFFF;
                font-size: 45px;
                line-height: 60px;
                margin: 0;
                letter-spacing: -1px;
            }


        .banner-subtitle {
            padding-left: 10px;
            padding-right: 10px;
        }
    }