.wait .content {
	display: flex;
	justify-content: center;
}
.wait .interact-box {
	display: none;
}

#player {
	aspect-ratio: 16/9;
}

body {
background:#825e8c url("../img/bg_image.png");
    background-repeat: no-repeat;
    background-position: center top;
    font-family: "roboto", sans-serif;
    margin: 0;background-position-y: -25px;
}

.header {
    width: 100%;
    max-width: 1920px;
    margin: auto;
	text-align:center;
	position:relative;
}

.header .session-name {
	background: #3b2e4a;
	padding:5px;
	font-weight:500;color: #ffffff;padding-left: 15px;
}

.header .titre {
	max-width:100%;
	height:auto;
}

.header .speakers {
	display:none;	
}

.header .logo-THERAMEX img {
	height:50px;
	max-width:100%;
	margin-bottom:10px;
}

.content-wrapper {
    max-width: 1920px;
    padding: 0;
    margin: auto;
}

.content {
    width: 100%;
}

.content .fluidMedia {
    position: relative;
    padding-bottom: 56.25%;
    /* proportion value to aspect ratio 16:9 (9 / 16 = 0.5625 or 56.25%) */
    height: 0;
    overflow: hidden;
}

.content .interact-box {
	height: 450px;
}

.content.wait .interact-box{
	display: none;
}

footer {
	clear:both;
	padding:12px;
	text-align:center;
	width: 95%;
    max-width: 1895px;
    margin: auto;
}	

footer ul.links {
	list-style:none;
	padding:0;
	margin:0;
}

footer ul.links li {
	display:inline-block;
    padding-left: 33px;
    line-height: 25px;
    height: 25px;
}

footer a {
	color:#fff;	
	text-decoration:none;
}

footer a:hover {
	text-decoration:underline;	
}

footer ul.links li.youtube {
	background:transparent url("../img/youtube.svg") no-repeat left top;
	background-size: contain;
	margin-right: 15px;
}

footer ul.links li.facebook {
	background:transparent url("../img/facebook.svg") no-repeat left top;
	background-size: contain;
}

/* modale inscription */

.iziModal {
	max-width:inherit !important;
}

/* page moderation chat */

.chat-moderation {
	background: rgb(50,17,63);	
}

.chat-moderation .header {
	height:150px;	background: none;
}

.chat-moderation .content-wrapper {
	width:90%;
	height:calc(100vh - 200px);
}

.chat-moderation .content {
	height:100%;	
}

.content.wait .media-box{
	background-image: url(/lives/theramex2021/theramex_ATTENTE.png);
	background-size: contain;
	float: none;
	margin: auto;
}

.content.wait .media-box .media{
	display: none;
}

/* responsive */

@media screen and (min-width:1024px) and (max-width:1280px)
{
	.header .logos {
	position: absolute;
    bottom: 0;
	}
	.header .titre {

		float:left;width: 50%;
	}
	}

@media screen and (min-width:1024px)
{
	.header {
		text-align:left;
		height:190px;	background: transparent url(../img/photos-moderateurs.png) no-repeat left bottom;
    background-position-x: 92px;background-size: 40%;

	}	
	.header .speakers {
		display:block;
		position:absolute;
		right:25px;
		top:25px;
	}
	.header .speakers img {
		width:460px;
	}	
	.header .session-name {
position: absolute;
    top: 85px;
	}
	.header .titre {
		margin-top: 0;
		margin-right:20px;
		float:left;
	}
	.header .logos {

    bottom: 0;
	}
	.header .logos img {
		margin-top:5px;	
	}
	.iziModal {
		max-width:700px !important;
	}
	.chat-moderation .header .logos {
		position:absolute;
		top:40px;
		right:60px;
	}
}

@media screen and (min-width: 1200px) 
{
		.header {
	background: transparent url(../img/photos-moderateurs.png) no-repeat left bottom;
    background-position-x: 92px;
	}
    .content .fluidMedia {
        position: inherit;
        padding: inherit;
        height: inherit;
        overflow: inherit;
    }

    .content .fluidMedia .media {
        position: inherit;
    }

    .content .media-box {
        width: 800px;
        height: 450px;
        padding: 0;
        float: left;
        position: relative;
    }

    .content .interact-box {
        height: 450px;
        width: calc(100% - 800px);
        float: left;
    }

	.header .speakers {
		top:15px;
	}
	
	.header .speakers img {
		width:auto;
	}
	
	footer {
		text-align:left;	
	}
}

@media screen and (min-width: 1400px) 
{
    .content .media-box {
        width: 1000px;
        height: 563px;
    }

    .content .interact-box {
        height: 563px;
        width: calc(100% - 1000px);
    }
	
	.header .titre {
		margin-top:0px;	
	}
	
	.header .logos {
		clear: inherit;
		float: left;
		margin-top: 65px;	
	}
	
	.chat-moderation .header .logos {
		float:none;
		margin:inherit;
	}
	
	.header .session-name {
		top:90px;
	}
	
}

@media screen and (min-width: 1600px) 
{
    .content .media-box {
        width: 1200px;
        height: 675px;
    }

    .content .interact-box {
        height: 675px;
        width: calc(100% - 1200px);
    }
	
	.header .titre {
		margin-right: 40px;
	}
	
	.header .logos {
		margin-top:40px;
	}
	
	.header .logos img {
		height:115px;
		margin-top:inherit;
		margin-right:20px;
	}
}