@font-face {
    font-family: "Bernhard Modern Std Roman";
    src: url("fonts/Bernhard-Modern/Bernhard-Modern.eot");
    src:
            url("fonts/Bernhard-Modern/Bernhard-Modern.eot?#iefix") format("embedded-opentype"),
            url("fonts/Bernhard-Modern/Bernhard-Modern.ttf") format("truetype"),
            url("fonts/Bernhard-Modern/Bernhard-Modern.svg#Bernhard Modern Std Roman") format("svg");
}

@font-face {font-family: "Mutlu Ornamental";
    src: url("fonts/Mutlu-Ornamental/Mutlu-Ornamental.eot");
    src:
            url("fonts/Mutlu-Ornamental/Mutlu-Ornamental.eot?#iefix") format("embedded-opentype"),
            url("fonts/Mutlu-Ornamental/Mutlu-Ornamental.ttf") format("truetype"),
            url("fonts/Mutlu-Ornamental/Mutlu-Ornamental.svg#Mutlu  Ornamental") format("svg");
}

@font-face {font-family: "Shelley Allegro";
    src: url("fonts/Shelley-Allegro/Shelley-Allegro.eot");
    src:
            url("fonts/Shelley-Allegro/Shelley-Allegro.eot?#iefix") format("embedded-opentype"),
            url("fonts/Shelley-Allegro/Shelley-Allegro.ttf") format("truetype"),
            url("fonts/Shelley-Allegro/Shelley-Allegro.svg#Shelley Allegro") format("svg");
}

@font-face {font-family: "Edwardian Script";
    src: url("fonts/Shelley-Allegro/Shelley-Allegro.eot");
    src:
            url("fonts/Edwardian-Script/Edwardian-Script.eot?#iefix") format("embedded-opentype"),
            url("fonts/Edwardian-Script/Edwardian-Script.ttf") format("truetype"),
            url("fonts/Edwardian-Script/Edwardian-Script.svg#Edwardian Script") format("svg");
}

h2, h3, h4{font-weight:bold;}
body{
    font-family:"Bernhard Modern Std Roman",sans-serif!important;
    font-size:16px;
    font-style:normal;
    background-color:rgba(248,247,245,1);}

.container-fluid{padding: 0;margin: 0;}

/*LOGO*/
#logo{position:relative;height:175px;width:200px;margin:0 auto;color:rgba(0,50,94,1);}
#logo span{position:absolute;}
#lettre-J{font-size:3em;top:0;left:0;}
#lettre-esp{font-size:2em;top:30px;left:60px;}
#lettre-G{font-size:3em;top:30px;right:0;}

.Ornamental{font-family:"Edwardian Script",sans-serif!important;text-align:center;}

.cadre{padding:10px;margin:10px;border:rgba(250,250,250,0.1) 1px solid;}
.tabGauche{width:50%;text-align:right;padding-right:10px;}
.tabDroite{width:50%;text-align:left;padding-left:10px;border-left:rgba(250,250,250,0.5) 1px dotted;}

.tab2Gauche{width:10%;text-align:right;padding-right:10px;}
.tab2Droite{width:90%;text-align:left;padding-left:10px;border-left:rgba(250,250,250,0.5) 1px dotted;}


/*MENU*/

.bg-light{background-color:rgba(0,50,94,1)!important;}
.nav-link{color:rgba(248,247,245,1)!important;font-size:20px;}
.nav-link:hover{color:rgba(223,220,175,1)!important;}


.hidden-xs{display:block;}

@media all and (max-width:768px){
    .navbar-expand-md{position:absolute;top:10px;padding:.5rem .5rem;z-index:1;border-radius:3px;font-size:1.5em;}
    .navbar-toggler-icon{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(248,247,245,1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")!important;}
    .nav-link{font-size:26px;}
    .hidden-xs{display:none;}
}




/*IMAGE HOME*/
.jumbotron{
    background:url("images/bg_home_maried.jpg") no-repeat center;
    background-size: cover;
    min-height:450px;
    position: relative;
}

/*COMPTEUR*/
#compteur{font-size:1.5em;margin:0 auto;text-align:center;line-height:35px;}
#compteur span{font-size:1.6em;}
#compteur div{float:left;width:20%;}

@media all and (max-width:768px){
    #compteur{font-size:1em;margin:0 auto;text-align:center;line-height:35px;}
    #compteur span{font-size:1.6em;}
    #compteur div{float:left;width:20%;}
}

.cadrePhoto{
    border:rgba(223,220,175,1) solid 5px;
    border-radius:1px;
}
.color-or{color:rgba(223,220,175,1);}
.color-bleu{color:rgba(0,50,94,1);}

/* Back to top button */
.back-to-top {
    position: fixed;
    display: none;
    background: rgba(0, 0, 0, 0.2);
    color: #fff;
    padding: 6px 12px 9px 12px;
    font-size: 16px;
    border-radius: 2px;
    right: 15px;
    bottom: 15px;
    transition: background 0.5s;
}

@media (max-width: 768px) {
    .back-to-top {
        bottom: 15px;
    }
}


#histoire{text-align:center;background-color:rgba(0,50,94,1); color:rgba(250,250,250,1);position:relative;}
#details{text-align:center;}
#informations{text-align:center;background-color:rgba(0,50,94,1); color:rgba(250,250,250,1);}
#informations a{color:rgba(250,250,250,1);text-decoration:underline;}


.btn-cal{
    background-color:rgba(0,50,94,1);
    margin: 0 auto 10px auto;
    color:white;
}

#rsvp{text-align:center;margin-bottom:50px;}
#rsvp .row{margin-top:25px;}
.input-group input{border:0;font-size:1.6em;border-bottom:1px grey solid;background-color:transparent;border-radius:0;}
.input-group span{border:0;background-color:transparent;}
.btn-rsvp{margin:35px auto;}
.cadre-accompagnant{background-color:rgba(50,50,50,0.1);padding:25px 15px;border-radius:3px;}
.cadre-accompagnant input{background-color: white;}

@media (max-width: 768px) {
    .input-group input{text-align: center;}
}


.back-to-top:focus {
    background: rgba(0, 0, 0, 0.2);
    color: #fff;
    outline: none;
}

.back-to-top:hover {
    background: #2dc997;
    color: #fff;
}