﻿/* THEME COLORS + NAV */
header {
    width: 100%;
    margin: 0 auto;
    position: relative;
    z-index: 1000;
}

    header:before, header:after {
        content: "";
        display: block;
        position: absolute;
        background: #fff;
        width: 100%;
        right: -100%;
        width: 100%;
        height: 100%;
        top: 0;
    }

    header:after {
        right: 100%;
        height: 89px;
    }

nav#main > ul > li:nth-last-child(2) > ul.sub-menu {
    width: 645px;
}

nav ul li a {
    font-family: 'Open Sans';
    color: #fff;
}

a:focus, a:hover {
    text-decoration: none;
}

nav#top ul li a {
    color: #fef1d4;
}

nav ul li a.enter, nav ul li a.enter:hover {
    color: #ffe59b !important;
}

.container-fluid.subBar:before, .home .container-fluid.subBar:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    /*height: 45px;
        */
    background: rgba(0,0,0,.7);
    /*top: 89px;
        */
    margin-left: -15px;
    z-index: 900;
    opacity: .1;
    transition: all ease .4s
}

.home .container-fluid.subBar:before {
    display: none;
}

.home .container-fluid.subBar:after {
    background: #fff;
    opacity: .8;
    z-index: 800;
}

.container-fluid.subBar.hideBar:after, .container-fluid.subBar.hideBar:before {
    opacity: 0;
    z-index: 0;
}

#branding {
    background: #fff;
    height: 89px;
    float: left;
    width: auto;
}

    #branding a {
        text-decoration: none;
    }

#branding a img#branding-desktop {
    height: 36px;
    margin-top: 26px;
    margin-left: 25px;
}

#branding a img {
    float: left;
    /* height: 78px; */
    width: auto;
}

    #branding a img#branding-mobile {
        display: none;
    }

.navbar-header, #branding .print-logo {
    display: none;
}

nav#top {
    background: #fff;
    width: 100%;
    text-align: right;
    height: 44px;
}

    nav#top ul {
        display: inline-block;
        margin: 0 10px 0 0;
        height: 39px;
    }

#nav-wrap {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    position: relative;
    height: 89px;
    margin: 0.7vw 0;
}

nav#main {
    height: 89px;
    width: 100%;
    display: block;
    position: relative;
}

    nav#main.calc-widths ul.sub-menu {
        /* used for JS calculations */
        display: block !important;
        top: -200px;
    }

    nav#main:after {
        content: "";
        background: #fff;
        overflow: auto;
        display: block;
    }

    nav#main > ul {
        display: flex;
        justify-content: stretch;
        left: 350px;
        margin: 0;
        padding: 0;
        position: relative;
        width: calc(100% - 360px);
        height: 89px;
    }
/*nav ul.sub-menu {
         width: 175px !important;
    }
    */
ul.sub-menu > li > a {
    background: #E1DFE0;
}

a.color-gray2:hover, a.color-gray2:active, a.color-gray2:focus, a.color-gray2:visited {
    color: #E1DFE0;
    font-weight: 700;
}

nav ul.sub-menu {
    display: none;
    position: absolute;
    padding-left: 0;
    margin-top: -11px;
    width: 100% !important;
}

nav ul.sub-menu {
    position: inherit;
}

    nav ul.sub-menu li {
        text-align: center !important;
        width: 100%;
        background: #E1DFE0;
    }

nav li.subs:hover ul.sub-menu {
    padding-bottom: 0;
    display: contents;
    position: relative;
    padding-left: 0;
    width: 100% !important;
}

nav ul li, nav ul li a {
    /*float: left;
        */
    display: block;
    /* transition: all ease .4s;
        */
}

    nav ul li a {
        font-family: 'Open Sans';
        font-size: 15px;
        font-weight:600;
        text-transform: uppercase;
        color: #fff;
        padding: 34px 18px 0px;
        line-height: 1.25 !important;
        /*        white-space: nowrap;*/
        background: inherit;
        /*height: 89px;
        */
        text-decoration: none;
    }

        /* nav ul li a.enter, nav ul li a.enter:hover {
            color: #18b5b2 !important;
        } */


    nav ul li a:hover, nav ul li a:active {
        color: #fff;
        text-decoration: none;
    }

nav#top ul li a {
    font-family: 'Open Sans';
    /*text-transform: capitalize;
        */
    font-size: 13.5px;
}

    nav#top ul li a.tickets {
        color: #000;
        background: rgba(255,255,255,.6);
        clip-path: polygon(90% 0%, 100% 50%, 90% 100%, 0% 100%, 10% 50%, 0% 0%);
        margin: 4px;
        height: 32px;
        padding: 10px 20px;
        font-family: "aileronbold";
    }

    nav#top ul li a:hover {
        color: #0da9de !important;
        text-shadow: 0 0 30px #fff;
    }

    nav#top ul li a i {
        font-size: 16px;
        line-height: 0;
        overflow: visible;
        margin-right: 3px;
    }

        nav#top ul li a i.fas.fa-ticket-alt {
            transform: rotate(-45deg);
        }

        nav#top ul li a i.fas.fa-language {
            font-size: 23px;
            position: relative;
            top: 3px;
        }

div.nav-menu-carrot {
    z-index: 10;
    text-align: center;
    display: none;
    position: relative;
}

    div.nav-menu-carrot > img {
        height: 10px;
    }

nav#main > ul > li:hover > div.nav-menu-carrot, nav#main > ul > li:hover > ul.sub-menu {
    display: block;
}

nav#main > ul > li {
    border: 0 none;
    flex-grow: 1;
    width: 160px;
}

    nav#main > ul > li > a {
        padding: 0px 9px 0px;
        width: 100%;
        text-align: center;
        Font-size: 15px;
        Color: #ffffff;
        font-family: 'Open Sans';
        Text-transform: Uppercase;
        display: flex;
        align-content: center;
        height: 100%;
        justify-content: center;
        align-items: center;
        /* margin-left: -15px;
        */
    }

    nav#main > ul > li > ul a {
        padding: 20px 18px 0px;
        /* font-size: 1.1rem;
        */
        white-space: inherit;
        color: #5B5B5B;
        margin-bottom: 20px;
    }

    nav#main > ul > li.subs > a[href="/Competition"] + ul {
        left: -21%;
    }

    nav#main > ul > li.subs > a[href="/Jury"] + ul {
        left: 33%;
    }

    nav#main > ul > li.current.hideSub > ul.sub-menu, nav#main > ul > li.hideSub:hover > ul.sub-menu {
        display: none;
    }

nav ul.sub-menu li {
    border-bottom: 1px solid white;
}

    nav ul.sub-menu li a:hover {
        background: #C1BFC0;
        padding-bottom: 20px !important;
        margin-bottom: 0px !important;
    }

nav#main > ul > li.current > a {
    position: relative;
    width: 100%;
    font-weight: 700;
}

    nav#main > ul > li.current > a:before, nav#main > ul > li.current > a:after {
        content: "";
        display: block;
        position: absolute;
        /*width: 1px;
        */
        height: 42px;
        top: 0;
        left: 0;
        /*background: #242426;
        */
    }

    nav#main > ul > li.current > a:after {
        right: 0;
        left: auto;
    }

nav#main > ul > li:last-child > ul.sub-menu {
    width: 443px;
    right: -5px;
}

nav#main > ul > li:nth-last-child(2) > ul.sub-menu {
    width: 330px;
    /*    right: -5px;*/
}

nav#main > ul > li.current > ul.sub-menu {
    display: block;
}

.center-vertically {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0;
}

div.nav-menu-carrot {
    z-index: 10;
    text-align: center;
    margin-top: 5px;
    display: none;
}

    div.nav-menu-carrot > img {
        height: 10px;
    }

nav#main > ul > li:hover > div.nav-menu-carrot, li.current > div.nav-menu-carrot {
    display: block;
}

nav#main > ul > li:hover {
    border-top: none;
}

nav ul form li a:hover {
    color: #fff !important;
}

/* Adding transform to the X */
/*.mobile-toggle.collapsed {
    transform: rotate(180deg);
    transition: all 2s linear 1s;
}*/

/* Styling the three lines to make it an X */
.mobile-toggle.collapsed .icon-bar:nth-child(2) {
    transform: translatex(3.5px) translatey(-3px) rotate(-135deg);
    width: 28px;
}

.mobile-toggle.collapsed .icon-bar:nth-child(3) {
    transform: scale(0);
}

.mobile-toggle.collapsed .icon-bar:nth-child(4) {
    transform: translatex(3.5px) translatey(-7px) rotate(135deg);
    width: 28px;
}


.mobile-toggle .icon-bar:nth-child(2) {
    transform: translatey(-9px);
}

.mobile-toggle .icon-bar:nth-child(4) {
    transform: translatey(9px);
}

.mobile-toggle .icon-bar {
    transition: transform 250ms cubic-bezier(.2,.6,.3,1), width 250ms cubic-bezier(.2,.6,.3,1);
}

nav ul form li.loggedIn a {
    padding: 34px 1vw;
}

.mobile-view {
    display: none;
}

.desktop-view {
    display: block;
}

@media all and (min-width:1881px) {
    nav ul form li.loggedIn a {
        padding: 34px 2.5vw;
    }
}

@media all and (min-width:1418px) {
    nav ul form li.loggedIn a {
        padding: 34px 1.5vw;
    }
}
@media all and (min-width:1024px) {
    /* IPad and Below */


    #branding {
        position: absolute;
        z-index: 100;
        border: none;
        height: 87px;
    }

    nav#main > ul > li > a[href="#"]:active + ul.sub-menu {
        display: block;
    }

    nav#top {
        float: right;
        padding-bottom: 49px;
        background: #fff;
        width: 100%;
        height: 89px;
    }

        nav#top ul li a {
            padding: 14px 13px 7px;
        }

        nav#top > ul {
            text-align: right;
            display: flex;
            justify-content: flex-end;
            max-width: 370px;
            float: right;
            flex-wrap: wrap;
            overflow: visible;
            padding-top: 4px;
        }

    form > li {
        display: inline-flex !important;
    }
    .navbar-right {
        margin-right: -0px;
    }
}

@media all and (max-width:1890px) {
    div.nav-menu-carrot {
        margin-top: 4px;
    }
}

@media all and (max-width:1821px) {
    div.nav-menu-carrot {
        margin-top: 3px;
    }
}

@media all and (max-width:1680px) {
    div.nav-menu-carrot {
        margin-top: 2px;
    }
}

@media all and (max-width:1640px) {
    div.nav-menu-carrot {
        margin-top: 3px;
    }
}

@media all and (max-width:1610px) {
    div.nav-menu-carrot {
        margin-top: 2px;
    }
}

@media all and (max-width:1565px) {
    div.nav-menu-carrot {
        margin-top: 1px;
    }
}

@media all and (max-width:1500px) {
    div.nav-menu-carrot {
        margin-top: 2px;
    }
}

@media all and (max-width:1460px) {
    div.nav-menu-carrot {
        margin-top: 1px;
    }
}

@media all and (max-width:1392px) {
    div.nav-menu-carrot {
        margin-top: 0px;
    }
}

@media all and (max-width:1380px) {
    nav#main > ul {
        width: 100%;
        left: 0;
    }

    #branding a img#branding-desktop {
        display: none;
    }
}

@media all and (max-width:1356px) {
    div.nav-menu-carrot {
        margin-top: 1px;
    }
}

@media all and (max-width:1323px) {
    div.nav-menu-carrot {
        margin-top: 0px;
    }
}

@media all and (max-width:1229px) {
    div.nav-menu-carrot {
        margin-top: -1px;
    }
}

@media all and (max-width:1209px) {
    div.nav-menu-carrot {
        margin-top: 0px;
    }
}

@media all and (max-width:1187px) {
    div.nav-menu-carrot {
        margin-top: -1px;
    }
}

@media all and (max-width:1110px) {
    div.nav-menu-carrot {
        margin-top: -2px;
    }
}

@media all and (max-width:1161px) {
    div.nav-menu-carrot {
        margin-top: -1px;
    }
}

@media all and (max-width:1135px) {
    div.nav-menu-carrot {
        margin-top: -2px;
    }
}

/*@media all and (max-width:1024px) {
    #branding a img#branding-desktop {
        display: none;
    }

    #branding a img#branding-tablet {
        display: block;
        padding-left: 8px;
    }
}*/

@media all and (max-width:1023px) {
    header {
        width: 100%;
        z-index: 100;
        position: absolute;
        border: none;
        height: 89px;
    }

        header:before, header:after {
            display: none;
        }

    .container-fluid.subBar:before {
        top: 88px;
        height: 54px;
        width: 61px;
        right: 0;
        display: none;
    }

    nav#top {
        height: 44px;
        display: block;
        position: absolute;
        top: 0;
        z-index: 90;
        width: 100%;
        right: 0;
        background: transparent;
        height: 51px;
    }

        nav#top ul li a {
            padding-left: 10px;
            padding-right: 10px;
        }

            /*        nav#top > ul li[class^="mobile-md"] {
            display: none !important;
            position: absolute;
            background: rgba(150,150,150,.1);
            ;
            padding: 6px 10px 11px;
            right: 0;
            border-top: 1px solid #fff;
            width: 140px;
        }*/

            nav#top ul li a.tickets {
                background: none;
                clip-path: none;
                margin: 0;
                height: inherit;
                padding: 14px 13px 7px;
                font-family: "aileronregular";
            }

        nav#top > ul li.mobile-md-hide-1 {
            border-top: 0;
            top: 90px;
        }

        nav#top > ul li.mobile-md-hide-2 {
            top: 141px;
        }

        nav#top > ul li.mobile-md-hide-3 {
            top: 193px;
        }

        nav#top > ul li.mobile-md-hide-4 {
            top: 245px;
        }

        nav#top > ul li.mobile-md-hide-5 {
            top: 297px;
        }

        nav#top.open > ul li[class*="mobile-md"] {
            display: block;
        }

    .navbar-header {
        display: block;
        height: 89px;
        float: none;
        padding-right: 3vw;
    }

    nav#main {
        height: auto;
    }

        nav#main ul li li {
            float: none;
            width: 100%;
        }

        nav#main:after {
            height: 0;
        }

    .mobile-toggle .icon-bar {
        display: block;
        width: 35px;
        border-radius: 1px;
        border: 0.5px solid;
        transition: transform 250ms cubic-bezier(.2,.6,.3,1),width 250ms cubic-bezier(.2,.6,.3,1);
        will-change: transform,width;
    }

    .mobile-toggle {
        position: absolute;
        float: right;
        padding: 18px 10px;
        margin-top: 4px;
        margin-right: 20px;
        background-color: transparent;
        background-image: none;
        border: 1px solid transparent;
        border-radius: 4px;
        width: 46px;
        z-index: 1000;
        color: #fff;
    }

    div.navbar-header > div.center-vertically {
        display: flex;
        height: 89px;
        justify-content: end;
        align-items: center;
    }


    nav#main ul, nav#main > ul > li > ul.sub-menu {
        width: 100% !important;
        display: flex;
        flex-direction: column !important;
        position: relative;
        /*background: #fafafa;
        */
        right: 0 !important;
    }

    nav#main > ul > li, nav#main > ul > li.current, nav#main > ul > li:hover {
        padding: 0;
    }

        nav#main > ul > li:last-child, nav#main > ul > li.current:last-child, nav#main > ul > li:last-child:hover {
            border-bottom: 0 none;
        }

        nav#main > ul > li.current > a:before, nav#main > ul > li.current > a:after {
            display: none;
        }


        nav#main > ul > li:hover > ul.sub-menu, nav#main > ul > li.current > ul.sub-menu {
            display: block;
        }

    nav#main ul li, nav#main ul li a {
        float: none;
        width: 100%;
    }

    nav#main > ul > li > ul.sub-menu {
        display: none;
    }

    nav ul.sub-menu {
        margin-top: 0;
        padding-bottom: 10px;
    }



    nav#main > ul > li.current > ul.sub-menu, nav#main > ul > li.current:hover > ul.sub-menu {
        display: block;
        padding: 0;
        left: 0 !important;
        text-align: center;
    }

        nav#main > ul > li.current > ul.sub-menu > li:hover, nav#main > ul > li.current > ul.sub-menu > li > a:focus, nav#main > ul > li.current > ul.sub-menu > li > a:hover {
            font-weight: 700;
        }

    nav#main > ul {
        display: none;
    }

    nav#top.open {
        display: block;
    }

    nav#main > ul.open {
        display: block;
        /* border-top: 1px solid;
        */
        position: relative;
        top: 0;
        /*padding-right: 140px;
         background: url(/content/images/diagnal-transparent.png) #fff;
        */
        /* border-bottom: 1px solid #555;
         box-shadow: 0 40px 70px rgba(0,0,0,.3);
        */
        height: auto;
    }

    nav#main > ul > li > a, nav#main > ul > form > li > a.color-gray2 {
        padding: 21px 12px 16px;
        text-align: center;
    }

    nav#main > ul > li > a {
        display: block;
    }

    nav ul.sub-menu li a:hover {
        padding-bottom: 12px !important;
    }

    nav ul.sub-menu li {
        border-bottom: none;
    }

    nav#main > ul > li.current, nav#main > ul > li.current li {
        /* background: rgba(24,181,178,.07);
    */
        padding: 0;
    }

        nav#main > ul > li.current:not(.subs) {
            background: rgba(255,255,255,1);
        }

    nav#main > ul > li.subs > a:after {
        content: "";
        height: 0;
        width: 0;
        background: none;
        position: relative;
        left: -14px;
        border: 0 none;
        border-right: 4px solid transparent;
        border-left: 4px solid transparent;
        border-top: 6px solid #fff;
        display: block;
        float: right;
        top: 3px;
    }

    nav#main > ul > li.subs.current > a:after {
        border: 0 none;
        border-right: 4px solid transparent;
        border-left: 4px solid transparent;
        border-bottom: 6px solid #fff;
    }

    nav#main > ul > li > ul a {
        padding: 17px 18px 12px;
        color: #444;
        margin-bottom: 0px;
        /* text-transform: capitalize;
        */
    }

    nav ul li a {
        white-space: normal;
    }

    nav#top ul li a:hover, nav#main > ul > li > a:hover, nav#main > ul > li.current > ul.sub-menu > li:hover,
    nav#main > ul > li.current > ul.sub-menu > li > a:focus, nav#main > ul > li.current > ul.sub-menu > li > a:hover {
        font-weight: 700;
        cursor: pointer;
    }

    nav#main > ul > li.current, nav#main > ul > li.current li {
        padding: 0;
    }

    #branding {
        width: 100%;
    }

    .branding-mobileOpen {
        position: fixed !important;
        z-index: 2 !important;
    }

    
        #branding a img#branding-desktop {
            display: block;
            margin-left: 37%;
            margin-top: 30px;
        }

    nav#main > ul > li:hover > ul.sub-menu {
        display: none;
    }

    nav#top {
        float: right;
        padding-bottom: 49px;
        background: #fff;
        width: 100%;
        height: 89px;
    }

        nav#top ul li a {
            padding: 14px 13px 7px;
        }

        nav#top > ul {
            text-align: right;
            display: flex;
            justify-content: flex-end;
            max-width: 370px;
            float: right;
            flex-wrap: wrap;
            overflow: visible;
            padding-top: 4px;
        }

    nav#main > ul > li.subs > a[href="/Competition"] + ul {
        left: auto;
    }

    .navbar-right {
        float: none !important;
        margin-right: 0px;
    }

    div.nav-menu-carrot, nav#main > ul > li:hover > div.nav-menu-carrot {
        display: none !important;
    }

    li.mobile-sm-hide-2 > a, li.mobile-sm-hide-1 > a, li.mobile-md-hide-2 > a {
        text-align: center;
        padding: 21px 12px 16px;
    }

    form > * {
        margin-bottom: 0px;
    }

    nav ul form li.loggedOut a, nav ul form li.loggedIn a {
        padding: 21px 12px 16px !important;
    }

    .sy-slides-wrap {
        top: 89px;
    }

    .row.content {
        margin-top: 160px;
    }

    body.category div div.row.content {
        margin-top: 80px;
    }

    .desktop-view {
        display: none;
    }

    .mobile-view {
        display: block;
    }
}

@media all and (max-width:985px) {
    #branding a img#branding-desktop {
        margin-left: 39%;
    }
}

@media all and (max-width:935px) {
    #branding a img#branding-desktop {
        margin-left: 38%;
    }
}

@media all and (max-width:895px) {
    #branding a img#branding-desktop {
        margin-left: 37%;
    }
}

@media all and (max-width:845px) {
    #nav-wrap {
        margin: 0;
        padding-right: 0;
    }
}

@media all and (max-width:839px) {
    #branding a img#branding-desktop {
        margin-left: 36%;
    }
}

@media all and (max-width:815px) {
    #branding a img#branding-desktop {
        margin-left: 35%;
    }
}

@media all and (max-width:799px) {
    #main {
        padding: 3vw 0;
    }

    .mobile-toggle {
        margin-right: 8%;
    }

    .sy-slides-wrap {
        top: 119px;
    }
}

@media all and (max-width:785px) {
    #branding a img#branding-desktop {
        margin-left: 34%;
    }
}

@media all and (max-width:768px) {
    header {
        width: 100%;
    }

    #branding a img#branding-mobile {
        display: block;
        padding-left: 10px;
    }

    #branding a img#branding-tablet {
        display: none;
    }

    #branding a img#branding-desktop {
        display: none;
    }
    /* Prevent iphone zooming in for inputs */
    input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="email"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"], select:focus, textarea {
        font-size: 16px;
    }

    /* .row.content {
        margin-top: 89px;
    } */

    #branding a img#branding-mobile {
        max-height: 36px;
        margin-left: 31%;
        margin-top: 25px;
    }
}

@media all and (max-width: 767px) {
    #branding a img#branding-mobile {
        margin-left: 33%;
    }
}

@media all and (max-width:745px) {
    #branding a img#branding-desktop {
        margin-left: 32%;
    }

    .mobile-toggle {
        margin-right: 9%;
    }
}

@media all and (max-width:700px) {
    #branding a img#branding-mobile {
        margin-left: 31%;
    }
}

@media all and (max-width:670px) {
    #branding a img#branding-mobile {
        margin-left: 28%;
    }

    .mobile-toggle {
        margin-right: 10%;
    }
}

@media all and (max-width:630px) {
    advertisingawards #branding a img#branding-desktop {
        margin-left: 27%;
    }
}

@media all and (max-width:600px) {
    #branding a img#branding-mobile {
        margin-left: 26%;
    }
}

@media all and (max-width:580px) {
    #branding a img#branding-mobile {
        margin-left: 25%;
    }
}

@media all and (max-width:568px) {
    /*    nav#top > ul li[class*="mobile-sm"] {
    display: none;
    position: absolute;
    background: rgba(150,150,150,.1);
    padding: 6px 10px 11px;
    right: 0;
    border-top: 1px solid #fff !important;
    width: 140px;
}*/

    nav#top > ul li.mobile-sm-hide-1 {
        border-top: 0 !important;
        top: 90px !important;
    }

    nav#top > ul li.mobile-sm-hide-2 {
        top: 141px !important;
    }

    nav#top > ul li.mobile-sm-hide-3 {
        top: 193px !important;
    }

    nav#top > ul li.mobile-sm-hide-4 {
        top: 245px !important;
    }

    nav#top > ul li.mobile-sm-hide-5 {
        top: 297px !important;
    }

    nav#top.open > ul li[class^="mobile-sm"] {
        display: none;
    }

    #branding a img#branding-mobile {
        margin-left: 24%;
    }
}

@media all and (max-width:500px) {
    #branding a img#branding-mobile {
        margin-left: 22%;
    }

    .sy-slides-wrap {
        top: 7.5em;
    }
}

@media all and (max-width:485px) {
    #branding a img#branding-mobile {
        margin-left: 21%;
        max-height: 34px;
    }
}

@media all and (max-width:470px) {
    #branding a img#branding-mobile {
        margin-left: 20%;
        max-height: 34px;
        margin-top: 26px;
    }
}

@media all and (max-width:450px) {
    #branding a img#branding-mobile {
        margin-left: 19%;
        max-height: 32px;
    }
}

@media all and (max-width:425px) {
    #branding a img#branding-mobile {
        margin-left: 18%;
        max-height: 30px;
        margin-top: 27px;
    }
}

@media all and (max-width:400px) {
    #branding a img#branding-mobile {
        margin-left: 18%;
        max-height: 28px;
        margin-top: 28px;
    }
}

@media all and (max-width:375px) {
    #branding a img#branding-mobile {
        margin-left: 17%;
        max-height: 26px;
    }
}

@media all and (max-width:350px) {
    #branding a img#branding-mobile {
        margin-left: 16%;
        max-height: 26px;
        margin-top: 29px;
    }
}

@media all and (max-width:325px) {
    #branding a img#branding-mobile {
        margin-left: 15%;
        max-height: 24px;
    }
}

@media all and (max-width:300px) {
    #branding a img#branding-mobile {
        margin-left: 14%;
        max-height: 22px;
        margin-top: 30px;
    }
}

@media all and (max-width:275px) {
    #branding a img#branding-mobile {
        margin-left: 13%;
        max-height: 20px;
    }
}

@media all and (max-width:250px) {
    #branding a img#branding-mobile {
        margin-left: 12%;
        max-height: 20px;
        margin-top: 31px;
    }
}

@media all and (max-width:225px) {
    #branding a img#branding-mobile {
        margin-left: 11%;
        max-height: 20px;
    }
}

@media all and (max-width:200px) {
    #branding a img#branding-mobile {
        margin-left: 10%;
        max-height: 20px;
        margin-top: 31px;
    }
}
