@CHARSET "utf-8";

@media only screen and (-webkit-max-device-pixel-ratio: 1.5),
 only screen and (-o-max-device-pixel-ratio: 3/2),
 only screen and (max--moz-device-pixel-ratio: 1.5),
 only screen and (max-device-pixel-ratio: 1.5) {
 
	.logo-image.icon{display:inline-block;}
	.logo-image.iconGrand{display:none;}  
	body * {image-rendering: -webkit-optimize-contrast;}
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
 only screen and (-o-min-device-pixel-ratio: 3/2),
 only screen and (min--moz-device-pixel-ratio: 1.5),
 only screen and (min-device-pixel-ratio: 1.5) {  
 
	.logo-image.icon {display:none;}
	.logo-image.iconGrand{display:inline-block;} 
	body * {image-rendering: initial;}
}

/*
	HEIGHT
*/

@media all and (max-height:720px) and (max-width: 860px) {
	#connexion-conteneur {min-height: unset; flex-wrap: nowrap;}
}

/*
	WIDTH 
*/

@media all and (max-width:1890px) {
	#insurance-infos {-ms-grid-columns: (300px)[2];grid-template-columns: repeat(2, 300px);}
}

@media all and (max-width:1655px) {
	#download-rooming {-ms-grid-columns: (-webkit-max-content)[2];-ms-grid-columns: (max-content)[2];grid-template-columns: repeat(2, -webkit-max-content);grid-template-columns: repeat(2, max-content);}
	
	#groups {width: 100%; margin-left: 0; margin-right: 0;}
	#groups ul {width: 100%; overflow-x: auto;}
}

@media all and (max-width:1530px) {
	#ctn-invoice-recieve {width: 100%;}
	#payments {-ms-grid-columns: auto;grid-template-columns: auto;}
	.section-infos {padding-right: 50px;}
}

@media all and (min-width:1500px) {
	#ctn-satisfaction > div {top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute;}
}

@media all and (min-width:1410px) {
	#ctn-rooming-available-soon > div {top: 40%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute;}
}

@media all and (max-width:1440px) {
	#notifications {width: 25%;}
	
	#participant-number {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}
	#participant-number > * + * {margin-top: 20px;}
}
	
@media all and (max-width:1410px) {
	.documents > div:not(#contacts) > div {-ms-flex-wrap: wrap;flex-wrap: wrap;}
	.documents > div:not(#contacts) > div > .flex-break {display: block;}
	.documents > div:not(#contacts) > div > .flex-break + *:not(.hidden) + * {margin-left: 0;}
}

@media all and (max-width:1375px) {
	.client-contacts {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}
	.client-contacts > * + * {margin-left: 0 !important; margin-top: 20px !important;}
	.client-contacts > .content:first-child > h4 {margin-top: 0;}
	.client-contacts > .content:last-child {width: 100%;}
}

@media all and (max-width:1350px) {
	#participant-number {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}
	#participant-number > * + * {margin-top: 20px;}
}

@media all and (max-width:1320px) {
	#ctn-search-trip {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}
	#ctn-search-trip > div {width: 360px;}
	#ctn-search-trip > * + * {margin-left: 0; margin-top: 15px;}
}

@media all and (max-width:1230px) {
	#nav-header > div:nth-child(2) {-webkit-box-flex: 3;-ms-flex-positive: 3;flex-grow: 3;}
}

@media all and (max-width:1190px) {
	#connexion-phrase span {font-size:43px; line-height: 45px;}
}

@media all and (max-width:1120px) {
	/* MENU BUGER */
	#nav-header {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; min-height: 160px; position: relative;}
	#nav-header > div:nth-child(1) {-webkit-box-flex: 0;-ms-flex: none;flex: none; width: 100%; height: 110px; border-bottom: 1px solid #fff;}
	#nav-header > div:nth-child(1) img {height: 82%; width: auto;}
	#nav-header > div:nth-child(2) {display: none;}
	#nav-header > div:nth-child(3) {position: absolute; right: 0; bottom: 10px;}
	#nav-header > div:nth-child(4) {position: absolute; left: 0; bottom: 12px;}
	#nav-header .logged-user {padding-right: 30px;}
	
	#notifications {width: 60vw;}
	
	.client-contacts {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}
	.client-contacts > * {max-width: 100%;}
	.client-contacts > * + * {margin-left: 0 !important; margin-top: 20px !important;}
	.client-contacts > .content:first-child > h4 {margin-top: 0;}
	
	.documents > div:not(#contacts) > div {-ms-flex-wrap: nowrap;flex-wrap: nowrap;}
	.documents > div:not(#contacts) > div > .flex-break {display: none;}
	.documents > div:not(#contacts) > div > .flex-break + *:not(.hidden) + * {margin-left: 10px;}
	
	#participants,
	#groups ul {width: calc(100vw - 100px); overflow-x: auto;}
}

@media all and (max-width:1030px) {
	#connexion-phrase-conteneur { width: 50%;}
	#connexion-phrase {font-size: 23px; line-height: 29px; padding:20px 20px 30px;}
	#connexion-phrase span {font-size:37px; line-height: 40px;}
		
	#connexion-contenu {width: 50%;}
	
	#modal-traveler-infos .modal-content {width: 80%;}
	#ctn-traveler-infos-indications > div > label {overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; line-clamp: 3; -webkit-line-clamp: 3; display: -webkit-box; -webkit-box-orient: vertical;}
	#ctn-traveler-infos-indications > div textarea {width: calc(100% - 8px); resize: vertical;}
}

@media all and (max-width:990px) {
	#connexion-phrase {font-size: 19px; line-height: 25px;}
	#connexion-phrase span {font-size:32px; line-height: 33px;}
	
	.documents > div:not(#contacts) > div {-ms-flex-wrap: wrap;flex-wrap: wrap;}
	.documents > div:not(#contacts) > div > .flex-break {display: block;}
	.documents > div:not(#contacts) > div > .flex-break + *:not(.hidden) + * {margin-left: 0;}
	
	#welcome {margin-left: 30px; margin-right: 30px;}
	
	#modal-traveler-documents .modal-content {width: 80%;}
}

@media all and (max-width:930px) {	
	#manage-admin {width: 90%;}
	#search-bar-admin {display: -ms-grid;display: grid; grid-template-areas: "a b ." "c d e";}
	#search-bar-admin > * {margin-left: 0;}
	#search-username {grid-area: a;}
	#search-email {grid-area: b;}
	#search-last-name {grid-area: c;}
	#search-first-name {grid-area: d;}
	#search-bar-admin > .button {grid-area: e;}
	
	#manage-account {width: 90%;}
	
	.retro-planning {-ms-grid-columns: 390px 220px;grid-template-columns: 390px 220px;}
}

@media all and (max-width:930px) {
	#search-username { -ms-grid-row: 1; -ms-grid-column: 1;}
	#search-email { -ms-grid-row: 1; -ms-grid-column: 2;}
	#search-last-name { -ms-grid-row: 2; -ms-grid-column: 1;}
	#search-first-name { -ms-grid-row: 2; -ms-grid-column: 2;}
	#search-bar-admin > .button { -ms-grid-row: 2; -ms-grid-column: 3;}
}

@media all and (max-width:900px) {	
	#welcome .welcome-text {width: 80%;}
	#welcome img {display: none;}
	#welcome-infos {-ms-grid-columns: 1fr;grid-template-columns: 1fr;}
}

@media all and (max-width:860px) {
	#connexion-conteneur { -webkit-box-orient: vertical;-webkit-box-direction: reverse;-ms-flex-direction: column-reverse;flex-direction: column-reverse;}
	#connexion-conteneur::after {background:rgba(0,100,176,0.9); position:absolute; z-index: 11; left: 0; top: 0; width: 100%; height: 100%; display:block; content: "";}
	#connexion-phrase-conteneur { width: 100%; }
	#connexion-phrase::before {margin: 0 0 30px;}
	#connexion-contenu { width: 100%; max-width:100%; max-height: 100vh; padding: 10px; background:none; } 
	#connexion-titre {font-size:17px; line-height: 22px;}
	#connexion-titre span {font-size: 22px; line-height: 27px;}
		
	#connexion-logo {height: auto;}
	#connexion-erreur {left:0; width: calc(100% - 10px);} 
	#connexion-form-contenu .input-text::-webkit-input-placeholder {font-size:17px; } 
	#connexion-form-contenu .input-text,
	#connexion-form-contenu .input-text::placeholder,
	#connexion-form-contenu .input-text::-webkit-input-placeholder,
	#connexion-form-contenu .input-text::-moz-placeholder,
	#connexion-form-contenu .input-text:-ms-input-placeholder,
	#connexion-form-contenu .input-text:-moz-placeholder {font-size:17px; }
	
	#form-add-admin form input {width: 300px;}
	
	.search-bar-trips {padding-left: 50px; padding-right: 50px;}
}

@media all and (max-width:840px) {
	#download-rooming {-ms-grid-columns: (-webkit-max-content)[1];-ms-grid-columns: (max-content)[1];grid-template-columns: repeat(1, -webkit-max-content);grid-template-columns: repeat(1, max-content);}
}

@media all and (max-width:810px) {
	.contact {-ms-grid-columns: (220px)[2];grid-template-columns: repeat(2, 220px);}
}

@media all and (max-width:800px) {
	.form-change-important-date {width: calc(100% - 52px); -webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: start; -ms-flex-align: start; align-items: start;}
	.form-change-important-date > div:last-child {margin-left: 30px !important;}
	.form-change-important-date > .inline-content {word-wrap: anywhere;}
	
	#contacts > div {-ms-flex-wrap: wrap;flex-wrap: wrap;}
	#contacts > div > .flex-break {display: block;}
	#contacts > div > .contact-number {margin-left: 0;}
	
	#reservation-infos {width: auto;}
}

@media all and (max-width:780px) {
	#form-update-traveler-documents {-ms-grid-columns: 1fr;grid-template-columns: 1fr;}
	#form-update-traveler-documents input[type="submit"] {-ms-grid-column: 1;grid-column: 1;}
}

@media all and (max-width:750px) {
	#menu .menu-content {width: 60vw;}
	
	.retro-planning {-ms-grid-columns: 1fr;grid-template-columns: 1fr;}
	
	#insurance-infos {-ms-grid-columns: 1fr;grid-template-columns: 1fr;}
	
	#ctn-satisfaction::before {display: none;}
	#ctn-satisfaction > div {width: 100%;}
	#ctn-satisfaction img {display: block;}
	
	#ctn-rooming-available-soon::before {display: none;}
	#ctn-rooming-available-soon > div {width: 100%; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
	#ctn-rooming-available-soon h4 {text-align: center;}
	#ctn-rooming-available-soon img {display: block;}
}

@media all and (max-width:718px) {
	#download-rooming {-ms-grid-columns: (initial)[1];grid-template-columns: repeat(1, initial);}
}

@media all and (max-width:630px) {
	#account-infos {width: 100%; -ms-grid-columns: -webkit-max-content 1fr; -ms-grid-columns: max-content 1fr; grid-template-columns: -webkit-max-content 1fr; grid-template-columns: max-content 1fr;}
	
	#ctn-general-infos {display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start;}

	#invoice,
	.payment {-ms-grid-columns: 1fr;grid-template-columns: 1fr;}
	
	#form-add-participant {-ms-grid-columns: 1fr;grid-template-columns: 1fr; width: calc(100% - 30px); min-width: 0;}
	#form-add-participant > * {margin-right: 0; width: 100% !important; -webkit-box-sizing: border-box; box-sizing: border-box;}
	#form-add-participant > *:last-child {-ms-grid-column: 1;grid-column: 1;}
}

@media all and (max-width:600px) {
	#contract + div {-ms-flex-wrap: wrap;flex-wrap: wrap;}
	#contract + div > .flex-break {display: block;}
	#contract-signed ~ input[type="file"] + label {margin-left: 0;}
}

@media all and (max-width:585px) {
	#account-update-email {display: -ms-grid;display: grid; -ms-grid-columns: -webkit-max-content 30px 1fr; -ms-grid-columns: max-content 30px 1fr; grid-template-columns: -webkit-max-content 1fr; grid-template-columns: max-content 1fr; grid-gap: 15px 30px;}
	#account-update-email > * {margin: 0;}
	
	.search-bar-trips {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: start; -ms-flex-align: start; align-items: start;}
	.search-bar-trips .select {width: 100%; margin-left: 0;}
}

@media all and (max-width:560px) {
	.documents {margin-left: -30px; margin-right: -30px;}
	
	.contact {-ms-grid-columns: 220px;grid-template-columns: 220px;}
}

@media all and (max-width:530px) {
	#nav-header .logged-user > div:first-child {display: none;}
}

@media all and (max-width:480px) {
	#connexion-form-conteneur {padding: 20px 5px;}
	
	#connexion-phrase {font-size: 17px; line-height: 22px;}
	#connexion-phrase span {font-size:27px; line-height: 29px;}
	
	#account-update-email,
	#account-update-password {display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: start; -ms-flex-align: start; align-items: start;}
	#account-update-password > .button {margin: auto 0;}
	
	#search-bar-admin {display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: start; -ms-flex-align: start; align-items: start;}
	#search-bar-admin > .button {margin-top: 15px;}
	
	.client-contact-infos {margin-left: 10px;}
}

@media all and (max-width:470px) {
	#menu .menu-content {width: calc(100% - 40px);}
}

@media all and (max-width:420px) {
	#connexion-form-contenu .form-ligne .bouton {width: 100%;}
	
	#download-rooming {-ms-grid-columns: 1fr; grid-template-columns: 1fr;}
	#download-rooming > button {width: calc(100% - 20px); text-align: left;}
}

@media all and (max-width:400px) {
	#ctn-search-trip > div {width: 95%;}
	
	.client-contacts > * + * {max-width: 100%; margin-top: 20px !important;}
	.client-contact {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: start;}
	.client-contact + .client-contact {margin-top: 20px;}
	.client-contact-infos {width: 100%; margin-left: 0; margin-top: 5px;}
}

@media all and (max-width:335px) {
	#form-add-admin form input {width: 288px;}
}