/*! HTML5 Boilerplate v5.0.0 | MIT License | http://h5bp.com/ */
/*@import url('bootstrap-24-cols.css');
@import url('normalize.css');
@import url('fonts.css');
@import url('utility.css');
//@import url('bootstrap-checkbox.css');
@import url('owl.carousel.css');
@import url('owl.theme.css');
@import url('owl.transitions.css');
@import url('svg.css');*/

/* ==========================================================================
	Base styles: opinionated defaults
	========================================================================== */
html {}
::-moz-selection {background: #FFCB05;text-shadow: none;}
::selection {background: #FFCB05;text-shadow: none;}
hr {display: block;height: 1px;border: 0;border-top: 1px solid #ccc;margin: 1em 0;padding: 0;}
audio,
canvas,
iframe,
img,
svg,
video {vertical-align: middle;}
fieldset {border: 0;margin: 0;padding: 0;}
textarea {resize: vertical;}

/* ==========================================================================
	Browser Upgrade Prompt
	========================================================================== */
.browserupgrade {margin: 0.2em 0;background: #ccc;color: #000;padding: 0.2em 0;}

/* ==========================================================================
	Author's custom styles
	========================================================================== */

/*	TAGS	*/
html, body {
    min-height: 100%;
    font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
    /* Le corps du site portait BrandonGrotesque-Medium : sans cette graisse,
       tout le texte retombait en 400 et l'ensemble paraissait délavé. */
    font-weight: 500;
    color: #404041;
}

body {
    line-height: 1.4;
    padding-top: 94px;
}

h1{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';color:#404041;font-size:20px;text-align:center;text-transform: uppercase;padding-bottom:10px;margin-bottom:15px;background:url('/img/h1-underline.svg') no-repeat bottom center;background-size:17px 3px;}
h2{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-size:16px;}
h3{}
h4{}
a{cursor:pointer;}
a:hover{text-decoration:none;}
strong{font-weight:bold;}

/*#wrapper{padding-top:94px;}
@media(max-width:768px){
    #wrapper{padding-top:50px;}
}*/

/* ==========================================================================
    Panel right
    ========================================================================== */
#right-panel{position:fixed;top:0;right:-20%;z-index:99999;height:100%;width:20%;background:#FFCB05;box-shadow:-1px 2px 4px #d1d1d1;opacity:0;}


/* ==========================================================================
    Top navigation
    ========================================================================== */
#main-nav{height:94px;margin-bottom:0;background:#FFCB05;border:none;font-size:11px;z-index:1000;}
#main-nav .logo{height:94px;line-height:94px;}
#main-nav .form{height:94px;padding-top:28px;}
#main-nav .col-sm-24.form{height:auto;padding-top:10px;padding-bottom:10px;}
#main-nav .form .input-group-addon,
#main-nav .form .input-group-btn > .btn{height:33px;padding-top:3px;padding-bottom:3px;background:#ffffff;border:none;}
#main-nav .form .input-group-btn > .btn{border-radius:0 10px 10px 0;padding-left:3px;padding-right:12px}
#main-nav .form .input-group-btn > .btn span{color:#d0d2d3;font-size:11px;}
#main-nav .form .input-group-btn > .btn:hover span{color:#a1a4a5;}
#main-nav .form .input-group-addon{border-radius:10px 0 0 10px;padding-left:10px;padding-right:5px;}
#main-nav .form .form-control{height:33px;padding-left:8px;padding-right:8px;background:#ffffff;border:none;border-left:1px solid #6f6f6f;font-size:11px;}
#main-nav .form .form-control:focus{box-shadow:inherit;border-left:1px solid #ffc000;}
#main-nav .custom-nav-bar{position:relative;}
#main-nav .custom-nav-bar ul{margin-left:0;margin-bottom:0;padding-top:0;text-transform:uppercase;}
#main-nav .custom-nav-bar ul > li{height:94px;line-height:87px;padding-left:0;padding-right:0;border-top:5px solid #FFCB05;border-bottom:5px solid #FFCB05;}
#main-nav .custom-nav-bar ul > li .glyphicon-home{margin-right:10px;}
#main-nav .custom-nav-bar ul > li.divider{width:3px;padding:0;}
    #main-nav .custom-nav-bar ul > li.divider svg *{fill:#404041}
#main-nav .custom-nav-bar ul > li.avatar{}
#main-nav .custom-nav-bar ul > li.avatar img{margin-right:5px;}
#main-nav .custom-nav-bar ul > li > a{display:inline-block;width:100%;padding-left:36px;padding-right:36px;height:84px;color:#404041;}
#main-nav .custom-nav-bar ul > li > a.btn-smile{background-position:32px 44px;background-size:14px 13px;}
#main-nav .custom-nav-bar ul > li > a:hover{background-color:#ffc000;color:#444444;}
#main-nav .custom-nav-bar ul > li.avatar button.img-circle{width:54px;height:54px;border:4px solid #ffffff;background-repeat: no-repeat;background-position: center center;background-size: cover;vertical-align: middle}
#main-nav .custom-nav-bar ul > li.avatar button:hover.img-circle{border:4px solid #000000;background-size: 120%;}
#main-nav .custom-nav-bar ul > li.active{color:#444444;border-top:5px solid #ffba00;border-bottom:5px solid #ffba00;}
#main-nav .custom-nav-bar ul li.add-item a svg{width:52px;}

#main-nav .custom-nav-bar ul li.add-item a:hover svg#svg-menu-add-item .st0{fill:#ffba00;}
#main-nav .custom-nav-bar ul li.add-item a:hover svg#svg-menu-add-item .st1{fill:#404041;}
#main-nav .custom-nav-bar ul li.add-item a:hover svg#svg-menu-add-item .st2{fill:#ffba00;stroke:#FFFFFF;stroke-miterlimit:10;}
#main-nav .custom-nav-bar ul li.add-item a:hover svg#svg-menu-add-item .st3{fill:#FFFFFF;}

#desktop-menu{background:#feda6c;width:186px;height:auto;max-height:100vh;overflow:auto;position:fixed;top:-100vh;left:0;z-index:990;font-size:11px;padding-top:94px;}
    #desktop-menu ul{background:#feda6c;color:#231f20;margin:0;}
        #desktop-menu ul li{width:100%;height:40px;line-height:40px;margin:0 auto;text-transform:uppercase;margin:0;padding:0;}
            #desktop-menu ul li a{display:block;width:100%;height:100%;color:#231f20;padding-left:20px;}
            #desktop-menu ul li a:hover{background:#ffba00;}
        #desktop-menu ul li.divider{width:25%;height:1px;margin:0 0 0 20px;border-bottom:1px dashed #231f20;}
        #desktop-menu ul li.add-item{background:#231f20;color:#feca30;}
        #desktop-menu ul li.logout{}
        #desktop-menu ul li.logout a span{display:none;}
            #desktop-menu ul li.logout a{color:#feca30;background:#231f20;}
            #desktop-menu ul li.logout a:hover{color:#ffffff;background:#000000;}
                #desktop-menu ul li.logout a:hover span{display:inline-block;margin-left:10px;}

@media(max-width:768px) {
    #desktop-menu {
        display: none;
    }
}

@media(min-width:768px) {

    #desktop-menu {
        margin-right:-490px;
        display: block;
    }
    /*#my-list {
        padding-top: 44px !important;
    }*/
    #main-nav .custom-nav-bar ul > li > a {
        padding-left: 32px;
        padding-right: 32px;
    }
}

@media(max-width:992px) {

    #homepage-header{
        height:auto !important;
        padding-bottom:110px
    }
    .stars{
        display:none;
        opacity: 0 !important;
    }
    .logo, .logo img{
        position:relative !important;
        width:90% !important;
        left:0 !important;
        height:auto !important;
        top: 0 !important;
        margin: 20px 0 20px 5% !important;
    }
    .mister-happylist{
        display:none !important;
    }
    .col-xs-12 {
        width: 100%;
    }
    .user-details .avatar {
        width: 100%;
    }
    .user-details {
        height: auto !important;
    }
    .btn-share{
        display:block;
    }
    .user-details .info .edit {
        text-align: right;
    }
    .white-bullet-border {
        background: none;
    }
}

/* Horizontal iPad */
@media(min-width:992px) {
    #main-nav .custom-nav-bar ul > li > a {
        padding-left: 14px;
        padding-right: 14px;
    }

    .item.square span.yellow-hyphen,
    .item.square .description {
        display: none;
    }
}

@media(min-width:1200px){
    /*#desktop-menu{margin-right:-430px;}*/
    .item.square span.yellow-hyphen,
    .item.square .description {
        display: inline-block;
    }
}


#mobile-nav{background:#FFCB05;border:none;font-size:11px;}
    /*#mobile-nav .btn-open{position:absolute;top:0;right:0;background:#404041;height:10px;width:10px;padding:5px 10px;border-radius:4px;margin:8px 15px 8px 0;border:1px solid #404041;}*/
    #mobile-nav .btn-open{background: #404041 none repeat scroll 0 0;
        border: 1px solid #404041;
        border-radius: 4px;
        height: 30px;
        margin: 8px 15px 8px 0;
        padding: 8px 10px;
        position: absolute;
        right: 0;
        top: 0;
        width: 40px;}
    /*#mobile-nav .btn-open .icon-bar{display:block;width:16px;height:1px;margin-bottom:2px;background:#ffffff;}*/
    #mobile-nav .btn-open .icon-bar{background: #ffffff none repeat scroll 0 0;
        display: block;
        height: 1px;
        margin: 0 auto 4px;
        width: 16px;}

#mobile-nav .btn-close{display:none;position:absolute;top:0;right:0;background:#404041;padding:5px 10px;border-radius:4px;margin:8px 15px 8px 0;border:1px solid #404041;}
    #mobile-nav .btn-close svg{width:16px;}
        #mobile-nav .btn-close svg *{stroke:#ffffff;}

    #mobile-nav .navbar-brand{padding-top:3px;padding-bottom:0;}
        #mobile-nav .navbar-brand svg{width:120px;}

#mobile-menu{background:#FFCB05;width:0;max-width:240px;height:auto;max-height:100vh;overflow:auto;position:fixed;top:50px;right:0;z-index:1000;}
    #mobile-menu ul{background:#feda6c;color:#231f20;margin:0;}
        #mobile-menu ul li{width:100%;height:40px;line-height:40px;margin:0 auto;padding-left:20px;text-transform:uppercase}
            #mobile-menu ul li a{color:#231f20;}
        #mobile-menu ul li.divider{width:25%;height:10px;margin:0 0 10px 20px;border-bottom:1px dashed #231f20;}
        #mobile-menu ul li.add-item{background:#231f20;color:#feca30;}
        #mobile-menu ul li.logout{background:#231f20;}
            #mobile-menu ul li.logout a{color:#feca30;}

@media(min-width:992px){
    #mobile-menu{display:none;}
}

/* ==========================================================================
    Next happydays
    ========================================================================== */
#next-happydays{position:relative;padding-top:14px;}
#next-happydays .next-happyday{margin-top:20px;}
#next-happydays .next-happyday a{color:#404041;}
#next-happydays .next-happyday .avatar{position:relative;text-align:center;margin-bottom:13px;height:170px;}
#next-happydays .next-happyday .avatar img{width:170px;height:170px;border:4px solid #ffffff;position:absolute;top:0;left:50%;margin-left:-85px;}
#next-happydays .next-happyday a:hover .avatar img{border:4px solid #ffc000;}
#next-happydays .next-happyday .crown{position:absolute;top:0;left:50%;z-index:0;width:41px;height:38px;margin-left:-90px;background:url('/img/crown.svg') no-repeat center center;background-size:contain;}

#next-happydays .next-happyday .count{position:absolute;top:10px;right:50%;z-index:2;width:70px;height:70px;margin-right:-110px;padding-top:8px;border-radius:35px;border:4px solid #ffffff;background:#ffcb05;text-align:center;}
#next-happydays .next-happyday .count span{display:block;width:100%;line-height:16px;}
#next-happydays .next-happyday a:hover .count{border:4px solid #404041;}
#next-happydays .next-happyday .count .in,
#next-happydays .next-happyday .count .days{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:400;font-size:12px;text-transform:uppercase;}
#next-happydays .next-happyday .count .days-count{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:800;font-size:23px;}

#next-happydays .next-happyday .user-name {
    margin-bottom:4px;
    font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:800;
    color:#404041;
    font-size:14px;
    text-align:center;
    text-transform:uppercase;
}

#next-happydays .next-happyday .user-name span {
    color: #FFCB05;
}

#next-happydays .see-calendar{position:absolute;bottom:15px;left:0;z-index:2;width:100%;height:auto;text-align:center;}
#next-happydays .background-white{height:30px;margin-top:45px;}

#next-happydays .hover-avatar{
	display:none;
	position:absolute;
	width:170px;
	height:170px;
	top:0;
	left:50%;
	margin-left:-85px;
	border-radius:50%;
	background-color:#ffc000;
	line-height:170px;
}
#next-happydays a:hover .hover-avatar{ 
	display:block;
}
#next-happydays .birthday-date-hover{
	display:inline-block;
	position:relative;
	text-align:center;
	line-height:normal;
	vertical-align:middle;
}
#next-happydays .birthday-age{
	display: block;
    text-align: center;
    position: relative;
    font-size: 24px;
    text-transform: uppercase;
    margin: 0;
    padding: 0;
    line-height: 17px;
    font-weight: bold;
}
#next-happydays .birthday-date{
	display: block;
    text-align: center;
    position: relative;
    font-size: 12px;
    text-transform: uppercase;
    margin: 0;
    padding: 0;
    line-height: 23px;
}

@media(max-width:1200px){
    #next-happydays .next-happyday .crown{}
    #next-happydays .next-happyday .count{margin-right:-100px;}
}
@media(max-width:992px){
    #next-happydays .next-happyday .crown{margin-left:-80px}
    #next-happydays .next-happyday .count{margin-right:-110px;}
    /*#next-happydays .next-happyday .avatar img{width:140px;}*/
}
@media(max-width:768px){
    #next-happydays .next-happyday .crown{margin-left:-90px;}
    #next-happydays .next-happyday{margin-bottom:40px;}
    /*#next-happydays .next-happyday .count{top:inherit;right:0;margin-right:0;bottom:0;}*/
    /*#next-happydays .next-happyday .avatar img{max-width:140px;}*/
}

/* ==========================================================================
    Last friends update
    ========================================================================== */
#last-friends-update {
    position: relative;
}
#last-friends-update .friend-update{margin-top:18px;padding-bottom:35px;}
#last-friends-update .friend-update .avatar{position:absolute;bottom:0;left:50%;z-index:3;width:70px;margin-left:-35px;border:4px solid #ffffff;opacity:0;border-radius:35px;}
#last-friends-update .friend-update .avatar img{border:4px solid #FFCB05;}

/* ==========================================================================
    Item management
    ========================================================================== */
.item {
    position: relative;
    overflow: hidden;
    background: no-repeat bottom center;
    background-size: cover;
    /*border: 1px dashed #ced2d1;*/
    /*opacity: 0;*/
    margin-top: 15px;
    margin-bottom: 15px;
    padding-bottom: 10px;
    padding-left: 0px;
    padding-right: 0px;
}

.item .reserved,
.item .myreserved,
.item .myoffered,
.item .offered,
.item .self-offered,
.item .details {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.7);
    color: #ffffff;
    transition: top 0.3s;
    -webkit-transition: top 0.3s;
    top: 400px;
    /*padding-top: 20px;*/
    padding: 5px;
    margin-left: 0;
    margin-right: 0;
    /*z-index: 1;
    left: 7.5px;*/
}

.item:hover .details {
    top: 0px;
}

.item:hover div.pinned {
    right: -25px;
    transition: right .2s;
    -webkit-transition: right .2s ease;
}

.item:hover div.second-hand {
    left: -25px;
    transition: left .2s;
    -webkit-transition: left .2s ease;
}

.item:hover div.virtual {
    left: -25px;
    transition: left .2s;
    -webkit-transition: left .2s ease;
}

.item .details .delete-item {
    /*position: absolute;*/
    z-index:30;
    /*top: 5px;
    right: 36px;*/
    width: 26px;
    height: 26px;
    border-radius: 50%;
    opacity: 0.5;
    background: rgba(238,64,54,0);
    float: right;
    margin-left: 3px;
}

.item .details .delete-item:hover {
    opacity: 1;
    background-color: rgba(238,64,54,1);
}

.item .details .delete-item svg#svg-trash-bin {
    width: 14px;
    margin-left: 6px;
    margin-top: 3px;
    opacity: 0.5;
}

.item .details .delete-item svg#svg-trash-bin * {
    fill:#ffffff;
    stroke: none;
}

.item .details .delete-item:hover svg#svg-trash-bin {
    opacity:1;
}

.item .details .edit-item {
    /*position: absolute;*/
    z-index: 30;
    /*top: 5px;
    right: 5px;*/
    width: 26px;
    height: 26px;
    border-radius: 50%;
    opacity: 0.5;
    background: rgba(255,203,5,0);
    float: right;
    margin-left: 3px;
}

.item .details .edit-item:hover {
    opacity:1;
    background-color:rgba(255,203,5,1);
}

.item .details .edit-item svg#svg-yellow-pencil {
    width: 16px;
    margin-left: 5px;
    margin-top: 2px;
    opacity: 0.5;
}

.item .details .edit-item svg#svg-yellow-pencil * {
    fill:#ffffff;
}

.item .details .edit-item:hover svg#svg-yellow-pencil {
    opacity:1;
}

.item .details .relist-item {
    /*position: absolute;*/
    z-index: 30;
    /*top: 5px;
    right: 5px;*/
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background-color: rgba(255,203,5,0);
    float: right;
    margin-left: 3px;
    opacity: 0.3;
}

.item .details .relist-item svg {
    width: 26px;
    fill: #FFFFFF;
}
.item .details .relist-item:hover {
    opacity:1;
    background-color: rgba(255,203,5,1);
}
.item .details .relist-item svg#svg-yellow-pencil {
    width:12px;
    margin-left:6px;
    margin-top:4px;
    opacity:0.2;
}
.item .details .relist-item svg#svg-yellow-pencil * {
    fill:#ffffff;
}
.item .details .relist-item:hover svg#svg-yellow-pencil {
    opacity:1;
}

/* Like button */

.item .details .like-item {
    position: absolute;
    z-index: 30;
    top: 5px;
    right: 35px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    opacity: 0.8;
    background-color: rgba(255,203,5,0);
}

.item .details .like-item svg {
    fill: #ffffff;
}

.item .details .like-item:hover {
    opacity: 1;
    animation: pulse .6s linear;
}

@keyframes pulse {
    50% {
        transform: scale(1.1);
    }
}

.item .details .like-item:hover svg,
.item .details .like-item.liked svg {
    fill: #F90101;
}

/* Pin button */

.item .details .pin-item {
    /*position: absolute;*/
    z-index: 30;
    /*top: 5px;
    right: 67px;*/
    width: 26px;
    height: 26px;
    border-radius: 50%;
    opacity: 0.3;
    background-color: rgba(255,203,5,0);
    float: right;
    margin-left: 3px;
}

.item .details .pin-item svg {
    fill: #ffffff;
    /*opacity: 0.9;*/
    width: 20px;
    margin-left: 3px;
}

.item .details .pin-item:hover,
.item .details .pin-item.active {
    opacity: 1;
}

.item .details .pin-item:hover svg,
.item .details .pin-item.active svg {
    fill: #FFCB05;
}

.item .details .pin-item:hover,
.item .details .pin-item.active {
    opacity:1;
    background-color: gray; /*rgba(238,64,54,1);*/
}

/* Virtual button */

.item .details .virtual {
    position: absolute;
    z-index: 30;
    top: 5px;
    left: 5px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    opacity: 1;
    background-color: rgba(255,203,5,0);
    cursor: help;
}

/* Second hand button */

.item .details .second-hand {
    z-index: 30;
    left: 5px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    opacity: 1;
    background-color: rgba(255,203,5,0);
    cursor: help;
    float: left;
    margin-right: 3px;
}

.item .details .second-hand svg {
    fill: #FACB1B;
}

/* Pinned */

.item .details .pinned {
    z-index: 30;
    left: 5px;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    opacity: 1;
    background-color: rgba(255,203,5,0);
    cursor: help;
    float: left;
    margin-right: 3px;
}

.item .details .pinned svg {
    fill: #FACB1B;
}

/* */

.item .details .description,
.item .details .price, .item .myreserved .price {
    font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
    font-weight:400;
    font-size:14px;
    text-align:center;
}

.item .myreserved .price{color:#fff;}
.item .details .description{margin-bottom:15px;}
.item .details .price{margin-bottom:16px;}
.item .details .cta{height:32px;margin-bottom:5px;text-align:center;text-transform:uppercase;}
.item .details .cta a{color:#FFCB05}
.item .details .cta a:hover{color:#ffc000}

.item .details .cta a.active{background-color:#FFCB05}
.item .details .cta a.active{color:#404041}

.item .details .cta a.btn-yellow{color:#404041}
.item .details .cta a.btn-yellow:hover{color:#000000}
.item .details small a{color:#FFCB05}
.item .details small a:hover{color:#ffc000}

/* My list */
.item .bought,
.item .received {
    top: 0;
    /*color: #404041;*/
}

/* Friend list */
.item .reserved,
.item .myoffered,
.item .offered,
.item .self-offered {
    top: 0;
    color: #404041;
}

.item .myreserved,
.item .myoffered {
    top: 0;
    color: #fff;
}

.item .reserved,
.item .offered {
    background:rgba(255,203,5,0.7);
}

.item .myreserved,
.item .myoffered {
    background: rgba(255,115,0,0.8);
}

/*.item .offered {
    background:rgba(187,189,191,0.7);
}*/


.item .self-offered{background:rgba(187,189,191,0.7);}
.item .reserved h2.background-smile,
.item .myreserved h2.background-smile,
.item .offered h2.background-smile,
.item .self-offered h2.background-smile {
    height:100px;
    background-position: 50px 20px;
    background-size:38px 28px;
}


/* ==========================================================================
    USER DETAILS
    ========================================================================== */
.user-details {
    margin-top:15px;
    margin-bottom:15px;
    padding-bottom:10px;
}
.user-details .avatar{text-align: center;padding-top:18px;}
.user-details .avatar p> a.img-circle{display:inline-block;width:170px;height:170px;margin:0 auto;border:4px solid #FFCB05;border-radius:50%;background-repeat:no-repeat;background-position:center center;background-size:cover;}
.user-details .avatar p> a:hover.img-circle{border:4px solid #404041;background-size:120%;}

.user-details .avatar .first-name,
.user-details .avatar .last-name,
.user-details .avatar .user-name {
    margin:0;
    font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:800;
    font-size:20px;
    line-height: 20px;
    text-transform:uppercase
}

.user-details .avatar .first-name{margin-top:8px;}

.user-details .avatar .first-name span {
    color: #FFCB05;
}

.user-details .avatar .counter {
    display: flex;
    justify-content: space-between;
    /* Ce bloc tient dans une demi-colonne d'environ 270 pixels. La pile système
       étant plus large que Brandon, les trois compteurs n'y tenaient plus : ils
       se touchaient, puis — avec un flex-wrap mal avisé — passaient à la ligne.
       Une taille légèrement réduite les fait tenir sur une ligne, sans se
       toucher, et ne dépend plus de la largeur de la police. */
    gap: 8px;
    flex-wrap: nowrap;
    font-size: 12px;
    list-style: none;
    padding-left: 0;
    margin-top: -5px;
}

.user-details .avatar .counter li { white-space: nowrap; }

.user-details .info{padding-top:18px;}
.user-details .info h2{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:800;font-size:16px;line-height:16px;text-transform:uppercase;margin:0;}
.user-details .info h3{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:400;font-size:12px;line-height:12px;text-transform:uppercase;margin:0 0 8px;}

.user-details .info .last_update {
    font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:400;
    font-size: 12px;
    line-height: 12px;
    text-transform: uppercase;
    margin: 0 0 8px;
}

.user-details .info .edit{margin-bottom:35px;}
.user-details .info .edit a{text-transform:uppercase;font-size:9px;font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:400;color:#66686a}
.user-details .info .edit a:hover{color:#FFCB05}
.user-details .info .edit a span{display:inline-block;margin-right:8px;border-bottom:1px solid #66686a;}
.user-details .info .edit a:hover span{border-bottom:1px solid #FFCB05;}
.user-details .info .edit a svg{}
.user-details .info .edit a svg *{fill:#66686a}
.user-details .info .edit a:hover svg *{fill: #FFCB05;}
.user-details .info .presa{margin-top:8px;font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:400;font-size:14px;}
.user-details .info .presa p{margin:0;}
.user-details .info .presa hr{width:90%;margin:19px auto 17px;border:none;border-top:1px solid #a6a8ab;}


/* ==========================================================================
    My list
    ========================================================================== */
#my-list{padding-top:15px;}
#my-list a .search{position:relative;margin-top:15px;margin-bottom:15px;padding-bottom:10px;background:#FFCB05;opacity:0;text-align:center;}
#my-list a:hover .search{background:#ffc000}
#my-list a .search svg{width:160px;margin-top:24px;}
#my-list a:hover .search svg{width:170px;margin-top:19px;}
#my-list a .search h2{position:absolute;bottom:15px;width:100%;font-size:18px;}

/* ==========================================================================
    Friend list
    ========================================================================== */
#friend-list{padding-top:15px;}
#friend-list .friend-info{margin-top:15px;margin-bottom:15px;padding-bottom:35px;}


/* ==========================================================================
    Happylisters list
    ========================================================================== */
#happylisters{position:relative;padding-top:14px;}
#happylisters .user-details{margin-top:0;margin-bottom:0;}
@media(max-width:992px){
    #happylisters .user-details,
    #happylisters .mail-invite-wrapper,
    #happylisters .facebook-invite-wrapper{margin-bottom:25px;}
}
#happylisters .user-details .avatar{padding-top:0;}
#happylisters .user-details .avatar .first-name,
#happylisters .user-details .avatar .last-name{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:500;font-size:14px;line-height: 18px;}
#happylisters .user-details .avatar .last-name{margin-bottom:15px;}


.user-details.to-follow .avatar p> a.img-circle{border:4px solid #66686a;position:relative;}
.user-details.to-follow .avatar p> a.img-circle .overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#66686a;opacity:0.5;border-radius:50%;}
.user-details.to-follow .avatar p> a:hover.img-circle{border:4px solid #505356;background-size:120%;}
.user-details.to-follow .avatar p> a:hover.img-circle .overlay{opacity:0;}


.facebook-invite{position:relative;background:#c9d2e6;border-radius:8px;height:320px;}
.facebook-invite p{position:absolute;bottom:15px;width:100%;}
.facebook-invite a{text-align:center;color:#4f6caa;}
    .facebook-invite a #svg-facebook-invite{max-width:170px;margin:20px auto 45px;}
.facebook-invite a:hover{color:#44609d;}
    .facebook-invite a:hover #svg-facebook-invite{max-width:180px;margin-top:15px;}
    .facebook-invite a:hover #svg-facebook-invite .st0{fill:#44609d;stroke:#44609d;stroke-width:4;stroke-miterlimit:10;}
    .facebook-invite a:hover #svg-facebook-invite .st1{fill:#ffc000;stroke:#424142;stroke-width:6;stroke-miterlimit:10;}



.mail-invite{position:relative;background:#dedede;border-radius:8px;height:320px;}
.mail-invite p{position:absolute;bottom:15px;width:100%;}
.mail-invite a{text-align:center;color:#878787;}
.mail-invite a #svg-mail-invite{max-width:170px;margin:20px auto 45px;}
.facebook-invite a:hover{color:#717171;}
    .mail-invite a:hover #svg-mail-invite{max-width:180px;margin-top:15px;}






/* ==========================================================================
    Calendar
    ========================================================================== */
#calendar{}
    #calendar .month-list{}
        #calendar .month-list li{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:500;font-size:14px;line-height: 18px;text-transform:uppercase;}
            #calendar .month-list li > a{color:#404041;}
        #calendar .month-list li.active{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:800;}
        #calendar .month-list li.empty{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:500;font-size:14px;line-height: 18px;color:#cccccc;}
        #calendar .month-list li.divider{padding-bottom:20px;margin-bottom:20px;border-bottom:2px dashed #d0d2d3;}
    #calendar .month{padding-bottom:20px;margin-bottom:20px;border-bottom:2px solid #404041;}
        #calendar .month h2{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:800;font-size: 20px;text-transform: uppercase;}
        #calendar .month .darkgray-hyphen{width:22px;height:7px;}
        #calendar .month .days{padding-bottom:20px;margin-bottom:20px;border-bottom:2px dashed #d0d2d3;}
            #calendar .month .days .day{padding-top:80px;}
                #calendar .month .days .day .day-of-the-week{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:400;font-size: 12px;text-transform: uppercase;text-align:center;margin:0;padding:0;line-height:1;}
                #calendar .month .days .day .date{font-size: 62px;text-align:center;margin:0;padding:0;line-height:1;}
            #calendar .month .user-details{padding-bottom:0;margin-top:0;}
                #calendar .month .user-details .avatar{padding-top:0;}
                    #calendar .month .user-details .avatar p>a.img-circle{width:100px;height:100px;}
                    #calendar .month .user-details .user-name{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:800;font-weight:800;font-size: 14px;}
                    #calendar .month .user-details .user-event{font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:500;font-size:14px;text-transform: uppercase}



/* ==========================================================================
    Main footer
    ========================================================================== */
#main-footer{margin-top:50px;margin-bottom:25px;}
#main-footer .border-top{letter-spacing:1px;line-height:18px;padding-top:22px;border-top:2px solid #e4e4e6;font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:400;font-size:12px;text-transform:uppercase;color:#a6a8ab;}
#main-footer .border-top a{color:#a6a8ab;}
#main-footer .border-top a:hover{color:#FFCB05;}
    #main-footer .border-top a img{vertical-align: top;}

/* ==========================================================================
    Modal add item
    ========================================================================== */
#modal-add-item .modal-dialog{width:420px;}
#modal-add-item .item{opacity:1;border:inherit;margin-top:inherit;margin-bottom:inherit;padding-bottom:inherit;}
#modal-add-item .owl-carousel{border:1px solid #eff0f1;padding:15px;}
#modal-add-item .prev,
#modal-add-item .next{padding-top:45px;}
#modal-add-item .prev a,
#modal-add-item .next a{font-size:30px;color:#404041;}
#modal-add-item .prev a:hover,
#modal-add-item .next a:hover{color:#333333;}
#modal-add-item .edit{font-size:14px;text-transform:uppercase;margin-bottom:0;}
    #modal-add-item .edit a{display:inline-block;margin-left:10px;}
        #modal-add-item .edit a img{vertical-align:baseline}
#modal-add-item .link{margin-bottom:0;}
    #modal-add-item .link a{font-size:14px;color:#bbbdbf;}
#modal-add-item .darkgray-hyphen{height:1px;}
#modal-add-item .description{font-size:14px;color:#404041;}

/* ==========================================================================
    Modals
    ========================================================================== */
    #modal .user-details{margin:0;padding:0;}
        #modal .user-details .avatar{padding:0;}


/* ==========================================================================
	Helper classes
	========================================================================== */


/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */

.visuallyhidden {border: 0;clip: rect(0 0 0 0);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;width: 1px;}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {clip: auto;height: auto;margin: 0;overflow: visible;position: static;width: auto;}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {visibility: hidden;}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *	`contenteditable` attribute is included anywhere else in the document.
 *	Otherwise it causes space to appear at the top and bottom of elements
 *	that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *	`:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {content: " "; /* 1 */display: table; /* 2 */}

.clearfix:after {clear: both;}



/* ==========================================================================
	EXAMPLE Media Queries for Responsive Design.
	These examples override the primary ('mobile first') styles.
	Modify as content requires.
	========================================================================== */

@media (min-width:480px ) and (max-width:767px){
    /*.col-xs-12.product-fade{
        max-width:50%;
    }*/
}

@media (min-width: 768px){
}
@media (min-width: 992px){

}

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
(-o-min-device-pixel-ratio: 5/4),
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
	Print styles.
	Inlined to avoid the additional HTTP request:
	http://www.phpied.com/delay-loading-your-print-css/
	========================================================================== */

@media print {
    *,*:before,*:after {	background: transparent !important;	color: #000 !important; /* Black prints faster:	http://www.sanbeiji.com/archives/953 */	box-shadow: none !important;	text-shadow: none !important;}
    a,a:visited {	text-decoration: underline;}
    a[href]:after {	content: " (" attr(href) ")";}
    abbr[title]:after {	content: " (" attr(title) ")";}
    /* * Don't show links that are fragment identifiers, * or use the `javascript:` pseudo protocol */
    a[href^="#"]:after,a[href^="javascript:"]:after {	content: "";}
    pre,blockquote {	border: 1px solid #999;	page-break-inside: avoid;}
    /* * Printing Tables: * http://css-discuss.incutio.com/wiki/Printing_Tables */
    thead {	display: table-header-group;}
    tr,img {	page-break-inside: avoid;}
    img {	max-width: 100% !important;}
    p,h2,h3 {	orphans: 3;	widows: 3;}
    h2,h3 {	page-break-after: avoid;}
}

/* Algolia powered search engine */

.algolia-autocomplete {
    width: 100%;
}
.algolia-autocomplete .aa-input,
.algolia-autocomplete .aa-hint {
    width: 100%;
    margin: 0px;
    padding: 8px 12px;
    border: 2px solid #ccc;
    outline: none;
}
.algolia-autocomplete .tt-input:focus {
    border: 2px solid #FFCB05;
}
.algolia-autocomplete .aa-hint {
    color: #999;
}
.algolia-autocomplete .aa-dropdown-menu {
    width: 100%;
    padding: 0;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-top: 0px;
}
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion {
    text-align: left;
    padding: 4px 8px;
    font-size: 18px;
    line-height: 24px;
}
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion.aa-cursor {
    color: #fff;
    background-color: #FFCB05;
}
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion em {
    font-weight: bold;
    font-style: normal;
}
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion .hit {
    color: #404041;
    font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:500;
    font-size: 14px;
    line-height: 18px;
    text-transform: uppercase;
}
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion .hit img {
    margin-right: 5px;
}
.algolia-autocomplete .aa-dropdown-menu .aa-suggestion a.hit {
    display: block;
}

/* Parrainage */

/*h2 {
    font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
    color: #404041;
    font-size: 20px;
    text-align: center;
    text-transform: uppercase;
    padding-bottom: 10px;
    margin-bottom: 15px;
    background: url('/img/h1-underline.svg') no-repeat bottom center;
    background-size: 17px 3px;
}*/

#zone-parrainage{
    display:block;
    position:relative;
    text-align:center;
}
#block-parrainage{
    display:inline-block;
    position:relative;
    width:100%;
    max-width:556px;
}
#block-content-parrainage{
    display: table;
    width: 100%;
    position: relative;
    background-color: #FCF8E2;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding:50px 35px 20px;
    margin-top: -18px;
    z-index: 1;
}
#block-footer-parrainage{
    display:block;
    position:relative;
    background-color:#F9EBB2;
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;
    padding:6px;
}
.black{
    font-weight:900;
}
#titre-parrainge {
    display: inline-block;
    position: relative;
    background-color: #FFCB05;
    font-size: 23px;
    font-weight: 400;
    color: #404041;
    z-index: 2;
}
#titre-parrainge:before {
    content: '';
    display: block;
    position: absolute;
    height: 50px;
    width: 42px;
    background-image: url('/img/parrainage-bandeau-cote-gauche.svg');
    z-index: 1;
    bottom: -15px;
    left: -30px;
}
#titre-parrainge:after {
    content: '';
    display: block;
    position: absolute;
    height: 50px;
    width: 42px;
    background-image: url('/img/parrainage-bandeau-cote-droit.svg');
    z-index: 1;
    bottom: -15px;
    right: -30px;
}
#texte-titre-parrainge{
    display: inline-block;
    position: relative;
    background-color: #FFCB05;
    padding: 10px 20px;
    font-size: 23px;
    font-weight: 400;
    color: #404041;
    z-index: 3;
}
.numero-etape{
    display:block;
    position:relative;
    font-size:25px;
    color:#fff;
    width:36px;
    height:36px;
    left:50%;
    margin-left:-18px;
    line-height:36px;
    text-align:center;
    border-radius:50%;
    text-shadow: 3px 3px 4px rgba(150, 150, 150, 0.5);
    z-index:2;
}
#etape1{
    background-color:#EC778E;
}
#etape2{
    background-color:#7AC8D1;
}
#etape3{
    background-color:#FFCB05;
}
input.input-parrainage {
    width: 100%;
    margin-top: 10px;
    border:solid 1px #E6E7E8;
    border-radius:4px;
    padding: 2px 5px;
    color:#66686A;
    text-align:center;
    font-size: 12px;
    line-height: 20px;
}
#block-parrainage .col-sm-4 {
    padding: 0 8px;
}
.parrainage-content-col{
    padding:10px 0;
}
.parrainage-facebook{
    font-weight:900;
    text-decoration:underline;
    color:#3B5998;
}
.parrainage-mail{
    font-weight:900;
    text-decoration:underline;
    color:#404041;
}
/*#parrainage-col3 {
    padding: 0;
    margin-top: -28px;
    position: relative;
    z-index: 1;
}*/
#parrainage-col3 img {
    max-width: 230px;
}

@media (min-width: 768px){
    span#etape1:after {
        content: '.......................................................................';
        display: block;
        width: 104px;
        color: #BBBDBF;
        top: -5px;
        position: absolute;
        right: -115px;
        letter-spacing: 0px;
        overflow: hidden;
        font-size: 18px;
        z-index: 3;
        text-shadow:none;
    }
    span#etape2:after {
        content: '.......................................................................';
        display: block;
        width: 60px;
        color: #BBBDBF;
        top: -5px;
        position: absolute;
        right: -70px;
        letter-spacing: 0px;
        overflow: hidden;
        font-size: 18px;
        z-index: 3;
        text-shadow: none;
    }
}

/*ETOILES*/
#block-parrainage:after {
    content: '';
    display: block;
    position: absolute;
    width: 16px;
    height: 18px;
    top: 221px;
    left: 19px;
    background-image: url('/img/parrainage-etoile.svg');
    z-index: 3;
}
#block-parrainage:before {
    content: '';
    display: block;
    position: absolute;
    width: 16px;
    height: 18px;
    top: 60px;
    right: 19px;
    background-image: url('/img/parrainage-etoile.svg');
    z-index: 2;
    -ms-transform: rotate(-80deg); /* IE 9 */
    -webkit-transform: rotate(-80deg); /* Safari */
    transform: rotate(-80deg);
}
#parrainage-col1:before {
    content: '';
    display: block;
    position: absolute;
    width: 12px;
    height: 14px;
    top: -15px;
    left: 50px;
    background-image: url('/img/parrainage-etoile.svg');
    z-index: 2;
    -ms-transform: rotate(40deg); /* IE 9 */
    -webkit-transform: rotate(40deg); /* Safari */
    transform: rotate(40deg);
}
#parrainage-col1:after {
    content: '';
    display: block;
    position: absolute;
    width: 27px;
    height: 30px;
    top: 15px;
    right: 19px;
    background-image: url('/img/parrainage-etoile.svg');
    z-index: 2;
    -ms-transform: rotate(10deg); /* IE 9 */
    -webkit-transform: rotate(10deg); /* Safari */
    transform: rotate(10deg);
}
#parrainage-col2:before {
    content: '';
    display: block;
    position: absolute;
    width: 12px;
    height: 14px;
    top: -10px;
    right: 19px;
    background-image: url('/img/parrainage-etoile.svg');
    z-index: 2;
    -ms-transform: rotate(-80deg); /* IE 9 */
    -webkit-transform: rotate(-80deg); /* Safari */
    transform: rotate(-80deg);
}

/* Codrops Input file - http://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/ */

.js .inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.no-js .inputfile + label {
    display: none;
}

/* Onboarding popup */

#modal-friends-onboarding .user-details {
    margin-bottom: 0px;
}
#modal-friends-onboarding .user-details .avatar {
    padding-top: 0px;
}
#modal-friends-onboarding .user-details .avatar .first-name,
#modal-friends-onboarding .user-details .avatar .last-name {
    font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';font-weight:500;
    font-size: 14px;
    line-height: 18px;
}
#modal-friends-onboarding .user-details .avatar .last-name {
    margin-bottom:15px;
}

/* VueJS transitions */

/* always present */
.expand-transition {
    opacity: 1;
}

/* .expand-enter defines the starting state for entering */
/* .expand-leave defines the ending state for leaving */
.expand-enter, .expand-leave {
    transition: all 0.4s ease-out;
    opacity: 0;
}



.shop h1 img {
    width: 64px;
}


/*.awning * {
    box-sizing: content-box;
    z-index: 999;
}

.awning {
    width: 623px;
    margin: 0px auto 0px -12px;
    padding: 0;
    height: 75px;
}
.awning ul {
    margin: 0;
    padding: 0;
}
.awning .sign li {
    padding: 0;
    list-style-type: none;
    height: 25px;
    width: 48px;
    float: left;
}
.awning .sign li:nth-child(odd):not(:first-child) {
    background: red;
}
.awning .sign li:nth-child(even):not(:last-child) {
    background: #ff3333;
}
.awning .sign li:first-child {
    width: 36px;
    height: 0;
    border-bottom: 25px solid red;
    border-left: 12px solid transparent;
}
.awning .sign li:last-child {
    width: 36px;
    height: 0;
    border-bottom: 25px solid #ff3333;
    border-right: 12px solid transparent;
}
.awning .scallops {
    padding: 0;
    height: 30px;
}
.awning .scallops li {
    padding: 0;
    list-style-type: none;
    background: red;
    border-radius: 0 0 50% 50%;
    width: 48px;
    height: 35px;
    float: left;
    -moz-box-shadow: rgba(0, 0, 0, 0.25) 0 10px 5px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.25) 0 10px 5px;
    box-shadow: rgba(0, 0, 0, 0.25) 0 10px 5px;
}
.awning .scallops li:nth-child(odd) {
    background: #ff2929;
}
.awning .scallops li:nth-child(even) {
    background: #ff3d3d;
}*/

#EjRGsoLbyTgH {
    margin: 20px;
    display: none;
}

#announcement {
    margin: 20px 0px;
}

#announcement a img {
    opacity: 0.9;
    filter: alpha(opacity=90); /* For IE8 and earlier */
}

#announcement a:hover img {
    opacity: 1;
    filter: alpha(opacity=100); /* For IE8 and earlier */
}

.item .icons {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    padding: 5px;
    transition: top .2s;
    -webkit-transition: top .2s ease;
}

.item div.pinned {
    width: 26px;
    height: 26px;
    transition: right .2s;
    -webkit-transition: right .2s ease;
    float: right;
    margin-left: 3px;
}

.item div.pinned svg {
    fill: #FFCB05;
}

.item div.second-hand {
    width: 26px;
    height: 26px;
    transition: right .2s, left .2s;
    -webkit-transition: right .2s ease, left .2s ease;
    float: left;
}

.item div.second-hand svg {
    fill: #FACB1B;
}

.item div.virtual {
    width: 26px;
    height: 26px;
    transition: right .2s, left .2s;
    -webkit-transition: right .2s ease, left .2s ease;
    float: right;
    margin-left: 3px;
}

.item div.virtual svg {
    fill: #404041;
}

.item div.likes {
    width: 26px;
    height: 26px;
    transition: right .2s;
    -webkit-transition: right .2s ease;
    text-align: center;
    float: left;
}

.item div.likes svg {
    fill: #FFCB05;
}

.item div.likes .likes-count {
    position: relative;
    top: -24px;
    color: #FFF;
}

.item:hover .icons {
    top: -45px;
    transition: top .2s;
    -webkit-transition: top .2s ease;
}

blockquote {
    height: 100%;
    font-size: 1.2em;
    /*width:60%;*/
    /*margin: 50px auto;*/
    font-style: italic;
    color: #555555;
    padding: 40px 20px;
    /*border-left: 8px solid #78C0A8;*/
    border: none;
    line-height: 1.3;
    position: relative;
    background: #F9F9F9;
    text-align: justify;
}

blockquote::before {
    /*font-family:Arial;*/
    content: "\201C";
    color:#78C0A8;
    font-size:4em;
    position: absolute;
    left: 10px;
    top:-10px;
    opacity: 0.3;
}

blockquote::after{
    /*font-family:Arial;*/
    content: "\201D";
    color:#78C0A8;
    font-size:4em;
    position: absolute;
    right: 18px;
    bottom: -32px;
    opacity: 0.3;
}

blockquote span{
    display:block;
    color:#333333;
    font-style: normal;
    font-weight: bold;
    margin-top:1em;
}

.navbar-nav {
    float: none;
    margin: 0;
}

.navbar-nav .nav-item.search {
    flex: 1;
}

.navbar-nav .nav-item {
    float: none;
}

.navbar-nav .form-group.has-search {
    width: 100%;
}

.navbar-nav .navbar-form {
    flex: 1;
    float: none;
    border: 0;
}

.navbar .container-fluid {
    padding: 0;
}

@media (min-width: 768px) {
    .navbar-nav {
        display: flex;
    }

    .navbar-nav .form-group.has-search {
        margin: 0;
    }

    .navbar-nav .navbar-form {
        padding: 8px;
    }
}

.navbar-form {
    padding: 3px;
    margin: 0;
}