
:root {
    --btnbg: linear-gradient(#ff4b00, #932000);
    --btnactivebg: linear-gradient(#ff4b00, #832000);
    --color0: #ff5722;
    --color1: #8f41b0;
    --color2: #27b737;
    --color3: #0c7adb;
    --color4: #f33066;
    --lightbg0: #ff572220;
    --lightbg1: #7d0cad20;
    --lightbg2: #27b73725;
    --lightbg3: #0c7adb25;
    --lightbg4: #f3306620;
    --btndarkbg: linear-gradient(#666, #333);
    --btndarkactivebg: linear-gradient(#666, #222);
    --shadow: rgba(0, 0, 0, 0.75) 0px 0px 5px -1px;
    --shadowdouble: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
    --shadowdouble2: rgba(50, 50, 93, 0.25) 0px 1px 5px 1px, rgba(0, 0, 0, 0.3) 0px 0px 3px 0px;
    --shadow2: rgba(0, 0, 0, 1) 0px 1px 3px -1px;
    --shadow3: rgba(0, 0, 0, .5) 0 3px 7px
}

a {
    text-decoration: none
}

.col2 {
    padding: 15px;
    width: 50%
}

h1 span,
h2 span,
h3 span,
h4 span {
    font-weight: 900;
    font-size: 120%;
    color: var(--color0)
}


@media only screen and (min-width:1200px) {
    .col4.new4col4 p span {
        display: inline
    }
}

@media only screen and (max-width:991px) {
    .main-menu a i {
        display: none
    }

    .megamenu {
        width: 550px
    }
}

@media screen and (max-width:850px) and (min-width:767px) {}

@media only screen and (max-width:767px) {
    body {
        padding-top: 60px
    }

    .mobilenone {
        display: none !important
    }

    header {
        padding: 10px 0;
        height: 60px
    }

    section {
        padding: 30px 0
    }

    .headlogo {
        width: 100%;
        max-width: 180px
    }

    .headlogo img {
        height: 40px;
        margin: 0;
        padding: 3px 0;
        width: auto
    }

    nav.main-menu {
        display: none
    }

    .mnavdiv {
        display: block
    }

    .rowx {
        display: block
    }

    .col1,
    .col2,
    .col3,
    .col4,
    .col5,
    .col30,
    .col40,
    .col66 {
        width: 100% !important
    }

    header .btn:active,
    .spbtndiv .spbtn:active {
        padding-top: 0;
        padding-bottom: 0;
        background: var(--btnactivebg)
    }

    .spbtn {
        background: var(--btnbg);
        height: 40px;
        box-sizing: border-box;
        padding: 0 15px;
        line-height: 40px
    }

    .spbtndiv:hover .spbtn {
        border-radius: 4px
    }

    .spbtn i {
        display: none
    }

    .spbtn:before {
        display: none
    }

    .hmysrsbtn {
        height: 40px;
        line-height: 40px
    }

    .col4.new4col4 .hmcbfrbig {
        text-align: center;
        width: calc(100% - 80px);
        padding: 0 10px
    }

    .col4.new4col4 {
        width: 50% !important;
        padding: 7px
    }

    #hmpdivider {
        margin-top: 20px
    }

    .singlecpage {
        padding-top: 20px
    }

    .snglsub.tchrdiv .row>div {
        width: 100%;
        float: none
    }

    .colmodal {
        width: 100%
    }

    .coldetails {
        width: 100%
    }

    footer h4 {
        margin-bottom: 0
    }

    #devby {
        float: none;
        font-size: 10px;
        margin-top: 10px
    }
}

@media screen and (max-width:820px) and (min-width:350px) {
    .sldfeatures .col3 {
        width: 33% !important
    }

    .sldfeatures .col3>div {
        padding: 8px 5px 5px
    }
}

@media only screen and (max-width:620px) {
    .sc-subrow>div {
        width: 100%
    }
}

@media screen and (max-width:409px) and (min-width:350px) {
    .sldfeatures .col3 {
        width: 33% !important
    }

    .sldfeatures .row {
        margin: -5px -10px
    }

    .sldfeatures .col3>div {
        padding: 8px 5px 5px
    }

    .sldfeatures .col3 {
        margin: 0;
        padding: 8px 3px
    }

    .mnavdiv {
        width: 125px;
        padding: 0 10px
    }

    .sldfeatures p {
        font-size: 13px
    }

    .spbtn {
        padding: 0 5px
    }
}

@media screen and (max-width:450px) {
    .slidertxt h1 {
        font-size: 30px;
        line-height: 38px
    }

    .hmysrsbtn {
        width: 50px
    }

    .hmysrsbtn span {
        display: none
    }

    .col4.new4col4 img {
        width: 53px
    }

    .col4.new4col4 big {
        font-size: 20px;
        line-height: 25px
    }
}

@media screen and (max-width:349px) {
    .mmenubtn {
        width: 50px
    }

    .mmenubtn span {
        display: none
    }

    .mnavdiv {
        width: 90px;
        padding: 0 20px
    }

    .col4.new4col4 {
        width: 100%
    }

    .logintype .ltypei {
        left: 10px
    }

    .logintype {
        padding-left: 60px
    }

    .logintbar {
        width: 220px;
        padding: 7px 0 7px 15px
    }

    .ltypeinholder>div {
        width: 218px
    }
}