body {
    background: #ffffff;
}










/*************************************************************
**************************************************************
**************************************************************

    PHONE SCREEN SIZE

**************************************************************
**************************************************************
*************************************************************/

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

    #billboard {
        display: block;
        position: relative;
        height: auto;
        width: 90%;
        background: #ffffff;
        margin: 0 auto;
        padding: 25px 0;
        transition: all 200ms ease-out;
    }

        #billboard > div {
            display: block;
            margin: 0;
            padding: 0;
            width: 80%;
            text-align: left;
            transition: all 200ms ease-out;
        }

            #billboard > div > h2 {
                margin: 0;
                padding: 10px 0;
                font-size: 16px;
                font-weight: 700;
                transition: all 200ms ease-out;
                font-family: "Cabin", Arial, Helvetica, sans-serif;
                font-weight: 600;
            }

            #billboard > div > p {
                margin: 0;
                padding: 10px 0;
                font-size: 12px;
                transition: all 200ms ease-out;
            }

            #billboard > div > ul {
                margin: 0;
                padding: 10px 0 0 25px;
            }

                #billboard > div > ul > li {
                    margin: 0;
                    padding: 0;
                    font-size: 12px;
                    transition: all 200ms ease-out;
                }

            #billboard > div > a.blue-button {
                font-size: 12px;
                margin: 25px 0 0 50px;
                display: inline-block;
            }

    #tech-specs {
        background: #ffffff;
        padding: 25px 0;
        margin: 25px auto 0 auto;
        width: 90%;
        border-top: 1px solid #cecece;
        overflow: auto;
        transition: all 200ms ease-out;
    }

        #tech-specs > div {
            width: 80%;
            margin: 0;
            padding: 25px 0;
            margin: 0;
        }

            #tech-specs > div > h3 {
                margin: 0;
                padding: 10px 0;
                font-size: 16px;
                font-weight: 700;
                transition: all 200ms ease-out;
                font-family: "Cabin", Arial, Helvetica, sans-serif;
                font-weight: 600;
            }

            #tech-specs > div > p {
                margin: 0;
                padding: 10px 0;
                font-size: 12px;
                transition: all 200ms ease-out;
            }

            #tech-specs > div > ul {
                margin: 0;
                padding: 10px 0 0 25px;
                transition: all 200ms ease-out;
            }

                #tech-specs > div > ul > li {
                    margin: 0;
                    padding: 0;
                    font-size: 12px;
                    transition: all 200ms ease-out;
                }

        #tech-specs table {
            width: 100%;
            border-collapse: collapse;
            margin: 0;
            padding: 0;
            transition: all 200ms ease-out;
        }

        #tech-specs tr:nth-child(odd) {
            background: #ffffff;
            transition: all 200ms ease-out;
        }

        #tech-specs tr:nth-child(even) {
            background: #efefef;
            transition: all 200ms ease-out;
        }

        #tech-specs th {
            text-align: left;
            padding: 1%;
            vertical-align: top;
            width: 35%;
            font-size: 12px;
            border: 1px solid #333333;
            transition: all 200ms ease-out;
        }

        #tech-specs td {
            text-align: left;
            padding: 1%;
            font-size: 12px;
            border: 1px solid #333333;
            transition: all 200ms ease-out;
        }

            #tech-specs td ul {
                margin: 0;
                padding: 0 0 0 2%;
                transition: all 200ms ease-out;
            }

            #tech-specs td li {
                margin: 0;
                padding: 0;
                font-size: 12px;
                transition: all 200ms ease-out;
            }

    #about {
        display: block;
        position: relative;
        width: 100%;
        background: #efefef;
        margin: 0 auto;
        padding: 25px 0;
        transition: all 200ms ease-out;
    }

        #about > div {
            display: block;
            position: relative;
            width: 80%;
            margin: 0 auto;
            transition: all 200ms ease-out;
        }

            #about > div > h3 {
                margin: 0;
                padding: 10px 0;
                font-size: 16px;
                font-weight: 700;
                transition: all 200ms ease-out;
                font-family: "Cabin", Arial, Helvetica, sans-serif;
                font-weight: 600;
            }

            #about > div > p {
                margin: 0;
                padding: 10px 0;
                font-size: 12px;
                transition: all 200ms ease-out;
            }
}










/*************************************************************
**************************************************************
**************************************************************

    TABLET SCREEN SIZE

**************************************************************
**************************************************************
*************************************************************/

@media only screen and (min-width: 900px) {

    #billboard {
        display: block;
        position: relative;
        height: 350px;
        width: 90%;
        background: url(../../images/page-images/transformers/rectifier/billboard/8421-high-voltage-angle-level.jpg) no-repeat 100% 100%;
        background-size: 50% auto;
        margin: 25px auto 0 auto;
        padding: 0;
        transition: all 200ms ease-out;
    }

        #billboard > div {
            display: block;
            margin: 0;
            padding: 0;
            position: absolute;
            top: 25px;
            left: 0;
            width: 50%;
            text-align: left;
            transition: all 200ms ease-out;
        }

            #billboard > div > h2 {
                margin: 0;
                padding: 10px 0;
                font-size: 20px;
                font-weight: 700;
                transition: all 200ms ease-out;
                font-family: "Cabin", Arial, Helvetica, sans-serif;
                font-weight: 600;
            }

            #billboard > div > p {
                margin: 0;
                padding: 10px 0;
                font-size: 12px;
                transition: all 200ms ease-out;
            }

            #billboard > div > ul {
                margin: 0;
                padding: 10px 0 0 25px;
            }

                #billboard > div > ul > li {
                    margin: 0;
                    padding: 0;
                    font-size: 12px;
                    transition: all 200ms ease-out;
                }

            #billboard > div > a.blue-button {
                font-size: 12px;
                margin: 25px 0 0 50px;
                display: inline-block;
            }

    #tech-specs {
        background: #ffffff;
        padding: 25px 0;
        margin: 25px auto 0 auto;
        width: 90%;
        border-top: 1px solid #cecece;
        overflow: auto;
    }

        #tech-specs > div {
            width: 90%;
            margin: 0 auto;
            padding: 25px 0;
        }

            #tech-specs > div > h3 {
                margin: 0;
                padding: 10px 0;
                font-size: 20px;
                font-weight: 700;
                transition: all 200ms ease-out;
                font-family: "Cabin", Arial, Helvetica, sans-serif;
                font-weight: 600;
            }

            #tech-specs > div > p {
                margin: 0;
                padding: 10px 0;
                font-size: 12px;
                transition: all 200ms ease-out;
            }

            #tech-specs > div > ul {
                margin: 0;
                padding: 10px 0 0 25px;
            }

                #tech-specs > div > ul > li {
                    margin: 0;
                    padding: 0;
                    font-size: 12px;
                    transition: all 200ms ease-out;
                }

        #tech-specs table {
            width: 100%;
            border-collapse: collapse;
            margin: 0;
            padding: 0;
        }

        #tech-specs tr:nth-child(odd) {
            background: #ffffff;
        }

        #tech-specs tr:nth-child(even) {
            background: #efefef;
        }

        #tech-specs th {
            text-align: left;
            padding: 1%;
            vertical-align: top;
            width: 35%;
            font-size: 12px;
            border: 1px solid #333333;
        }

        #tech-specs td {
            text-align: left;
            padding: 1%;
            font-size: 12px;
            border: 1px solid #333333;
        }

            #tech-specs td ul {
                margin: 0;
                padding: 0 0 0 2%;
            }

            #tech-specs td li {
                margin: 0;
                padding: 0;
                font-size: 12px;
            }

    #about {
        display: block;
        position: relative;
        width: 90%;
        background: #efefef;
        margin: 25px auto;
        padding: 50px 0;
        transition: all 200ms ease-out;
    }

        #about > div {
            display: block;
            position: relative;
            width: 80%;
            margin: 0 auto;
            transition: all 200ms ease-out;
        }

            #about > div > h3 {
                margin: 0;
                padding: 10px 0;
                font-size: 20px;
                font-weight: 700;
                transition: all 200ms ease-out;
                font-family: "Cabin", Arial, Helvetica, sans-serif;
                font-weight: 600;
            }

            #about > div > p {
                margin: 0;
                padding: 10px 0;
                font-size: 12px;
                transition: all 200ms ease-out;
            }
}








/*************************************************************
**************************************************************
**************************************************************

    DESKTOP-SMALL SCREEN SIZE

**************************************************************
**************************************************************
*************************************************************/

@media only screen and (min-width: 1300px) {

    #billboard {
        height: 500px;
        background-size: auto 300px;
    }

        #billboard > div {
            top: 50px;
            left: 0;
        }

            #billboard > div > h2 {
                font-size: 28px;
            }

            #billboard > div > p {
                font-size: 14px;
            }

                #billboard > div > ul > li {
                    font-size: 14px;
                }

            #billboard > div > a.blue-button {
                font-size: 14px;
            }

    #tech-specs > div {
        width: 75%;
        margin: 0 auto;
        padding: 25px 0;
    }

        #tech-specs > div > h3 {
            font-size: 28px;
        }

        #tech-specs > div > p {
            font-size: 14px;
        }

        #tech-specs > div > ul > li {
            font-size: 14px;
        }

    #tech-specs table {
        width: 75%;
        margin: 0 auto;
    }

    #tech-specs th {
        font-size: 14px;
    }

    #tech-specs td {
        font-size: 14px;
    }

    #about > div {
        width: 75%;
    }

        #about > div > h3 {
            font-size: 28px;
        }

        #about > div > p {
            font-size: 14px;
        }

    #background-one {
        height: 450px;
    }

    #design {
        height: 600px;
    }

        #design > div {
            width: 350px;
            top: 100px;
            right: 100px;
        }

            #design > div > h3 {
                font-size: 28px;
            }

            #design > div > p {
                font-size: 14px;
            }

            #design > div > ul > li {
                font-size: 14px;
            }
}








/*************************************************************
**************************************************************
**************************************************************

    DESKTOP-LARGE SCREEN SIZE

**************************************************************
**************************************************************
*************************************************************/

@media only screen and (min-width: 1700px) {

    #billboard {
        height: 500px;
        background-size: auto 400px;
    }

        #billboard > div {
            top: 50px;
            left: 0;
            width: 600px;
        }

    #tech-specs > div {
        width: 40%;
        margin: 0;
        padding: 0;
        float: left;
    }

    #tech-specs table {
        float: right;
        width: 50%;
    }

        #about > div {
            width: 50%;
        }

    #background-one {
        height: 600px;
    }

    #design {
        height: 700px;
    }

        #design > div {
            width: 400px;
            top: 200px;
            right: 200px;
        }
}