/* Fichier css pour la page Main.html */
html{
    height: 100%;
    font-size: 12px;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
}
body{
    height: 100%;
    margin: 0;
    background-color: #f5f4f4;
    box-sizing: border-box;
    overscroll-behavior:none;
}
input:focus{
    outline: none;
}


/* CLASS */

.Bouton {
    width: 26px;
    height: 26px;
    cursor: pointer;
}
.BoutonCalendrier {
    float: left;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    background-image: url(../../Images/Contexte/btnCalendrier.png);
    background-repeat: no-repeat;
    text-align: center;
}

/* COULEURS */
.color0 {
    /* Jaune */
    background-color: #f1c40f;
}
.color1 {
    /* Orange */
    background-color: #d25400;
}
.color2 {
    /* Rouge */
    background-color: #c0382a;
}
.color3 {
    /* Rose */
    background-color: #b1265d;
}
.color4 {
    /* Violet */
    background-color: #441b9d;
}
.color5 {
    /* Blue */
    background-color: #0171c5;
}
.color6 {
    /* Vert */
    background-color: #00a285;
}
.color7 {
    /* Vert Clair */
    background-color: #7cb854;
}
.color8 {
    /* Gris foncé */
    background-color: #666666;
}

.FullScreen{
    height: 100%!important;
    padding-top: 0!important;
}

/* HEADER */
.hd_Header{
    position: fixed;
    width: 100%;
    height: 45px;
    right: 0;
    left: 0;
    top: -60px;
    background-color: rgba(255, 255, 255, 0.95);
    z-index: 3;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12);
    border-bottom: 2px solid #2f4f6b;
    box-sizing: border-box;

    transition: top 600ms ease-out;
}
.hd_Header_Affiche{
    top: 0!important;
}
.hd_img_account_setting{
    background-image: url(../../Images/Header/account-setting.svg);
}
.hd_img_account_supervisor{
    background-image: url(../../Images/Header/account-supervisor.svg);
}
.hd_img_face{
    background-image: url(../../Images/Header/face.svg);
}
.hd_Logo{
    float: left;
    width: 240px;
    height: 100%;
    background-image: url(../../Images/Main/so_HORSYS_DIGITAL_hrz.svg);
    background-repeat: no-repeat;
    background-position: 20px center;
    font-weight: bold;
    font-size: 14px;
    box-sizing: border-box;
    background-size: 170px;
}
.hd_LogoPerso{
    float: right;
    width: 150px;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
}
.hd_Menu{
    float: left;
    height: 100%;
    position: relative;
    overflow: hidden;
}
.hd_MnuBtn{
    width: 70px;
    display: inline-block;
    height: 100%;
    text-align: center;
    color: white;
    cursor: pointer;
}
.hd_NewNotify{
    animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
}
.hd_MenuAvatar{
    height: 100%;
    width: 40px;
    display: flex;
    box-sizing: border-box;
    cursor: pointer;
    float: left;
}
.hd_MenuAnnuaire{
    display: none;
}
.hd_MenuImg{
    height: 100%;
    width: 40px;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    box-sizing: border-box;
    float: left;
    background-size: 30px;
}
.hd_MenuLabel{
    background-repeat: no-repeat;
    padding: 0 30px 0 30px;
    background-position: 0 center;
    height: 100%;
}
.hd_MenuLabel > label{
    font-weight: bold;
    padding: 15px 0 0 0;
    display: block;
    box-sizing: border-box;

    /* transition: 200ms padding-top cubic-bezier(0, 0.82, 0, 1); */
    transition: 200ms padding-top ease;
}
.hd_MenuLabel > label:hover{
    cursor: pointer;
}
.hd_MenuLabel > span{
    float: left;
    width: 0%;
    border-radius: 5px;
    height: 5px;
    border-radius: 5px;
    margin: 3px 0 0 0;

    transition: 200ms width ease;
}
/* .hd_MenuLabel > label > label{
    font-style: italic;
    font-size: 10px;
} */
.hd_MenuStd{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    box-sizing: border-box;
    color: #4a4a4b;
}
.hd_MenuStd > .active{
    opacity: 1;
}
.hd_MenuStd > .active > .hd_MenuLabel > label{
    padding-top: 11px;
}
.hd_MenuStd > .active > .hd_MenuLabel > span{
    width: 100%;
}

.hd_NavAccordion{
    display: none;
}
.hd_OptAnnuaire{
    background-image: url(../../Images/Main/Directory_Blue_30.png);
}
.hd_OptBtn{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    top: 0;
}
.hd_OptBubble{
    position: absolute;
	left: 60%;
	top: 54%;
	color: white;
	height: 14px;
	width: 14px;
	border-radius: 20px;
	line-height: 15px;
	font-size: 10px;
	text-align: center;
	font-weight: bold;
}
.hd_OptBubbleAlert{
    background-color: #ff5f47;
}
.hd_OptBubbleInfo{
    background-color: #3598db;
}
.hd_Options{
    float: right;
    height: 100%;
}
.hd_OptMessageNew{
    background-image: url(../../Images/Main/MessageNew_Blue_30.png);
}
.hd_OptMessageNo{
    background-image: url(../../Images/Main/Message_Blue_30.png);
}
.hd_OptFeaturesNew {
	background-position: center !important;
	background-size: 35px !important;
	background-image: url(../../Images/Header/new-solid.svg);
}

.hd_OptFeaturesNo {
	background-position: center !important;
	background-size: 35px !important;
	background-image: url(../../Images/Header/new-line.svg);
}

.hd_OptNotifyNew{
    background-image: url(../../Images/Main/NotifyNew_Blue_25.png);
}
.hd_OptNotifyNo{
    background-image: url(../../Images/Main/Notify_Blue_25.png);
}
.hd_OptUser{
    width: 223px;
}
.hd_OptUserSoc{
    display: inline-block;
    padding-top: 8px;
    width: calc(100% - 50px);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
}
.hd_OptUserUser{
    display: inline-block;
    font-size: 10px;
    width: calc(100% - 50px);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
}
.hd_CtnAvatar{
	width: 50px;
    height: 100%;
    display: flex;
    float: left;
}
.hd_CtnAvatar > div{
	height: 32px;
    width: 32px;
    border-radius: 50%;
    margin: auto;
}
.hd_Other{
    height: 100%;
}
.hd_SignOut{
    float: right;
    padding: 5px;
}
.hd_UnAvatar{
    color: #FFF;
    border-radius: 50%;
    height: 30px;
    width: 30px;
    line-height: 30px;
    font-size: 14px;
    margin: auto;
    position: relative;
    text-align: center;
    cursor: pointer;
}
.hd_UneOpt{
    float: right;
    height: 100%;
    background-repeat: no-repeat;
    background-position: 10px center;
    border-left: 1px solid #2f4f6b;
    padding-left: 50px;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
}
.hd_UneOpt:hover{
    background-color: rgba(47, 79, 107, 0.08);
    transition: background-color 300ms ease-in-out;
}
.hd_UnMenu{
    float: left;
    height: 100%;
    font-size: 14px;
    position: relative;
    opacity: 0.5;
    transition: 200ms opacity cubic-bezier(0, 0.82, 0, 1);
}
.hd_UnMenu:hover{
    opacity: 0.8;
    cursor: pointer;
}
.hd_UnMenu > i{
    width: 5px;
    height: 5px;
    position: absolute;
    top: 6px;
    right: 6px;
    border-radius: 50%;
}
.hd_UnMenu > i.offline{
    background-color: #f44336;
}
.hd_UnMenu > i.online{
    background-color: #4caf50;
}

.IFRAMES{
    width: 100%;
    height: 100%;
    border: 0;
    margin: 0;
    float: left;

    animation: fondu 500ms ease-in-out;
}

/* LOGIN */
.lbl_Titre_Accueil{
    font-size: 40px;
    text-align: right;
    padding-top: 60px;
    padding-right: 40px;
    padding-bottom: 30px;
}
.lbl_Titre_PortailRH{
    font-size: 23px;
    text-align: right;
    padding-right: 40px;
    padding-left: 30px;
}
.lg_Ctn{
    position: absolute;
    width: 38%;
    height: 460px;
    border-radius: 4px;
    top: 50%;
    left: 50%;
    box-shadow: 0 4px 10px 0 rgba(0,0,0,0.2), 0 4px 20px 0 rgba(0,0,0,0.19);
    background-color: white;
    transform: translate(-50%,-50%);
    z-index: 1;
}
.lg_Ctn_Main{
    position:relative;
    float:left;
    height:calc(100% - 40px);
    width:100%;
}
.lg_FlagLanguage{
    float: left;
    width: 20px;
    height: 15px;
    position: absolute;
    left: 5px;
    bottom: 5px;
    background-repeat: no-repeat;
    background-size: contain;
    margin-left:12px;
}
.lg_Footer{
    float: left;
    width: 100%;
    height: 35px;
    box-sizing: border-box;
    position: relative;
    bottom:10px;
}
.lg_Gel{
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
}
.lg_Horloge{
    width: 225px;
    position: absolute;
    left: 50%;
    top:30%;
    transform: translateX(-50%);
}
.lg_img_Fra{
    background-image: url(../../Images/Login/francais.svg);
}
.lg_img_Eng{
    background-image: url(../../Images/Login/anglais.svg);
}
.lg_img_Esp{
    background-image: url(../../Images/Login/espagnol.svg);
}
.lg_img_All{
    background-image: url(../../Images/Login/allemand.svg);
}
.lg_img_Ita{
    background-image: url(../../Images/Login/italien.svg);
}
.lg_last-database{
    background-image: url(../../Images/Login/last-database-24.svg);
}
.lg_last-database-ON{
    background-image: url(../../Images/Login/last-database-24-ON.svg);
}
.lg_Login{
    width: 100%;
    height: 100%;
    position: relative;

    margin-top: -50px;
    opacity: 0;
    transition: all 600ms ease-out;
    z-index:2;
}
.lg_Login .background_Login{
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.65;
    background-color:white;
    background-image:url(../../Images/Login/background_login.jpg);
    background-size:cover;
    background-repeat: no-repeat;
    z-index:0;
}
.lg_Login_Affiche{
    margin-top: 0!important;
    opacity: 1!important;
}
.lg_Logo{
    width: 100%;
    height: 40px;
    background-image: url(../../Images/Login/SoHorsysLogoWhite.png);
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    bottom:0;
    margin-bottom:20px;
    background-size: contain;
}
.lg_Logo_Responsive{
    display:none;
}
.lg_Main{
    width: 100%;
    padding: 60px;
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.lg_Main>.co_BtnConnexion{
    margin-top:40px;
}
.lg_Main .lbl_Titre_Connexion{
    font-size:28px;
    color:#2f4f6b;
    font-weight: 400;
    margin-bottom:10px;
}
.lg_Round{
    width: 151px;
    height: 158px;
    background-image: url(../../Images/Login/bg_round_green.png);
    background-repeat: no-repeat;
    background-position: left top;
    margin: 34px auto;
}
.lg_SectionChoice > .Main{
    float: left;
    width: 100%;
    height: calc(100% - 90px);
    padding: 15px;
    box-sizing: border-box;
    overflow-y: auto;
    overflow-x: hidden;

    transition: all 400ms ease-out;
}
.lg_SectionChoice > .Main > .active{
    z-index: 2!important;
    color: #fff!important;
    background-color: #2f4f6b!important;
    border-color: #2f4f6b!important;
}
.lg_SectionChoice > .Main > .active:hover{
    background-color: #2f4f6b;
}
.lg_SectionChoice > .Main > .last-selected{
    background-repeat: no-repeat;
    background-position: calc(100% - 30px) center;
    background-size: 28px;
}
.lg_SectionChoice > .Main > .list-group-item{
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: -1px;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.125);
    font-size: 14px;
    /* color: #495057; */
    line-height: 30px;
    cursor: pointer;
}
.lg_SectionChoice > .Main > .list-group-item:hover{
    background-color: #f8f9fa;
}
.lg_SectionChoice > .Main > .list-group-item:first-child{
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
}
.lg_SectionChoice > .Main > .list-group-item:last-child{
    border-bottom-left-radius: .25rem;
    border-bottom-right-radius: .25rem;
}
.lg_SectionChoice > .Main > .PwdRules > ul {
    list-style: none;
    padding-left: 30px;
    min-height: 80px;
}
.lg_SectionChoice > .Main > .PwdRules > ul > li {
    height: 16px;
    padding-left: 18px;
    box-sizing: border-box;
    position: relative;
}
.lg_SectionChoice > .Main > .PwdRules > ul > li > span {
    width: 10px;
    height: 10px;
    display: inline-block;
    margin-right: 5px;
    background-color: #ff5f47;
    border-radius: 100%;
    position: absolute;
    left: 0;
    top: 2px;
}
.lg_SectionChoice > .Main > .PwdRules > .Title {
    font-size: 14px;
}
.lg_SectionChoice > .Main > .PwdChange{
    float: left;
    width: 100%;
    padding: 20px 40px 10px 40px;
    box-sizing: border-box;
}
.lg_SectionChoice > .Title{
    float: left;
    width: 100%;
    height: 90px;
    font-size: 24px;
    text-align: center;
    padding: 15px;
    box-sizing: border-box;
    line-height:90px;
    transition: all 400ms ease-out;
}
.lg_SectionLangue,.lg_SectionChoice{
    position: absolute;
    width: 0%;
    height: 0%;
    border-radius: 100%;
    bottom: 0;
    left:45%;
    right: 0;
    background-color: white;
    z-index: 2;

    transition: all 400ms ease-out;
}
.lg_SectionLangue .Main{
    float: left;
    width: 100%;
    height: calc(100% - 55px);
    padding: 15px;
    box-sizing: border-box;
}
.lg_SectionLangue .Main .Title{
    float: left;
    width: 100%;
    height: 50px;
    font-size: 24px;
    text-align: center;
}
.lg_SectionLangue .Main .List{
    float: left;
    width: 100%;
    height: calc(100% - 50px);
}
.lg_SectionLangue .Main .List .UneLangue{
    float: left;
    width: 100%;
    height: 40px;
    border-bottom: 1px solid #b1b1b1;
    position: relative;
    cursor: pointer;
}
.lg_SectionLangue .Main .List .UneLangue:hover{
    background-color: #f3f3f3;
}
.lg_SectionLangue .Main .List .LangueFlag{
    float: left;
    width: 30px;
    height: 22px;
    position: absolute;
    left: 15px;
    bottom: 8px;
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}
.lg_SectionLangue .Main .List .LangueLabel{
    display: block;
    float: left;
    height: 100%;
    width: 100%;
    padding-left: 65px;
    box-sizing: border-box;
    font-size: 20px;
    line-height: 42px;
    cursor: pointer;
}
.lg_SectionLangue .Top{
    float: left;
    width: 100%;
    height: 55px;
    padding: 15px;
    box-sizing: border-box;
}
.lg_SectionLangue .Top{
    float: left;
    width: 100%;
    height: 55px;
    padding: 15px;
    box-sizing: border-box;
}
.lg_SectionLangue .Top .CrossClose{
    float: right;
    position: relative;
    width: 30px;
    height: 24px;
    cursor: pointer;
    opacity: 0;

    transition: all 400ms ease-out;
}
.lg_SectionLangue .Top .CrossClose span {
    display: block;
    position: absolute;
    height: 3px;
    width: 30px;
    background: #2f4f6b;
    left: 0;
    opacity: 1;
}
.lg_SectionLangue .Top .CrossClose .Cross:first-child{
    top: 10px;
    transform: rotate(135deg);
}
.lg_SectionLangue .Top .CrossClose .Cross:last-child{
    top: 10px;
    transform: rotate(-135deg);
}
.lg_SectionLangueActive,.lg_SectionChoiceActive{
    width: 55%!important;
    height: 100%!important;
    border-radius: 0%!important;
}
.lg_Top{
    float: left;
    width: 100%;
    height: 175px;
    background-image: url(../../Images/Login/bg_top_blue.png);
    background-repeat: no-repeat;
    background-position: left top;
    border-radius: 2px;
    display: flex;
}
.lg_User_ico_white{
    width: 100%;
    height: 100%;
    background-image: url(../../Images/Login/ico_User_96_white.png);
    background-repeat: no-repeat;
    background-position: center 24px;
}
.lg_Version{
    color: #777;
    float: right;
    position: absolute;
    right: 5px;
    bottom: 5px;
    margin-right:12px;
}

.LoaderBloquant{
	position:relative;
	width:26px;
	height:auto;
	display:inline-block;
	vertical-align:middle;

	padding:16px;
}
.LoaderBloquantDetail{
	position: relative;
    width: 30px;
    height: 30px;
    margin: 0 auto;
    animation: loading 1.7s linear infinite;
    margin-left: 15px;
}
.LoaderBloquantBubble-1,.LoaderBloquantBubble-2{
	position: absolute;
    top: 0;
    width: 15px;
    height: 15px;
    border-radius: 100%;
    background-color: #2f4f6b;
    animation: bounce 1.7s ease-in-out infinite;
}
.LoaderBloquantBubble-2{
	top: auto;
    bottom: 0;
	animation-delay: -0.8s;
}

.MessageBoxAction{
	display: table-cell;
	vertical-align:middle;

	text-align:center;

	outline:none;
}
.MessageBoxDetailLibelleAffiche{
	max-height: 200px;

	padding-right: 20px;

	overflow-y:auto;
}
.MessageBoxMainLoader{
	border-radius: 2px;
}
/* MAIN */
.mn_Main{
    height: 100%;
    padding: 10px;
    box-sizing: border-box;
}
.mn_IFrame{
    display: none;
    width: 100%;
    height: 100%;
}
/* IMAGES */
.MnuDirectory{
    background-image: url(../../Images/Main/Directory_White_40.png);
}
.MnuGED{
    background-image: url(../../Images/Main/cloud-ged.svg);
}
.MnuGED.active{
    background-image: url(../../Images/Main/cloud-ged_White.svg);
}
.MnuHome{
    background-image: url(../../Images/Main/Home_Dark.svg);
}
.MnuHome.active{
    background-image: url(../../Images/Main/Home_White.svg);
}
.MnuHelp{
    background-image: url(../../Images/Main/Help_Dark.svg);
}
.MnuHelp.active{
    background-image: url(../../Images/Main/Help_White.svg);
}
.MnuMesInfos{
    background-image: url(../../Images/Main/MaFiche.svg);
}
.MnuMesInfos.active{
    background-image: url(../../Images/Main/MaFiche_White.svg);
}

.SignOut_Btn{
    width: 35px;
    height: 35px;
    background-color: #c43b24;
    border-radius: 35px;
    cursor: pointer;
    padding-left: 1px;
    padding-right: 1px;
    box-sizing: border-box;

    background-image: url(../../Images/Main/SignOut_White_24.svg);
    background-repeat: no-repeat;
    background-position: center center;

    -webkit-transition-property: background-color;
    transition-property: background-color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.SignOut_Btn:hover{
    background-color: white;
    border: 1px solid #d0d0d0;
    padding-left: 0;
    padding-right: 0;
    background-image: url(../../Images/Main/SignOut_Red_24.svg);
}
/* USER CONFIG */
.SepartUnElementUserConfig {
    width: 7px;
    height: 100%;
    float: left;
}

.txtConfigUser {
    width: 100%;
    height: 20px;
    float: right;
    margin-top: 2px;
}

.UnElementUserConfig {
    width: 48%;
    height: 100%;
    float: left;
    border-radius: 5px;
    cursor: pointer;
}

.UnElementUserConfigBloc {
    width: 100%;
    float: left;
    padding: 5px;
    box-sizing: border-box;
}

.UnElementUserConfigBlocText {
    width: 100%;
    border-bottom: 1px solid #cfcfcf;
}

.UnElementUserConfigBlocTextUneLigne {
    width: 100%;
    height: 25px;
    padding-left: 3px;
    line-height: 25px;
    background-color: rgba(0, 0, 0, 0.1);
    box-sizing: border-box;
    font-size: 11px;
    overflow: hidden;
}

.UnElementUserConfigBlocTextUneLigneImg {
    float: left;
    height: 23px;
    width: 100%;
    background-repeat: no-repeat;
    padding: 5px 0px 5px 35px;
    box-sizing: border-box;
    background-position: 10px center;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 12px;
}

.UnElementUserConfigBlocTextUneLigneTitre {
    float: left;
    font-weight: bold;
}

.UnElementUserConfigBlocTextUneLigneDetail {
    float: left;
}

.UneLigneElementUserConfigChangeSociete {
    width: 100%;
    height: 35px;
    padding-bottom: 5px;
}

.UnElementUserConfigDetail {
    width: 100%;
    height: 100%;
}

.UnElementUserConfigDetailLogo {
    width: 100%;
    height: 80%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 40px;
}

.UnElementUserConfigDetailLibelle {
    text-align: center;
    font-weight: bold;
    color: white;
}

.UnElementUserConfigDetail:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

.UnElementUserConfigSousMnu {
    width: 100%;
    height: 30px;
    border-bottom: 1px solid #cfcfcf;
    line-height: 30px;
    cursor: pointer;
}

.UnElementUserConfigSousMnu:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

.UnElementUserConfigSousMenuAction {
    width: 30px;
    height: 100%;
    float: right;
    background-position: center;
    background-repeat: no-repeat;
    text-align: center;
}

.UnElementUserConfigSousMenuActionLibre {
    height: 100%;
    float: right;
    background-position: center;
    background-repeat: no-repeat;
    text-align: center;
    padding-right: 8px;
    line-height: 30px;
}

.UnElementUserConfigSousMenuDetail {
    width: 100%;
    background-color: #ECECEC;
    font-size: 11px;
    -webkit-overflow-scrolling: touch;
}

.UnElementUserConfigSousMenuDetailOpt {
    width: 100%;
    height: 30px;
    border-bottom: 1px solid #cfcfcf;
    line-height: 30px;
    cursor: pointer;
}

.UnElementUserConfigSousMenuDetailOptDetail {
    width: 100%;
    height: 100%;
}

.UnElementUserConfigSousMenuDetailOptDetail:hover {
    background-color: rgba(0, 0, 0, 0.1);
}

.UnElementUserConfigSousMenuDetailOptDetailColor {
    width: 30px;
    height: 100%;
    float: left;
    display: table;
}

.UnElementUserConfigSousMenuDetailOptDetailIcon {
    width: 100%;
    display: table-cell;
    padding: 5px;
    vertical-align: middle;
}

.UnElementUserConfigSousMenuDetailOptDetailImg {
    height: 20px;
    border-radius: 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #3a3a3a;
}

.UnElementUserConfigSousMenuDetailOptDetailLibelle {
    max-width: 190px;
    height: 100%;
    float: left;
    overflow: hidden;
    padding-left: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.UnElementUserConfigSousMenuDetailOptDetailOpt {
    width: 30px;
    height: 100%;
    float: right;
    background-position: center;
    background-repeat: no-repeat;
    text-align: center;
}

.UnElementUserConfigSousMenuDetailOptDetailTexte {
    width: 70px;
    height: 100%;
    float: left;
    padding-left: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.UnElementUserConfigSousMenuDetailOptDetailZoneTxt {
    width: 65%;
    height: 100%;
    float: right;
    margin-right: 5px;
    line-height: 30px;
}

.UnElementUserConfigSousMenuLibelle {
    height: 100%;
    float: left;
    padding-left: 10px;
}

.UneLigneElementUserConfig {
    width: 100%;
    height: 80px;
    padding-bottom: 5px;
    padding-left: 5%;
    padding-right: 5%;
    box-sizing: border-box;
}

.UneLigneElementUserConfigChangeSociete {
    width: 100%;
    height: 35px;
    padding-bottom: 5px;
}

.UnSousElementUserConfig {
    width: 100%;
    height: 30px;
}

.UserConfigSectionMainSousMnuButton {
    height: 26px;
    color: #FFF;
    text-align: center;
    line-height: 26px;
    border-radius: 2px;
    cursor: pointer;
}

.UserConfigSectionMainSousMnuFooter {
    position: relative;
    height: 30px;
    box-shadow: 0px 0px 2px black;
    background-color: #D7D7D7;
}

.UserConfigSectionMainSousMnuFooterBtnAppliquer {
    width: 45%;
    height: 25px;
    float: right;
    line-height: 25px;
    border-radius: 2px;
    margin-top: 2px;
    margin-right: 2px;
    text-align: center;
    font-size: 12px;
    cursor: pointer;
    color: white;
}

.UserConfigSectionMainSousMnuFooterBtnAppliquerSousMenu {
    width: 98%;
    height: 26px;
    line-height: 26px;
    border-radius: 2px;
    margin-top: 4px;
    margin-left: 1%;
    margin-right: 1%;
    text-align: center;
    font-size: 12px;
    cursor: pointer;
    color: white;
}

.UserConfigSectionMainSousMnuTittle {
    height: 20px;
    box-shadow: 0px 0px 1px black;
    line-height: 20px;
    cursor: pointer;
}

.UserConfigSectionMainSousMnuTittleImg {
    width: 20px;
    height: 20px;
    float: left;
    background-position: center;
    background-repeat: no-repeat;
}

.UserConfigSectionMainSousMnuTittleLibelle {
    float: right;
    padding-right: 5px;
    color: white;
}

.UserConfigSectionMainSousMnuSection {
    position: relative;
    width: 100%;
    height: 300px;
    display: none;
    overflow-y: auto;
}



/* ID */
#CtnAnnuaire{
    position: absolute;
    top: 45px;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    display: none;
    background-color: rgba(0, 0, 0, 0.70);

    /* transition: 300ms width ease-in-out; */
}
#CtnBtnCloseIFrame {
	height: calc(100% - 18px);
	max-width: 300px;
	margin: 10px 0;
	float: right;
	border-left: 1px solid #BDBDBD;
	padding: 0 15px;
	box-sizing: border-box;
}

#CtnBtnCloseIFrame>span {
	display: block;
	min-width: 32px;
	height: 32px;
	border-radius: 32px;
	box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.3);
	background-color: #FFF;
	transform: scale(1);
	transition: all .2s ease-out;
	padding-right: 40px;
	padding-left: 20px;
	background-image: url(../../Images/Commun_V10/close_black.svg);
	background-repeat: no-repeat;
	background-position: right 8px center;
	box-sizing: border-box;
	line-height: 32px;
	cursor: pointer;
}
#CtnPicker {
    z-index: 999;
    position: absolute;
    width: auto;
    height: auto;
    background-color: #FFF;
    display: none;
    visibility: hidden;
    box-shadow: 1px 1px 3px #666;
    cursor: crosshair;
}
#dvBlocagePageDialogue {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: black;
	opacity: 0.5;
	z-index: 3;
	display: none;
}
#ListIFRAME{
    width: 100%;
    height: 100%;
}
#loaderConnexion{
    position: absolute;
    top: 13px;
    left: 25px;
}
#MessageBox{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:none;

	background-color:rgba(0, 0, 0, 0.3);

	/* z-index:21; cf CommunV10 et charte graphique*/
}
#MessageBoxMain{
	position:fixed;
	top:50%;
	left:50%;
	display: table;

	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24)

    z-index:20;
    background-color: #FFF;

    transform: translate(-50%,-50%);
}
#MessageBoxAction{
	width:100%;
	height:30px;
	display: table-row;

	margin:15px;

	color:white;
	cursor:pointer;
}
#MessageBoxDetail{
	display: table;
}
#MessageBoxDetailLoader{
	display: table;
}
#MessageBoxDetailProgressBar{
	width: 100%;
	display: table;
	min-width:60px;
}
#MessageBoxDetailIcon{
	width:26px;
	padding-left:15px;
	display: table-cell;

	background-repeat:no-repeat;
	background-position:center center;

	opacity:0.3;
}
#MessageBoxDetailLibelle{			/*RSP*/   
    text-align: center;
	padding: 20px 15px 20px 20px;
	min-width: 250px;

	overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
#MessageBoxQuestion{
	width:100%;
	height:30px;
	display: table;

	color:white;
	cursor:pointer;
}
#MessageBoxQuestionAction{
	display: table-row;
}
#MessageBoxTitre{
	display: table;
	width: 100%;
}
#MessageBoxTitreLibelle{
	display: table-cell;
	max-width:300px;
	min-width: 250px;

	padding-left:5px;
	padding-top:5px;
	padding-right:10px;

	text-align:right;
	font-style: italic;
	font-size: 10px;

	opacity:0.8;
}
#mnu_resp_navbar{
    background-color: #2f4f6b;
    height: 100%;
    margin: 0;
    z-index: 2;
    width: 0;
    position: fixed;
    right: 0;
    top: 0;
    padding-top: 45px;
    padding-left: 0;
    box-sizing: border-box;
}
#mnu_resp_navbar>li {
    list-style: none;
    font-size: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: rgba(255, 255, 255, 0.44);;
    cursor: pointer;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
#mnu_resp_navbar>li:hover{
   color: #FFF;
}
#mnu_resp_navbar>li>label>label {
    display: none;
}
#mnu_resp_navbar.open{
    width: 300px;
    padding-top: 45px;
    padding-left: 40px;
    overflow-y: auto;
}
#mnu_responsive {
    width: 30px;
    height: 24px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    
    cursor: pointer;
}
#mnu_responsive span {
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    background: #2f4f6b;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}
#mnu_responsive span:nth-child(1) {
    top: 0px;
}
#mnu_responsive span:nth-child(2) {
    top: 10px;
}
#mnu_responsive span:nth-child(3) {
    top: 20px;
}
#mnu_responsive.open span:nth-child(1) {
    background: #FFF;
    top: 10px;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
}
#mnu_responsive.open span:nth-child(2) {
    background: #FFF;
    opacity: 0;
  left: -60px;
}
#mnu_responsive.open span:nth-child(3) {
    background: #FFF;
    top: 10px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

#MySpace{
    width: 100%;
    height: 100%;
    opacity: 1;
    position: relative;
    z-index: 0;

    transition: opacity 400ms ease-out;
}
#MySpace .btnActionDockOptionPage {
    width: 35px;
    height: 100%;
    float: right;
    border-top-right-radius: 5px;
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
}
#MySpace .btnActionDockOptionPageInfo {
    width: 35px;
    height: 100%;
    float: right;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    background-image: url(../../Images/Main/icon_info_white.png);
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
}
#MySpace .btnActionDockOptionPageMini {
    width: 35px;
    height: 100%;
    float: right;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
}
#MySpace .btnInfoDockSalarie {
    width: 35px;
    height: 35px;
    float: left;
    border-radius: 5px;
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
}
#MySpace .cboDockOptionPage {
    height: 30px;
    float: left;
}
#MySpace .cboDockOptionPageDetail {
    width: 100%;
    height: 26px;
    margin-top: 5px;
}
#MySpace .ClosePopup {
    width: 35px;
    height: 100%;
    float: right;
    background-image: url(../../Images/Contexte/chevron_bas.png);
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
}
#MySpace .ColorMenuDockOptionPageInfo {
    background-color: #428bca;
}
#MySpace .ColorMenuDockOptionPageInfo:hover {
    /* Bleu clair Hover */
    background-color: #62a7e3;
}	
#MySpace .DockOptionPageElement {
    float: left;
}
#MySpace .DockOptionPageSousElement {
    float: left;
}
#MySpace .DockOptionPageSepareElement {
    width: 10px;
    height: 100%;
    float: left;
}
#MySpace .DockZoomDetail {
    position: relative;
    height: 26px;
    float: left;
}
#MySpace .DockZoomImg {
    position: absolute;
    height: 100%;
    width: 4px;
    float: left;
    background-repeat: no-repeat;
    background-position: center center;
}
#MySpace .DockZoomImgLeft {
    right: 0px;
    background-image: url(../../Images/Main/imgZoomLeft.png);
}
#MySpace .DockZoomImgRight {
    left: 0px;
    background-image: url(../../Images/Main/imgZoomRight.png);
}
#MySpace .DockZoomTxt {
    height: 20px;
    background-color: white;
    font-size: 12px;
    text-align: center;
    padding: 2px;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(169, 169, 169);
    border-image: initial;
    border-radius: 0px;
}	
#MySpace .FlecheDate {
    position: relative;
    width: 11px;
    height: 35px;
    float: left;
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
}
#MySpace .FlecheGaucheDatePopMarge {
    margin-left: 10px;
}
#MySpace .FullScreenMode{
    width: 100%!important;
    margin-left: 0!important;
}
#MySpace .imgPreferencesMini {
	background-image: url(../../Images/Main/icon_Preference_mini.png);
}
#MySpace .imgArrowDownGrey16 {
    background-image: url(../../Images/Menus_V9/ArrowDown.svg);
}
#MySpace .imgDeclarationGrey24 {
    background-image: url(../../Images/Menus_V9/Declaration.svg);
}
#MySpace .imgDemandeGrey24 {
    background-image: url(../../Images/Menus_V9/Demande.svg);
}
#MySpace .imgEditionGrey24 {
    background-image: url(../../Images/Menus_V9/Edition.svg);
}
#MySpace .imgHBoardGrey24 {
    background-image: url(../../Images/Menus_V9/HBoard.svg);
}
#MySpace .imgMouvementGrey24 {
    background-image: url(../../Images/Menus_V9/Mouvement.svg);
}
#MySpace .imgObjectCercle {
    background-image: url(../../Images/Main_V2/sohorsys-objets-cercle.svg);
}
#MySpace .imgObjectReveil {
    background-image: url(../../Images/Main_V2/sohorsys-reveil.svg);
}
#MySpace .imgUserCardGrey {
    background-image: url(../../Images/Menus_V9/MaFiche.svg);
}

#MySpace .imgEDocumentsGrey24{
    background-image: url(../../Images/Menus_V9/eDocuments.svg);
}

#MySpace .LibelleDate {
    width: 195px;
    height: 100%;
    float: left;
    line-height: 35px;
    text-align: center;
    cursor: pointer;
}
#MySpace .mnuDockOptionsInfoDetail {
    height: 100%;
    float: left;
    display: block;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    /*background-color: #686767;*/
}
#MySpace .mnuDockOptionPageAction {
    /* RSP */
    height: 100%;
    float: left;
    display: block;
}
#MySpace .mnuDockOptionPageDetail {
    height: 100%;
    float: left;
    display: block;
    padding-left: 10px;
    padding-top: 3px;
    padding-right: 10px;
    padding-bottom: 3px;
}
#MySpace .mnuDockOptionPageDetailDatePeriode {
    float: left;
    margin-top: 4px;
}
#MySpace .mnuDockOptionPageDetailDetailPeriode {
    position: relative;
    width: 100%;
    height: 100%;
    float: left;
    min-width: 300px;
    padding-right: 5px;
}
#MySpace .mnuDockOptionPageDetailLibelle {
    float: left;
    line-height: 35px;
    padding-left: 5px;
    padding-right: 5px;
}
#MySpace .mnuDockOptionPageDetailLibelleSeparateurMoisAnnee {
    float: left;
    line-height: 20px;
    margin-top: 5px;
    padding-left: 5px;
    padding-right: 5px;
}
#MySpace .mnuDockOptionPageDetailTxtAnneePeriode {
    width: 40px;
    height: 20px;
    float: left;
    margin-top: 3px;
    border: 0;
    background-color: white;
}
#MySpace .mnuDockOptionPageDetailTxtDatePeriode {
    width: 70px;
    height: 20px;
    float: left;
    padding: 3px;
    border: 0;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    background-color: white;
    font-size: 12px;
}
#MySpace .mnuDockOptionPageDetailTxtMoisPeriode {
    width: 20px;
    height: 20px;
    float: left;
    margin-top: 3px;
    border: 0;
    background-color: white;
}
#MySpace .mnuDockOptionPageOptPlusLabel {
    width: 100%;
    float: left;
    text-align: center;
    line-height: 24px;
    text-decoration: underline;
    color: #505050;
    cursor: pointer;
}
#MySpace .popDockFiltre {
    width: 100%;
    height: 35px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
#MySpace .popInfoPageMainUneLigne {
    width: 100%;
    height: 30px;
    padding-bottom: 5px;
}
#MySpace .popInfoPageMainUneLigneLegende {
    width: 40px;
    height: 26px;
    float: left;
}
#MySpace .popInfoPageMainUneLigneLegendeLibelle {
    height: 26px;
    line-height: 26px;
    float: left;
    padding-left: 10px;
}
#MySpace .popInfoPageMainUneLigneLegendeTitre {
    height: 100%;
    padding-left: 9px;
    border-radius: 2px;
    background-color: #909090;
    color: white;
    line-height: 30px;
}
#MySpace .popInfoPageMainUneLigneLegendePastille {
    height: 20px;
    width: 20px;
    border-radius: 20px;
    margin: auto;
    border: 1px solid #808080;
}
#MySpace .popInfoPageMainUneLigneLegendeSymbole {
    width: 40px;
    height: 26px;
    float: left;
    border: 1px solid white;
    background-position: center;
    background-repeat: no-repeat;
}
#MySpace .TitrePopup {
    height: 35px;
    line-height: 35px;
    float: left;
    padding-left: 5px;
    color: white;
}
#MySpace .mnuDockOptionsPageMiniDetail {
    height: 100%;
    float: left;
    display: block;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    box-shadow: 0px 0px 3px black;
}
#MySpace > .mn_GelMenu {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
    background-color: rgba(0, 0, 0, 0.70);
	z-index: 6;

    transition: 200ms background-color cubic-bezier(0, 0.82, 0, 1);
}
#MySpace > .mn_GelMenuOpen {
	width: 100%;
	height: 100%;
}
#MySpace > .mn_Menu {
    position: absolute;
    left: -240px;
    top: 0;
    width: 240px;
    height: 100%;
    float: left;
    background-color: #FFF;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    z-index: 7;
    transition: 200ms left cubic-bezier(0, 0.82, 0, 1);
}
#MySpace > .mn_Menu .Top {
    width: 100%;
    height: 130px;
    position: relative;
    overflow: hidden;
}
#MySpace > .mn_Menu .Top .btnCloseRespMnu {
    position: absolute;
    width: 30px;
    height: 30px;
    right: 0;
    box-sizing: border-box;
    background-image: url(../../Images/InfosPage/CloseMenuRsp.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    cursor: pointer;
    z-index: 1;
    display: none;
}
#MySpace > .mn_Menu .Top .img01 {
    position: absolute;
    width: 134px;
    height: 109px;
    background-repeat: no-repeat;
    top: 15px;
    left: 0;
    background-size: cover;
    transform: rotate(-30deg);
}
#MySpace > .mn_Menu .Top .img02 {
    position: absolute;
    width: 106px;
    height: 120px;
    background-repeat: no-repeat;
    top: 11px;
    right: 0;
    background-size: cover;
}
#MySpace > .mn_Menu .Top .Name {
    position: absolute;
    width: 100%;
    height: 40px;
    bottom: 0;
    padding-top: 12px;
    padding-left: 8px;
    box-sizing: border-box;
    padding-right: 8px;
}
#MySpace > .mn_Menu>ul {
    list-style: none;
    position: relative;
    width: 100%;
    height: calc(100% - 130px);
    padding: 15px 0 0 0;
    margin: 0;
    box-sizing: border-box;
    overflow-y: auto;
}
#MySpace > .mn_Menu>ul .active {
    background-color: rgba(221, 221, 221, 0.56);
}
#MySpace > .mn_Menu>ul .active:hover {
    background-color: #ddd!important;
}
#MySpace > .mn_Menu>ul .UnMenuGen {
    width: 100%;
    height: 42px;
    padding: 0 15px 0 15px;
    box-sizing: border-box;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#MySpace > .mn_Menu>ul .UnMenuGen:hover {
    background-color: #f5f5f5;
    cursor: pointer;
}
#MySpace > .mn_Menu>ul>li {
    float: left;
    width: 100%;
    line-height: 42px;
    margin-top: 1px;
    border-right: 1px solid #e7e7e2;
    box-sizing: border-box;
    position: relative;
    color: #444;
    font-size: 14px;
}
#MySpace > .mn_Menu>ul>li>ul {
    list-style: none;
    position: relative;
    width: 100%;
    margin: 0;
    box-sizing: border-box;
    height: 0;
    overflow: hidden;
    padding: 0;
    font-size: 12px;
    color: #0F2B6E;

    transition: 200ms height cubic-bezier(0, 0.82, 0, 1);
}
#MySpace > .mn_Menu>ul>li>ul>li {
    padding: 0 0 0 61px;
}
#MySpace > .mn_Menu>ul>li>ul>li:hover {
    background-color: #f5f5f5;
    cursor: pointer;
}
#MySpace > .mn_Menu>ul>li label {
    display: block;
    float: left;
    width: calc(100% - 56px);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#MySpace > .mn_Menu>ul>li .indicator {
    position: absolute;
    top: -1px;
    left: 0;
    height: 100%;
    width: 4px;
    opacity: 1;
    z-index: 1;
}
#MySpace > .mn_Menu>ul>li .imgMenu {
    width: 30px;
    height: 100%;
    display: block;
    margin-right: 10px;
    float: left;
    background-position: center center;
    background-repeat: no-repeat;
}
#MySpace > .mn_Menu>ul>li .arrowMenu {
    width: 16px;
    height: 100%;
    float: right;
    background-position: center center;
    background-repeat: no-repeat;
    transition: 200ms transform cubic-bezier(0, 0.82, 0, 1);
}
#MySpace > .mn_MenuOpen {
    left: 0;
}
#MySpace > .mn_Main {
    width: calc(100% - 240px);
    height: 100%;
    float: left;
    position: relative;
    overflow: hidden;
    margin-left: 240px;
    box-sizing: border-box;
    transition: 200ms all ease-in-out;
    padding: 0;
}
#MySpace > .mn_Main .bgReveil {
    position: absolute;
    width: 56%;
    height: 116%;
    background-repeat: no-repeat;
    top: -45px;
    right: 0;
    background-size: cover;
    opacity: 0.3;
    z-index: -1;
}
#MySpace > .mn_Main .bgCercleTop {
    position: absolute;
    width: 15%;
    height: 53%;
    background-repeat: no-repeat;
    top: 145px;
    left: -10px;
    background-size: contain;
    opacity: 0.3;
    z-index: -1;
    min-width: 150px;
}
#MySpace > .mn_Main .IFRAME {
    width: 100%;
    height: 100%;
    border: none;
}

#MySpace > .mn_Main .TopMain {
    float: left;
    width: 100%;
    height: 50px;
    box-sizing: border-box;
    padding-left: 10px;
}
#MySpace > .mn_Main .TopMain .UnMenuRsp{
    position: relative;
    width: 50px;
    box-sizing: border-box;
    background-position: 10px center;
    background-repeat: no-repeat;
    height: 100%;
    float: left;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 300ms ease;
    display: none;
}
#MySpace > .mn_Main .TopMain > .ShowMnuAction {
	opacity: 1 !important;
	transform: scale(1) !important;
}
#MySpace > .mn_Main .TopMain > .DragStart {
	border: 1px dashed #808080 !important;
	background-color: #f3f3f3 !important;
	border-radius: 2px !important;
}
#MySpace > .mn_Main .TopMain > #btnMnuAction{
    position: relative;
    height: 100%;
    width: 50px;
    box-sizing: border-box;
    background-image: url(../../Images/InfosPage/Menu.svg);
    background-position: center center;
    float: right;
    opacity: 0.8;
    background-repeat: no-repeat;
}
#MySpace > .mn_Main .TopMain > #btnMnuAction:hover{
    opacity: 1;
    cursor: pointer;
}
#MySpace > .mn_Main .TopMain > #lstMenuRaccoucis{
    height: 100%;
    float: left;
    padding-left: 10px;
    padding-right: 10px;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    border: 1px solid #e4e4e4;
    transition: all 0.2s ease;
}
#MySpace > .mn_Main .TopMain > #lstMenuRaccoucis > #mnuRaccourcis {
	width: 100%;
	height: 100%;
	transition: all 0.3s ease;
	margin: auto;
}
#MySpace > .mn_Main .TopMain > #lstMenuRaccoucis > #mnuRaccourcis > .UnRaccourciCtn {
	width: 30px;
	border-radius: 50%;
	box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.3);
	background-color: #FFF;
	margin: 10px 5px 10px 5px;
	transform: scale(1);
	transition: all .2s ease-out;
	height: calc(100% - 18px);
	float: right;
}
#MySpace > .mn_Main .TopMain > #lstMenuRaccoucis > #mnuRaccourcis > .UnRaccourciCtn:hover {
	transform: scale(1.2);

	box-shadow: 0 4px 11px 0px rgba(0, 0, 0, 0.375);
}
#MySpace > .mn_Main .TopMain > #lstMenuRaccoucis > #mnuRaccourcis > .UnRaccourciCtn > .mnuActionDetail {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center center;
}
#MySpace > .mn_Main .TopMain > #lstMenuRaccoucis > #mnuRaccourcis > .UnRaccourciCtn > .UnRaccourci {
	background-size: 18px;
}

#MySpace > .mn_Main .TopMain > #mnuDropAction{
    position: absolute;
    right: 10px;
    margin-top: 45px;
    background-color: white;
    box-sizing: border-box;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    color: #4a4a4b;
    font-size: 12px;
    border-radius: 2px;
    overflow: hidden;
    padding: 10px 0;
    min-width: 150px;
    transition: all 0.2s ease;
    opacity: 0;
    transform: scale(0);
    transform-origin: right top 0px;
    z-index: 9;
}
#MySpace > .mn_Main .TopMain > #mnuDropAction  .mnuAction {
    height: 35px;
    cursor: pointer;
    list-style-type: none;
}
#MySpace > .mn_Main .TopMain > #mnuDropAction  .mnuAction:hover {
    background-color: #ebebeb;
}
#MySpace > .mn_Main .TopMain > #mnuDropAction  .mnuAction > .imgAction {
    width: 40px;
    height: 100%;
    float: left;
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer;
    background-size: 26px;
}
#MySpace > .mn_Main .TopMain > #mnuDropAction .mnuTitleAction {
    position: relative;
    height: 15px;
    top: 11px;
    text-align: left;
    padding-left: 42px;
    padding-right: 10px;
}
#MySpace > .mn_Main .TopMain > #mnuDropAction  .mnuActionGroup {
	background-image: url(../../Images/Main/Group.png);
	background-position: 95% center;
	background-repeat: no-repeat;
}
#MySpace > .mn_Main .TopMain > #mnuDropAction  .mnuGroup {
    height: 100%;
    display: none;
    border-top: 1px solid #333333;
    background-color: white;
    visibility: hidden;
    color: #666666;
}


#MySpace #btnDockInfoResp{
    background-image: url(../../Images/InfosPage/Info.svg);
}
#MySpace #btnDockOptionPageResp {
    background-image: url(../../Images/InfosPage/OptionPage.svg);
}
#MySpace #btnMenuRespMySpace {
    position: relative;
    width: 50px;
    box-sizing: border-box;
    background-position: 10px center;
    background-repeat: no-repeat;
    height: 100%;
    float: left;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 300ms ease;
    background-image: url(../../Images/InfosPage/MenuRsp.svg);
    display: none;
}
#MySpace #DockPopup {
	position: fixed;
	z-index: 2;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;

	background-color: rgba(0, 0, 0, 0.6);
	display: none;
}
#MySpace #DockPopup>.UnPopup {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: white;
	box-shadow: 0px 0px 5px #575757;
	display: inline-block;
	text-align: left;
	width: 100%;
    /* max-width: 400px; */
    max-width:500px;
}
#MySpace #DockPopup>.UnPopup>.Top {
	width: 100%;
	min-height: 50px;
	background-color: #f7f7f7;
	border-bottom: 1px solid #d6d6d6;
	border-top: 1px solid #d6d6d6;
}
#MySpace #DockPopup>.UnPopup>.Top>label {
	padding: 15px;
	float: left;
	font-weight: 600;
	font-size: 17px;
	text-transform: uppercase;
}
#MySpace #DockPopup>.UnPopup>.Top>.btnClose {
	position: absolute;
	top: 8px;
	right: 7px;
	background-image: url(../../Images/Commun_V10/close_black.svg);
	background-repeat: no-repeat;
	opacity: 0.6;
	background-size: 25px;
	cursor: pointer;
	padding: 20px 20px 20px 50px;
	transition: opacity 0.3s ease;
	background-position: right top;
}
#MySpace #DockPopup>.UnPopup>.Top>.btnClose:hover {
	opacity: 1;
}
#MySpace #DockPopup>.UnPopup>.Body {
	padding: 20px 20px 20px 20px;
	overflow-y: auto;
	width: calc(100% - 40px);
	height: calc(100% - 190px);
}
#MySpace #gelDockOptionPage,#MySpace #gelDockOptionInfo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: none;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 1;
}
#MySpace #IFRAMES {
    float: left;
    width: 100%;
    height: calc(100% - 50px);
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
}
#MySpace #PAGES {
    float: left;
    width: 100%;
    height: calc(100% - 70px);
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
    padding: 0 10px 10px 10px;
    box-sizing: border-box;
}
#MySpace #lblNameSal {
    float: left;
    width: 100%;
    text-align: center;
    color: #FFF;
    font-size: 16px;
    font-weight: bold;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    letter-spacing: .8px;
}
#MySpace #mnuActionPlanning3 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10008.svg);
}
#MySpace #mnuActionPlanning29 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10029.svg);
}

/* MENU ACTION */
#MySpace #mnuAction1 {
	background-image: url(../../Images/Actions/Action1.svg);
}
#MySpace #mnuAction2 {
	background-image: url(../../Images/Actions/Action2.svg);
}
#MySpace #mnuAction3 {
	background-image: url(../../Images/Actions/Action3.svg);
}
#MySpace #mnuAction9 {
	background-image: url(../../Images/Actions/Action9.svg);
}
#MySpace #mnuAction10 {
	background-image: url(../../Images/Actions/Action10.svg);
}
#MySpace #mnuAction12 {
	background-image: url(../../Images/Actions/Action12.svg);
}
#MySpace #mnuAction16 {
	background-image: url(../../Images/Actions/Action16.svg);
}
#MySpace #mnuAction17 {
	background-image: url(../../Images/Actions/Action17.svg);
}
#MySpace #mnuAction22 {
	background-image: url(../../Images/Actions/Action22.svg);
}
#MySpace #mnuAction23 {
	background-image: url(../../Images/Actions/Action23.svg);
}
#MySpace #mnuAction24 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10001.svg);
}
#MySpace #mnuAction25 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10007.svg);
}
#MySpace #mnuAction26 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10002.svg);
}
#MySpace #mnuAction27 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10008.svg);
}
#MySpace #mnuAction28 {
	background-image: url(../../Images/Actions/Action28.svg);
}
#MySpace #mnuAction30 {
	background-image: url(../../Images/Actions/Action30.svg);
}
#MySpace #mnuAction31 {
	background-image: url(../../Images/Actions/Action31.svg);
}
#MySpace #mnuAction32 {
	background-image: url(../../Images/Actions/Action32.svg);
}
#MySpace #mnuAction33 {
	background-image: url(../../Images/Actions/Action33.svg);
}
#MySpace #mnuAction34{
	background-image: url(../../Images/Actions/Action34.svg);
}
#MySpace #mnuAction100 {
	background-image: url(../../Images/Actions/Action100.svg);
}
#MySpace #mnuAction101 {
	background-image: url(../../Images/Actions/Action101.svg);
}
#MySpace #mnuAction101White {
	background-image: url(../../Images/Actions/Action101.svg);
}
#MySpace #mnuAction102 {
	background-image: url(../../Images/Actions/Action102.svg);
}
#MySpace #mnuAction102White {
	background-image: url(../../Images/Actions/Action102.svg);
}
#MySpace #mnuAction103 {
	background-image: url(../../Images/Actions/Action103.svg);
}
#MySpace #mnuAction103White {
	background-image: url(../../Images/Actions/Action103.svg);
}
#MySpace #mnuAction104 {
	background-image: url(../../Images/Actions/Action104.svg);
}
#MySpace #mnuAction105 {
	background-image: url(../../Images/Actions/Action105.svg);
}
#MySpace #mnuAction1000 {
	background-image: url(../../Images/Actions/Action1000.svg);
}
#MySpace #mnuAction1001 {
	background-image: url(../../Images/Actions/Action104.svg);
}
#MySpace #mnuAction1002 {
	background-image: url(../../Images/Actions/Action1002.svg);
}
#MySpace #mnuAction1003 {
	background-image: url(../../Images/Actions/Action1003.svg);
}
#MySpace #mnuAction1020 {
	background-image: url(../../Images/Actions/Action1020.svg);
}
#MySpace #mnuAction20000 {
	background-image: url(../../Images/Main/Action20000.png);
}
#MySpace #mnuActionPlanning3 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10008.svg);
}
#MySpace #mnuActionPlanning29 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10029.svg);
}
#MySpace #mnuActionPlanning34 {
	background-image: url(../../Images/Actions/Action34.svg);
}
#MySpace #mnuActionPlanning10001 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10001.svg);
}
#MySpace #mnuActionPlanning10002 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10002.svg);
}
#MySpace #mnuActionPlanning10003 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10003.svg);
}
#MySpace #mnuActionPlanning10004 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10004.svg);
}
#MySpace #mnuActionPlanning10005 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10005.svg);
}
#MySpace #mnuActionPlanning10006 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10006.svg);
}
#MySpace #mnuActionPlanning10007 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10007.svg);
}
#MySpace #mnuActionPlanning10008 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10008.svg);
}
#MySpace #mnuActionPlanning10010 {
	background-image: url(../../Images/Actions/Planning/ActionPlanning10010.svg);
}
#MySpace #mnuDock {
    position: absolute;
    left: 7%;
    bottom: 0px;
    min-height: 40px;
    z-index: 5;
}
#MySpace #mnuDockDockOptions {
    position: relative;
    height: 100%;
    float: left;
    margin-left: 1%;
}
#MySpace #mnuDockOptionsInfo {
    position: relative;
    height: 40px;
    float: left;
    margin-left: 10px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: 0px 0px 3px black;
    background-color: #bec3c7;
    display: none;
}
#MySpace #mnuDockOptionsPage {
    height: 100%;
}
#MySpace #mnuDockOptionsPageMain {
    position: relative;
    height: 100%;
    float: left;
    min-height: 40px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: 0px 0px 3px black;
    background-color: #bec3c7;
}
#MySpace #mnuDockOptionsMiniButton {
	display: none;
}
#MySpace #NamePage {
    color: #444;
    font-size: 20px;
    float: left;
    position: relative;
    padding: 0 10px 0 20px;
    padding-top: 4px;
    box-sizing: border-box;
    margin: 10px 0 10px 0;
    height: calc(100% - 20px);
}
#MySpace #NamePage .indicator {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 4px;
}
#MySpace #popInfoPage {
    position: absolute;
    /* width: 100%; */
    bottom: 41px;
    left: 0;
    display: none;
    visibility: hidden;
    z-index: 1;
}
#MySpace #popInfoPageDetail {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: 0px -1px 3px black;
}
#MySpace #popInfoPageMain {
    padding: 10px 5px 10px 5px;
    background-color: white;
    overflow-y: auto;
    max-height: 170px;
    -webkit-overflow-scrolling: touch;
}

/* SECTION */
#SectionAccueil{
    width:42%;
    background-color:#2f4f6b;
    color:white;
    height:110%;
    float:right;
    margin-top:-28px;
    position:relative;
    border-radius: 4px;
    box-shadow: 0 4px 10px 0 rgba(0,0,0,0.2), 0 4px 20px 0 rgba(0,0,0,0.19);
    z-index:1;
}
#SectionDashboard{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: -1;
}
#SectionIdent{
    width:55%;
    height:100%;
    float:right;
    position: relative;
}
#SectionLogin{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: -1;
}
#SectionMain{
    height: calc(100% - 45px);
    width: 100%;
    padding-top: 45px;
}

#UserConfigMain {
    /*RSP*/
    width: 300px;
    height: 500px;
    position: absolute;
    top: -50px;
    border-radius: 2px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    background-color: white;
    z-index: 2;
    display: none;
    transition: 200ms all ease-in-out;
}
#UserConfigMnu {
    float: right;
    display: table;
    border-left: 1px solid #737272;
}
#UserConfigCboChangeSociete {
    width: 92%;
    height: 25px;
    margin-left: 4%;
    margin-right: 4%;
}
#UserConfigMnu:hover {
    background-color: #EAEAEA;
}
#UserConfigMnuLibelleUser {
    display: table-cell;
    height: 100%;
    vertical-align: middle;
    padding-left: 5px;
    padding-right: 8px;
    text-align: left;
    /*color: white;*/
}
#UserConfigMnuImage {
    display: table-cell;
    width: 30px;
    height: 100%;
    vertical-align: middle;
    padding-right: 5px;
    background-position: center;
    background-repeat: no-repeat;
}

#UserConfigSection {
    width: 100%;
    height: 350px;
}
#UserConfigSection > #btnNewFeatures {
	height: 30px;
    border-radius: 30px;
    position: absolute;
    bottom: 15px;
    line-height: 30px;
    cursor: pointer;
    left: 15px;
    box-sizing: border-box;
    width: calc(100% - 30px);
    text-align: center;
    color: #3d688a;
    letter-spacing: 0.094em;
    transition: 300ms cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid #3d688a;
}
#UserConfigSection > #btnNewFeatures:hover {
	background-color: #3d688a;
	color: #FFF;
}

#UserConfigSectionMainMnu {
    width: 100%;
    max-height: 350px;
    float: left;
}
#UserConfigSectionMainMnuMenuPrincipal {
    width: 100%;
    max-height: 310px;
    overflow-y: auto;
}
#UserConfigSectionMainSousMnu {
    width: 100%;
    display: none;
}

#UserConfigHeader {
    width: 100%;
    height: 150px;
    position: relative;
}
#UserConfigHeader > .btnClose{
    height: 30px;
    width: 30px;
    position: absolute;
    top: 0;
    right: 5px;
    background-image: url(../../Images/Commun/close_white.svg);
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    display: none;
}
#UserConfigHeaderBg {
    width: 100%;
    height: 100px;
    background-color: #2f4f6b;
}
#UserConfigHeaderInfo {
    width: 100%;
    height: 120px;
    position: absolute;
    bottom: 0;
}
#UserConfigHeaderInfoAvatar {
    /* width:100%; */
    height: 85px;
    background-position: center;
    background-repeat: no-repeat;
    text-align: center;
    width: 85px;
    margin: auto;
    border-radius: 80px;
}
#UserConfigHeaderInfoAvatarImg {
    height: 70px;
}
#UserConfigHeaderInfoLibelleUser {
    width: 100%;
    height: 30%;
    display: table;
}
#UserConfigHeaderInfoLibelleUserDetail {
    width: 100%;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    font-weight: bold;
    font-size: 14px;
}


/* HEYFRAMES */
@keyframes bounce {
	0%, 100%{transform: scale(0.0);}
	50%{transform: scale(1.0);}
}
@keyframes fondu {
	0%{
      opacity: 0;
    }
    1000%{
      opacity: 0;
    }
}
@keyframes loading {
    100% {transform: rotate(360deg);}
}
@keyframes shake {
    10%, 90% {
      left: -1px;
    }
    20%, 80% {
      left: 2px;
    }
    30%, 50%, 70% {
      left: -4px;
    }
    40%, 60% {
      left: 4px;
    }
}

/*RESPONSIVE*/

@media (max-width: 1920px){
    .lg_Ctn{
        width: 50%;
    }
}

@media (max-width: 1680px){

    .lbl_Titre_Accueil{
        font-size:44px;
    }

    .lbl_Titre_PortailRH{
        font-size:24px;
    }

    .lg_Ctn{
        width:55%;
    }

    .lg_Main .lbl_Titre_Connexion{
        font-size:30px;
    }
}

@media (max-width: 1440px){
    .lg_Ctn{
        width:65%;
    }
}

@media (max-width: 1280px){
    .hd_MenuLabel{
        padding: 0 15px;
        background-position: center;
        width: 24px;
    }
    .hd_MenuLabel > label{
        display: none;
    }
    .hd_MenuLabel > span {
        margin-top: 35px;
    }
    .hd_MenuStd > .active > .hd_MenuLabel > span {
        width: 24px;
    }

    .lbl_Titre_Accueil{
        font-size:42px;
    }

    .lbl_Titre_PortailRH{
        font-size:22px;
    }

    .lg_Ctn{
        width:70%;
    }

    .lg_Main .lbl_Titre_Connexion{
        font-size:28px;
    }

}

@media (max-width: 1024px){
    .lg_Ctn{
        width:85%;
    }
}

@media (max-width: 980px){
    .hd_Menu {
        display: none;
    }
    .hd_NavAccordion{
        display: block;
        padding: 11px!important;
        z-index: 3;
    }
    .hd_Options {
        width: calc(100% - 205px);
    }    
    .hd_UneOpt:last-child{
        border-left: 1px solid #2f4f6b;
    }
    .hd_Options{
        display: none;
    }
    .hd_SignOut{
        display: none;
    }

    .lbl_Titre_Accueil{
        font-size:40px;
    }

    .lbl_Titre_PortailRH{
        font-size:20px;
    }

    .lg_Ctn{
        width:90%;
    }

    .lg_Logo{
        height: 35px;
    }

    .lg_Main .lbl_Titre_Connexion{
        font-size:25px;
    }

    #UserConfigMain{
        width: 100%!important;
        height: calc(100% - 45px)!important;
        left: 0!important;
    }
    #UserConfigHeader > .btnClose{
        display: block;
    }
    #UserConfigSection{
        height: calc(100% - 150px)!important;
    }
    #UserConfigSectionMainSousMnu{
        height: calc(100% - 50px);
    }
}

@media (max-width: 950px){
    #MySpace #btnMenuRespMySpace {
        display: block;
    }
    #MySpace #NamePage{
        display: none;
    }
}

@media (max-width: 800px){
    .lg_Ctn{
        width:95%;
    }
}

@media (max-width: 768px){
    #MySpace .btnActionDockOptionPage {
        width: 100%;
        border-top-right-radius: 0;
    }
    #MySpace .cboDockOptionPage {
		width: 100% !important;
		margin: 0!important;
	}
    #MySpace .DockOptionPageElement {
		width: 100% !important;
		padding: 6px 0 5px 0;
	}

	#MySpace .DockOptionPageSousElement {
		width: 100% !important;
	}
    
    .hd_Logo{
        width: 110px;
        background-image: url(../../Images/Main/so_HORSYS_DIGITAL_ico.svg);
        background-size: 30px;
    }
    .hd_OptUser{
        width: auto;
    }
    .hd_OptUserSoc{
        display: none;
    }
    .hd_OptUserUser{
        display: none;
    }
    .hd_UneOpt {
        /* padding-left: 40px!important; */
        background-position: center;
    }

    .lbl_Titre_Accueil{
        font-size:38px;
    }

    .lbl_Titre_PortailRH{
        font-size:19px;
    }

    .lg_Ctn{
        width:97%;
    }

    .lg_Main{
         padding:40px;
    }

    #MySpace .LibelleDate {
        width: 148px;
    }

    .mn_HBoardBase .container {
        width: 60%;
    }
    .mn_HBoardBase .container .HeureDate .Date{
        font-size: 15px;
    }
    .mn_HBoardBase .container .HeureDate .Heure{
        font-size: 80px;
    }    
    .mnuDockOptionPageAction {
        height: 30px!important;
        width: 100%;
    }
    .mnuDockOptionPageDetail {
        width: 100%!important;
        box-sizing: border-box;
        height: calc(100% - 30px);
        min-width: auto!important;
    }

    #MySpace .popInfoPageMainUneLigneLegendeTitre {
        background-color: transparent;
        color: #000;
        text-transform: uppercase;
        padding-left: 0;
    }

    #MySpace .UneLigneElementUserConfig{
        height: 110px;
    }
    #MySpace .UserConfigSectionMainSousMnuSection{
        height: 100%;
    }

    #MySpace #mnu_responsive{
        width: 28px;
    }
    #MySpace #mnuDock{
        display: none!important;
    }
    #MySpace #mnuDockDockOptions {
        position: absolute;
        right: 20px;
        top: 55px;
        z-index: 5;
        width: 245px;
        height: 255px;
        min-width: auto!important;
        left: auto;
        display: none;
    }
    #MySpace #mnuDockOptionsPageMain{
        position: relative;
        background-color: transparent;
        border: 0;
        box-shadow: none;
        bottom: 0;
        width: 100%;
    }

    #MySpace #mnuDockOptionsInfo {
        display: none!important;
    }

    #MySpace #NamePage{
        display: none;
    }

    #MySpace #popInfoPageMain{
        padding: 0;
        background-color: transparent;
        overflow: auto;
        max-height: none;
        width: 100%;
    }

    #MySpace #SectionAccueil{
        min-height:500px;
    }

    #MySpace #UserConfigMain{
        width: 100%!important;
        height: calc(100% - 45px)!important;
        left: 0!important;
    }
    #MySpace #UserConfigHeader > .btnClose{
        display: block;
    }
    #MySpace #UserConfigSection {
        height: calc(100% - 150px)!important;
    }
    #MySpace #UserConfigSectionMainSousMnu {
        height: calc(100% - 50px);
    }
}

@media (max-width: 640px){
    .lbl_Titre_Accueil{
        font-size:35px;
    }

    .lg_Ctn{
        width:100%;
     }

    .lg_Logo{
        height: 30px;
    }
}

@media (max-width: 600px){

    
    .lg_Horloge{
        width: 200px;
    }

    .lg_Logo{
        height: 30px;
    }

    .lg_Main .lbl_Titre_Connexion{
        margin-bottom:2px;
    }

    #SectionAccueil{
        width:43%;
    }

}

@media (max-width: 520px){

    .co_TxtEffectUp{
        margin-top:15px;
    }

    .lg_Ctn{
        height:95%;
        width:95%;
        min-height:440px;
    }   

    .lg_Ctn_Main{
        height:calc(100% - 150px);
    }

    .lg_Logo_Responsive{
        background-image: url(../../Images/Login/SoHorsysLogo.jpg);
        width:100%;
        height:40px;
        background-repeat: no-repeat;
        background-size: contain;
        display: block;
        margin-bottom: 30px;
        background-position: center;
        margin-top: 50px;
        float:left;
    }

    .lg_Main{
        padding:40px;
    }

    .lg_Main .lbl_Titre_Connexion{
        font-size:25px;
    }

    .lg_SectionLangue, .lg_SectionChoice{
        left:0;
    }

    .lg_SectionLangueActive,.lg_SectionChoiceActive{
        width: 100%!important;
    }

    #SectionAccueil{
        visibility: hidden;
        z-index: -1;
    }

    #SectionIdent{
        width:100%;
    }


}

@media (max-width: 450px){
    /* .lg_Ctn{
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin-top: 0;
        margin-left: 0;
        min-height: 560px;
    }    
    .lg_Logo {
        margin-top: -94px;
    }
    .lg_Main{
        min-height: 350px;
    }
    .lg_Top {
        background-size: cover;
    } */

    
    .lg_Ctn_Main{
        height:calc(100% - 130px);
    }

    .lg_Logo_Responsive{
        margin-top:25px;
    }

    .mn_HBoardBase .container {
        width: 80%;
    }
    #CtnAnnuaire{
        min-width: auto;
    }
    #mnu_resp_navbar.open{
        width: 100%;
    }
    #MessageBoxMain{
        width: 95%;
    }
    #MessageBoxDetail{
        width: 100%;
    }
    #MessageBoxDetailLibelle{
        min-width: initial;
    }
}

@media (max-height: 530px){
    .lg_Ctn {
        height:100%;
        width:100%;
    }

    .lg_Logo_Responsive{
        margin-top:20px;
    }

    .lg_Footer{
       height:45px;
       bottom:0px;
    }
}