/*
 Theme Name:   Bunker D
 Theme URI:    bunkerd
 Description:  Theme for "Bunker D"
 Author:       Bunker D
 Author URI:   http://www.bunkerd.fr
 Version:      1.0
 Template:     twentysixteen
*/


/*
 *   Fonts
 */

/* Flat icons */
@font-face {
	font-family: 'rondo';
	src: url('fonts/rondo/rondo.eot?#') format('eot'),
		url('fonts/rondo/rondo.svg#rondo') format('svg'),
		url('fonts/rondo/rondo.woff') format('woff'),
		url('fonts/rondo/rondo.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}


/*****
 *****   General
 *****/

*,
*:before,
*:after {
	/* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

body {
    margin: 0;
    padding: 0;
    top: 0;
    background-color: white;
    font-size: 19px;
    text-align: justify;
}
@media screen and (min-width: 44.375em) {
	body:not(.custom-background-image):before,
	body:not(.custom-background-image):after {
		content: "";
        height: 0;
	}
}

p, ul, ol {
    margin-bottom: 1.25em;
}

h3 {
    font-size: 1.7em;
    margin-bottom: 0.5em;
}

ul, ol {
    margin-left: 1.5em;
}

@media screen and (min-width: 44.375em) {
	.entry-content ul,
	.entry-summary ul,
	.comment-content ul,
	.entry-content ol,
	.entry-summary ol,
	.comment-content ol {
		margin-left: 1.5em;
	}
}

p {
    text-align: justify;
}

.meta-data {
    font-family: Montserrat, "Helvetica Neue", sans-serif;
    font-size: 0.8125rem;
    color: #686868;
    line-height: 1.6153846154;
}

a {
    text-decoration: none;
    box-shadow: none;
    color: #c00;
}

.entry-content a, .entry-summary a, .taxonomy-description a, .logged-in-as a, .comment-content a, .pingback .comment-body > a, .textwidget a {
    box-shadow: none;
}

a:hover, .entry-content a:hover, .entry-summary a:hover, .taxonomy-description a:hover, .logged-in-as a:hover, .comment-content a:hover, .pingback .comment-body > a:hover, .textwidget a:hover,
a:focus, .entry-content a:focus, .entry-summary a:focus, .taxonomy-description a:focus, .logged-in-as a:focus, .comment-content a:focus, .pingback .comment-body > a:focus, .textwidget a:focus {
    color: #c00;
    box-shadow: 0 1px 0 0 currentColor;
}

.entry-footer a:hover, nav-links a:hover,
.entry-footer a:focus, nav-links a:focus {
    color: #c00;
    box-shadow: none;
}

.post-navigation a:hover .post-title,
.post-navigation a:focus .post-title {
	color: #666;
}

.pagination a:hover,
.pagination a:focus {
	color: #1a1a1a;
    box-shadow: none;
}

.pagination .prev:hover,
.pagination .prev:focus,
.pagination .next:hover,
.pagination .next:focus {
	background-color: #666;
	color: #fff;
}

::selection {
    background: #d13028; /* WebKit/Blink Browsers */
    color: white;
}

::-moz-selection {
    background: #d13028; /* Gecko Browsers */
    color: white;
}

mark, ins {
    background: #d13028;
}

code {
    background-color: transparent;
    font-family: Courrier, monospace;
    font-weight: normal;
}

var {
    color: #666;
}

hr {
    background-color: #c00;
    border: 1px;
    height: 1px;
    margin: 0 0 1.75em;
}

hr.black {
    background-color: #1a1a1a;
}

hr.skip {
    background-color: transparent;
}

th, td {
    text-align: justify;
}

.remarque {
    color: #686868;
    font-style: italic;
    font-size: 0.83em;
}

.formula {
    font-family: Georgia, "Times New Roman";
    font-size: 1.1em;
}

/*****
 *****   Header
 *****/

/*
 *   Image and folding
 */

.site-header {
    position: fixed;
    top: 0px;
    width: 100%;
    margin: 0;
    padding: 0;
    z-index: 100;
}

/* Translate fixed header +32px if admin bar */
.admin-bar .site-header {
    top: 32px;
    transition: top 0.2s ease;
}
@media screen and (max-width: 782px) {
    .admin-bar .site-header {
        top: 46px;
    }
}

.site-header-height {   /* To define .site-header height */
    width: 100%;
    min-width: 2077px;  /* Banner width @ minimal height */
}
.site-header-height:before {
    content: "";
    display: block;
    padding-top: 5.584978%; /* Banner heigth:width ration */
}

.site-banner-hider {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    bottom: 0;
    transition: all 0.2s ease;
    border-bottom: 8px solid #d13028;
    transition: all 0.2s ease;
}

.site-banner-anchor {
    display: block;
    width: 100%;
    min-width: 2077px;  /* Banner width @ minimal height */
    position: absolute;
    right: 18.6455207886841%;   /* Position of logo right */
    top: 0;
    bottom: 0;
}

.site-banner-img-banner {
    display: block;
    width: 100%;
    float: right;
    margin: 0 -18.6455207886841% 0 0;   /* Position of logo right */
}

.site-banner-img-top {
    width: 12.999952%;
    position: absolute;
    right: 0px;
    top: 0;
    margin: 0;
}

.site-banner-img-bottom {
    width: 12.999952%;
    position: absolute;
    right: 2px;
    bottom: 0px;
    margin: 0;
}

.img-active {
    opacity: 0;
    transition: 0.1s;
    cursor: pointer;
}
.img-active:hover {
    opacity: 1;
    transition: 0.1s;
}


/*
 *   Facebook
 */

.site-banner-fb-container {
    position: absolute;
    top: 28px;
    right: 6.21517359623%;
    bottom: 0;
    left: 81.3544792113%;
    padding: 0; margin: 0;
    text-align: center;
    font-size: 60px;
    line-height: 60px;
    vertical-align: middle;
    transition: top 0.2s ease;
}
.site-banner-tw-container {
    position: absolute;
    top: 28px;
    right: 3%;
    bottom: 0;
    left: 90.569652807535%;
    padding: 0; margin: 0;
    text-align: center;
    font-size: 60px;
    line-height: 60px;
    vertical-align: middle;
    transition: top 0.2s ease;
}
@media screen and (max-width: 1080px) {
    .site-banner-fb-container { font-size: 40px; top: 31px; }
    .site-banner-tw-container { font-size: 40px; top: 31px; }
}
@media screen and (max-width: 670px) {
    .site-banner-fb-container { display: none; }
    .site-banner-tw-container { display: none; }
}

.fb-bubble-icon {
    cursor: default;
    font-family: 'rondo';
	font-style: normal;
	speak: none;
	/* Enable Ligatures */
	-webkit-font-feature-settings:"liga","dlig";-moz-font-feature-settings:"liga=1, dlig=1";-moz-font-feature-settings:"liga","dlig";-ms-font-feature-settings:"liga","dlig";-o-font-feature-settings:"liga","dlig";
	font-feature-settings:"liga","dlig";
	text-rendering:optimizeLegibility;
    /* Animation */
    color: white;
    opacity: .75;
    transition: all 0.4s ease;
}

.fb-bubble-icon:hover {
    opacity: 1;
    transition: all 0.4s ease;
}

.fb-bubble-icon:hover > .fb-bubble {
    height: auto;
    padding: 40px 0 0 0;
    overflow: hidden;
}

.fb-bubble {
    width: 430px;
    position: absolute;
    top: 60%;
    right: 50%;
    margin: 0 -83px 0 0;
    padding: 0;
    /* Hide by default */
    height: 0px;
    overflow: hidden;
    z-index: 1000;
}
.fb-bubble:before {
    content: "";
	height: 0px;
    position: absolute;
	right: 50px;
	top: -40px;
    border-width: 40px 33px;
	border-style: solid;
	border-color: transparent transparent #333 transparent;
}

.fb-bubble a {
    text-decoration: none;
}

.fb-bubble-container {
    width: 100%;
    padding: 1px;
    background-color: #333;
    border-radius: 30px;
    color: white;
    font-size: 18px;
    font-family: Merriweather, Georgia, serif;
}

.fb-bubble-elem {
    color: white;
    margin: 30px;
}
.fb-bubble-elem > h2 {
    padding: 0;
    margin: 0 0 0.5em 0;
    font-family: Montserrat, "Helvetica Neue", sans-serif;
    text-align: left;
    line-height: 1.2;
}
.fb-bubble-elem:hover > h2 {
    color: #c00;
}
.fb-bubble-elem > p {
    width: 90%;
    margin: 0.7em 0 0 5%;
    line-height: 1.2;
}
.fb-bubble-elem > img {
    width: 90%;
    padding: 0;
    margin: 0 0 0 5%;
    border-radius: 13px
}


/*
 *   Admin bar + Scroll behavior
 */

.admin-bar .site-header.scrolled {
    top: 0;
}

.site-header.scrolled .site-banner-hider {
    height: 70.689655%;
}

.site-header.scrolled .site-banner-fb-container {
    top: 11px;
}
.site-header.scrolled .site-banner-tw-container {
    top: 11px;
}
@media screen and (max-width: 1080px) {
    .site-header.scrolled .site-banner-fb-container { top: 13px; }
    .site-header.scrolled .site-banner-tw-container { top: 13px; }
}


#wpadminbar {
    top: 0;
    transition: top 0.2s ease;
}

#wpadminbar.scrolled {
    top: -32px;
}
@media screen and (max-width: 782px) {
    #wpadminbar.scrolled {
        top: -46px;
    }
}


/*
 *   ~ banner starting height * constant ratio
 */

.site-header-height-maj {   /* Similar to .site-header-height, with reduce width & increased ration */
    width: 1%;
    min-width: 21px;  /* Banner width @ minimal height */
}
.site-header-height-maj:before {
    content: "";
    display: block;
    padding-top: 1000%; /* Banner heigth:width ration */
}


/*
 *   Progress bar
 */

#progress-bar-container {
    position: absolute;
    top: 100%;
    height: 8px;
    width: 42%;    /* 60%*70% */    /* Must align with .article-content */
    left: 29%;
    overflow: hidden;
    transition: top 0.2s ease;
}
@media screen and (max-width: 90rem) {
    #progress-bar-container {
        width: 49%;    /* 70%*70% */
        left: 25.5%;
    }
}
@media screen and (max-width: 70rem) {
    #progress-bar-container {
        width: 56%;    /* 80%*70% */
        left: 22%;
    }
}
@media screen and (max-width: 50rem) {
    #progress-bar-container {
        width: 63%;    /* 90%*70% */
        left: 18.5%;
    }
}
@media screen and (max-width: 40rem) { /* No more side space */
    #progress-bar-container {
        width: 90%;    /* 90%*100% */
        left: 5%;
    }
}

#progress-bar {
    position: absolute;
    top: 2.5px;
    left: 0;
    height: 2.5px;
    background-color: white;
    width: 0;
    transition: width 0.2s ease-out;
}

.scrolled #progress-bar-container {
    top: 70.689655%;
}

main.single {
    width: 60%;
    margin: auto;
}

main.single .article-content {
    width: 70%;
    display: block;
    margin: auto;
}
@media screen and (max-width: 90rem) {
    main.single {
        width: 70%;
        margin: auto;
    }
}
@media screen and (max-width: 70rem) {
    main.single {
        width: 80%;
        margin: auto;
    }
}
@media screen and (max-width: 50rem) {
    main.single {
        width: 90%;
        margin: auto;
    }
}
@media screen and (max-width: 40rem) { /* No more side space */
    main.single .article-content {
        width: 100%;
    }
    main.single .alignleft, main.single .alignright {
        float: none;
        display: block;
        margin: 1em auto;  /* (1-width)/(2*width) */
    }
    blockquote.alignleft, blockquote.alignright {
        width: 80%;
        float: none;
        margin: 1em auto;
    }
}


/*****
 *****   Main
 *****/

main {
    width: 100%;
    margin-top: 100px;
}

.center, .left, .right, img, .img {
    float: none;
    display: block;
    margin: 1.25em auto;
    padding: 0;
    width: 100%;
}

.img img,
.entry-thumbnail img {
    width: 100%;
    margin: 0;
    padding: 0;
}

.caption {
    font-style: italic;
    font-size: 1rem;
    color: #686868;
    line-height: 1;
    margin: .4rem 0 0 0;
}

.source {
    font-size: 0.5em;
    line-height: 1.25em;
    font-family: Montserrat, "Helvetica Neue", sans-serif;
    font-size: 0.8125rem;
    color: #686868;
    line-height: 1.6153846154;
    font-style: normal;
}

.source a {
    color: inherit;
}
.source a:after {
    content: "\00A0\2192";
}
.source a:hover {
    color: #1a1a1a;
}

.source.largesource {
    font-size: 0.86em;
}

.source .details {
    font-family: Merriweather, Georgia, serif;
    color: #1a1a1a;
}
.source .details:before {
    content: "\A";
}

table.source {
    width: auto;
    border: none;
    margin: 0 0 0 0.75em;
}
table.source td {
    padding: 0.375em 0 0.375em 0.5em;
    border: none;
    vertical-align: top;
}

ul.source > li {
    margin: 0.75em 0;
}


/*
 *     Blockquote
 */

blockquote, blockquote.left, blockquote.right,
.comment-content blockquote {
    width: 80%;
    margin: 0 auto 1.25em auto;
    padding: 0 1.5em;
    border: none;
    border-left: 5px solid #ec746e;
    position: relative;
}
blockquote:before {
    content: "\201C";
    color: #ec746e;
    font-size: 2.2em;
    position: absolute;
    margin-left: -0.65em;
    margin-top: -0.3em;
    font-family: Merriweather, Georgia, serif;
}

@media screen and (min-width: 44.375em) {
    .entry-content blockquote:not(.alignleft):not(.alignright), .entry-summary blockquote, .comment-content blockquote {
        margin: 1em auto;
    }
}
@media screen and (min-width: 75em) {
    .entry-content blockquote:not(.alignleft):not(.alignright), .entry-summary blockquote, .comment-content blockquote {
        margin: 1em auto;
    }
}

blockquote p,
#refhandler p {
    margin: 0;
    padding: 0;
}
blockquote cite,
#refhandler cite {
    text-align: right;
    font-size: inherit;
    line-height: 1.25em;
    color: #1a1a1a;
}
blockquote cite:before,
#refhandler cite:before {
    content: "\2015\00A0\00A0"
}

blockquote strong,
blockquote b {
    font-weight: bold;
    color: #1a1a1a;
}

blockquote .source {
    text-align: right;
}

blockquote .qvovf,
#refhandler #refvovf {
    font-size: 0.5em;
    line-height: 1.25em;
    font-family: Montserrat, "Helvetica Neue", sans-serif;
    font-weight: normal;
    font-style: normal;
    font-size: 0.8125rem;
    color: #686868;
    line-height: 1.6153846154;
    cursor: pointer;
}

blockquote .qvovf {
    position: absolute;
    top: 0;
    left: 100%;
    display: table;
    margin: 0;
    padding: 0;
    opacity: 0;
    transition: opacity 0.1s ease;
}
blockquote:hover .qvovf {
    opacity: 1;
}
@media screen and (min-width: 40rem) {
    blockquote.left .qvovf {
        top: initial;
        bottom: 100%;
        left: 0;
        margin-bottom: 0.5em;
    }
    blockquote.right .qvovf {
        top: initial;
        right: 0;
        bottom: 100%;
        left: initial;
        margin-bottom: 0.5em;
    }
}

blockquote.vovf p.vf,
#refhandler #refcontent .vf {
    display: none;
}
blockquote.vovf.vf p.vf,
#refhandler.vf #refcontent .vf {
    display: block;
}
blockquote.vovf.vf p.vo,
#refhandler.vf #refcontent .vo {
    display: none;
}

blockquote .qvovf .vo,
#refhandler #refvovf .vo {
    font-weight: bold;
    color: #1a1a1a;
}
blockquote.vf .qvovf .vo,
#refhandler.vf #refvovf .vo {
    font-weight: inherit;
    color: inherit;
}
blockquote.vf .qvovf .vf,
#refhandler.vf #refvovf .vf {
    font-weight: bold;
    color: #1a1a1a;
}


/*
 *     More about...
 */

.moreabout {
    width: 90%;
    margin: 1em auto;
    padding: 0;
    border: none;
}
.moreabout.large {
    width: 100%;
}
.moreabout:not(.large) {
    font-size: 0.9em;    
}

.moreabout-header {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    font-family: Montserrat, "Helvetica Neue", sans-serif;
}
.moreabout:not(.large) .moreabout-header {
    color: white;    
    line-height: 1.2;
}
.moreabout.large .moreabout-header {
    border-top: 1px solid #1a1a1a;
}

.moreabout-header-txt {
    padding-left: 1.5em;
}

.moreabout-header-gb {
    width: 1.5em;
    height: 100%;
    float: left;
    text-align: center;
    font-family: Montserrat, "Helvetica Neue", sans-serif;
}

.moreabout-header-bg-off {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #ec746e;
    z-index: -3;
}
.moreabout-header-bg-off:before {
    content: "\00A0\00A0?";
}
.moreabout.large .moreabout-header-bg-off {
    background-color: white;
}

.moreabout-header-bg-on {
    position: absolute;
    bottom: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #d13028;
    z-index: -2;
    transition: bottom 0.1s ease;
}
.moreabout-header-bg-on:after {
    content: "\00A0\00A0\25BE";
    font-family: Montserrat, "Helvetica Neue", sans-serif;
}
.moreabout.large .moreabout-header-bg-on {
    background-color: white;
}

.moreabout-header:hover .moreabout-header-bg-on,
.moreabout.active .moreabout-header-bg-on {
    bottom: 0;
}

.moreabout-content {
    height: 0;
    overflow: hidden;
    line-height: 1.5em;
}

.moreabout-content p,
.moreabout-content ol,
.moreabout-content ul,
.moreabout-content table {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

.moreabout.active .moreabout-content {
    height: auto;
}

.moreabout.gray .moreabout-header-bg-off {
    background-color: #686868;
}
.moreabout.white .moreabout-header-bg-on,
.moreabout.gray .moreabout-header-bg-on {
    background-color: #1a1a1a;
}
.moreabout.white .moreabout-header-bg-off {
    background-color: #bbb;
}


/*****
 *****   Main: Listing articles
 *****/

main.list {
    width: 55%;
    margin: auto;
}

main.list > article {
    width: 100%;
    border: none;
    margin: 4em -38px 8em -38px;
    padding: 0 38px;
}
main.list > article:hover {
    width: 100%;
    border-left: 8px solid #d13028;
    padding-left: 30px;
}
main.list > article:after {
    content: "";
    clear: both;
    display: block;
}

main.list > article .entry-title {
    margin: 0 0 0.6em 5%;
}
main.list > article:hover .entry-title {
    color: #d13028;
}
.entry-title a {
    color: inherit;
}
.entry-title a:hover {
    color: #d13028;
    box-shadow: none;
}

main.list > article > .entry-thumbnail {
    float: left;
    width: 25%;
    margin: 0 auto 0 0;
}
main.list > article > .article-preview {
    float: right;
    width: 74.9%;
    margin: 0 0 -1em 0;
    padding: 0 0 0 1em;
    box-sizing: border-box;
}
main.list > article > .article-preview:after {
    clear: none;
}

.more-link {
    color: #686868;
}

main.list .moreabout {
    display: none;
}

.excerpt {
    margin: 0 0 1em 0;
    padding: 0 0 0 1em;
    font-style: italic;
    color: #686868;
    border-left: 5px solid #d13028;
}

main.list img, main.list .img {
    display: none;
}
main.list .entry-thumbnail img {
    display: block;
}

@media screen and (max-width: 90rem) {
    main.list {
        width: 67%;
    }
}
@media screen and (max-width: 70rem) {
    main.list {
        width: 80%;
    }
}
@media screen and (max-width: 55rem) {
    main.list {
        width: 90%;
    }
    main.list > article > .entry-thumbnail {
        display: none;
    }
    main.list > article > .article-preview {
        float: none;
        width: 100%;
    }
    main.list > article .entry-title {
        margin: 0 0 0.6em 0;
    }
}

main.list .qvovf {
    display: none;
}

/*****
 *****   Main: Single
 *****/

/* Remove some parent theme settings */
.entry-header, .entry-summary, .entry-content, .entry-footer, .page-content {
    margin-right: 0;
    margin-left: 0;
}
footer.entry-footer {
    float: none;
    display: block;
}
@media screen and (min-width: 61.5625em) {
    body:not(.search-results) article:not(.type-page) footer.entry-footer {
        float: none;
        display: block;
    }
}
/**/

main.single {
    width: 60%;
    margin: auto;
}
@media screen and (max-width: 90rem) {
    main.single {
        width: 70%;
        margin: auto;
    }
}
@media screen and (max-width: 70rem) {
    main.single {
        width: 80%;
        margin: auto;
    }
}
@media screen and (max-width: 50rem) {
    main.single {
        width: 90%;
        margin: auto;
    }
}

main.single > article {
    width: 100%;
    border: none;
    margin: 4em -38px 0 -38px;
    padding: 0 38px;
}

main.single .entry-header {
    width: 100%;
}
main.single .entry-header h1 {
    font-size: 3em;
    margin-bottom: 0.2em;
}
main.single .meta-data {
    margin-bottom: 5rem;
    font-size: 1.2rem;
}

main.single .article-content {
    width: 100%;
}

/* If wide enough, use sides. */
@media screen and (min-width: 40rem) {
    main.single .article-content {
        width: 70%;
        display: block;
        margin: auto;
    }
    
    main.single .left {
        float: left;
        margin: 0.4em 1.75em 0.4em -21.4285714285714%;
        width: 60%;
    }
    
    main.single .right {
        float: right;
        margin: 0.4em -21.4285714285714% 0.4em 1.75em;
        width: 60%;
    }

    main.single blockquote.left,
    main.single blockquote.right {
        width: 50%;
        padding-right: 0;
    }
}


/*****
 *****   Comments
 *****/

.comments-title {
    padding-top: 2em;
}
.comment-author a {
    color: #1a1a1a;
}
.comment-metadata a:hover {
    color: #1a1a1a;
}
.comment-reply-link {
    color: #686868;
}
.comment-reply-link:hover {
    color: #1a1a1a;
}
.comment-form a {
    color: #686868;
}
.comment-form a:hover {
    color: #1a1a1a;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
textarea:focus {
	background-color: #fff;
	border-color: #c00;
	color: #1a1a1a;
	outline: 0;
}

button:hover,
button:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
	background: #686868;
}

.comment-author .avatar {
    margin: 0 0.875em 0 0;
}
.required {
    color: #c00;
}

/*****
 *****   Article bottom
 *****/


/*
 *   Creative Commons
 */


.creative-commons {
    margin: 4rem 0 0 0;
}

.creative-commons img {
    width: 1.5rem;
    display: inline;
    margin: 0;
    opacity: 0.898;
}

.single-footer {
    background-color: #ec746e;
    border-top: 5px solid #d13028;
}

/*
 *   Share icons
 */

.share {
    float: right;
    margin: 2rem 0 1rem 0;
    line-height: 1;
}

.h-line {
    display: block;
    clear: both;
    width: 100%;
    height: 0.25em;
    margin: 0.25em 0;
    background-color: black;
}

[class^="share-icon"] {
    font-family: 'rondo';
	font-style: normal;
    font-size: 3rem;
    text-decoration: none;
	speak: none;
	/* Enable Ligatures */
	-webkit-font-feature-settings:"liga","dlig";-moz-font-feature-settings:"liga=1, dlig=1";-moz-font-feature-settings:"liga","dlig";-ms-font-feature-settings:"liga","dlig";-o-font-feature-settings:"liga","dlig";
	font-feature-settings:"liga","dlig";
	text-rendering:optimizeLegibility;
    /* Animation */
    color: #1a1a1a;
    background-color: none;
    border-radius: 100px;
    transition: all 0.3s ease;
    padding: 0;
    margin: 0 1rem;
    transition: all 0.3s ease;
}

[class^="share-icon"]:focus {
    color: #1a1a1a;
}

.share-icon-facebook:hover {
    /* background-color: #7eb1f5; */ /* Black on clear color */
    background-color: #4a69a5; color: white;
}
.share-icon-twitter:hover {
    /* background-color: #31cfff; color: white; */ /* White on true color */
    color: #31cfff;  /* True color */
}
.share-icon-googleplus:hover {
    background-color: #d64929; color: white; /* White on true color */
}

.clear {
    clear: both;
}


/*****
 *****   Reference
 *****/


span.reference {
    color: #ec746e;
}
span.reference.active {
    color: #c00;
}

#refhandler-container {
    position: absolute;
    padding: 0;
    margin: 0;
    top: 0;
    right: 0;
    left: auto;
    width: 26.1%;  /* 90% * ( ( 1 - (main.single * .article-contente) ) / 2 )  */
}
#refhandler-container.left {
    left: 0;
    right: auto;
}
@media screen and (max-width: 90rem) {
    #refhandler-container {
        width: 22.95%;
    }
}
@media screen and (max-width: 70rem) {
    #refhandler-container {
        width: 19.8%;
    }
}
@media screen and (max-width: 60rem) {
    #refhandler-container {
        visibility: hidden;
    }
    span.reference.active {
        font-weight: inherit;
        color: #ec746e;
    }
}

#refhandler {
    position: absolute;
    width: 88%;
    max-width: 22em;
    border: 0 solid #c00;
    border-width: 0 0 0 3px;
    padding: 0 8px;
    font-size: 1rem;
    line-height: 1.4;
    left: 0;
    right: auto;
    background-color: white;
}
#refhandler-container.left #refhandler {
    border-width: 0 3px 0 0;
    left: auto;
    right: 0;
}

#refcontent p {
    font-style: italic;
    margin: 0 0 .2em 0;
}
#refcontent p:before {
    content: "\201C";
}
#refcontent p:after {
    content: "\201D";
}
#refcontent p.noquote:before {
    content: "";
}
#refcontent p.noquote:after {
    content: "";
}
#refcontent cite {
    text-align: right;
    font-style: normal;
    font-size: 1em;
    float: right;
}
#refcontent cite:before {
    content: none;
}

#refhandler #refcontent .vf {
    display: none;
}
#refhandler.vf #refcontent .vf {
    display: block;
}
#refhandler.vf #refcontent .vo {
    display: none;
}

#refhandler #refvovf {
    font-size: 0.5em;
    line-height: 1.25em;
    font-family: Montserrat, "Helvetica Neue", sans-serif;
    font-size: 0.8125rem;
    color: #686868;
    line-height: 1.6153846154;
    cursor: pointer;
    position: absolute;
    bottom: 100%;
    right: 0;
    margin: 0 0 0.3em 0;
    display: table;
    background-color: white;
}
#refhandler-container.left #refvovf {
    left: 0;
}
#refhandler #refvovf .vo {
    font-weight: bold;
    color: #1a1a1a;
}
#refhandler.vf #refvovf .vo {
    font-weight: inherit;
    color: inherit;
}
#refhandler.vf #refvovf .vf {
    font-weight: bold;
    color: #1a1a1a;
}
#refhandler.monolang #refvovf {
    display: none;
}

del {
    display: none;
}
ins {
    color: inherit;
    text-decoration: inherit;
    padding: inherit;
    background: inherit;
}