/**********************/
/**      Common      **/
/**********************/

.desktop .bg_desktop {
	display: block;
}

.desktop .bg_fullHD {
	display: none;
}
.desktop #header h1 {
	padding-top: 150px;
}

.desktop #header p {
	font-size: 21px;
	text-align: left;
}

.desktop .block {
	width: 1425px;
	padding: 30px 60px;
}

.desktop #frontContainer {
	width: 1425px;
}

.desktop #backContainer {
	width: 1425px;
}


/*  values  */

.desktop #values.block {
	display:block;
	padding: 30px 10px;
}

.desktop .flip-card {
	height: 515px;
	width: 345px;
}

	/* Style the front side (fallback if image is missing) */

.desktop .flip-card-front h3 {
	margin-top: 20px;
}

	/* Style the back side */

.desktop .flip-card-back p {
	font-size: 17px !important;
}

.desktop #valuesMobile {
	display: none;
}

/***** FOOTER *****/

.desktop #footer .contact p {
  font-size: 31px;
  line-height: 40px;
  margin: 6px 0px;
}

.desktop #footer .logo {
  width: 185px;
}

.desktop #footer .text {
    width: 320px;
    margin-left: 65px;
}

.desktop #footer .thumbnail {
  width: 320px;
  height: 300px;
}

.desktop .thumbnail svg {
  width: 150px;
  height: 150px;
}

.desktop .thumbnail span {
  font-size: 18px;
  line-height: 30px;
  display: inline-flex;
  margin-top: 10px;
}

.desktop #footer .contact {
  margin-right: 50px;
  margin-left: 20px;
	padding: 30px;
}

.desktop #footer .layer {
  padding-top: 40px;
  padding-bottom: 40px;
}

.desktop #footer .copyright p {
  font-size: 18px;
  line-height: 35px;
  margin: 6px;
}

/************************/
/*******  Modal  ********/
/************************/

.desktop #modalContainer .modal-content p {
	padding: 11px 0px;
    line-height: 20px;
    margin: 0;
}

.desktop #modalContainer .modal-body {
	padding: 16px;
}

/*.desktop #modalContainer .modal-dialog {
	width: 1000px;
}*/

.desktop #modalContainer .modal-content {
	border-radius: 10px;
}

.desktop #modalContainer .modal-content fieldset {
	border-radius: 10px;
	padding: 10px;
}

.desktop #modalContainer .modal-content legend {
	padding: 0px 5px;
}

.desktop .modal-title {
	margin-bottom: 0px;
}

.desktop .checkboxAvailability {
	width: 128px;
}

.desktop .checkboxAvailability input {
	width: 120px;
	height: 30px;
    margin-top: 4px;
}

.desktop .checkboxAvailability input::before {
	border-radius: 10px;
	width: 120px;
	height: 32px;
}

.desktop input[type="file"]::-webkit-file-upload-button {
	border-radius: 10px;
	padding: 10px 15px;
	font-size: 15px;
}


/******************************/
/**       Tarification       **/
/******************************/

#tarif.desktop #header .headerContent {
	padding: 100px 51px 0px 68px;
}

#tarif.desktop #header .headerContent img {
	height: 600px;
}

#tarif.desktop .card {
	width: 318px;
}

.desktop .accordion p {
	margin: 2px 0px 6px 0px;
}

.desktop .accordion-body p {
	padding: 6px 16px;
}

.desktop .accordion-button:hover, 
.desktop .accordion-button:not(.collapsed):hover {
	padding: 11px 16px;
	font-size: 20px;
}

.desktop .accordion-button {
	padding: 12px 16px;
	border-radius: 0px;
	margin: 0px;
}
/**********************/
/**       Blog       **/
/**********************/

.desktop #carouselPopularBlogs {
	height: 570px;
	margin-top: 0px;
}

.desktop .carousel-item {
	height: 570px;
}

.desktop .carouselTextDiv {
	padding-top: 190px;
}

.desktop .carouselTextDiv p {
	font-size: 21px;
	margin-left: 312px;
	margin-top: 50px;
	margin-bottom: 40px;
	width: 800px;
}

.desktop .carouselTextDiv h3 {
	font-size: 28px;
	margin-top: 10px;
}

.desktop .blogCard {
	border-radius: 10px;
	margin: 10px;
	padding-bottom: 20px;
	width: 633px;
}
  
.desktop .blogCard img{
	width: 631px;
	height: 252px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	margin-bottom: 30px;
}

.desktop .blogCard p{
	margin: 20px;
	font-size: 18px;
}


/**********************/
/***** Blog Post ******/
/**********************/

.desktop .blogHeader {
	height: 570px;
}

.desktop .blogPost {
	padding-left: 120px;
	padding-right: 120px;
}

.desktop .blogPost h1 {
	font-size: 38px;
	margin-bottom: 28px;
}
  
.desktop .blogPost h2 {
	margin-top: 24px;
	margin-bottom: 16px;
}

.desktop .blogPost p {
	font-size: 21px;
	margin-bottom: 12px;
}

.desktop .blogPostQuestion {
	margin-top: 23px;
	font-size: 21px;
}

/****** PROFIL ************/
#profil.desktop .aboutSection div {
	width: 800px;
}

#profil.desktop #word .openQuote {
	margin-left: 0px;
    margin-right: 25px;
    margin-bottom: 280px;
}

#profil.desktop .wordQuote {
	max-width: 1000px;
    margin: 25px 0px;
}

#profil.desktop #word .closeQuote {
    margin-right: 30px;
    margin-left: 25px;
    margin-top: 180px;
}

#profil.desktop #valuesMobile {
	display: none;
}

/**********************/
/**      ACCUEIL     **/
/**********************/

.desktop #pitchMobile {
	display: none;
}

.desktop #metier .textMetier {
	margin-top: 0px;
	margin-inline: 45px;
}

.desktop #metier .textMetier p{
	line-height: 30px;
}

.desktop #prestations .thumbnailContainer {
	overflow: hidden;
	flex-wrap: wrap;
	gap: 15px;
	padding: 30px 10px;
}

.desktop #prestations .thumbnail {
	width: 340px;
}

.desktop #prestations.block {
	padding: 30px 0px;
}

.desktop #prestations {
	gap: 0px;
}


/**********************/
/**** Visio *******/
/**********************/

.desktop.room #mute-btn-card, 
.desktop.room #toggle-camera-btn {
    width: 45px; 
    height: 45px; 
    margin: 0 5px; 
}

.desktop.room #mute-btn-card svg, 
.desktop.room #toggle-camera-btn svg {
	position: absolute;
}


.desktop.room #name-form {
    width: 500px;
    box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
    padding: 10px;
}

#join-btn{
	  margin-top: 25px;
}

.desktop.room #name-form button:not(.mute-btn):not(.camera-btn):not(.join-btn) svg {
	width: 24px;
    height: 24px;
    margin-right: 3px;
    margin-top: 5px;
    margin-bottom: 5px;
    vertical-align: middle;
    float: left;
}

.desktop.room #dropdown{
	height: 60px;
}

.desktop.room .dropdown-toggle::after {
	vertical-align: 2px;
}

.desktop.room #name-form .dropdown-menu{
	width: 480px;
    position: absolute;
    inset: 0px auto auto 0px;
    margin: 0px;
    transform: translate(-15px, 64px);
    border-radius: 15px;
    border: 1px solid #ccc;
}

.desktop.room #name-form .dropdown-item {
	width : 400px;
	padding: 7px 13px;
    font-size: 17px;
	margin: 0px;
}

.desktop.room #localVideoContainer {
	width: 475px;
	height: 250px;
	margin-bottom: 10px;
}

.desktop.room #name-form h1 {
    font-size: 1.4em;
    margin-bottom: 10.5px;
}

.desktop.room #CameraSelector {
	padding-left: 25px;
}

.desktop.room #MicrophoneSelector {
	padding-left: 25px;
}

.desktop.room #name-form input{
	padding: 10px;
	font-size: 1em;
	border-radius: 5px;
	margin-right: 10px;
	margin-top: 2.5px;
}
.desktop.room .mute-icon{
	width: 16px;
	height: 16px;
}

.desktop.room .audio-icon{
	width: 24px;  
	height: 24px;  
	margin-right: 3px;  
	margin-top: 4px;  
	margin-bottom: 4px; 
	margin-left: 4px;  
	vertical-align: middle;  
	float: left;
}


.desktop.room #name-form input,
.desktop.room #name-form select,
.desktop.room #name-form label,
.desktop.room #name-form button:not(.mute-btn):not(.camera-btn):not(.dropdown-item) {
	width: 480px;
	margin-bottom: 12px;
	padding: 7.5px;
	font-size: 20px;
	height: 50px;
	line-height: 35px;
}

.desktop.room #settings label {
	font-size: 20px;
	color: var(--front-color);
}

.desktop.room .dropdown{
	height: 60px;
}

.desktop.room  #local-controls {
	gap: 15px;
	margin-bottom: 15px;
}

.desktop.room .control-btn,
.desktop.room .mute-btn,
.desktop.room .camera-btn {
	width: 50px;
	height: 50px; 
	margin: 0 10px; 
}

.desktop.room  .mute-btn svg,
.desktop.room  .camera-btn svg {
    width: 25px;
    height: 25px;
}


.desktop.room #visio-interface {
	width: 1280px;
	margin: 3vh auto;
}

.desktop.room .video-container {
	width: 1280px;
	height: calc(100% - 118px);
	min-height: 125px;
}
.desktop.room .video-container.small {
    margin-top: 7px;
    height: 145px;
    opacity: 0.9;
}

.desktop.room .roomName {
	margin-top: 30px;
}

.desktop.room .chat-controls button {
	margin-right: 7.5px;
	padding: 3px 7.5px;
	border-radius: 25px;
	font-size: 0.7em;
	width: 40px;
	height: 35px;
}

.desktop.room .controls {
    bottom: 0;
    left: 0;
    width: 1280px;
    height: 65px;
    padding: 7.5px;
    z-index: 10;
}

.desktop.room .controls button {
	margin-right: 11px;
	padding: 6px 11px;
	border-radius: 15px;
	font-size: 0.9em;
	width: 50px;
	height: 45px;
}

.desktop.room .peer-video video {
	width: 100%;
}

.desktop.room .peer-video .name-banner {
	padding: 3px 7.5px;
	/* font-size: 0.8em; */
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

.desktop.room video {
	width: 60%;
}

.desktop.room #chatBox {
      width: 325px;
}

.desktop.room .chatHeader {
    font-size: 0.5em;
    height: 50px;
    letter-spacing: 0.6px;
}

.desktop.room .chatHeader h3{
	font-size : 35px;
}

.desktop.room .chatBoxMessages {
	padding: 7px;      
}

.desktop.room .chatInputContainer {
	height: 65px;
	padding: 0.75px;
}

.desktop.room .chatInput {
	padding: 3%;
    border-radius: 5px;
    font-size: 1em;
	margin: 7px 7px 7px 7px;
	}

.desktop.room .chatSendBtn {
	padding: 7px 10px;
}

.desktop.room .chatBoxMessage {
	margin-bottom: 7px;
	max-width: 250px;
	padding: 7px;
	border-radius: 15px;
	font-size: 0.8em;
	line-height: 1;
}

.desktop.room .chatBoxMessage span {
	font-size: 1em;
}

.desktop.room .chatBoxMessage.sent {
	margin-left: 70px;
}

.desktop.room .chatBoxMessage.received {
	margin-right: 70px;
}

.desktop.room .bubble-received-svg svg{
	bottom:calc(1 * 2px);
	left:calc(6 * -3.3px);
	height:calc(6 * 10px);
	width:calc(6 * 15px);
}

.desktop.room #send-chat-btn svg {
	width: 24px;
	height: 24px;
}

.desktop.room .bubble-send-svg svg{
	bottom:calc(6 * -0.45px);
	right:calc(6 * -2.2px);
	height:calc(6 * 10px);
	width:calc(6 * 15px);
}

.desktop.room .chat-username {
	margin-bottom: 2px;
}

.desktop.room .main-video-container {
    width: 1280px;
    max-height: calc(90% - 185px);
    border-radius: 10px;
}

.desktop.room .main-video-container video {
	border-radius: 10px;
	width: 705px;
}

.desktop.room .video-container .peer-video {
	max-width: 100%;
	max-height: 100%;
	border: 1px solid #272748;
	border-radius: 15px;
}


.desktop.room .main-video-container .name-banner {
	padding: 7.5px 10px;
	font-size: 0.75em;
}

.desktop.room .error-card {
	border-radius: 10px;
	padding: 15px;
	width: 450px;
}


.desktop.room .error-card p {
	font-size: 1em;
	margin-bottom: 20px;
}

.desktop.room .error-card button {
	border-radius: 5px;
	padding: 10px 20px;
	font-size: 0.7em;
}

.desktop.room #visio-interface h1 {
	text-align: center; 
	margin-bottom :auto ;
	line-height :50px; 
}