body {
    overflow-x: hidden;
}

.boldmont {
    font-family: MontSerratB;
}

@media (max-width: 767px) {
    .triangle-border {
        padding: 10px 15px 10px 15px;
        margin: 1em 0 3em;
        font-size: 9pt;
    }
    .triangle-border h1 {
        font-size: 15pt;
        margin-bottom: 20px;
    }
    .triangle-border input[type="text"],
    input[type="email"] {
        width: 60%;
        right: 0px;
    }
    textarea {
        height: 200px;
    }
    input[type="submit"] {
        padding: 6px 10px 6px 10px;
        font-size: 8pt;
        margin-top: 15px;
    }
    .triangle-border:before {
        bottom: -53px;
        /* value = - border-top-width - border-bottom-width */
        left: 43%;
        /* controls horizontal position */
        border-width: 50px 30px 0;
    }
    .triangle-border:after {
        bottom: -47px;
        /* value = - border-top-width - border-bottom-width */
        left: 43%;
        /* value = (:before left) + (:before border-left) - (:after border-left) */
        border-width: 50px 30px 0;
    }
    #robo {
        height: 250px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .triangle-border {
        padding: 10px 30px 10px 30px;
        margin: 1em 0 3em;
        font-size: 9pt;
    }
    .triangle-border h1 {
        font-size: 25pt;
        margin-bottom: 30px;
    }
    .triangle-border input[type="text"],
    input[type="email"] {
        width: 80%;
        right: 0px;
    }
    textarea {
        height: 250px;
    }
    input[type="submit"] {
        padding: 8px 12px 8px 12px;
        font-size: 10pt;
        margin-top: 20px;
    }
    .triangle-border:before {
        bottom: -73px;
        /* value = - border-top-width - border-bottom-width */
        left: 42%;
        /* controls horizontal position */
        border-width: 70px 50px 0;
    }
    .triangle-border:after {
        bottom: -67px;
        /* value = - border-top-width - border-bottom-width */
        left: 42%;
        /* value = (:before left) + (:before border-left) - (:after border-left) */
        border-width: 70px 50px 0;
    }
    #robo {
        height: 400px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .triangle-border {
        padding: 10px 30px 10px 30px;
        margin: 1em 0 3em;
        font-size: 13pt;
    }
    .triangle-border h1 {
        font-size: 35pt;
        margin-bottom: 40px;
    }
    .triangle-border input[type="text"],
    input[type="email"] {
        width: 80%;
        right: 0px;
    }
    textarea {
        height: 280px;
    }
    input[type="submit"],
    input[type="button"] {
        padding: 10px 15px 10px 15px;
        font-size: 13pt;
        margin-top: 20px;
    }
    .triangle-border:before {
        bottom: -93px;
        /* value = - border-top-width - border-bottom-width */
        left: 44%;
        /* controls horizontal position */
        border-width: 90px 60px 0;
    }
    .triangle-border:after {
        bottom: -87px;
        /* value = - border-top-width - border-bottom-width */
        left: 44%;
        /* value = (:before left) + (:before border-left) - (:after border-left) */
        border-width: 90px 60px 0;
    }
}

@media (min-width: 1200px) {
    .triangle-border {
        padding: 10px 50px 10px 50px;
        margin: 1em 0 3em;
        font-size: 15pt;
    }
    .triangle-border h1 {
        font-size: 42pt;
        margin-bottom: 50px;
    }
    .triangle-border input[type="text"],
    input[type="email"] {
        width: 80%;
        right: 0px;
    }
    textarea {
        height: 300px;
    }
    input[type="submit"],
    input[type="button"] {
        padding: 10px 15px 10px 15px;
        font-size: 15pt;
        margin-top: 30px;
    }
    .triangle-border:before {
        bottom: -103px;
        /* value = - border-top-width - border-bottom-width */
        left: 44.3%;
        /* controls horizontal position */
        border-width: 100px 70px 0;
    }
    .triangle-border:after {
        bottom: -97px;
        /* value = - border-top-width - border-bottom-width */
        left: 44.3%;
        /* value = (:before left) + (:before border-left) - (:after border-left) */
        border-width: 100px 70px 0;
    }
}

.triangle-border h1 {
    color: #0073ba;
}

.triangle-border {
    position: relative;
    border: 3px solid black;
    color: #333;
    background: #f2f8fa;
}

.triangle-border:before {
    content: "";
    position: absolute;
    border-style: solid;
    border-color: black transparent;
    /* reduce the damage in FF3.0 */
    display: block;
    width: 0;
}


/* creates the smaller  triangle */

.triangle-border:after {
    content: "";
    position: absolute;
    border-style: solid;
    border-color: #f2f8fa transparent;
    /* reduce the damage in FF3.0 */
    display: block;
    width: 0;
}

input[type="email"],
input[type="text"] {
    border: 2px #0073ba solid;
    border-radius: 20px;
    padding-left: 10px;
}

textarea {
    border: 2px #0073ba solid;
    width: 100%;
    padding: 10px;
}

input[type="submit"],
input[type="button"] {
    border: 2px black solid;
    background-color: white;
    font-family: MontSerratB;
}