/* Mobile */

.telLogoLine1 {
    z-index: 5;
    white-space: nowrap;
    line-height: 62px;
    font-weight: 100;
    color: rgb(255, 255, 255);
    font-family: Roboto;
    letter-spacing: 29px;
    visibility: inherit;
    transition: none;
    border-width: 0px;
    margin: 0px;
    padding: 0px;
    min-height: 0px;
    min-width: 0px;
    max-height: none;
    max-width: none;
    opacity: 1;
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform-origin: 50% 50% 0px;
}

.telLogoLine2 {
    z-index: 6;
    white-space: nowrap;
    line-height: 62px;
    font-weight: 500;
    color: rgb(255, 255, 255);
    font-family: Roboto;
    letter-spacing: 23px;
    visibility: inherit;
    transition: none;
    border-width: 0px;
    margin: 0px;
    padding: 0px;
    min-height: 0px;
    min-width: 0px;
    max-height: none;
    max-width: none;
    opacity: 1;
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform-origin: 50% 50% 0px;
}

.telLogoLineRight {
    z-index: 7;
    white-space: nowrap;
    line-height: 27px;
    font-weight: 300;
    color: rgb(255, 255, 255);
    font-family: Roboto;
    letter-spacing: 7px;
    visibility: inherit;
    transition: none;
    border-width: 0px;
    margin: 0px;
    padding: 0px;
    min-height: 0px;
    min-width: 0px;
    max-height: none;
    max-width: none;
    opacity: 1;
    transform: matrix3d(0, -1, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform-origin: 50% 50% 0px;
    left: 210px;
    top: -110px;
    position: relative;
}

.telLogoTagline {
    z-index: 10;
    white-space: nowrap;
    line-height: 27px;
    font-weight: 300;
    color: rgb(255, 255, 255);
    font-family: Roboto;
    letter-spacing: 3px;
    visibility: inherit;
    transition: none;
    border-width: 0px;
    margin: 0px;
    padding: 0px;
    min-height: 0px;
    min-width: 0px;
    max-height: none;
    max-width: none;
    opacity: 1;
    transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
    transform-origin: 50% 50% 0px;
}


/* CSS Structure For Logo */
/* https://1stwebdesigner.com/responsive-design-breakpoints/ */

/* Mobile */

@media screen and (min-width: 200px) and (max-width: 480px) {

    .telLogoLine1 {
        font-size: 35px;
        line-height: 32px;
        letter-spacing: 20px;
        margin-left: 30px;
    }

    .telLogoLine2 {
        font-size: 34px;
        line-height: 37px;
        margin-left: 23px;
        letter-spacing: 12px;
    }

    .telLogoLineRight {
        font-size: 10px;
        left: 110px;
        top: -66px;
        font-weight: 100;
        letter-spacing: 4.5px;
        margin-bottom: -25px;
    }

    .telLogoTagline {
        font-size: 10px;
        letter-spacing: 3.5px;
        margin-left: 15px;
        line-height: 15px;
    }

}

@media screen and (min-width: 480px) and (max-width: 768px) {
    
    .telLogoLine1 {
        font-size: 75px;
        line-height: 65px;
        letter-spacing: 21px;
        margin-left: 30px;
    }

    .telLogoLine2 {
        font-size: 69px;
        line-height: 62px;
        margin-left: 15px;
        letter-spacing: 12px;
    }

    .telLogoLineRight {
        font-size: 20px;
        left: 174px;
        top: -106px;
        font-weight: 100;
        letter-spacing: 7.5px;
    }

    .telLogoTagline {
        font-size: 12px;
        letter-spacing: 7.5px;
    }

}

/* Tablet */

@media screen and (min-width: 768px) and (max-width: 1200px) {

    .telLogoLine1 {
        font-size: 150px;
        line-height: 130px;
        letter-spacing: 42px;
        margin-left: 30px;
    }

    .telLogoLine2 {
        font-size: 138px;
        line-height: 125px;
        margin-left: 15px;
    }

    .telLogoLineRight {
        font-size: 40px;
        left: 335px;
        top: -176px;
        font-weight: 100;
        letter-spacing: 15px;
    }

    .telLogoTagline {
        font-size: 25px;
        letter-spacing: 15px;
    }

}

/* Desktop */

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

    .telLogoLine1 {
        font-size: 150px;
        line-height: 130px;
        letter-spacing: 42px;
        margin-left: 30px;
    }

    .telLogoLine2 {
        font-size: 138px;
        line-height: 125px;
        margin-left: 15px;
    }

    .telLogoLineRight {
        font-size: 40px;
        left: 335px;
        top: -176px;
        font-weight: 100;
        letter-spacing: 15px;
    }

    .telLogoTagline {
        font-size: 25px;
        letter-spacing: 15px;
    }

}
