﻿button {
    background-color: #006195;
    border: solid 3px #006195;
    border-radius: 5px;
    color: #fff;
    padding: 5px 15px;
    font-size: 1.5rem;
    margin:25px;
}

@media (min-width: 1700px) {
    .hero_container {
        position: relative;
        background: url('/images/upgrade/upgrade-from-pots-bg.jpg') no-repeat;
        background-position: right;
        background-size: cover;
        height: 80vh;
    }

        .hero_container .hero_text {
            position: absolute;
            top: 40%;
            left: 10%;
            margin-right: -10%;
            transform: translate(-10%, -40%);
            max-width:900px;
        }

            .hero_container .hero_text h1 {
                font-size: 70px;
                color:#fff;
            }

            .hero_container .hero_text h2 {
                font-size: 50px;
            }

            .hero_container .hero_text a {
                background-color: #006195;
                border: solid 3px #006195;
                border-radius: 5px;
                color: #fff;
                padding: 5px 15px;
                font-size: 30px;
                transition: .2s;
            }

                .hero_container .hero_text a:hover {
                    background: transparent;
                    color: #006195;
                }


    /* Section 1 */
    .section_1 {
        background-color: #f2f2f2;
        padding: 3rem 0;
    }

        .section_1 h3 {
            font-size: 55px;
        }

        .section_1 i {
            font-size: 27px;
        }

        .section_1 img {
            width: 90%;
            max-width: 600px;
            margin: 30px 10px;
        }

        .section_1 p {
            font-size: 35px;
        }

    /* Section 2 */
    .section_2 {
        background-color: #003E5F;
        color: #fff;
        padding: 3rem 0;
    }

        .section_2 img {
            max-height: 700px;
        }

        .section_2 .sub_text {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-right: -50%;
            transform: translate(-50%, -50%);
        }

            .section_2 h3 {
                font-size: 70px;
            }

            .section_2  h4 {
                font-size: 50px;
            }
        .section_2 h5 {
            font-size: 30px;
            margin-bottom: 50px;
        }


    /* Section 3 */
    .section_3 {
        background-color: #f2f2f2;
        padding: 3rem 0;
    }

        .section_3 h4 {
            font-size: 55px;
        }

        .section_3 i {
            font-size: 27px;
        }
        }

@media (min-width: 1400px) and (max-width: 1699px) {
    .hero_container {
        position: relative;
        background: url('/images/upgrade/upgrade-from-pots-bg.jpg') no-repeat;
        background-position: right;
        background-size: cover;
        height: 80vh;
    }

        .hero_container .hero_text {
            position: absolute;
            top: 40%;
            left: 10%;
            margin-right: -10%;
            transform: translate(-10%, -40%);
            max-width: 900px;
        }

            .hero_container .hero_text h1 {
                font-size: 70px;
                color: #fff;
            }

            .hero_container .hero_text h2 {
                font-size: 50px;
            }

            .hero_container .hero_text a {
                background-color: #006195;
                border: solid 3px #006195;
                border-radius: 5px;
                color: #fff;
                padding: 5px 15px;
                font-size: 30px;
                transition: .2s;
            }

                .hero_container .hero_text a:hover {
                    background: transparent;
                    color: #006195;
                }


    /* Section 1 */
    .section_1 {
        background-color: #f2f2f2;
        padding: 3rem 0;
    }

        .section_1 h3 {
            font-size: 55px;
        }

        .section_1 i {
            font-size: 27px;
        }

        .section_1 img {
            width: 90%;
            max-width: 600px;
            margin: 30px 10px;
        }

        .section_1 p {
            font-size: 35px;
        }

    /* Section 2 */
    .section_2 {
        background-color: #003E5F;
        color: #fff;
        padding: 3rem 0;
    }

        .section_2 img {
            max-height: 700px;
        }

        .section_2 .sub_text {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-right: -50%;
            transform: translate(-50%, -50%);
        }

        .section_2 h3 {
            font-size: 70px;
        }

        .section_2 h4 {
            font-size: 50px;
        }

        .section_2 h5 {
            font-size: 30px;
            margin-bottom: 50px;
        }


    /* Section 3 */
    .section_3 {
        background-color: #f2f2f2;
        padding: 3rem 0;
    }

        .section_3 h4 {
            font-size: 55px;
        }

        .section_3 i {
            font-size: 27px;
        }
}


@media (min-width: 1024px) and (max-width: 1399px) {
    .hero_container {
        position: relative;
        background: url('/images/upgrade/upgrade-from-pots-bg.jpg') no-repeat;
        background-position: 70%;
        background-size: cover;
        height: 80vh;
    }
    .hero_container .hero_text {
            position: absolute;
            top: 40%;
            left: 10%;
            margin-right: -10%;
            transform: translate(-10%, -40%);
            max-width: 650px;
        }

            .hero_container .hero_text h1 {
                font-size: 70px;
                color: #fff;
            }

            .hero_container .hero_text h2 {
                font-size: 50px;
            }

            .hero_container .hero_text a {
                background-color: #006195;
                border: solid 3px #006195;
                border-radius: 5px;
                color: #fff;
                padding: 5px 15px;
                font-size: 30px;
                transition: .2s;
            }

                .hero_container .hero_text a:hover {
                    background: transparent;
                    color: #006195;
                }


    /* Section 1 */
    .section_1 {
        background-color: #f2f2f2;
        padding: 3rem;
    }

        .section_1 h3 {
            font-size: 45px;
        }               

        .section_1 img {
            width: 90%;
            max-width: 600px;
            margin: 30px 10px;
        }

        .section_1 p {
            font-size: 30px;
        }

    /* Section 2 */
    .section_2 {
        background-color: #003E5F;
        color: #fff;
        padding: 3rem;
    }

        .section_2 img {
            max-height: 700px;
        }

        .section_2 .sub_text {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-right: -50%;
            transform: translate(-50%, -50%);
        }

        .section_2 h3 {
            font-size: 60px;
        }

        .section_2 h4 {
            font-size: 40px;
        }

        .section_2 h5 {
            font-size: 20px;
            margin-bottom: 50px;
        }


    /* Section 3 */
    .section_3 {
        background-color: #f2f2f2;
        padding: 3rem;
    }

        .section_3 h4 {
            font-size: 45px;
        }

        .section_3 i {
            font-size: 17px;
        }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .hero_container {
        position: relative;
        background: url('/images/upgrade/upgrade-from-pots-bg-m.jpg') no-repeat;
        text-align: center;
        background-position: center;
        background-size: cover;
        height: 80vh;
    }

        .hero_container .hero_text {
            position: absolute;
            top: 40%;
            left: 50%;
            margin-right: -50%;
            transform: translate(-50%, -40%);
            text-align: center;
            color:#fff;
            padding: 5%;
        }

            .hero_container .hero_text h1 {
                font-size: 70px;
                
            }

            .hero_container .hero_text h2 {
                font-size: 50px;
            }

            .hero_container .hero_text a {
                background-color: #006195;
                border: solid 3px #006195;
                border-radius: 5px;
                color: #fff;
                padding: 5px 15px;
                font-size: 30px;
                transition: .2s;
            }

                .hero_container .hero_text a:hover {
                    background: transparent;
                    color: #006195;
                }


    /* Section 1 */
    .section_1 {
        background-color: #f2f2f2;
        padding: 3rem;
    }

        .section_1 h3 {
            font-size: 45px;
        }

        .section_1 img {
            width: 90%;
            max-width: 600px;
            margin: 30px 10px;
        }

        .section_1 p {
            font-size: 30px;
        }

    /* Section 2 */
    .section_2 {
        background-color: #003E5F;
        color: #fff;
        padding: 3rem;
    }

        .section_2 img {
            max-height: 700px;
        }

        .section_2 .sub_text {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-right: -50%;
            transform: translate(-50%, -50%);
        }

        .section_2 h3 {
            font-size: 60px;
        }

        .section_2 h4 {
            font-size: 40px;
        }

        .section_2 h5 {
            font-size: 20px;
            margin-bottom: 50px;
        }


    /* Section 3 */
    .section_3 {
        background-color: #f2f2f2;
        padding: 3rem;
    }

        .section_3 h4 {
            font-size: 45px;
        }

        .section_3 i {
            font-size: 25px;
        }
}

@media (max-width: 767px) {

    .hero_container {
        position: relative;
        background: url('/images/upgrade/upgrade-from-pots-bg-m.jpg') no-repeat;
        text-align: center;
        background-position: center;
        background-size: cover;
        height: 80vh;
    }

        .hero_container .hero_text {
            position: absolute;
            top: 40%;
            left: 50%;
            margin-right: -50%;
            transform: translate(-50%, -40%);
            text-align: center;
            color: #fff;
            padding: 5%;
        }

            .hero_container .hero_text h1 {
                font-size: 30px;
            }

            .hero_container .hero_text h2 {
                font-size: 20px;
            }



    /* Section 1 */
    .section_1 {
        background-color: #f2f2f2;
        padding: 2rem;
    }

        .section_1 h3 {
            font-size: 45px;
        }

        .section_1 img {
            width: 100%;
            margin: 30px 0px;
        }

        .section_1 p {
            font-size: 25px;
        }

    /* Section 2 */
    .section_2 {
        background-color: #003E5F;
        color: #fff;
        padding: 1.5rem;
    }

        .section_2 img {
            max-height: 700px;
        }

        .section_2 .sub_text {
            position: absolute;
            top: 50%;
            left: 50%;
            margin-right: -50%;
            transform: translate(-50%, -50%);
        }

        .section_2 h3 {
            font-size: 40px;
        }

        .section_2 h4 {
            font-size: 32px;
        }

        .section_2 h5 {
            font-size: 20px;
            margin-bottom: 50px;
        }


    /* Section 3 */
    .section_3 {
        background-color: #f2f2f2;
        padding: 2rem;
    }

        .section_3 h4 {
            font-size: 35px;
        }

        .section_3 i {
            font-size: 20px;
        }

    /* Mobile Form */
        .modal-body {
            padding:.5rem;
        }

    .modal .modal-dialog .modal-content button {
        margin:5px !important;
    }

    .contact-form.mt-5 {
        margin-top: 1rem !important;
    }
        
}
