/* accent color - #ff0052 */

.navbar-logo {
    height: 30px;
    width: auto;
}

#mainNav .navbar-toggler {
    font-size: 20px;
    padding: 8px 10px;
    color: #ffffff;
    border: 0px solid white;
}

#mainNav .navbar-nav > li > a {
    font-size: 15px;
    font-family: 'Lato', 'Helvetica', 'Arial', 'sans-serif';
    letter-spacing: 2px;
    text-transform: none;
}

#mainNav .navbar-nav > li > a.active {
    color: #ffffff !important;
    background-color: transparent;
}

#mainNav .navbar-nav > li > a.active:hover {
    background-color: transparent;
}

#mainNav .navbar-nav > li > a,
#mainNav .navbar-nav > li > a:focus {
    color: #ffffff;
}

#mainNav .navbar-nav > li > a:hover,
#mainNav .navbar-nav > li > a:focus:hover {
    color: #ffffff;
}

.accent-color {
    color: #ff0052;
}

.bg-black {
  background-color: #222222 !important;
}

header.masthead {
    background: linear-gradient(#121212, black);
    background-size: cover;
    background-repeat: no-repeat;
}

header.masthead .header-content h3 {
    font-size: 20px;
}

header.masthead .header-content h1 {
    font-weight: 500;
}

.btn-outline:hover, .btn-outline:focus, .btn-outline:active, .btn-outline.active {
    color: white;
    border-color: #ff0052;
    background-color: #ff0052;
}

.features {
    background: url(../img/weeto_back_blur.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    color: #ffffff;
}

.text-muted {
    color: #b0bfcc !important;
}

section.features .feature-item-wide {
    max-width: 500px;
}

section.features .feature-item {
    max-width: 400px;
}

.feature-icon {
    height: 96px;
    width: auto;
    margin-bottom: 20px;
}

.bg-primary {
    background: #ff0052;
    background: -webkit-linear-gradient(#ff0052, #e6004a);
    background: linear-gradient(#ff0052, #e6004a);
}

.bg-secondary {
    background: #222222 !important;
}

.download {
    color: #ffffff;
}

section.features .section-heading {
    margin-bottom: 50px;
}

a:hover, a:focus {
    color: #ff0052;
}

#mainNav .navbar-toggler {
    border: none;
    outline: none;
}

footer p:first-child {
    font-size: 20px;
    margin: 0;
}

footer .heart-symbol {
    //font-size: 15px;
}

.hr-love {
    border-color: rgba(255, 255, 255, 0.3);
    margin-top: 10px;
    margin-bottom: 12px;
    max-width: 200px;
}

header.masthead .header-content h1 {
  font-size: 50px;
  text-align: center;
}



@media (min-width: 992px) {
    /*
    #mainNav {
    border-color: transparent;
    background-color: transparent;
}
    #mainNav .navbar-brand {
    color: fade(white, 70%);
}
    #mainNav .navbar-brand:hover, #mainNav .navbar-brand:focus {
    color: white;
}
    */
    #mainNav .navbar-nav > li > a,
    #mainNav .navbar-nav > li > a:focus {
        color: rgba(255, 255, 255, 0.7);
    }
    #mainNav .navbar-nav > li > a:hover,
    #mainNav .navbar-nav > li > a:focus:hover {
        color: white;
    }
    /*
    #mainNav.navbar-shrink {
    border-color: rgba(34, 34, 34, 0.1);
    background-color: white;
}
    #mainNav.navbar-shrink .navbar-brand {
    color: #222222;
}
    #mainNav.navbar-shrink .navbar-brand:hover, #mainNav.navbar-shrink .navbar-brand:focus {
    color: #fdcc52;
}
    */
    #mainNav.navbar-shrink .navbar-nav > li > a,
    #mainNav.navbar-shrink .navbar-nav > li > a:focus {
        color: #ffffff;
    }
    #mainNav.navbar-shrink .navbar-nav > li > a:hover,
    #mainNav.navbar-shrink .navbar-nav > li > a:focus:hover {
        color: #ff0052;
    }

    header.masthead .header-content h1 {
        font-size: 40px;
    }

    header.masthead .header-content h3 {
        font-size: 30px;
    }
}


/* portrait mode -> height > width */
/*
@media screen and (max-aspect-ratio: 1/1) {

header.masthead {
background: url(../img/weeto_back_1.jpg);
background-size: cover;
background-repeat: no-repeat;
}

}
*/

/* narrow portrait mode -> height > 2 * width */
/*
@media screen and (max-aspect-ratio: 1/2) {

header.masthead {
background: url(../img/weeto_back_2.jpg);
background-size: cover;
background-repeat: no-repeat;
}

}

*/