@media screen and (max-device-width: 1024px) {
    .example2{display: none}
}
@media  screen and (min-width: 1280px) and (max-width: 1980px){
    .mobile2{display: none}
}



.navbar-brand {
    padding: 0px;
}
.navbar-brand>img {
    height: 100%;
    padding: 15px;
    width: auto;
}
.example2 .navbar-brand>img {
    padding: 7px 47px;
}
.example2{
    position: absolute;
    z-index: 2;
    color: white;

}
/* CSS Transform Align Navbar Brand Text ... This could also be achieved with table / table-cells */
.navbar-alignit .navbar-header {
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
    height: 50px;
}
.navbar-alignit .navbar-brand {
    top: 50%;
    display: block;
    position: relative;
    height: auto;
    transform: translate(0,-50%);
    margin-right: 15px;
    margin-left: 15px;
}
.navbar-brand{

    height: 120px
}

.navbar-default .navbar-nav>li>a {
    color: white;
    text-transform: uppercase;
    font-size: 18pt;
}
.home-guide-btn{
    border-radius: 20px;
    BACKGROUND-COLOR: red;
    color: white;
    border: 0;
    font-size: 14px;
    padding: 10px;
    text-transform: uppercase;
}
#myLinks a{
    background-color: white;
}
.fa-close .fa-bars{
    transform: translateX(-100%) rotateY(-180deg);
}