@import url("https://fonts.googleapis.com/css?family=Rubik:400,500,700");

/*@font-face {
    font-family: 'Brooke\ Smith\ Script';
    src: url('Brooke\ Smith\ Script.ttf') format('truetype');
}

@font-face {
    font-family: 'AvenirNextLTPro-Regular';
    src: url('AvenirNextLTPro-Regular.otf') format('truetype');
}*/

@font-face {
    font-family: 'PostScriptumLight';
    src: url('PostScriptum\ Light.ttf') format('truetype');
}
@font-face {
    font-family: 'Arsenal';
    src: url('Arsenal-Regular.otf') format('truetype');
}
@font-face {
    font-family: 'PresciousSoul';
    src: url('Prescious\ Soul.ttf') format('truetype');
}

@font-face {
    font-family: 'din-regular';
    src: url('din-regular.ttf') format('truetype');
}


@font-face {
    font-family: 'Dosis-Light';
    src: url('Dosis-Light.ttf') format('truetype');
}

body, html {
    background: #fff; 
}

body {
    font-family: AvenirNextLTPro-Regular;
    margin: 0;
    font-size: 16px;
    /*font-weight: bold;*/
    color: #5e635c;
}
p{
    color:#5e635c!important; 
}

h1 {
    /*font-family: 'Brooke\ Smith\ Script'*/
    color: #8c98a4;
}



 h2, h3, h4, h5, h6 {
    /* color: black;
   text-transform: uppercase;
    letter-spacing: 5px;*/
}



h3{
    text-align: center;
    font-size: 18pt;
    /*color: #f3bbc7;*/
}

h2{
    font-size: 18pt;
}

h4{
    font-size: 16pt;
    letter-spacing: 0px;
}

.form-control{
    font-size: 16pt;
}

.accent {
    /*font-family: 'Brooke\ Smith\ Script'*/
    font-weight: bold;
    /*color: #f3bbc7;*/
    /*margin: auto;*/
}
.accentpink {
    /*font-weight: bold;*/
    color: #f3bbc7;
    font-size: 14pt;
}

/*.form-control {
    font-size: 10pt;
}*/

.wrapper {
    padding-top: 5px;
    padding-bottom: 5px;
}

#header{
    /*height: 300px; background-image: url('../images/header.jpg');background-size: cover !important;*/
    /*height: 400px; background-image: url('../images/Header_home.jpg');background-size: cover !important;*/
    background-position: center bottom !important;
    background-repeat: no-repeat !important; 
}

#header.home{
    height: 400px; background-image: url('../images/Header_home.jpg');background-size: cover !important;
}

#header.exclusive{
    height: 400px; background-image: url('../images/Header_dateexclusive.jpg');background-size: cover !important;
}

#header.kalender{
    height: 400px; background-image: url('../images/Header_kalender.jpg');background-size: cover !important;
}

#header.matchingtool{
    height: 400px; background-image: url('../images/Header_matchingtool.jpg');background-size: cover !important;
}

#header.contact{
    height: 400px; background-image: url('../images/Header_contact.jpg');background-size: cover !important;
}

.profielknop{
    margin-top: 100px;
    margin-right: 150px;
    padding: 30px;
}

.loginknop{
    font-size: 9pt;
    font-family: 'AvenirNextLTPro-Regular';
    text-transform: uppercase;
    padding: 3px;
    position: absolute;
     top: 60px; 
    right: 50px;
}

#content{
    padding-top: 415px; padding-bottom: 100px; 
}

.navbar-nav {
    margin-right: 30px;
        font-size: 10pt;
}

    .navbar-nav .nav-link {
        color: black;
    }

.u-hamburger:hover .u-hamburger__inner, .u-hamburger:hover .u-hamburger__inner::before, .u-hamburger:hover .u-hamburger__inner::after {
    background-color: black;
}
.u-hamburger__inner {
    margin-left: 15px;
    margin-top: 15px;
}

/*#topnav .topbar-main .logo {
    float: inherit;
    text-align: center;
}

#topnav #navigation {
    text-align: center;
}*/

#topnav {
    position: inherit;

    background: black url(../images/header.png) center center no-repeat;
    background-size: cover;
}



#topnav .topbar-main.first {
    background-color: initial;
    min-height: 600px;
}


#topnav .topbar-main.second {
    background-color: initial;
    min-height: 150px;
}

.cookiemelding{
    background-color: black;
    color: white;
    display: block;
    position: fixed;
    min-width: 100%;
    height: auto;
    z-index: 100000;
    font-size: 13px;
    /*line-height: 20px;*/
    left: 0;
    text-align: center;
    bottom: 0px;
    padding: 3px;
}

#logoAndNav.menubalk {
        margin-left: auto;
}

.u-header__nav-link {
    color: black;
    text-decoration: none;
}

.u-header__navbar-link {
     color: black;
    text-decoration: none;
}

#matches {

    /*background-image: url('../images/Header_contact.jpg');
    background-repeat: no-repeat;*/

    /*background: black url(../images/Achtergrond.jpg) center center no-repeat; background-size: cover;


    width: 285px;
    height: 250px;*/
    
    text-align: center;
    margin:auto;
    /*border-radius: 50%;*/
    position: fixed;
    right: -250px;	
    bottom: 200px;
    display: table; 
    z-index: 999;
}

    #matchpijl{
        width: 500px;
    }


.btn-outline-success {
    color: black;
    border-color: black;
}

.btn-outline-success.active, .btn-outline-success:active, .btn-outline-success:hover, .btn-success.active, .btn-success.focus, .btn-success:active, .btn-success:focus, .btn-success:hover, .btn-success:not(:disabled):not(.disabled):active, .open>.dropdown-toggle.btn-success, .show>.btn-outline-success.dropdown-toggle, .show>.btn-success.dropdown-toggle {
    background-color: #f3bbc7;
    border: 1px solid #f3bbc7;
}

.btn-outline-success:not(:disabled):not(.disabled).active, .btn-outline-success:not(:disabled):not(.disabled):active, .show>.btn-outline-success.dropdown-toggle {
    color: #fff;
    background-color: #f3bbc7;
    border-color: #f3bbc7;
}

.btn-outline-success.focus, .btn-outline-success:focus, .btn-success.focus, .btn-success:focus, .btn-success:not(:disabled):not(.disabled):active:focus, .show>.btn-success.dropdown-toggle:focus {
    box-shadow: 0 0 0 2px rgba(250,231,235,.3);
}

.btn-outline-success:not(:disabled):not(.disabled).active:focus, .btn-outline-success:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-success.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem rgba(243,187,199,.5);
}

.card {
    background-color: #f2f2f2;
}

a{
    text-decoration: underline;
    color: black;
}

    .btn:not([href]):not([type]):not(:disabled):not(.disabled) {
        text-decoration: none;
    }
    a:not([href]):not([tabindex]) {
            text-decoration: underline;
    }

    a:hover {
        /*color: #f3bbc7;*/
        color: black;
        cursor: pointer;
    }

.u-header__nav-item:hover .u-header__nav-link, .u-header__nav-item:focus .u-header__nav-link {
    color: #f3bbc7;
}

.u-header__navbar-link {
     text-decoration: none;
}

.btn.btn-soft-primary {
    background: rgba(243,187,199,.3);
     text-decoration: none;
     color: black;
}

.btn-soft-primary[href]:hover, .btn-soft-primary[href]:focus, .btn-soft-primary[href]:active, .btn-soft-primary[href].active, .btn-soft-primary[type]:hover, .btn-soft-primary[type]:focus, .btn-soft-primary[type]:active, .btn-soft-primary[type].active {
    color: #fff;
    background: #f3bbc7;
   box-shadow: 0 0 0 0.2rem rgba(243,187,199,.5);
}

footer{
        border-top: 1px solid rgba(0,0,0,.05);
}

.startitem{
    padding: 25px;
}

.startitem:hover{
    border: 1px solid black;
    background: pink;
    cursor: pointer;
}

.eveOnKalender:hover{
    background: rgba(0,0,0,.03);
     cursor: pointer;
}


#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: #f3bbc7;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#myBtn:hover {
  background-color: #555;
}

.u-go-to {
    background-color: pink;
}

.progress {
    background-color: rgba(0,0,0,.03);
}

.progress-bar {
    background-color: pink;
}

.u-media-viewer__icon {
    background-color: pink;
}

.js-fancybox.u-media-viewer{
    filter: grayscale(100%);
    margin: 5px;
}

.js-fancybox.u-media-viewer:hover{
    filter: grayscale(0%);
}

@media (max-width: 767.98px) {
    .u-header--bg-transparent .u-header__navbar-nav {
        background-color: pink;
    }

    #content {
         padding-top: 15px;
    }
}

@media (max-width: 375px) {
    #header.contact {
        height: 100px;
        background-image: url('../images/Header_contact_mobiel.jpg');
    }
    #header.home{
        height: 100px; background-image: url('../images/Header_home_mobiel.jpg');
    }

    #header.exclusive{
        height: 100px; background-image: url('../images/Header_dateexclusive_mobiel.jpg');
    }

    #header.kalender{
        height: 100px; background-image: url('../images/Header_kalender_mobiel.jpg');
    }

    #header.matchingtool{
        height: 100px; background-image: url('../images/Header_matchingtool_mobiel.jpg');
    }

    .profielknop{
        margin-top: 75px;
        margin-right: 0px;
        padding: 15px;
    }

    .loginknop{
        top: 10px; 
        right: 10px;
    }

    #matches {
        text-align: center;
        margin:auto;
        position: fixed;
        right: -150px;	
        bottom: 150px;
        display: table; 
        z-index: 999;
    }

    #matchpijl{
        width: 250px;
    }


}