#top-menu-parent {
    background-color:#edf6f7;
}

.custom-wrapper {
    margin-bottom: 1em;
    -webkit-font-smoothing: antialiased;
    text-transform:uppercase;
    height:75px;
    overflow: hidden;
    -webkit-transition: height 0.5s;
    -moz-transition: height 0.5s;
    -ms-transition: height 0.5s;
    transition: height 0.5s;
}

.custom-wrapper.open {
    height:auto;
}

.custom-menu-3 {
    text-align: center;
    padding-top:1.5em;
}

.custom-toggle {
    width: 34px;
    height: 34px;
    position: absolute;
    top: 1em;
    left: 0;
    display: none;
}

.custom-toggle .bar {
    background-color: #777;
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 100px;
    position: absolute;
    top: 18px;
    right: 7px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    transition: all 0.5s;
}

.custom-toggle .bar:first-child {
    -webkit-transform: translateY(-6px);
    -moz-transform: translateY(-6px);
    -ms-transform: translateY(-6px);
    transform: translateY(-6px);
}

.custom-toggle.x .bar {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.custom-toggle.x .bar:first-child {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.custom-brand {
    display:inline-block;
    width:188px;
    /* height:32px; */
    padding-top: 3em;
    /* padding-left: 3em; */
    /* padding-left: 0.5em; */
    cursor:pointer;
    background-image: url("../images/logo.png");
    background-repeat:no-repeat;
    background-position: center center;
}

.custom-menu-2 {
    font-size:0.825em;
    /*font-weight:bold;*/
    /*font-weight: lighter !important;*/
    color:#000000;
    padding-top:25px;
    height:100%;
}

/*@-moz-document url-prefix() {
  .custom-menu-2 {
    font-size:0.8em;
  }
}
*/
.custom-menu-2 .pure-menu-list {
    height:95%;
}

#download-link.selected {
    border-bottom:solid 2px #c586e3;
}

#download-link.selected .pure-menu-link {
    color:#c586e3;
}

#pricing-link.selected {
    border-bottom:solid 2px #f5ab35;
}

#pricing-link.selected .pure-menu-link {
    color:#f5ab35;
}

#faq-link.selected {
    border-bottom:solid 2px #1abc9c;
}

#faq-link.selected .pure-menu-link {
    color:#1abc9c;
}

#docs-link.selected {
    border-bottom:solid 2px #d2527f;
}

#docs-link.selected .pure-menu-link {
    color:#d2527f;
}

#api-link.selected {
    border-bottom:solid 2px #338;
}

#api-link.selected .pure-menu-link {
    color:#338;
}

#contact-link.selected {
    border-bottom:solid 2px #3498db;
}

#contact-link.selected .pure-menu-link {
    color:#3498db;
}

#status-link.selected {
    border-bottom:solid 2px rgb(120,130,150);
}

#status-link.selected .pure-menu-link {
    color:rgb(120,130,150);
}

#register-link, #login-link {
    /* margin-top:20px; */
    margin-right:0em;
    padding:0em 0em;
    border-radius:5px;
}

#register-link {
    border:solid 2px #1abc9c;
    font-size: 0.9em;
    min-width: 8em;
}

#register-link > a {
    color:#1abc9c;
}

#login-link {
    border:solid 2px #3498db;
    font-size: 0.9em;
    min-width: 8em;
}

#login-link > a {
    color:#3498db;
}

/* @media (max-width: 47.999em) { */
@media (max-width: 63.999em) {

    /* give space for the burger */
    .custom-brand {
        /* padding-left:4em; */
        margin-left: 3em;
    }

    .custom-menu-3 {
        text-align: left;
        padding-top: 1em;
        border-bottom: solid 3px #EBEBEB;
        padding-bottom:1em;
        margin-bottom:1em;
    }

    /* In small screens, let REGISTER & LOGIN still be horizontal */
    .custom-menu-3 li {
        display:inline-block;
    }

    .custom-toggle {
        display: block;
    }

    .pure-menu-item {
        height:auto;
    }

    #register-link, #login-link {
        /* margin-top:1em; */
        margin-right:0.2em;
        border-radius:5px;
    }
}

/* @media (min-width: 40em) { */
@media (min-width: 64em) {
    #top-menu {
        /* padding-left: 200px; "left col (nav + list)" width */
        max-width:1200px;
        margin:0 auto;
        position: relative;
    }

    #top-menu-middle {
        text-align: right;
    }

}
