/*
 Theme Name:   ND2020
 Description:  Site de l'institution Notre Dame de Strasbourg
 Author:       Valentin Nussbaum
 Template:     twentyseventeen
 Version:      1.0.0
*/
@font-face{font-family:Raleway;font-style:normal;font-weight:200;src:url(fonts/Raleway-Light.ttf)}
@font-face{font-family:Raleway;font-style:normal;font-weight:400;src:url(fonts/Raleway-Regular.ttf)}
@font-face{font-family:Raleway;font-style:normal;font-weight:700;src:url(fonts/Raleway-Bold.ttf)}
@font-face{font-family:Raleway;font-style:italic;font-weight:200;src:url(fonts/Raleway-LightItalic.ttf)}
@font-face{font-family:Raleway;font-style:italic;font-weight:400;src:url(fonts/Raleway-Italic.ttf)}
@font-face{font-family:Raleway;font-style:italic;font-weight:700;src:url(fonts/Raleway-BoldItalic.ttf)}

@font-face{font-family:Sarabun;font-style:normal;font-weight:200;src:url(fonts/Sarabun-Light.ttf)}
@font-face{font-family:Sarabun;font-style:normal;font-weight:400;src:url(fonts/Sarabun-Regular.ttf)}
@font-face{font-family:Sarabun;font-style:normal;font-weight:700;src:url(fonts/Sarabun-Bold.ttf)}
@font-face{font-family:Sarabun;font-style:italic;font-weight:200;src:url(fonts/Sarabun-LightItalic.ttf)}
@font-face{font-family:Sarabun;font-style:italic;font-weight:400;src:url(fonts/Sarabun-Italic.ttf)}
@font-face{font-family:Sarabun;font-style:italic;font-weight:700;src:url(fonts/Sarabun-BoldItalic.ttf)}


h1, h2, h3, h4, h5 {
    font-family: Sarabun, Arial, sans-serif;	
	padding: 0.5em 0 0;
}
body, button, input, select, textarea {
    font-family: Raleway, Arial, sans-serif;
}
/*body {min-width:1280px;}*/
.site-content {padding: 2.5em 0 0;}
a {color:#2196f3;text-decoration:none;	box-shadow:none;-webkit-box-shadow:none;transition:none;transition:color 80ms ease-in;}
a:hover {color:#2196f3 !important;text-decoration:underline !important;box-shadow:none !important;-webkit-box-shadow:none !important;}
.site-title a {color:#fff !important;text-decoration:none !important;}

.nav-title {border:none !important;box-shadow:none !important;-webkit-box-shadow:none !important;transition:none !important;color:#2196f3;}
.nav-previous a:hover, .nav-next a:hover, .nav-previous a:hover .nav-subtitle, .nav-next a:hover .nav-subtitle {text-decoration:none !important;}
.nav-previous a:hover .nav-title, .nav-next a:hover .nav-title {color:#2196f3;text-decoration:underline;}

.main-navigation li li:hover {background:#2196f3;}
.main-navigation li li:hover a {color:#fff !important;text-decoration:none !important;}
*:focus {outline: none;}
hr {margin-bottom: 1.2em;margin-top: 1.2em;}

#main ul, #main ol {padding-left: 15px}

#primary .entry-content .wp-block-button .wp-block-button__link {margin-top: 0em;margin-bottom: 0.5em;	text-decoration:none !important;}
#primary .entry-content .wp-block-button:hover .wp-block-button__lin {background: #2196f3 !important;color:#fff !important;text-decoration:none !important;opacity:1;}


/* HEADER */
.has-header-image.twentyseventeen-front-page .custom-header, .has-header-video.twentyseventeen-front-page .custom-header, .has-header-image.home.blog .custom-header, .has-header-video.home.blog .custom-header {
height: 400px;margin-bottom:0 !important;}
.has-header-image .custom-header-media img, .has-header-video .custom-header-media video, .has-header-video .custom-header-media iframe {position:static;background-size: cover;filter: blur(0.4rem);}
.has-header-image.twentyseventeen-front-page .custom-header, .has-header-video.twentyseventeen-front-page .custom-header, .has-header-image.home.blog .custom-header, .has-header-video.home.blog .custom-header {height:320px;}
.twentyseventeen-front-page.has-header-image .custom-header-media, .twentyseventeen-front-page.has-header-video .custom-header-media, .home.blog.has-header-image .custom-header-media, .home.blog.has-header-video .custom-header-media {position:absolute;}
.custom-header {margin-bottom:0 !important;}
#header-visit {display:block;position:absolute;z-index:10;bottom:0;right:0;width:300px;height:100%;color: #fff;font-size: 25px;text-align:center;line-height: 1em;padding: 100px 20px 100px 60px;box-sizing: border-box;}
#header-visit:hover {text-decoration:none !important;color:#fac92f !important;}
#header-visit strong {font-size: 50px;line-height:50px;display:block;}
#header-visit .triple-arrow {display:inline-block;width:80px;height:40px;background:url('img/icon_arrow_r_white_triple.png');margin-top: 10px;transition:background 80ms ease-in}
#header-visit:hover .triple-arrow {background:url('img/icon_arrow_r_yellow_triple.png');}
#header-visit:focus{box-shadow: none; outline: none;}
#inside-header {position:relative;margin:0 auto;max-width:1200px;height:320px;border-right:2px solid #fff;border-left:2px solid #fff;}
#inside-header-top {position:relative;margin:0 auto;max-width:1200px;height:100%;max-height: 100%;background:url('img/Notre-Dame-header.png');background-position:top left;background-repeat:no-repeat;}
#visite-vid {position:absolute;top:0;right:0;width:300px;height:320px;}
#visite-vid-cache {position:absolute;top:0;right:0;background:#333;opacity:0.4;width:300px;height:320px;}
#masthead .site-branding > .wrap {padding: 5px 20px;background: rgba(0, 0, 0, 0.6);width: 720px;margin: 0;}
.navigation-top {position:relative;}

@media screen and (max-width: 1199px) {
	#inside-header {max-width: 1024px;height: 273px;}
	.has-header-image.twentyseventeen-front-page .custom-header, .has-header-video.twentyseventeen-front-page .custom-header, .has-header-image.home.blog .custom-header, .has-header-video.home.blog .custom-header {
	height: 273px;
	}
	#visite-vid, #visite-vid-cache {height: 273px;width:256px;}
	#inside-header-top{background-size: contain;}
	#header-visit {padding-right:5px;width:260px;}
}

@media screen and (max-width: 1023px) {
	#visite-vid, #visite-vid-cache {display:none;}
	#header-visit {width:100%;height: 70px;padding:10px;margin:0;text-align:center;}
	#header-visit, #header-visit strong {line-height:40px;font-size:40px;}
	#header-visit strong  {display:inline;}
	#inside-header-top {background-image:url('img/Notre-Dame-header.jpg');background-size: cover;background-position: center;}
	#masthead #inside-header-top .site-branding > .wrap {width:100%;}
}

@media screen and (max-width: 620px) {
	#header-visit, #header-visit strong {
		line-height: 40px;
		font-size: 25px;
	}
	#header-visit .triple-arrow {display:none;}
}

/* MENUS */
.navigation-top .wrap {max-width:1200px;}
.unclickable > a { pointer-events: none;}
.main-navigation a {padding:1em;}
.homelink > a {position:relative;}
.menu-scroll-down {display:none;}

/* WIDGET GENERAL */
.widget_text p:last-child, .widget_text img:last-child, .widget_text div:last-child {
	margin-bottom:0;
}

.textwidget, .widget_recent_entries ul, h2.widget-title + div, h2.widget-title + table, h2.widget-title + ul {
	padding:15px;
}

.widget.widget_search > form > label {display:none;}

.widget a.amail {
	position:relative;
	display:block;
	padding-left: 25px;
	box-shadow:none;
	-webkit-box-shadow:none;
	}
	
.widget a.amail:before {
	position:absolute;
	content: url('img/icone_mail.gif');
	top:2px;
	left:0;
	width:28px;
	height:20px;
}



/* WIDGET TOP */
#widget-home-top-full, #widget-home-top-article {}
#widget-home-top-full .widget, #widget-home-top-article .widget {padding-bottom:0;border: 2px solid #ffcc30;margin-bottom:30px;}
#widget-home-top-full .widget-title, #widget-home-top-article .widget-title {display:none;}

/* WIDGET TOP MOBILES*/
#widget-mobile-top-full {display:none;}
#widget-mobile-top-full .widget {display:inline-block;}
#widget-mobile-top-full h2.widget-title, #secondary h2.widget-title {display:block;}

@media screen and (max-width: 959px) {
	#widget-mobile-top-full {display:block;}
	#secondary, .has-sidebar #secondary {width:100% !important;float:none;}
	#secondary {padding-top:30px !important;}
	#secondary .widget {width:47%;margin-right:4%;float:left;}*
	#widget-mobile-top-full .widget:nth-child(even){width:47%;float:left;}
	#widget-mobile-top-full .widget:nth-child(odd){width:47%;float:right;}
	
	#secondary .widget:nth-child(even), #widget-mobile-top-full .widget:last-child {margin-right:0;}
}

@media screen and (max-width: 767px) {
	#widget-mobile-top-full .widget, #secondary .widget, #widget-mobile-top-full .widget:nth-child(odd), #widget-mobile-top-full .widget:nth-child(even) {width:100%;float:none;margin-right:0;} 
}


/* HOME */
#home-top-intro {text-align: center;font-size: 30px;font-weight: bold;color: #2b82dc;margin-bottom:30px;}

/* FOOTER */
.site-footer {text-align:center;background:#fff;}
.site-info {width:100%;}

/* CATS */
.page .panel-content .entry-title, .page-title, body.page:not(.twentyseventeen-front-page) .entry-title {font-size: 1.7rem;border-bottom: 1px solid #333;padding-bottom: 20px;text-align:center;}

/* ARTICLES */
.post-navigation {margin:1em 0;}
#primary article.page header, #primary article.page .entry-content{width:100% !important;float:none !important;}

/* GENETAL */
.entry-meta a { color:#2196f3; }
.entry-meta a[rel=bookmark]{ color:#333; }

.entry-title a, .widget a, .entry-meta a, .page-links a, .page-links a .page-number, .entry-footer a, .entry-footer .cat-links a, .entry-footer .tags-links a, .edit-link a, .post-navigation a, .logged-in-as a, .comment-navigation a, .comment-metadata a, .comment-metadata a.comment-edit-link, .comment-reply-link, a .nav-title, .pagination a, .comments-pagination a, .site-info a, .widget .widget-title a, .widget ul li a, .site-footer .widget-area ul li a, .site-footer .widget-area ul li a, .entry-title a {
	box-shadow:none;
	-webkit-box-shadow:none;
	text-decoration:none;
	transition:none;
	transition:color 80ms ease-in;
}

figure.alignright {margin-left:30px;}
figure.alignleft {margin-right:30px;}

h2, .home.blog .entry-title, .page .panel-content .recent-posts .entry-title { font-size: 1.8rem; }

.blog .site-main > article.sticky, .archive .site-main > article.sticky, .search .site-main > article.sticky {
	background-color:#fac92f;
	padding:30px;
	background-image:url('img/pinned.png');
	background-position:top right;
	background-repeat:no-repeat;
}
#main hr:last-child {display:none;}

.blocks-gallery-grid, .wp-block-gallery { margin: 0 auto; }

.entry-meta {
	text-transform:none;
	font-weight: 700;
	font-size: 0.85em;
}
.site-content-contain {background:url('img/bg_crossword_bleu.jpg');}


/* ASIDE */
aside .widget_text, aside .widget {
	border : 2px solid #ffcc30;
	margin-bottom:20px;
	padding:0;
}

aside h2.widget-title {
	display: inline-block;
    padding: 5px 10px;
	margin-bottom:0;
    border-bottom-right-radius: 15px;
    background: #ffcc30;
	color:#333;
}	

/* CONTENT */	
.site-content-contain .wrap {
		width:100%;
		max-width: 1200px;
		padding: 30px;
		background:#fff;
}
	
@media screen and (max-width: 1200px) {
	.site-content-contain .wrap {
		max-width: 1024px;
	}
	#content #primary {width:675px;}
}

@media screen and (max-width: 1024px) {
	.site-content-contain .wrap {
		max-width: 959px;
	}
	#content #primary {width:615px;}
}

@media screen and (max-width: 959px) {
 #content .has-sidebar aside , #content aside, #content .has-sidebar #primary, #content #primary, #content #primary {float:none;width:100%;}
}
	
	.blog .site-main > article, .archive .site-main > article, .search .site-main > article {
		padding: 30px 0;
	}
	
	.has-sidebar #secondary {width: 260px;padding:0px;}

	.has-sidebar:not(.error404) #primary {
		float: left;
		width: 840px;
		padding:0px;
	}


/* ARTICLE I et menus*/
	a.article_le_i {
	display:block;
	position:relative;
	padding:20px 50px 20px 110px;
	background: #caecfe;
	color:#2196f3;
	font-size: 1.6em;
	}
	
	a.article_le_i:before {
		content:'';
		display:block;
		position:absolute;
		top:0;left:0;
		height:100%;
		width:98px;
		background-position:center left;
		background:url('img/icon_i.png');background-position:center left;
		background-repeat:no-repeat;
	}
	
	a.article_le_i:after {
		content:'';
		display:block;
		position:absolute;
		top:50%;right:20px;
		margin-top:-20px;
		height:40px;
		width:26px;
		background:url('img/icon_arrow_r_blue.png');
		background-position:center left;
		background-repeat:no-repeat;
	}
	
	a.article_le_i:hover {
	background: #2196f3;
	color:#fff !important;
	text-decoration:none !important;
	}
	
	a.article_le_i:hover:after {
	background:url('img/icon_arrow_r_white.png');
	}
	
	
	div.article_menus {
	display:block;
	position:relative;
	padding:10px 20px 10px 110px;
	background: #caecfe;
	color:#333333;
	font-size: 1.6em;
	}
	
	div.article_menus h3 { margin: 0 0 0.4em; }
	
	div.article_menus:before {
		content:'';
		display:block;
		position:absolute;
		top:0;left:0;
		height:100%;
		width:98px;
		background-position:center left;
		background:url('img/icon_menus.png');background-position:center left;
		background-repeat:no-repeat;
	}

	div.article_menus a {
		position:relative;
		display:inline-block;
		font-size:0.9em;
		padding:5px 35px 5px 10px;
		border : 1px dotted #2196f3
	}
	
	 div.article_menus a:after {
		content:'';
		display:block;
		position:absolute;
		top:50%;right:5px;
		margin-top:-15px;
		height:30px;
		width:20px;
		background:url('img/icon_arrow_r_blue_petite.png');
		background-position:center left;
		background-repeat:no-repeat;
	}
	
	div.article_menus a:first-child {margin-right:20px;}

	div.article_menus a:hover {
	background: #2196f3;
	color:#fff !important;
	text-decoration:none !important;
	}
	
	div.article_menus a:hover:after {
	background:url('img/icon_arrow_r_white_petite.png');
	background-repeat:no-repeat;
	}
	
	
	@media screen and (max-width: 959px) {
		a.article_le_i, div.article_menus {font-size: 1.4em;}
	}
	
	@media screen and (max-width: 767px) {
		a.article_le_i, div.article_menus {font-size: 1.2em;}
	}
	

/* Articles */

@media screen and (max-width: 767px) {
	.blocks-gallery-grid.alignleft, .blocks-gallery-grid.alignright, .wp-block-gallery.alignleft, .wp-block-gallery.alignright, figure.alignright, figure.alignleft
	{
	margin:0 auto;max-width:100%;	
	}
	#main figure.alignleft ul, #main figure.alignright ul{padding:0;}
}




.has-sidebar .entry-content.fullwidth,  .has-sidebar .entry-header.fullwidth  {
float: none;
width: 100%;
}
		
		
/* Taille mobile < 960 px */
/*
@media screen and (min-width: 48em) {	
	.has-sidebar .entry-content.fullwidth,  .has-sidebar .entry-header.fullwidth  {
	float: none;
	width: 100%;
	}
}
*/