/*
 Theme Name:   Djouani Mohamed
 Description:  djouanimohamed Theme
 Author:       Benoit Lenglin
 Author URI:   https://www.le-kube.com
 Template:     twentysixteen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  djouanimohamed
*/
html {
  scroll-behavior: smooth;
}
body {
	background-color: #3752A6;
	line-height:1.25;
	font-family: 'CrimsonText-Regular';
	text-rendering: optimizeLegibility;
}
.site {
	margin:20px 0 0 0;
	background-color:#3752A6;
}
.site-inner {
	background-color:#FFFFFF;
}
	body:before, 
  body:after,
body:not(.custom-background-image):before,
body:not(.custom-background-image):after{
		top: 0;
		height: 0;
	}

.site-header {
	padding:0 0 80px 0;
}
.site-branding {
	margin:0;
	width: 100%;
}
.site-header-main {
	width:100%;
}
.site-branding .site-title {
	font-family: 'CrimsonText-Bold';
	font-size:3.75em;
	text-align:center;
	width: 100%;
	padding: 50px 0 0px 0;
}
.site-branding .site-title a {
	color:#3752A6;
}
.site-branding .site-title a:hover,
.site-branding .site-title a:focus,
.main-navigation li:hover > a:hover, 
.main-navigation li.focus > a, 
.main-navigation li.focus > a:hover,
.main-navigation li:hover > a:hover::before, 
.main-navigation li.focus > a:hover::before{
	color:#F23E1D;
}
.site-branding .site-description {
	margin:0;
	padding-bottom:30px;
	text-align:center;
	font-size:1.2em;
	color: #262626;
}
.site-header-menu {
	margin:0 4.5455%;
	width: 100%;
	border-top: 3px solid #3752A6;
	border-bottom: 1px solid #262626;
}

#menu-principal {
	text-align:center;
}
.menu-item {
	display:inline-block;
}
.main-navigation .primary-menu > li {
	float:none;
}
.main-navigation a {
	min-height:38px;
	line-height:38px;
	padding: 0 25px;
	font-family: 'Montserrat-SemiBold';
	font-size: 1em;
	color: #262626;
	height: auto;
}
.main-navigation a::before {
	content:"#";
	font-size:0.75em;
	color:#3752A6;
}
.site-branding {
	position:relative;
}
.menu-toggle {
	background-color: transparent;
	border:0;
	border-top:3px solid #3752A6;
	border-bottom:1px solid #262626;
	color: #007acc;
	margin: 0 5.5%;
	width: 100%;
	padding: 0.7em;
}
.menu-toggle.toggled-on,
.menu-toggle.toggled-on:hover,
.menu-toggle.toggled-on:focus {
	background-color: #fff;
	border-color: #1a1a1a;
	color: #007acc;
}
.menu-toggle:hover,
.menu-toggle:focus {
	background-color: transparent;
	color: orange;
}
	.main-navigation ul ul a {
		width:500px;
		text-align: left;
	}
.main-navigation .menu-item-has-children > a {
	margin-right: 0;
}
#d_social {
	position:absolute;
	bottom:10px;
	right:4.5%;
}
#d_social a {
  position: relative;
	display:inline-block;
	background-color:#0554F2;
	color:#FFFFFF;
	height:42px;
	width:42px;
	text-align:center;
	line-height:42px;
  border-radius: 5px;
}
	#d_social a img {
		position:absolute;
		top:0;
		left:0;
	}
#d_social a:hover::after,
#d_social a:focus::after {
  content: attr(aria-label);
  position: absolute;
  top: -3em;
  right: 0;
  /*! transform: translateX(-50%); */
  z-index: 1;
  white-space: nowrap;
  color: #F23E1D;
  background-color: #FFFFFF;
  padding: 2px 5px;
  font-family: "Montserrat-Regular";
}
.site-content {
	display:flex;
	flex-wrap:wrap;
	padding: 0;
}
#d_recently {
	display: flex;
	position:relative;
	padding: 0 4.5% 80px 0;
	min-height: 380px;
	margin: 0 0 0px 9%;
	border-bottom: 10px solid #3752A6;
}
#d_recently h2:not(article h2) {
	transform:rotate(270deg);
	position:absolute;
	left:-5%;
	/*! height: 5.5%; */
	bottom: -2px;
	transform-origin: 14px 25px;
	font-family: 'Montserrat-SemiBold';
	font-size: 1.5em;
	text-transform: uppercase;
	color: #3752A6;
}
#d_recently article {
	width:44.5%;
	margin-left:5.5%;
}
#d_recently article h3, #main article h3 {
	font-family: 'CrimsonText-Bold';
	font-size:1.9em;
	color:#3752A6;
	position:relative;
	/*! height: 45px; */
}
#main article .d_desc_h3 ~ h3{
	font-size:1.2em;
	font-family:"CrimsonText-Regular";
}
#main article .d_desc_h3 ~ h3::after{
	display:none;
}
#main article .d_desc_h3 ~ p strong{
	color:#3752A6;
}
#d_recently article h3:after, #main article h3:after {
	content:"";
	width:100%;
	height:2px;
	position:absolute;
	left:0;
	bottom:3px;
	background-color:#3752A6;
}

#d_recently article p, #main article p {
	font-family: 'CrimsonText-Regular';
	font-size:1.30em;
	color:#262626;
	margin-bottom: 1em;
}
#main article p strong {
	font-family: 'CrimsonText-Bold';
	font-weight:400;
}
#d_recently article p strong, .home #main article p strong {
	font-family: 'Montserrat-Regular';
	font-size:0.8em;
	color:#3752A6;
}

.wp-block-file {
	font-size:1.30em;
}
.wp-block-file a {
	margin-top:0;
}
#d_recently article p a:last-child, .d_article_link, #main article p:nth-last-child(2) a:last-of-type, .wp-block-file a {
	background-color:#0554F2;
	color:#FFF;
	padding:8px 20px;
	border-radius:5px;
	font-family: 'Montserrat-Regular';
	font-size: 0.8em;
	display: inline-block;
	margin-top:20px;
}
.wp-block-file a {
	margin-top:0;
}
.d_article_link {
	font-size: 1em;
	margin-top: 0;
}
	#primary {
		background-color:#FFFFFF;
		margin:0 0 0 119px;
		width: 805px;
		padding: 0 3.1% 80px 0;
		min-height:1350px;
	}
.home #primary {
	padding-top: 80px;
}
	.site-main {
		margin-bottom: 0;
	}
  .site-main > article {
		margin-bottom: 3.5em;
	}
	#secondary {
		margin:0;
		background-color:#3752A6;
		background-color:#3752A6;
		width:30%;
	 display: block;
		padding: 40px 0 324px 0;
		position: relative;
	}
/*interactions*/
a:hover,
a:focus,
a:active {
	color: #F23E1D;
}
#d_social a:hover,
#d_social a:focus,
.d_article_link:hover,
.d_article_link:focus,
#d_recently article p a:last-child:hover, 
#d_recently article p a:last-child:focus, 
.d_article_link:hover, 
.d_article_link:focus, 
#main article p:nth-last-child(2) a:last-of-type:hover,
#main article p:nth-last-child(2) a:last-of-type:focus,
.d_pagination li:not(.active) .page-link:hover,
.d_pagination li:not(.active) .page-link:focus,
#bio a:hover,
#bio a:focus,
.d_contact_2 p a:hover,
.d_contact_2 p a:focus,
.widget button.search-submit:hover,
.widget button.search-submit:focus,
.search-no-results main .search-form button:hover,
.search-no-results main .search-form button:focus, 
.error-404 .page-content .search-form button:hover, 
.error-404 .page-content .search-form button:focus,
.wp-block-file a:hover,
.wp-block-file a:focus
{
	color:#FFFFFF;
  background-color:#F23E1D;
  -webkit-animation: shadow-pop-bl 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
	animation: shadow-pop-bl 0.2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

/* ----------------------------------------------
 * Generated by Animista on 2020-6-18 9:29:57
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation shadow-pop-bl
 * ----------------------------------------
 */
@-webkit-keyframes shadow-pop-bl {
  0% {
    -webkit-box-shadow: 0 0 #262626, 0 0 #262626, 0 0 #262626, 0 0 #262626;
            box-shadow: 0 0 #262626, 0 0 #262626, 0 0 #262626, 0 0 #262626;
    -webkit-transform: translateX(0) translateY(0);
            transform: translateX(0) translateY(0);
  }
  100% {
    -webkit-box-shadow: -1px 1px #262626, -2px 2px #262626, -3px 3px #262626, -4px 4px #262626;
            box-shadow: -1px 1px #262626, -2px 2px #262626, -3px 3px #262626, -4px 4px #262626;
    -webkit-transform: translateX(4px) translateY(-4px);
            transform: translateX(4px) translateY(-4px);
  }
}
@keyframes shadow-pop-bl {
  0% {
    -webkit-box-shadow: 0 0 #262626, 0 0 #262626, 0 0 #262626, 0 0 #262626;
            box-shadow: 0 0 #262626, 0 0 #262626, 0 0 #262626, 0 0 #262626;
    -webkit-transform: translateX(0) translateY(0);
            transform: translateX(0) translateY(0);
  }
  100% {
    -webkit-box-shadow: -1px 1px #262626, -2px 2px #262626, -3px 3px #262626, -4px 4px #262626;
            box-shadow: -1px 1px #262626, -2px 2px #262626, -3px 3px #262626, -4px 4px #262626;
    -webkit-transform: translateX(4px) translateY(-4px);
            transform: translateX(4px) translateY(-4px);
  }
}

/*/interactions*/


/*pages content*/
	body:not(.search-results) article:not(.type-page) .entry-content {
		float: left;
		width: 100%;
	}
	.post-navigation .post-title {
		font-family: 'Montserrat-Regular';
		font-size: 1rem;
		line-height: 1.5;
		color: blue;
	}
	.post-navigation .post-title {
		font-family: 'Montserrat-Regular';
		font-size: 1rem;
		line-height: 1.5;
		color: #0554F2;
	}
.post-navigation a:hover .post-title,
.post-navigation a:focus .post-title {
	color: #F23E1D;
}
.post-navigation {
	border-top: 4px solid #3752A6;
	border-bottom: 4px solid #3752A6;
}
.post-navigation div + div {
	border-top: 2px solid #262626;
}
	body:not(.search-results) article:not(.type-page) .entry-footer {
    padding-top:10px;
		margin-top:30px;
		border-top:2px solid #3752A6;
	}
.wp-block-file a.wp-block-file__button {
	display:none;
}
.entry-footer strong {
	color:#3752A6;
}
.entry-footer a {
	color: #0554F2;
}
.entry-footer a:hover,
.entry-footer a:focus {
	color: #F23E1D;
}
  .cat-links a::before, .tags-links a::before {
	 content:"#";
	 font-size:0.8em;
  }
.d_nav {
	border-top: 1px solid #262626;
}
.d_pagination {
	margin: 0;
	list-style: none;
	font-family:'Montserrat-Regular';
	text-align:right;
	position: relative;
}
.d_pagination span {
	margin: 0;
	list-style: none;
margin-right:10px;
	left: 0;
	position: absolute;
	height: 40px;
	line-height: 40px;
}
.d_pagination li {
	display: inline-block;
	margin-left: 1px;
}
.d_pagination li .page-link {
	display: inline-block;
	background-color: #0554F2;
	color: #FFF;
	height: 40px;
	width: 40px;
	line-height: 40px;
	text-align: center;
}
.d_pagination .active .page-link {
	background-color: #FFFFFF;
	color: #262626;
}
.pagination {
	border-top: 1px solid #262626;
}
.pagination .prev,
.pagination .next {
	background-color: #0554F2;
	height: 40px;
	width: 40px;
}
.pagination .prev:before,
.pagination .next:before {
	font-size: 32px;
	height: 40px;
	line-height: 40px;
	position: relative;
	width: 40px;
}
.pagination:before,
.pagination:after {
	display:none;
}
.page-header {
	border-top: 0px solid #1a1a1a;
	}
.page-header h1 {
	font-family: 'Montserrat-Regular';
	color:#262626;
	}
.search-no-results main p, .error-404 .page-content p {
	font-size:1.3em;
}
.search-no-results main .search-form, .error-404 .page-content .search-form {
	border-radius:0 5px 5px 0;
	border:1px solid #3752A6;
}
.search-no-results main .search-form button, .error-404 .page-content .search-form button {
	background-color: #3752A6;
	color:#FFFFFF;
}
.search-no-results main .search-form button:hover, 
.search-no-results main .search-form button:focus,
.error-404 .page-content .search-form button:hover, 
.error-404 .page-content .search-form button:focus
{
	background-color: #F23E1D;
	color:#FFFFFF;
}
/*/pages content*/

/*sidebar*/
#secondary img {
	width:200px;
	height:200px;
	border-radius:50%;
	margin:0 auto 20px auto;
	display: block;
}
#bio p {
	color:#FFFFFF;
	padding:0 10%;
	font-family: 'Montserrat-Regular';
	margin: 0;
}
#bio  a {
	background-color:#FFF  ;
	color:#0554F2;
	padding:8px 20px;
	border-radius:5px;
	font-family: 'Montserrat-Regular';
	text-align:center;
	display: inline-block;
	margin:20px 10% 40px 10%;
	display:inline-block;	
}
.d_contact_2 {
	position:absolute;
	background-color: #262626;
	color:#FFFFFF;
	width:100%;
	bottom:0;
	padding:40px;
	font-family: 'Montserrat-Regular';
}
.d_contact_2 p {
	display:flex;
	flex-direction:column;
	/*sidebar*/
	margin: 0;
}
.d_contact_2 p a {
	background-color:#FFF  ;
	color:#0554F2;
	padding:8px 20px;
	border-radius:5px;
	font-family: 'Montserrat-Regular';
	text-align:center;
	display: inline-block;
	margin-top:20px;
	display:block;
}
.widget {
	margin: 0;
	padding:35px 10%;
	border:none;
	color:#FFF;
	position: relative;
	width: 70%;
	font-size: 1em;
}
.widget::before {
	content:"";
	position:absolute;
	height:10px;
	width:100%;
	background-color:#FFF;
	left: 0;
	top: -5px;
}
.tagcloud ul {
	margin:0;
}
.tagcloud ul li {
	display:block;
}
.tagcloud a {
	border: none;
	color: #FFF;
}
.tagcloud a::before {
	content:"#";
	font-size:0.8em;
	color:#FFF;
}
.tagcloud a:hover, .tagcloud a:focus {
	color:#FFFFFF;
}
.tagcloud a:hover::before, tagcloud a:focus::before {
	color:#F23E1D;
}
.search-form {
	border:0px solid blue;
}
input[type="search"] .search-field {
	border:1px solid #FFF;
	border-radius:5px 0 0 5px;
}
input[type="search"] .search-field:focus, input[type="search"]:focus {
	border:1px solid #F23E1D;
	color: #262626;
}
.search-form {
	width:100%;
}
.search-form button {
	background-color:#FFF;
	color:#0554F2;
	border-radius: 0 5px 5px 0;
}
.search-form button:hover {
	color:#F23E1D;
}
.d_a_propos {
		background-color:#FFF  ;
	color:#0554F2;
	padding:8px 20px;
	border-radius:5px;
	font-family: 'Montserrat-Regular';
	text-align:center;
	display: inline-block;
	width:80%;
	margin:0 10% 20px 10%;
	display:block;
}
.d_a_propos:last-of-type {
	margin-bottom:40px;
}
/*sidebar*/

/*page*/
.entry-title {
	font-size:2.8em;
	font-family: 'CrimsonText-Bold';
	color:#3752A6;
	margin-bottom: 0.3em;
}
.entry-content h2, .entry-summary h2, .comment-content h2 {
	font-size:1.8em;
	font-family: 'CrimsonText-Regular';
	color:#3752A6;
	margin-bottom: 0.3em;
}
	.entry-content ul,
	.entry-summary ul,
	.comment-content ul,
	.entry-content ol,
	.entry-summary ol,
	.comment-content ol {
		list-style:none;
	}
	.entry-content ul li,
	.entry-summary ul li,
	.comment-content ul li,
	.entry-content ol li,
	.entry-summary ol li,
	.comment-content ol li {
		margin-bottom:15px;
		font-size: 1.3em;
	}
	.entry-content ul li::before,
	.entry-summary ul li::before,
	.comment-content ul li::before,
	.entry-content ol li::before,
	.entry-summary ol li::before,
	.comment-content ol li::before {
		content:"•";
		margin-right:5px;
		color:#044BD9;
		font-family: 'CrimsonText-Bold';
	}
.entry-content #d_these {
	padding-left:30px;
	border-left:2px solid #044BD9;
}
.entry-content #d_these h3 {
	color:#3752A6;
	font-family:"Montserrat-Semibold" ;
	font-size:1.1em;
	margin:0;
}
.entry-content #d_these h3::after {
	display:none;
}
	.entry-content #d_these ul li::before,
	.entry-summary #d_these ul li::before,
	.comment-content #d_these ul li::before,
	.entry-content #d_these ol li::before,
	.entry-summary #d_these ol li::before,
	.comment-content #d_these ol li::before {
		display:none;
	}
/*/page*/

.site-footer {
	background-color:#262626;
	font-family: 'Montserrat-Regular';
	color:#FFF;
	padding: 0;
}
.site-footer .main-navigation {
	margin-bottom: 0;
}
.site-footer .site-info {
	margin: 0 0 0 5%;
	padding: 40px 0;
}
.site-footer .site-info a {
	color:#FFF;
	text-decoration:underline;
}
.dropdown-toggle {
	width: 60px;
	color: #0554F2;
}
footer .dropdown-toggle {
	width: 60px;
	color: #FFFFFF;
}
#matomo{
	padding:20px 65px 0 65px;
	font-size: 14px;
}
@media screen and (max-width:84em) {
	.site {
		margin:0;
	}
		#primary {
		margin:0 0 0 9%;
		width: 61%;
	}
	#secondary {
		width:30%;
	}
}
@media screen and (max-width:61.5625em) {
	#d_recently{
		flex-wrap: wrap;
		width:100%;
		margin:0;
		padding:0px 0 30px 0;
	}
	#d_recently h2 {
		transform:rotate(0deg);
		position:relative;
		width:100%;
    margin-bottom:30px;
		left: 0;
		padding-left: 5%;
	}
#d_recently article {
	width:40%;
	margin: 0 5%;
}  
		body:not(.search-results) article:not(.type-page) .entry-footer {
		border-top:0px solid #3752A6;
	}
}
@media screen and (max-width:56.9em) {
	.site-header-menu {
		margin:0 5.5%;
		width: 100%;
		border-top: none;
		border-bottom: 1px solid #262626;
	}
	#menu-principal li,#menu-principal-1 li  {
		display:block;
	}
	#menu-principal li a, #menu-principal-1 li a {
		min-height:50px;
		line-height:50px;
	}
	#menu-principal-1 li a {
		color:#FFF;
		text-align: center;
	}
  #d_recently {
		padding: 0px 0 20px 0;
	}
	#d_recently article {
		width:80%;
		margin-right:8.6%;
		margin-bottom: 50px;
	}
	#primary {
		background-color:#FFFFFF;
		margin:0;
		width: 100%;
		padding: 0px 4.5% 80px 4.5%;
		min-height:200px;
	}
		#secondary {
		margin:0;
		background-color:#3752A6;
		background-color:#3752A6;
		width: 100%;
		padding: 40px 0 0 0;
	 display: block;
		position: relative;
	}
	.widget {
		margin: 0;
		padding:35px 4.5%;
		width: 100%;
	}
	.d_contact_2 {
		position:relative;
		background-color: #262626;
		color:#FFFFFF;
		width:100%;
		bottom:0;
		padding:40px;
		font-family: 'Montserrat-Regular';
	}
	#bio p {
		color:#FFFFFF;
		padding:0 4.5%;
		font-family: 'Montserrat-Regular';
		margin: 0;
	}
	#bio  a {
		background-color:#FFF  ;
		color:#0554F2;
		padding:8px 20px;
		border-radius:5px;
		font-family: 'Montserrat-Regular';
		text-align:center;
		display: inline-block;
		margin:20px 4.5% 40px 4.5%;
		display:block;	
	}
	body:not(.search-results) article:not(.type-page) .entry-content {
    margin: 0;
	}
	.entry-header, .post-navigation, .entry-footer {
		margin:0;
	}
	.page-content, .page-header {
		margin-left:0;
		margin-right:0;
	}
	.entry-header,
	.entry-summary,
	.entry-content,
	.entry-footer,
	.page-content,
	.entry-content ul, .entry-summary ul, .comment-content ul, .entry-content ol, .entry-summary ol, .comment-content ol{
		margin-right: 0%;
		margin-left: 0%;
	}
	.main-navigation ul ul a {
		width:100%;
		text-align: center;
	}
}
@media screen and (max-width:48.9375em) {
	
}
@media screen and (max-width:44.375em) {
	#d_social {
		position:relative;
		bottom:0;
		right:0;
		text-align: center;
		margin-bottom: 30px;
	}
	#d_social a {
		position: relative;
		cursor: help;
		display:inline-block;
		background-color:#0554F2;
		color:#FFFFFF;
		height:42px;
		width:42px;
		text-align:center;
		line-height:42px;
		border-radius: 5px;
	}

	#d_social a:hover::after,
	#d_social a:focus::after {
		content: attr(aria-label);
		position: absolute;
		top: -2.4em;
		left: 50%;
		transform: translateX(-50%);
		z-index: 1;
		white-space: nowrap;
	}
	.site-branding .site-title {
		font-size:3em;
		padding: 40px 20px 30px 20px;
	}
	.entry-title {
		font-size:2em;
	}
	.entry-header,
	.entry-summary,
	.entry-content,
	.entry-footer,
	.page-content,
	.entry-content ul, .entry-summary ul, .comment-content ul, .entry-content ol, .entry-summary ol, .comment-content ol{
		margin-right: 0%;
		margin-left: 0%;
	}
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}