@charset "UTF-8";

body {
font-family: "MuseoSansRounded","Helvetica Neue",Helvetica,Arial,sans-serif;
background-color:#f2f2f2;
font-style:normal;
font-weight:200;
height:100%;
margin:0
}

* {
margin:0;
padding:0
}

.hidden {
display:none
}

.content {
max-width:1200px;
margin:auto
}

a:hover {
text-decoration:underline;
color:inherit;
}

.actif {
font-weight:700
}

header {
background-color:white;
padding-top: 1em;
}

header a {
text-decoration:none;
color:inherit;
}

header h1 {
	text-indent: -9999px;                 /* sends the text off-screen */
    background-image: url(../images/logo/Logo-Hospitaliere-texte-blanc.svg);  /* shows image */
    height: 50px;                        /* be sure to set height & width */
    width: 290px;
    white-space: nowrap;
    background-repeat: no-repeat;
	background-size:75%;
	background-position: center center;
	background-color: #54c0ec;
		border-radius: 50px;
margin-top: 10px;
color:#D0D5D5;
text-transform:uppercase;
line-height:2em;
margin:0;
font-size:18pt;
font-weight:400;
display:inline;
float:left
}
header #facebook {
	float: left;
	height: 50px;
	width: 50px;
	background-image: url(/images/logo/logo-facebook-white.svg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 50%;
	background-color: #54c0ec;
		border-radius: 50px;
	margin-left: 1em;
}
header ul {
color:#111;
margin:0;
list-style:none;
vertical-align:baseline;
text-align:right;
padding:0;
width:100%;
font-weight:200;
padding-top:8px;
letter-spacing: 0.15em;
}

header ul li {
display:inline-block;
padding-left:24px;
}

header nav {
display:inline-block;
width:100%;
height:2em;
margin-bottom:2em;
text-transform:uppercase;
margin-top: 3em;
}

header nav ul {
color:#252525;
display:block
}

header nav ul li {
font-size:14pt
}
footer {
background-color:#000
}

footer h4 {
margin:0;
color:#55B2D7;
text-align:center;
padding-top:36px;
padding-bottom:36px;
font-size:16pt;
font-weight:200;
text-transform:uppercase;
letter-spacing:2px
}

footer a {
color:inherit;
text-decoration:none
}

.banner {
background-color:#000
}

.banner .content {
padding-left:0;
padding-right:0;
margin:auto;
max-width:1200px
}

.pressrelease {
border: 1px solid red;
padding: 4px;
border-radius: 4px;
color: red;
font-size: 12px;
vertical-align: 4px;
transition: border-color 0.4s ease 0s, background-color 0.4s ease 0s;

}

.pressrelease:hover {
	
	background-color: red;
	color: white;
	text-decoration: none;

}

#title {
background-color: #76b1c9;
padding-top:2.5em;
padding-bottom:2.5em;
box-shadow: inset 0px 50px 50px -30px rgba(0, 0, 0, 0.9);
}

#title h1 {
color:white;
font-weight:200;
text-align:center;
letter-spacing:3px;
font-size:38pt;
line-height:1.3em;
margin-bottom: 34px;
margin-top: 34px;
}

.banner_video {
background-color:#000;
width:100%
}

.banner_video img {
max-width:100%;
height:auto
}

.banner_video video {
height:auto;
width:100%
}

.bg-logo {
background-image: url(/images/logo/icon-hospitalieres-blanc-30.svg);
background-repeat: no-repeat;
background-position: center center;
background-size: contain;
}
.introduction {
/*background-color:#B2E2FE;*/

background-color:#cccccc;
padding-top:4em;
padding-bottom:4em;
position: relative;
}

.introduction p {
color:#707070;
text-align:justify;
font-weight:400;
letter-spacing:.5pt;
line-height:1.5em;
margin-top:18px;
font-size:14pt;
font-weight:300
}

.introduction p:first-of-type:first-letter {
float:left;
font-size:3.5em;
color:#fff;
padding:0;
margin:0;
line-height:.02em;
padding-right:.05em
}
.comediens {
background-color:#DFDFDF;
padding-top:4em;
padding-bottom:1em
}
.thumbnails {
	display: block;
	height: 144px;
	width: auto;
	background-size: contain;
	padding: 20px;
	position: relative;
	background-image: url(../images/THUMBNAIL_HOSPI_16-9_OFFICIEL.png);
}
.thumbnails span {
	position: absolute;
	bottom: 10px;
}
.thumbnails p {
margin: 0;
line-height: 1em;
}
.thumbnails .prenom {
	color: #b6b6b6;
	font-size: 16pt;
	text-transform: uppercase;
}
.thumbnails .nom {
	color: #54c1ec;
	font-size: 20pt;
	text-transform: uppercase;
}
.boite_comediens {
position:relative;
background-color:#fff;
width:260px;
color:#222;
box-shadow:0 2px 3px 2px #aaa;
margin-bottom:4em;
}

.boite_comediens a:hover {
text-decoration:none
}

.boite_comediens h2 {
text-transform:uppercase;
text-align:center;
padding:0;
margin:0;
padding-top:20px;
padding-bottom: 20px;
line-height:1em;
color:#A4A4A4;
font-size:13pt
}

.boite_comediens h3 {
font-size:14pt;
text-transform:uppercase;
text-align:center;
margin-top:10px;
margin-bottom:0;
padding-bottom:12px;
color:#53585F
}

.avenir h2:after {
	content:"À VENIR";
	padding-left: 1em;
	display: inline-block;
	font-size:10pt;

}

.avenir_en h2:after {
	content:"COMING SOON";
	padding-left: 1em;
	display: inline-block;
	font-size:10pt;
}

.avenir_es h2:after {
	content:"PRÓXIMAMENTE";
	padding-left: 1em;
	display: inline-block;
	font-size:10pt;
}

.fr h3:before {
content:"par";
text-transform:none;
display:block;
width:100%;
padding-bottom:4px;
font-size:12pt;
font-weight:200;
color:#53585F
}

.en h3:before {
content:"by";
text-transform:none;
display:block;
width:100%;
padding-bottom:4px;
font-size:12pt;
font-weight:200;
color:#53585F
}

.es h3:before {
content:"por";
text-transform:none;
display:block;
width:100%;
padding-bottom:4px;
font-size:12pt;
font-weight:200;
color:#53585F
}

.photo_comediens img {
width:100%;
height:auto
}

.commandites {
padding-top:3em;
padding-bottom:3em;
background-color:#fff
}

.commandites h1 {
color:#707070;
text-transform:uppercase;
line-height:2em;
text-align:center;
padding:0;
margin:0
}

.logo_commandites {
clear:both;
display:flex;
flex-flow:row wrap;
justify-content:space-around;
padding-top:24px;
padding-bottom:24px
}

.logo_commandites img {
height:70px;
width:auto
}

.gilbertbasting {
	max-width: 400px;
	height: auto;
    padding: 10px;
}
.pieta {
float:right;
color:#555;
display:none
}

.pieta h5 {
text-align:right;
text-transform:uppercase;
font-size:16pt;
font-weight:200;
text-decoration:overline underline
}

.pieta h6 {
text-align:right;
font-size:12pt
}

.pieta img {
height:300px;
width:auto;
padding-top:1em
}

.videos {
display:flex;
flex-direction:row;
flex-wrap:wrap;
justify-content:space-around
}

.modal-backdrop {
opacity:.9!important
}

.modal-content {
background:none
}

.videoplayer {
max-width:1200px;
margin:auto;
padding-top:4em;
padding-left:1em;
padding-right:1em
}

.boite_comediens .overlay {
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
height:100%;
width:100%;
opacity:0;
transition:.5s ease;
font-size:34pt;
background-image:url(/images/DVDPlayer-icon.png);
background-size:auto 35%;
background-repeat:no-repeat;
background-position:center 28px
}

.boite_comediens:hover .overlay {
opacity:.85
}
#carousel {
	padding-top: 4px;
	padding-bottom: 4px;
}
.carousel-fade .carousel-inner .item {
opacity:0;
transition-property:opacity
}

.carousel-fade .carousel-inner .active {
opacity:1
}

.carousel-fade .carousel-inner .active.left,.carousel-fade .carousel-inner .active.right {
left:0;
opacity:0;
z-index:1
}

.carousel-fade .carousel-inner .next.left,.carousel-fade .carousel-inner .prev.right {
opacity:1
}

.carousel-fade .carousel-control {
z-index:2
}

.carousel-control {
	font-size: 175px;
}
.carousel-control div {
clear: both;
display: flex;
align-items: center;
height: 100%;

}
.carousel-control.left div{
	clear: both;
	text-align: left;
	justify-content: flex-start;
}

.carousel-control.right div{
	clear: both;
	text-align: right;
	justify-content: flex-end;
}

.carousel-indicators {
	bottom: 0;
}

@media all and (transform-3d),(-webkit-transform-3d) {
.carousel-fade .carousel-inner > .item.next,.carousel-fade .carousel-inner > .item.active.right {
opacity:0;
-webkit-transform:translate3d(0,0,0);
transform:translate3d(0,0,0)
}

.carousel-fade .carousel-inner > .item.prev,.carousel-fade .carousel-inner > .item.active.left {
opacity:0;
-webkit-transform:translate3d(0,0,0);
transform:translate3d(0,0,0)
}

.carousel-fade .carousel-inner > .item.next.left,.carousel-fade .carousel-inner > .item.prev.right,.carousel-fade .carousel-inner > .item.active {
opacity:1;
-webkit-transform:translate3d(0,0,0);
transform:translate3d(0,0,0)
}
}

@media only screen and (max-width: 1400px) {
.content {
margin-left:8%;
margin-right:8%
}
}