/* ========== Responsive Styles ========== */


/* --------- max width 991px -------- */

@media only screen and (max-width: 991px) {
    /* Main menu */
    .navbar-nav > li > a {
        font-size: 14px !important;
    }
    /* Benefits */
    .single-benefits {
        margin-bottom: 60px;
    }
}


/* --------- Styles for Screen width between 768px To 1023px -------- */

@media only screen and (min-width: 768px) and (max-width: 1023px) {
    /* Home */
    .home {
        min-height: 596px;
    }
    .welcome {
        position: relative;
        font-size: 45px;
        line-height: 62px;
        margin-top: 120px;
        margin-bottom: 50px;
        color: #fff !important;
        font-weight: 400;
        letter-spacing: 0.02em;
    }
    .intro-message {
        padding: 0 20px;
    }
    .img-responsive2 {
        display: block;
        width: 100%;
        max-width: 100%;
        height: auto;
    }
    .container.planbooks {
        padding-top: 120px;
        padding-bottom: 0;
        min-height: 800px;
    }
    .section-buildbook-title {
        margin-bottom: 20px;
    }
    .buildstep1 {
        text-align: center;
        padding-bottom: 20px;
    }
    .buildstep2 {
        text-align: center;
        padding-bottom: 20px;
    }
    .buildstep3 {
        text-align: center;
        padding-bottom: 20px;
    }
    .buildstep4 {
        text-align: center;
        padding-bottom: 20px;
    }
    .buildtitle {
        text-align: center;
    }
    .builddescription {
        text-align: center;
        padding: 0 10px;
    }
    .build-img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        padding-bottom: 20px;
    }
    .contact-form {
        margin-top: 30px;
    }
        /* Modernized */
    .container.modernized {
        padding-bottom: 20px;
        min-height: 700px;
    }
    .modernized .text {
        color: #FFF;
        font-size: 20px;
        padding: 20px 0;
    }
    .modernized li {
        list-style: disc;
        color: #FFF;
        text-align: left;
        line-height: normal;
    }
    .modernized .concept {
        width: 90%;
        height: 250px;
        padding: 5px;
        margin-top: 10px;
    }
    .modernized .concept h3 {
        color: #FFF;
        text-transform: uppercase;
        font-size: 30px;
        letter-spacing: 0.1em;
    }
    .modernized .concept p {
        color: #FFF;
        font-size: 16px;
        line-height: normal;
    }
    /* Madness */
    .container.madness {
        padding-bottom: 0px;
        min-height: 647px;
    }
    .container.stopmadness {
        min-height: 400px;
        border-left: 0;
        border-right: 0;
        border-bottom: 0;
        margin-top: 0px;
    }
    .stopmadness .title {
        margin: 0;
    }
    .stopmadness h3:before,
    .stopmadness h3:after {
        visibility: hidden;
        height: 0px;
    }
    .stopmadness .madcontent {
        margin: 0px;
    }
    .stopmadness .madcontent li {
        list-style: disc;
        color: #2b3d42;
        line-height: 36px;
        text-align: left;
    }
    .stopmadness .madcontent p {
        font-size: 24px;
        font-weight: 400;
        padding-top: 30px;
    }
}


/* --------- Styles for Screen width Smaller than 767px -------- */

@media only screen and (max-width: 767px) {
    /* Main menu */
    .navbar-collapse {
        margin-left: -16px;
        margin-right: -16px;
        background: #222;
        overflow-y: scroll;
        max-height: 200px;
    }
    .navbar-nav > li > a {
        padding-left: 30px;
    }
    .img-responsive2 {
        display: block;
        width: 80% \9;
        max-width: 80%;
        height: auto;
    }
    /* Benefits table */
    .single-benefits-wrap {
        margin-bottom: 40px;
    }
}


/* --------- Styles for Screen width Smaller than 480px -------- */

@media only screen and (max-width: 480px) {
    /* Headings for mobile View */
    h1 {
        font-size: 36px;
        line-height: 48px;
    }
    h2 {
        font-size: 26px;
        line-height: 34px;
    }
    h3 {
        font-size: 24px;
        line-height: 32px;
    }
    #section-feature {
        padding-top: 140px;
        padding-bottom: 40px;
    }
    .img-responsive2 {
        display: block;
        width: 80% \9;
        max-width: 80%;
        height: auto;
        padding-top: 10px;
    }
    /* header */
    .home {
        min-height: 550px;
        padding-bottom: 10px;
    }
    .welcome {
        margin-top: 100px;
        margin-bottom: 20px;
        font-size: 40px;
        line-height: 48px;
    }
    .intro-message {
        font-size: 18px;
        padding: 0 10px;
        margin-bottom: 30px;
    }
    /* Planbooks */
    .container.planbooks {
        padding-bottom: 0;
        min-height: 1100px;
    }
    .planbooks .section-title {
        margin-bottom: 20px;
    }
    /* Benefits */
    .container.benefits {
        padding-bottom: 0;
    }
    /* Buildbook */
    .container.buildbook {
        padding-bottom: 20px;
    }
    .section-buildbook-title {
        margin-bottom: 20px;
    }
    .buildstep1 {
        text-align: center;
        padding-bottom: 20px;
    }
    .buildstep2 {
        text-align: center;
        padding-bottom: 20px;
    }
    .buildstep3 {
        text-align: center;
        padding-bottom: 20px;
    }
    .buildstep4 {
        text-align: center;
        padding-bottom: 20px;
    }
    .buildtitle {
        text-align: center;
    }
    .builddescription {
        text-align: center;
        padding: 0 10px;
    }
    .build-img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        padding-bottom: 20px;
    }
    /* Modernized */
    .container.modernized {
        padding-bottom: 20px;
        min-height: 700px;
    }
    .modernized .text {
        color: #FFF;
        font-size: 20px;
        padding: 20px 0;
    }
    .modernized li {
        list-style: disc;
        color: #FFF;
        text-align: left;
        line-height: normal;
    }
    .modernized .concept {
        height: 250px;
        padding: 5px;
        margin-top: 10px;
    }
    .modernized .concept h3 {
        color: #FFF;
        text-transform: uppercase;
        font-size: 30px;
        letter-spacing: 0.1em;
    }
    .modernized .concept p {
        color: #FFF;
        font-size: 16px;
        line-height: normal;
    }
    /* Madness */
    .container.madness {
        padding-bottom: 0px;
        min-height: 647px;
    }
    .container.stopmadness {
        min-height: 400px;
        border-left: 0;
        border-right: 0;
        border-bottom: 0;
        margin-top: 0px;
    }
    .stopmadness .title {
        margin: 0;
    }
    .stopmadness h3:before,
    .stopmadness h3:after {
        visibility: hidden;
        height: 0px;
    }
    .stopmadness .madcontent {
        margin: 0px;
    }
    .stopmadness .madcontent li {
        list-style: disc;
        color: #2b3d42;
        line-height: 36px;
        text-align: left;
    }
    .stopmadness .madcontent p {
        font-size: 24px;
        font-weight: 400;
        padding-top: 30px;
    }
    /* Contact */
    .contact {
        padding-top: 50px;
        padding-bottom: 20px;
    }
    .contact-form {
        margin-top: 30px;
    }
}


/* --------- Styles for Screen width Smaller than 360px -------- */

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