@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css);
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300i,700,700i&display=swap");
#banner {
	background-color: #ffffff;
	color: #c1c5cb;
	display: -moz-flex;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;-moz-flex-wrap: no-wrap;-webkit-flex-wrap: no-wrap;-ms-flex-wrap: no-wrap;flex-wrap: no-wrap;
	cursor: default;
	height: var(--global--banner-height);
	position: relative;
	
	/* background: #CCE8F4 url("../../images/pic01.jpg"); */
	/* background-position: center center; */
	/* background-size: cover; */
	/* background-repeat: no-repeat; */

	margin: 0;
}
#banner input, #banner select, #banner textarea {
	color: #ffffff;
}
#banner a {
	color: #ffffff;
}
#banner strong, #banner b {
	color: #ffffff;
}
#banner h1, #banner h2, #banner h3, #banner h4, #banner h5, #banner h6 {
	color: #ffffff;
}
#banner blockquote {
	border-left-color: rgba(255, 255, 255, 0.2);
}
#banner code {
	background: rgba(255, 255, 255, 0.075);border-color: rgba(255, 255, 255, 0.2);
}
#banner hr {
	border-bottom-color: rgba(255, 255, 255, 0.2);
}
#banner:after {
	pointer-events: none;-moz-transition: opacity1.5s ease-in-out, visibility 1.5s;-webkit-transition: opacity1.5s ease-in-out, visibility 1.5s;-ms-transition: opacity1.5s ease-in-out, visibility 1.5s;transition: opacity1.5s ease-in-out, visibility 1.5s;background: #2a3037;content: '';display: block;height: 100%;left: 0;opacity: 0;position: absolute;top: 0;visibility: hidden;width: 100%;z-index: 2;
}
#banner > article {
	-moz-transition: opacity 1.5s, visibility 1.5s;-webkit-transition: opacity 1.5s, visibility 1.5s;-ms-transition: opacity 1.5s, visibility 1.5s;transition: opacity 1.5s, visibility 1.5s;display: -moz-flex;display: -webkit-flex;display: -ms-flex;display: flex;-moz-align-items: center;-webkit-align-items: center;-ms-align-items: center;align-items: center;background-position: center;background-repeat: no-repeat;background-size: cover;height: 100%;left: 0;opacity: 0;padding: 0;position: absolute;text-align: center;top: 0;visibility: hidden;width: 100%;z-index: 800;
}
#banner > article:after {
-moz-transition: opacity 1.5s ease-in-out;-webkit-transition: opacity 1.5s ease-in-out;-ms-transition: opacity 1.5s ease-in-out;transition: opacity 1.5s ease-in-out;/* background-color: rgba(42, 48, 55, 0.75); */content: '';height: 100%;left: 0;position: absolute;top: 0;width: 100%;}
#banner > article .inner > :last-child {
margin-bottom: 0;}
#banner > article h1, #banner > article p {
position: absolute;z-index: 802;
bottom: 2rem;
right: 0rem;
}
#banner > article p {
	bottom: 1rem;
	right: 4.7rem;
}
#banner > article h1 {
font-size: 3rem;
background: rgba(0,0,0,0.5);
padding: 2rem 4rem 1rem 2rem;
}
#banner > article h1:after {
	background-color:var(--global--banner-barre-color);
	content: '';
	display: block;
	height: var(--global--banner-barre-height);
	margin: 0.5rem auto;
	width:var(--global--banner-barre-width);}
	
#banner > article p {
line-height: inherit;font-size: 1.75rem;}
#banner > article.visible {
opacity: 1;visibility: visible;}
#banner > article.top {
z-index: 802;}
#banner > article img {
display: none;}
#banner .indicators {
bottom: 3rem;line-height: 1;list-style: none;margin: 0 auto;padding: 0;position: absolute;text-align: center;width: 100%;}
#banner .indicators li {
cursor: pointer;display: inline-block;height: 1.25rem;margin-left: 0.5rem;overflow: hidden;padding: 0;position: relative;text-indent: -2.5rem;width: 1.25rem;z-index: 802;}
#banner .indicators li:before {
-moz-transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);-moz-transition: background-color 0.2s ease-in-out;-webkit-transition: background-color 0.2s ease-in-out;-ms-transition: background-color 0.2s ease-in-out;transition: background-color 0.2s ease-in-out;background-color: rgba(255, 255, 255, 0.15);border-radius: 100%;content: '';display: inline-block;height: 1rem;left: 50%;position: absolute;text-indent: 0;top: 50%;width: 1rem;}
#banner .indicators li.visible:before {
background-color: #ffffff;}
body.is-preload #banner:after {
opacity: 1.0;visibility: visible;}
@media screen and (max-width: 1280px) {
#banner {
height: 40rem;}
}
@media screen and (max-width: 980px) {
#banner .indicators {
display: none;}
}
@media screen and (max-width: 736px) {
#banner {
height: 25rem;}
#banner > article h1 {
font-size: 2.25rem;}
#banner > article p {
font-size: 1.25rem;}
}
@media screen and (max-width: 480px) {
#banner {
	height: 30rem;
}
}
#banner .inner {
    margin: 0 auto;
    max-width: calc(100% - 10rem);
}