/*** FONTS ***/

/*@font-face {
    font-family: "UniversCondensedMedium";
    font-style: normal;
    font-weight: normal;
    src: url("../../resources/fonts/s3e/unvr57w-webfont.eot?#iefix") format("embedded-opentype"), url("../../resources/fonts/s3e/unvr57w-webfont.woff") format("woff"), url("../../resources/fonts/s3e/unvr57w-webfont.ttf") format("truetype"), url("../../resources/fonts/s3e/unvr57w-webfont.svg#UniversCondensedMedium") format("svg");
}

@font-face {
    font-family: "UniversCondensed";
    src: url("../../resources/fonts/s3e/UniversCondensed.ttf");
}

@font-face {
    font-family: "BreeSerifRegular";
    src: url("../../resources/fonts/s3e/BreeSerifRegular.ttf");
}

@font-face {
    font-family: "Oswald";
    src: url("../../resources/fonts/s3e/Oswald-Light.ttf");
}

@font-face {
    font-family: "RobotoMedium";
    src: url("../../resources/fonts/s3e/orkney-medium.otf");
}

@font-face {
    font-family: "RobotoBold";
    src: url("../../resources/fonts/s3e/orkney-bold.otf");
}

@font-face {
    font-family: 'Roboto';
    src: url('../../resources/fonts/s3e/Roboto.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}*/


/*Added roboto support before deleting other fonts ?*/


@font-face {
    font-family: "UniversCondensedMedium";
    font-style: normal;
    font-weight: normal;
    src: url("../../resources/fonts/s3e/unvr57w-webfont.eot?#iefix") format("embedded-opentype"), url("../../resources/fonts/s3e/unvr57w-webfont.woff") format("woff"), url("../../resources/fonts/s3e/unvr57w-webfont.ttf") format("truetype"), url("../../resources/fonts/s3e/unvr57w-webfont.svg#UniversCondensedMedium") format("svg");
}

@font-face {
    font-family: "UniversCondensed";
    src: url("../../resources/fonts/s3e/UniversCondensed.ttf");
}

@font-face {
    font-family: "BreeSerifRegular";
    src: url("../../resources/fonts/s3e/BreeSerifRegular.ttf");
}

@font-face {
    font-family: "Oswald";
    src: url("../../resources/fonts/s3e/Oswald-Light.ttf");
}


@font-face {
    font-family: 'Roboto';
    src:url('../../resources/fonts/s3e/Roboto-Light.ttf');
}


@font-face {
    font-family: 'Roboto-Thin';
    src:url('../../resources/fonts/s3e/Roboto-Thin.ttf');
}



@font-face {
    font-family: "RobotoMedium";
    src: url("../../resources/fonts/s3e/Roboto-Medium.ttf");
}

@font-face {
    font-family: "RobotoBold";
    src: url("../../resources/fonts/s3e/Roboto-Bold.ttf");
}

@font-face {
    font-family: 'Roboto';
    src: url('../../resources/fonts/s3e/Roboto-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}





/** Overriden selectors **/
.ui-state-error {
    background: rgb(255, 255, 255);
}

.ui-message-error {
    width: 28.125rem; /* 450px converted to rem */
    margin: 0;
    font-size: 1rem; /* 1em converted to rem */
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.request-form .precision-participants .ui-message-error {
    width: auto;
    max-width: 100%;
    display: block;
}


/** Generic selectors **/
b {
    font-weight: bold;
}

html, body {
    height: 100%;
}

body {
    /*background-color: #BDBAAD;*/
    font-size: 0.8em;
    font-family: Roboto, sans-serif;
    color: rgb(70, 70, 70);
}

#bodyS3e {
    overflow: hidden;
    /*padding-bottom: 1.875rem;*/ /* 30px converted to rem */

/**  ON MOBILE SOMETIMES  THE PAGE IS TAKING LESS THAN 100% OF THE SCREEN -> NOT VERY GOOD FOR THE FOOTER  **/
    display: flex;
    min-height: 100%;
    flex-direction: column;
}

h1 {
    font-family: Roboto, sans-serif;
    font-size:  1.8em;
    padding-bottom: 10px;
    font-weight: 500;
}

h2 {
    font-family: Roboto, sans-serif;
    font-size:  1.6em;
    font-weight: bold;
    padding-bottom: 10px;
    padding-top: 10px;
}

h3 {
    font-family: Roboto, sans-serif;
    font-size:  1.5em;
    font-weight: normal;
    /*padding-bottom: 20px;*/
}

h4 {
    font-family: Roboto, sans-serif;
    font-size:  1.2em;
    font-weight: normal;
    padding-bottom: 10px;
}

.text.left p {
    font-family: Roboto, sans-serif;
    font-size: 1.1em;
}

a,
a:link:not(.orejime-Modal-privacyPolicyLink):not(.orejime-Notice-privacyPolicyLink),
a:visited,
a:link:hover,
a:visited:hover {
    text-decoration: none;
    font-family:Roboto;
}

.sizingbox {
    width: auto;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.hide {
    display: none;
}

.box {
    display: block;
}

.inline {
    display: inline;
}

.inline-block {
    display: inline-block;
}

.floating-box {
    overflow: hidden;
}

.floating-box .left {
    float: left;
}

.floating-box .right {
    float: right;
}

.smaller {
    font-size: 0.8em;
}

.uppercase {
    text-transform: uppercase;
}

.capitalize {
    text-transform: capitalize;
}

.underline {
    text-decoration: underline;
}

.pre-line {
    white-space: pre-line;
}

/** Foreground, background, box, paragraph colors **/
.home-fg-color,
#content-topS3e .home-fg-color {
    color: #0047a3;
}

.home-bg-color {
    background-color: #e02363;
}

.space-boxes.home-sb-color > .space-box.selected,
.space-boxes.home-sb-color > .space-box-sponsor.selected {
    background-color: #e02363;
}

p.home-p-color {
    color: #e02363;
}

.offers-fg-color {
    /*color: #0047a3;*/
    color: #2c62cb
    /*padding-left: 1.25rem;*/
}

.funding_labels {
    color: #2c62cb;
    margin-right: 5.25rem; /* 20px converted to rem */
    font-weight: bold;
}

.funding_details_label {
    color: #2c62cb;
    margin-left: 8rem; /* 32px converted to rem */
    font-weight: bold;
}

.funding_organism_label {
    color: #2c62cb;
    margin-left: 8rem; /* 20px converted to rem */
    font-weight: bold;
}

.offers-bg-color {
    background-color: #2c62cb;
}

.search-fg-color {
    color: #8b8b8b;
}

.search-bg-color {
    background-color: #8b8b8b;
}

.school-fg-color {
    color: #00af5e;
}

.school-bg-color {
    background-color: #0067aa;
}

.course-fg-color {
    color: rgb(215, 19, 82); /* #d71352 */
}

.course-bg-color {
    background-color: rgb(215, 19, 82); /* #d71352 */
}

.newcourse-fg-color {
    color: #0047a3; /* #8f4099 */
}

.newcourse-bg-color {
    /* background-color: rgb(144, 65, 154); */ /* #90419a */
}

.sponsor-content > .space-boxes > .space-box.selected,
.sponsor-content > .space-boxes > .space-box-sponsor.selected {
    background-color: #0047a3;
}

.sponsor-content .puce_1 {
    background-image: url("../../resources/images/s3e/1_sponsor.png");
    background-size: contain;
}

.sponsor-content .puce_2 {
    background-image: url("../../resources/images/s3e/2_sponsor.png");
    background-size: contain;
}

.sponsor-content .puce_3 {
    background-image: url("../../resources/images/s3e/3_sponsor.png");
    background-size: contain;
}

p.sponsor-p-color,
.company-fg-color { /* p.purple */
    color: #0047a3;
}

.parents-fg-color {
    color: #da1984;
}

.plateform-bg-color {
    background-color: #0095ff;
}

.plateform-fg-color {
    color: #0095ff;
}



.platform-content > .space-boxes > .space-box.selected {
    background-color: #0095ff;
}
.platform-content > .space-boxes > .space-box-sponsor.selected {
    background-color: #0095ff;
}


p.plateform-p-color { /* p.carmine */
    color: #0095ff;
}

.parents-bg-color {
    background-color: #6b991d;
}

.space-boxes.parents-sb-color > .space-box.selected { /* .space-boxes.green */
    background-color: #6b991d;
}

.space-boxes.parents-sb-color > .space-box-sponsor.selected { /* .space-boxes.green */
    background-color: #6b991d;
}

p.parents-p-color { /* p.green */
    color: #6b991d;
}

.parents-space-fg-color {
    color: #9e734a;
}

.parents-space-bg-color {
    background-color: #9e734a;
}

.sponsor-space-fg-color,
.sponsor-fg-color{
    color: #0047a3;
}

.student-space-fg-color,
.student-fg-color{
    color: #2c62cb;
}

.student-space-bg-color {
    background-color: #2c62cb;
}

.school-content .puce_1 {
    background-image: url("../../resources/images/s3e/1.png");
    background-size: contain;
}

.school-content .puce_2 {
    background-image: url("../../resources/images/s3e/2.png");
    background-size: contain;
}

.school-content .puce_3 {
    background-image: url("../../resources/images/s3e/3.png");
    background-size: contain;
}

.student-content .puce_1 {
    background-image: url("../../resources/images/s3e/1_student.png");
    background-size: contain;
}

.student-content .puce_2 {
    background-image: url("../../resources/images/s3e/2_student.png");
    background-size: contain;
}

.student-content .puce_3 {
    background-image: url("../../resources/images/s3e/3_student.png");
    background-size: contain;
}

.space-boxes.student-sb-color > .space-box.selected { /* .space-boxes.orange */
    background-color: #2c62cb;
}

.space-boxes.student-sb-color > .space-box-sponsor.selected { /* .space-boxes.orange */
    background-color: #2c62cb;
}

p.student-p-color { /* p.orange */
    color: #2c62cb;
}

.school-space-fg-color,
.referent-fg-color {
    color: #0067aa;
}

.school-space-bg-color {
    background-color: #0067aa;
}

.school-space-color {
    color: #00af5e;
}
.space-boxes.school-sb-color > .space-box.selected { /* .space-boxes.blue*/
    background-color: #00af5e;
}

.space-boxes.school-sb-color > .space-box-schools.selected { /* .space-boxes.blue*/
    background-color: #00af5e;
}

.space-boxes.school-sb-color > .space-box-sponsor.selected { /* .space-boxes.blue*/
    background-color: #00af5e;
}


p.school-p-color { /* p;blue */
    color: #00af5e;
}

.personal-space-fg-color {
   color: #1767c2; 
}


.trombine-row {
    display:flex;
    flex-direction:row;
}

.trombine-col {
    display:flex;
    flex-direction:column;
    width:11rem;
    height:15rem;
    text-align:center;
    row-gap:0.3rem;
    margin-left:3rem;
}

.trombine-pic {
    cursor: pointer;
    width:7.81rem;
    height:9.58rem;
    border-radius: 12px;
}

/*** Common ***/
#topS3e.header .top-title {
    width: 100%;
    margin: auto;
}


/* ADDED 01-07-2024 aligning the menu header (ul) elements -> overriding the mediaquery for now */

#menuS3e ul{
    display:flex !important;
    flex-direction:row;
    justify-content:center;
}






#menuS3e ul{
    width: 75rem; /* 75rem converted to rem */
    margin: auto;
}

#ml50 {
    margin-right: 3.125rem; /* 50px converted to rem */
}

#ml14 {
    margin-right: 0.875rem;
}

#w75 {
    width: 75%; /* Adjusted width for responsiveness */
}

/*** Header ***/
#topS3e.header {
    width: 100%;
    height: 12rem; /* 70px converted to rem */
    margin: 0;
    background-color: #fff;
    background-image: url(../../resources/images/s3e/background-chateau.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#topS3e {
    position: relative;
   
    color: black;
    /* padding-top: 0.938rem; */
}

/*#topS3e .top-login{
    background-color: inherit;
    display: block;
    text-align: right;
    height: 38px;
    line-height: 38px;
    width: 75rem;
    margin: auto;
}*/


/* ADDED Nouveau logo centré (ode91) pour le header */


img#centered_header_logo{
    width: auto;
    margin-top: 1.2rem;
    height: 3.4rem;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    text-align: center;
}


#topS3e .top-login #topLogFormS3e{
/*    position: relative;*/
   /* display: flex;
    flex-direction: row;
    flex-wrap: nowrap;*/

}

/* LOGO ESSONNE  */

#topLogFormS3e #logo-essonne{
    width: 10rem;
    height: auto;
    margin-left: 1.15rem;
    margin-top: 1.15rem;
}



#topS3e .top-login a {
    font-size: 1rem; /* 1em converted to rem */
    color: black;
    padding-left: 0.625rem;
    font-family: inherit;
    position: relative;
    padding-right: 0.313rem;
    text-align: left;
    /*line-height: 3.5;*/
    /* margin-right: -244px;*/
}



/* bouton de connexion <-> user button top-right for the header */

#user-button-header{
    background: none;
    padding-right: 0px;
    margin-right: 0px;
    color: white;
}





.alinkheader {
    font-size: 1.5rem !important; /* Adjusted font size for header link */
    color: #0047a3 !important;
    font-weight: bold !important;
    padding-right: 0.313rem;
    text-align: left;
    /*margin-right: -244px;*/
    opacity: 0.9;
    padding-top: 1.563rem; /* 25px converted to rem */
    padding-left: 1.563rem !important; /* 25px converted to rem */
}

.leftalignheader {
    float: left;
}

.rightalignheader {
    float: right;
    background-color: #e7eaf2;
    border-radius: 0.25rem;
    line-height: 2.188rem; /* 35px converted to rem */
    text-align: center !important;
    padding-right: 0.625rem;
    padding-left: 0.625rem;
    margin-top: 1.125rem; /* 1.125rem converted to rem */
    margin-right: 2.5rem; /* 100px converted to rem */
}

.logoimg {
    width: 4.6875rem; /* 75px converted to rem */
    height: 3.125rem; /* 50px converted to rem */
    float: left;
    margin-top: 0.625rem; /* 10px converted to rem */
    margin-left: 2.5rem;
}

.noBorders {
    width: max-content;
}

#topS3e .top-username {
    font-size: 1.125rem; /* 1.125rem converted to rem */
}

#topS3e .top-username button {
    font: inherit;
    background: none !important;
    color: inherit;
    text-shadow: inherit;
    border: none;
    box-shadow: none;
    height: 2.375rem; /* 38px converted to rem */
    /*border-right: 0.063rem solid white;*/
}

#topS3e .top-username .ui-button .ui-button-text {
    display: initial;
    text-decoration: underline;
}

#topS3e .top-username button.ui-state-focus,
#topS3e .top-username button.ui-state-hover {
    outline: none;
}

#top-menubuttonS3e_menu {
    border: none;
    background: lightgray;
}

#top-menubuttonS3e_menu a {
    color: white;
    font-size: 1em;
    font-family: Roboto, sans-serif;
}

#top-menubuttonS3e_menu .ui-state-hover {
    background: #0047a3;
    box-shadow: none;
}

#topS3e.header .top-title {
    margin-bottom: 0;
    /*margin-left: 2.5rem;
    /*margin-right: 2.5rem;*/
    display: block;
}

#topS3e.header .top-title h1 {
    font-size: 2.5rem;
    padding-bottom: 0.313rem;
}

#topS3e.header .top-title h2 {
    font-size: 1.25rem;
    padding-bottom: 0.313rem;
    font-style: bold;
}

#top-sidebar {
    float: left;
    background-image: url("../../resources/images/s3e/top-sidebar.png");
    background-repeat: no-repeat;
    background-position: 0% 50%;
    width: 21.875rem; /* 350px converted to rem */
    height: 8.75rem; /* 140px converted to rem */
    transform: translate(-1.313rem, 0rem); /* -21px converted to rem */
}

#top-sidebar:hover {
    cursor: pointer;
}

#top-img {
    float: left;
    background-image: url("../../resources/images/s3e/jeunes.png");
    background-repeat: no-repeat;
    height: 8.75rem; /* 140px converted to rem */
    width: 21.875rem; /* 350px converted to rem */
}

#topS3e #top-customer {
    float: left;
    background-image: url("../../resources/images/s3e/btn-customer.png");
    background-repeat: no-repeat;
    background-size: 7.5rem; /* 120px converted to rem */
    /*margin-top: 0.938rem;*/
    /*margin-right: 11.25rem;*/ /* 720px converted to rem */
    /*border: 0.063rem solid #808083;*/
    height: 7.5rem; /* 120px converted to rem */
    width: 12.6875rem; /* 203px converted to rem */
    cursor: pointer;
    position: relative;
    left: 2.5rem; /* 40px converted to rem */
}

#topS3e #top-customer:hover {
    background-image: url("../../resources/images/s3e/btn-customer.png");
    border: 0.063rem solid #474749;
    box-shadow: 0 0 0.313rem #939393;
}

/*** Menu ***/
#blank-menuS3e {
    position: relative;
    background-color: #fb8c00;
    height: 0;
}

/*** Menu ***/
#blank-menuS3e {
    position: relative;
    background-color: #fb8c00;
    height: 0px;
}

#menuS3e {
    position: absolute;
    width:100%;
    bottom:0px;
    background-color: #343332ca;
    color: #fefefe;
    margin-bottom: 0;
    box-shadow: 0.125rem 0 0.25rem rgba(0,1,1,0.38);
    
    /*height: 2.8125rem;*/   /* Equivalent to 45px */
    /*padding-top: 0.3125rem;*/ /* Equivalent to 5px */
    /*padding-bottom: 0.625rem;*/ /* Equivalent to 10px */
    
    /*padding-top:.4rem;*/

    border-top:.3rem solid #1B4EA9;

}

#menuS3e ul {
    padding: 0;
}

#menuS3e ul li {
    display: block;
    float: left;
    min-width: 19%; /* Equivalent to 19% */
    margin-right: 0.625rem; /* Equivalent to 10px */
}

#menuS3e ul li.home-item:hover,
#menuS3e ul li.home-item.selected,
#menuS3e ul li.students-item:hover,
#menuS3e ul li.students-item.selected,
#menuS3e ul li.sponsors-item:hover,
#menuS3e ul li.sponsors-item.selected,
#menuS3e ul li.parents-item:hover,
#menuS3e ul li.parents-item.selected,
#menuS3e ul li.school-item:hover,
#menuS3e ul li.school-item.selected {
    background-color: #ffffffbf;
    width: 19%; /* Equivalent to 19% */
    height: 2.125rem; /* Equivalent to 34px */
    border-radius: 1.125rem; /* Equivalent to 18px */
    margin-right: 0.625rem; /* Equivalent to 10px */
}

#menuS3e a:hover,
#menuS3e ul li.selected a {
    color: black;
}

#menuS3e a:before {
    content: "\276f";
    font-size: 1rem; /* Equivalent to 16px */
    margin-right: 0.3125rem; /* Equivalent to 5px */
    position: relative;
}

#menuS3e ul li.home-item a:before {
    color: #0047a3;
}

#menuS3e ul li.students-item a:before {
    color: #2c62cb;
}

#menuS3e ul li.sponsors-item a:before {
    color: #0047a3;
}

#menuS3e ul li.parents-item a:before {
    color: #da1984;
}

#menuS3e ul li.school-item a:before {
    color: #00af5e;
}

#menuS3e ul li:hover a:after,
#menuS3e ul li.selected a:after {
    color: #fb8c00;
}


#menuS3e_options ul li:hover a:after,
#menuS3e_options ul li.selected a:after {
    color: #fb8c00;
}

#menuS3e a {
    color: white;
    line-height: 2.5rem; /* 40px converted to rem */
    text-align: center;
    /*height: 38px;*/
    display: block;
    font-family: Roboto, sans-serif;
    font-weight: 100; 
    font-size: 1rem;
}

/*** Menu Filter***/
#menuFilter {
    /*position: relative;*/
    background-color: #191919;
    /*color: #2c62cb;*/
    border: none;
    padding-top: 0.188rem;
    /*box-shadow: 0.125rem 0rem 0.25rem rgba(0,1,1,0.38);*/
    height: 2.563rem; /* 41px converted to rem */
}

#menuFilter ul {
    padding: 0;
    background: white;
    border: none;
    display: none;
}

#menuFilter ul li {
    display: block;
    float: left;
    /*width: 9.375rem;*/ /* 150px converted to rem */
    /* border: none;*/
    background: white;
}

#menuFilter ul li.ui-tabs-selected {
    background: #a8a8a8;
    display: block;
    float: left;
    height: 0; /* Removed !important */
    /*width: 9.375rem;*/ /* 150px converted to rem */
}

#menuFilter ul li a {
    color: #000000;
    border: none;
}

#menuFilter .ui-tabs-panels {
    border: 0.063rem solid #a8a8a8;
}

#menuFilter .ui-tab {
    border: none;
}

#menuFilter .ui-widget-content {
    border: none;
}

/*** Footer ***/
#bottom {
    /* padding: 0.313rem;
    padding-top:20px;
    padding-bottom: 40px; */
    font-family: Roboto, sans-serif;
    font-weight: bold;
    /* background-color: #dadada;
    height: 65px;
    box-shadow: 0 0 0.313rem rgba(0,0,0,0.38);
    border: 0.063rem solid #73716b; */
    border-top: none;
    margin: auto;
    width: auto; /* 75rem converted to rem */
    padding: 1rem 0rem; /* 20px converted to rem */
}

#footer {
    background-color: #2c2c2c;
    color: white;
}

#footer > div#off_mobile{
    flex-wrap: nowrap;
}

#footer-educ:hover,
#footer-customer:hover {
    cursor: pointer;
}

.footerImages img:last-child {
    padding-right: 0.625rem;
}

.footerImages img {
    padding-left: 1.563rem; /* 25px converted to rem */
    float: left;
}

.footerText {
    line-height: 1.063rem;
    /* color: #6e6e6e; */
    font-family: Oswald, sans-serif;
    font-weight: 100;
    /* text-align: center; */
    margin: 1.2rem auto;
    margin-bottom: .75rem;
    width: 50%;
    text-align: center;


}

#footer-menu {
    color: black;
    text-align: center;
    font-family: Roboto, sans-serif;
}

#footer-menu a {
    color: white;
    margin: 0 0.625rem; /* 10px converted to rem */
}

.footerLeft {
    float: left;
    margin-top: 0.5rem;
    position: relative;
    /* width: 10%;
    height: 70px; 
    margin-left: 15%; */
}

.footerRight {
    position: relative;
    top: -3.75rem; /* 60px converted to rem */
    float: right;
    /* width: 20%; */
    /* margin-right: 10%; */
    height: 0.625rem; /* 10px converted to rem */
    /* left:5em; */
}

p.footerRight img {
    max-width: 7.5rem; /* 120px converted to rem */
}

p.footerLeft img {
    max-width: 7.5rem; /* 120px converted to rem */
}

.form-terms-of-use,
.required-field {
    font-family: Roboto, sans-serif;
    font-size: 1.125rem; /* 1.125rem converted to rem */
}

.terms-of-use-link {
    color: #003A79;
    margin-left: 0.25rem;
    margin-right: 0.25rem;
    font-family: inherit;
    font-size: inherit;
}

.epi {
    font-size: smaller;
}

#content-wrapperS3e {
    overflow: hidden;
    background-color: #FFFFFF;
    /* box-shadow: 0 0 0.313rem rgba(0,0,0,0.38);
    border: 0.063rem solid #73716b; */
    border-bottom: none;
    padding: 1.875rem; /* 30px converted to rem */
    /*padding: 1rem 4rem 1rem 4rem;*/
    border-top: none;
}

.sidemenu {
    float: right;
    padding: 0 0.313rem 0.313rem;
    width: 12.5rem; /* 200px converted to rem */
}

#sidemenu h2:last-of-type {
    padding-top: 1.875rem; /* 30px converted to rem */
}

#personalSpaceForm {
    border: 0.063rem solid #E02363;
    margin-bottom: 0.625rem; /* 10px converted to rem */
}

#parentsSpaceForm {
    border: 0.063rem solid #9e734a;
    margin-right: 0.625rem; /* 10px converted to rem */
}

#schoolSpaceForm {
    border: 0.063rem solid #00af5e;
    margin-right: 0.625rem; /* 10px converted to rem */
}

#sponsorSpaceForm {
    border: 0.063rem solid #0047a3;
    margin-right: 5.813rem; /* 93px converted to rem */
}

#personalSpaceForm a {
    color: rgb(224, 35, 99);
}

#parentsSpaceForm a {
    color: #9e734a;
}

#schoolSpaceForm a {
    color: #00af5e;
}

#sponsorSpaceForm a {
    color: #0047a3;
}


#personalSpaceForm:hover a,
#parentsSpaceForm:hover a,
/*#studentSpaceForm:hover a,*/
#schoolSpaceForm:hover a,
#sponsorSpaceForm:hover a {
    color: white;
}

.space-menu {
    padding: 0.625rem 0.938rem 0.938rem;
}

.search-box {
    margin-bottom: 0;
}

#searchFormS3e .ui-inputfield {
    height: 1.25rem; /* 20px converted to rem */
    border: #626262 solid 0.063rem;
    float: left;
    width: 9.063rem; /* 145px converted to rem */
}

#courseForm .ui-inputfield {
    height: 1.25rem; /* 20px converted to rem */
    border: #626262 solid 0.063rem;
    padding: 0.313rem 0.25rem 0.313rem;
}

.links {
    background-image: url("../../resources/images/s3e/stripeGris.png");
    padding: 0.625rem 0.625rem 3.125rem; /* 50px converted to rem */
    margin-right: 1.25rem; /* 20px converted to rem */
    width: 10.313rem; /* 165px converted to rem */
}

.links ul li:before {
    content: "• ";
}

.links ul li {
    padding-bottom: 0.375rem;
}

.links a {
    line-height: 1.5em;
    padding: 0.313rem 0;
    font-size: 1.3em;
    color: rgb(70, 70, 70);
    text-decoration: underline;
}

.links img {
    padding-top: 0.625rem;
    width: 11.25rem; /* 180px converted to rem */
    height: 3.125rem; /* 50px converted to rem */
    -webkit-transform: translate(-2.188rem, 0rem); /* -35px converted to rem */
    -moz-transform: translate(-2.188rem, 0rem);
    -o-transform: translate(-2.188rem, 0rem);
    -ms-transform: translate(-2.188rem, 0rem);
    transform: translate(-2.188rem, 0rem);
}

.w700 {
    /*width: 700px;*/
}

/*** Centre ***/
#content-topS3e {
    /*min-height: 0.938rem;*/
}

#content {
    background-color: #fff;
    min-height: 21.875rem; /* 350px converted to rem */
    margin-top: 0;
}

/*** Accueil ***/
.course-steps {
    border-top: 0.313rem solid #D7215F;
    margin-bottom: 0.625rem; /* 10px converted to rem */
    text-align: center;
    background-color: rgb(237, 237, 237);
    color: rgb(147, 147, 147);
}

.course-steps ul li {
    padding: 1.563rem; /* 25px converted to rem */
    max-width: 6.25rem; /* 100px converted to rem */
    vertical-align: middle;
}

.course-steps .smaller {
    text-transform: none;
}

.home-content .text {
    text-align: justify;
    margin-right: 0.625rem; /* 10px converted to rem */
    width: 42.188rem; /* 675px converted to rem */
}

.home-content .text p:not(:first-of-type) {
    margin-top: 1.25rem; /* 20px converted to rem */
}

#adminSpaceForm .announcements-table thead tr[role="row"] span:not(.ui-icon) {
    font-size: 0.875rem; /* 14pt converted to rem */
    text-align: center;
}

.announcements-table .content-column {
    font-family: Roboto, sans-serif;
    font-size: 1.3rem; /* 20px converted to rem */
}

.announcements-table .image-column {
    text-align: center;
    vertical-align: middle;
    width: 6.25rem; /* 100px converted to rem */
}

.announcements-table .image-column img {
    max-width: 4.688rem; /* 75px converted to rem */
    max-height: 4.688rem; /* 75px converted to rem */
    padding-left: 0.938rem; /* 15px converted to rem */
    padding-right: 0.625rem; /* 10px converted to rem */
}

#adminSpaceForm .ui-datatable td.action-announcement {
    width: 3.75rem; /* 60px converted to rem */
    height: 1.25rem; /* 20px converted to rem */
    text-align: center;
    vertical-align: middle;
}

#adminSpaceForm .ui-datatable td.action-announcement .action-link-delete,
#adminSpaceForm .ui-datatable td.action-announcement .action-link-edit {
    background-repeat: no-repeat;
    display: inline-block;
    width: 1.25rem; /* 20px converted to rem */
    height: 1.25rem; /* 20px converted to rem */
    margin-left: 0.313rem; /* 5px converted to rem */
}

#adminSpaceForm .ui-datatable td.action-announcement .action-link-delete {
    background-image: url("../../resources/images/s3e/refus.png");
}

#adminSpaceForm .ui-datatable td.action-announcement .action-link-edit {
    background-image: url("../../resources/images/s3e/valide.png");
}

/*** Pages de stage ***/

#adminSpaceForm label {
    margin-top: 1.25rem; /* 20px converted to rem */
    font-family: Roboto, sans-serif;
    font-size: 1rem; /* 16pt converted to rem */
}

.request-form label,
.request-form .ui-widget label,
.courseListForm label,
.courseListForm .ui-widget label{
    font-size: 1rem; /* 9pt converted to rem */
    font-family: Roboto, sans-serif;
    margin-top: 0.3rem !important;
    /*margin-bottom: 1rem !important;*/
}

.request-form button {
    margin-top: 0.313rem; /* 5px converted to rem */
    margin-bottom: 0.313rem; /* 5px converted to rem */
}

.request-form p.date input {
    width: 7rem;
}

/* Default styles */

.request-form label,
.course-detail.label,
.course-detail.content,
.candidature-detail.label,
.candidature-detail.content,
#adminSpaceForm label {
    display: inline-block;
}

.course-detail.label:not(:first-child),
.candidature-detail.label:not(:first-child) {
    margin-top: 1.25rem; /* 20px converted to rem */
}

.course-detail.content.naf,
.candidature-detail.content.naf {
    display: inline;
}

a.course-detail.content.naf,
a.candidature-detail.content.naf {
    padding-left: 0;
}

img.candidature-detail.content.logo {
    max-width: 12.5rem; /* 200px converted to rem */
    width: auto;
}

img.course-detail.content.logo {
    max-width: 6.25rem; /* 100px converted to rem */
    width: auto;
}


p.funding,
p.attachment {
    display: inline-block;
    width: 21.875rem; /* 350px converted to rem */
}

p.logo {
    display: inline-block;
    width: 30%;
}

.fundingCol {
    width: 1.25rem; /* 20px converted to rem */
}

p.logo-attachment {
    padding-left: 1.5rem; /* 24px converted to rem */
}

.file-delete,
.delete-funding-field,
.add-funding-field {
    display: inline-block;
    /*margin-left: 0.9rem;*/
}

.file-delete .delete-button,
.delete-funding-field,
.add-funding-field {
    width: 2rem !important; /* 31px converted to rem */
    height: 2rem !important; /* 26px converted to rem */
    border: none;
    box-shadow: none;
    text-shadow: none;
    background: rgb(143, 146, 144);
    background-repeat: no-repeat;
    background-position: center;
    color: #DB201D;
    margin-top: 1.875rem; /* 30px converted to rem */
}

/* Default styles */

.file-delete button > span.ui-button-text {
    padding: 0;
}

#logoFile .ui-fileupload-choose.ui-state-hover,
#adminSpaceForm #logoFile .ui-fileupload-choose.ui-state-hover,
#attachmentM12File .ui-fileupload-choose.ui-state-hover {
    background-image: url("../../resources/images/s3e/plus.png");
    background-repeat: no-repeat;
    background-position: center;
}

#logoFile .ui-fileupload-choose.ui-state-hover{    
    background: #0047a3;
}

#adminSpaceForm #logoFile .ui-fileupload-choose.ui-state-hover{
    background: #0095ff;
}

#attachmentM12File .ui-fileupload-choose.ui-state-hover {
      background: #0095ff;  
}



#checkbox-label {
    margin-top: 0;
}

.ui-selectcheckboxmenu {
    display: inherit !important;
    border: 0.063rem solid #A8A8A8;
    font: inherit;
    outline: none;
    background: #fff;
    box-shadow: 0 0.125rem 0.125rem rgba(0, 0, 0, 0.25) inset;
    line-height: 1.2;
    font-size: 0.875rem; /* Converted to rem */
}

.ui-chkbox .ui-chkbox-box {
    height: 1.125rem !important; /* Converted to rem */
    width: 1.125rem !important; /* Converted to rem */
    /* Le thème PF14 (saga) impose min-width/min-height: 1.5rem, qui l'emporte
       sur width et étire la case en rectangle : neutralisés. */
    min-width: 0 !important;
    min-height: 0 !important;
    margin-top: 0.125rem;
}

.list-filters.ui-panelgrid > * > tr,
.list-filters.ui-panelgrid .ui-panelgrid-cell {
    border: 0;
}

.list-filters.ui-panelgrid td label {
    border: 0;
    display: inline;
}

.list-filters.ui-panelgrid td {
    border: 0;
    font-size: 0.75rem !important; /* Converted to rem */
}
 
/*.list-filters.ui-panelgrid td input:checked + label{
      font-weight: bold;
}
    
.list-filters.ui-panelgrid>*>tr .ui-chkbox{
        display: none;
        
} */
  
/*.list-filters.ui-panelgrid>*>tr .ui-chkbox.input:checked + label{
        font-weight: bold;
    } */


.file-delete .delete-button.ui-state-hover{ 
    background: #DB201D;
    background-repeat: no-repeat;
    background-position: center;
    color: #fff;
}

/* Used by login screen */
.request-form input,
.request-form textarea {
    font-family: Roboto, sans-serif;
    margin: 0.313rem 1.25rem; /* Converted margin to rem */
    width: 75%; /* Converted width to rem */
}


#adminSpaceForm .request-form p.logo label {
    margin: 0;
    padding: 0.25rem;
    font-size: 1.2rem; /* Converted font size to rem */
    min-width: 21.625rem; /* Converted min-width to rem */
    border: 0.063rem solid #A8A8A8; /* Converted border width to rem */
    vertical-align: middle;
}

.request-form p.logo label {
    margin: 0;
    padding: 0.25rem;
    /*font-size: 1.2em;
    margin-left: 5%;
    width: 80%;*/
    border: 1px solid #A8A8A8;
    vertical-align: middle;
}

.form-side .ui-fileupload {
    display: inline-block;
    font-size: 0.9rem; /* Converted font size to rem */
}

.form-side .ui-fileupload label {
    margin: 0;
}

.form-side .ui-fileupload .ui-widget-header {
    background: none !important;
    border: none !important;
}

.form-side .ui-fileupload-choose {
    height: 2rem; /* Converted height to rem */
    /*background: rgb(143, 146, 144);
    background-image: url("../../resources/images/s3e/plus.png");*/
    background-repeat: no-repeat;
    background-position: center;
}

/* Base styles */
.form-side .ui-fileupload-buttonbar .ui-button-text {
    display: none;
}

.form-side .ui-fileupload-buttonbar .ui-icon {
    /*display: none;*/
    color: white;
}

.form-side .ui-fileupload-choose.ui-state-default {
    width: 2rem; /* 30px converted to rem */
    box-shadow: none;
    text-shadow: none;
}

.form-side .ui-fileupload-buttonbar {
    /*width: 1.875rem; /* 30px converted to rem */
}

.form-side .ui-fileupload-buttonbar .ui-fileupload-choose input {
    transform: none;
    width: 1.875rem; /* 30px converted to rem */
}

.form-side .ui-fileupload-content {
    border: none;
    background: none;
    position: relative;
    display: none;
}

.form-side .ui-fileupload-content .ui-messages {
    color: rgb(185, 74, 72);
    background: rgb(242, 222, 222);
    border-color: rgb(238, 211, 215);
    position: absolute;
    left: -21.875rem; /* 350px converted to rem */
    bottom: -2.5rem; /* 40px converted to rem */
    height: 2.188rem; /* 35px converted to rem */
}

.form-side .ui-fileupload-content .ui-messages .ui-messages-error {
    margin: 0;
}

.form-side .ui-fileupload-content .ui-messages .ui-icon-close {
    margin-top: -0.015625rem; /* -0.25px converted to rem */
}

.form-side .ui-fileupload-content .ui-messages .ui-messages-error-icon {
    margin-top: -0.03125rem; /* -0.5px converted to rem */
}

.form-side .ui-fileupload-content .ui-fileupload-files {
    display: none !important;
}


/*.form-side .fileinput-button { 
    height: 21px;
    border: rgb(144, 65, 154) solid 0.063rem;
    background: rgb(144, 65, 154);
    min-width: 185px;
    white-space: pre;
 }

.form-side .fileinput-button.ui-state-default{
    background-image: url("../../resources/images/s3e/plus.png");
    background-repeat: no-repeat;
    background-position: center;
    border: #90419a solid 0.188rem;
    width: 30px;
    min-width: 0;
     box-shadow: none;
    text-shadow: none;
}

.form-side .fileinput-button.ui-state-hover{ 
    border: #90419a solid 0.188rem;
    background: #ffffff;
    color: #90419a;
    background-image: url("../../resources/images/s3e/plus_sponsor.png");
    background-repeat: no-repeat;
    background-position: center;
}

.form-side .fileupload-buttonbar .ui-button-text{
    display: none;
}

.form-side .fileinput-button.ui-state-hover .ui-button-text{
    border: #90419a solid 0.188rem;
    color: #90419a;
}

.form-side .fileupload-buttonbar .ui-icon{
    display: none;
}

.form-side .fileupload-content{
    border: none;
}

.form-side .fileupload-content .files .template-upload.ui-state-error{
    display: inline !important;
    color: rgb(185, 74, 72);
    background: rgb(242, 222, 222);
    border-color: rgb(238, 211, 215);
    position: absolute;
    left: 300px;
}

.form-side .fileupload-content .files .template-upload{
    display: none !important;
}*/

/* Default styles */

.request-form label,
.request-form input,
.course-detail.label,
.candidature-detail.label {
    margin-bottom: 0.313rem; /* Converted to rem */
}

a.course-detail.content {
    color: rgba(143, 64, 153, 1);
    text-decoration: underline;
}

.user-panel .gender-table {
    margin-bottom: 0.313rem; /* Converted to rem */
}

.contact-gender label,
.gender label,
#createOrSelectCompany label,
.user-gender label {
    margin-left: 0.313rem;
    margin-right: 2.188rem; /* Converted to rem */
}

#requestForm .gender label {
    color: #2c62cb;
}

.user-gender label,
#requestForm.plateform-content .gender label {
    color: #0095ff;
}

#requestForm.school-content .gender label {
    color: #00af5e;
}

#population label {
    color: #E46726;
    margin-left: 0.313rem;
    margin-right: 2.188rem; /* Converted to rem */
    font-size: 1.3em;
}
/* Default styles */

.list-header {
    padding: 0.313rem;
    color: white;
    font-size: 1.3em;
    display: inline-block;
    width: 56.125rem; /* Converted to rem */
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.list-item {
    padding: 0.313rem 0.313rem 0.625rem 0.313rem;
}

.list-item a {
    font-size: 1.3em;
}

.list-item span {
    display: block;
}

#courseDataTable .ui-widget-header .ui-inputfield {
    margin-left: 0.313rem;
}

#courseDataTable.ui-datatable .ui-datatable-header {
    text-align: left;
    font-family: Roboto, sans-serif;
    background: white;
    text-shadow: none;
    font-weight: normal;
}

#courseListForm .ui-datatable.ui-widget,
#studentSpaceForm .ui-datatable.ui-widget,
#referentSpaceForm .ui-datatable.ui-widget,
#companySpaceForm .ui-datatable.ui-widget,
#adminSpaceForm .ui-datatable.ui-widget {
    font-size: inherit;
}

#courseListForm .ui-datatable *,
#studentSpaceForm .ui-datatable *,
#referentSpaceForm .ui-datatable *,
#companySpaceForm .ui-datatable *,
#adminSpaceForm .ui-datatable * {
    border: none;
    /*width: 60%;*/
}

#courseListForm thead th[scope="col"],
#studentSpaceForm thead th[scope="col"],
#referentSpaceForm thead th[scope="col"],
#companySpaceForm thead th[scope="col"],
#adminSpaceForm thead th[scope="col"] {
    background-image: none;
    font-family: Roboto, sans-serif;
    font-weight: normal;
    text-shadow: none;
    text-align: left;
    vertical-align: top;
}

#courseDataTable thead th[scope="col"] {
    background-color: #2c62cb;
}

#studentSpaceForm thead th[scope="col"],
#referentSpaceForm thead th[scope="col"],
#companySpaceForm thead th[scope="col"] {
    background-color: #1767c2;
}

#adminSpaceForm thead th[scope="col"] {
    background-color: #0095ff;
}

#courseListForm thead tr[role="row"] span:not(.ui-icon),
#studentSpaceForm thead tr[role="row"] span:not(.ui-icon),
#referentSpaceForm thead tr[role="row"] span:not(.ui-icon),
#companySpaceForm thead tr[role="row"] span:not(.ui-icon),
#adminSpaceForm thead tr[role="row"] span:not(.ui-icon) {
    color: white;
    font-size: 12pt;
    display: inline-flex;
   /* max-height: 2.8rem;
    min-height: 0rem;
    max-width: 7rem;
    min-width: 2rem;*/
}

body .ui-datatable thead th .ui-sortable-column-badge {
    
 background:none;   
    
}

.ui-sortable-column-icon{
    
    color: white !important;
}

/* Default styles */

#courseListForm thead tr[role="row"] .ui-column-filter,
#studentSpaceForm thead tr[role="row"] .ui-column-filter,
#referentSpaceForm thead tr[role="row"] .ui-column-filter,
#companySpaceForm thead tr[role="row"] .ui-column-filter,
#adminSpaceForm thead tr[role="row"] .ui-column-filter,
#adminSpaceForm2 thead tr[role="row"] .ui-column-filter {
    margin-left: 0;
    margin-top: 0.313rem;
}
#adminSpaceForm thead tr[role="row"] .course-accessKey .ui-column-filter,
#adminSpaceForm2 thead tr[role="row"] .course-accessKey .ui-column-filter{
    width: 5rem;
    margin-left: 0; 
}
#companySpaceForm thead tr[role="row"] .course-accessKey .ui-column-filter,
#adminSpaceForm thead tr[role="row"] .student-id .ui-column-filter,
#adminSpaceForm2 thead tr[role="row"] .student-id .ui-column-filter {
    width: 8rem;
    margin-left: 0;
}

#candidaturesPPRSDataTable thead tr[role="row"] .course-label .ui-column-filter,
#companyCoursesDataTable thead tr[role="row"] .course-label .ui-column-filter,
#candidaturesToValidateCompanyDataTable thead tr[role="row"] .course-label .ui-column-filter,
#candidaturesValidatedCompanyDataTable thead tr[role="row"] .course-label .ui-column-filter,
#coursesCompanyDataTable thead tr[role="row"] .course-label .ui-column-filter,
#courseDataTable thead tr[role="row"] .course-label .ui-column-filter{
    width: 15.625rem; /* Converted to rem */
}

#companySpaceForm thead tr[role="row"] .course-accessKey,
#adminSpaceForm thead tr[role="row"] .course-accessKey{
    
    width: 5rem;
}

#adminSpaceForm thead tr[role="row"] .student-id {
    width: 9rem; /* Converted to rem */
}

#courseDataTable thead th.course-city {
    width: 9.375rem; /* Converted to rem */
}

#courseDataTable thead th.course-period,
#companySpaceForm thead th.course-period,
#adminSpaceForm thead th.course-period{
    min-width: 6.25rem; /* Converted to rem */
}

#courseDataTable thead th.course-status,
#adminSpaceForm thead th.course-status,
#companySpaceForm thead th.course-status {
    width: auto; /* Converted to rem */
}

#coursesDataTable thead th.course-date,
#companySpaceForm thead th.course-date,
#companySpaceForm thead th.course_place_date,
#companySpaceForm thead th.date-candidature,
#adminSpaceForm thead th.course_place_date,
#adminSpaceForm thead th.date-candidature,
#referentSpaceForm thead th.date-candidature,
#studentSpaceForm thead th.date-candidature{
    max-width: 7.5rem; /* Converted to rem */
}

#adminSpaceForm thead th.course-date{
   /* width:7.5rem;*/
}


td.funding_show_value{
    width: 5.625rem; /* Converted to rem */
}

#adminSpaceForm thead th.course-level,
#companySpaceForm thead th.course-level {
    width: 5.625rem; /* Converted to rem */
}

#studentSpaceForm thead th.candidature-status,
#adminSpaceForm thead th.candidature-status,
#companySpaceForm thead th.candidature-status {
    width: 6.25rem; /* Converted to rem */
}

#referentSpaceForm thead th.candidature-status{
    max-width: 7.25rem;
}

td.candidature-status{
    text-align: center;
}

#courseDataTable thead th.course-prof-cat {
    min-width: 5.625rem; /* Converted to rem */
}

#candidaturesToValidPPRSDataTable thead th.select-all {
    width: 2%;
}

#candidaturesToValidPPRSDataTable thead th.course-label,
#candidaturesPPRSDataTable thead th.course-label,
#companyCoursesDataTable thead th.course-label{
    width: 25%; /* Responsive width */
}

#candidaturesToValidPPRSDataTable thead th.school-label,
#candidaturesPPRSDataTable thead th.school-label {
    width: 15%; /* Responsive width */
}

#candidaturesToValidPPRSDataTable thead th.motivation,
#candidaturesPPRSDataTable thead th.motivation {
    width: 47%; /* Responsive width */
}

#candidaturesToValidPPRSDataTable thead th.action-candidature,
#candidaturesPPRSDataTable thead th.action-candidature {
    width: 5%; /* Responsive width */
}

#courseListForm thead th,
#studentSpaceForm thead th,
#referentSpaceForm thead th,
#companySpaceForm thead th,
#adminSpaceForm thead th {
    padding: 0.313rem 0.313rem 0.438rem;
}

/*#courseDataTable thead div.ui-dt-c:first-of-type {
    margin-left: 0.313rem;
}

#courseDataTable thead div.ui-dt-c > span:not(:first-of-type) {
    margin-left: 0.625rem;
}*/

/* Default styles */

#courseListForm thead .ui-state-default:not(.ui-inputfield),
#studentSpaceForm thead .ui-state-default:not(.ui-inputfield),
#referentSpaceForm thead .ui-state-default:not(.ui-inputfield),
#companySpaceForm thead .ui-state-default:not(.ui-inputfield),
#adminSpaceForm thead .ui-state-default:not(.ui-inputfield){
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
}

#courseListForm .ui-datatable-data td,
#companySpaceForm .ui-datatable-data td,
#referentSpaceForm .ui-datatable-data td,
#studentSpaceForm .ui-datatable-data td,
#adminSpaceForm .ui-datatable-data td {
    padding: 0rem 0rem 1.5rem !important;
    /*padding: 0.313rem 0.313rem 0.625rem;*/ /* Converted to rem */
    white-space: normal;
}

#companySpaceForm .ui-datatable .ui-widget-content > td.course-accessKey,
#referentSpaceForm .ui-datatable .ui-widget-content > td.course-accessKey,
#adminSpaceForm .ui-datatable .ui-widget-content > td.course-accessKey,
#adminSpaceForm .ui-datatable .ui-widget-content > td.student-id{
    text-align: center;
}

#companySpaceForm .ui-datatable .ui-widget-content > td.course-accessKey img,
#referentSpaceForm .ui-datatable .ui-widget-content > td.course-accessKey img,
#adminSpaceForm .ui-datatable .ui-widget-content > td.course-accessKey img{
    padding: 0.188rem 0.813rem 0 0.813rem; /* Converted to rem */
}


#companySpaceForm .ui-datatable .ui-widget-content > td.course-accessKey .access-key,
#adminSpaceForm .ui-datatable .ui-widget-content > td.course-accessKey .access-key,
#adminSpaceForm .ui-datatable .ui-widget-content > td.student-id{
    font-size: 1.1em; /* Converted to rem */
    color: #272727;
    font-weight: bold;
}

#adminSpaceForm .ui-datatable .ui-widget-content > td.course-accessKey button,
#adminSpaceForm .ui-datatable .ui-widget-content > td.student-id button{
    background: none;
    text-shadow: none;
    box-shadow: none;
    color:#a25a5a;
}

#adminSpaceForm .ui-datatable .ui-widget-content > td.course-accessKey .ui-button .ui-button-text,
#adminSpaceForm .ui-datatable .ui-widget-content > td.student-id .ui-button .ui-button-text{
    padding: 0;
    line-height: inherit;
}

#companySpaceForm .ui-datatable .ui-widget-content > td.course-accessKey .available-place,
#adminSpaceForm .ui-datatable .ui-widget-content > td.course-accessKey .available-place{
    font-size: 0.9em; /* Converted to rem */
    color: #D8368A;
}

#courseDataTable_data.ui-datatable-data td.course-label {
    font-family: Roboto, sans-serif;
}
.ui-widget-content a > .course-type {
    color: black;
    font-size: 0.65rem; /* Converted to rem */
    font-weight: bold;
    float: left;
    margin: 0 0.625rem 0.313rem 0.625rem; /* Converted to rem */
}

.ui-widget-content a > .course-title {
    color: #0047a3;
    text-transform: uppercase;
    font-size: 0.725rem; /* Converted to rem */
    font-family: Roboto, sans-serif !important;
    float: left;
    margin:0.313rem 0.625rem 0; /* Converted to rem */
    line-height: 0.9rem; /* Converted to rem */
}

#companySpaceForm .ui-datatable-data td.course-label,
#adminSpaceForm .ui-datatable-data td.course-label{
    margin-left: 0.625rem; /* Converted to rem */
    font-family: Roboto, sans-serif;
}

#courseListForm .ui-datatable-data td.course-label span,
#companySpaceForm .ui-datatable-data td.course-label span,
#studentSpaceForm .ui-datatable-data td.course-label span,
#referentSpaceForm .ui-datatable-data td.course-label span,
#adminSpaceForm .ui-datatable-data td.course-label span,
#adminSpaceForm .ui-datatable-data td.user-label span{    
    display: block;
}
/* Default styles */

#courseListForm .ui-datatable-data td.course-label .course-title,
#companySpaceForm .ui-datatable-data td.course-label .course-title,
#referentSpaceForm .ui-datatable-data td.course-label .course-title,
#studentSpaceForm .ui-datatable-data td.course-label .course-title,
#adminSpaceForm .ui-datatable-data td.course-label .course-title,
#adminSpaceForm .ui-datatable-data td.user-label > .user-name{
    font-size: 0.917rem; /* Converted to rem */
    /*font-weight: 600;*/
}

#courseListForm .ui-datatable-data td.course-label .course-title {
    color: #2c62cb;
}

#companySpaceForm .ui-datatable-data td.course-label .course-title,
#studentSpaceForm .ui-datatable-data td.course-label .course-title,
#referentSpaceForm .ui-datatable-data td.course-label .course-title {
    color: #1767c2;
}

#adminSpaceForm .ui-datatable-data td.course-label .course-title,
#adminSpaceForm .ui-datatable-data td.user-label > .user-name{
    color: #0095ff;
}

#adminSpaceForm .ui-datatable-data td.user-label > .company-name + .company-city {
    margin-top: 0.188rem;
    font-style: normal;
    color: rgb(39, 39, 39);
    font-size: inherit;
}

#adminSpaceForm .ui-datatable-data td.user-label > .company-name {
    color: rgb(39, 39, 39);
    font-weight: normal;
}

#courseListForm .ui-datatable-data td.city-label > .company-city,
#companySpaceForm .ui-datatable-data td.course-label > .company-city,
#studentSpaceForm .ui-datatable-data td.course-label > .company-city,
#referentSpaceForm .ui-datatable-data td.course-label > .company-city,
#adminSpaceForm .ui-datatable-data td.course-label > .company-city,
#adminSpaceForm .ui-datatable-data td.course-label > .list-school-city,
#adminSpaceForm .ui-datatable-data td.user-label > .user-email{
    margin-top: 0.188rem; /* Converted to rem */
    font-size: 0.75rem; /* Converted to rem */
    color: rgb(39, 39, 39);
    font-style: italic;
}

#courseListForm .ui-datatable-data td.corporate-label > .company-name,
#studentSpaceForm .ui-datatable-data td.course-label > .company-name,
#referentSpaceForm .ui-datatable-data td.course-label > .company-name,
#adminSpaceForm .ui-datatable-data td.course-label > .company-name,
#adminSpaceForm .ui-datatable-data td.corporate-label > .company-name{
    font-family: Roboto, sans-serif;
    margin-top: 0.313rem; /* Converted to rem */
    color: rgb(39, 39, 39);
    font-weight: 600;
}

#courseDataTable_data.ui-datatable-data td.course-label > .company-name {
    margin-top: 0.188rem; /* Converted to rem */
    font-size: 0.75rem; /* Converted to rem */
    color: rgb(39, 39, 39);
    font-style: italic;
    font-weight: 600;
}

#courseDataTable_data.ui-datatable-data td.course-logo > .company-logo{
    max-width: 5rem; /* Converted to rem */
    vertical-align: top;
}

#courseDataTable_data.ui-datatable-data td.course-status  {
    padding: 0 0 0.313rem 0; /* Converted to rem */
}

#courseDataTable_data.ui-datatable-data td.course-status span,
#companySpaceForm .ui-datatable-data td.course-status span,
#adminSpaceForm .ui-datatable-data td.course-status span{
    display: block;
    height: 2.313rem; /* Converted to rem */
    text-align: center;
}

#courseDataTable_data.ui-datatable-data td.course-status span.opened,
#courseDataTable_data.ui-datatable-data td.course-status span.filled,
#companySpaceForm .ui-datatable-data td.course-status span.opened,
#companySpaceForm .ui-datatable-data td.course-status span.filled,
#adminSpaceForm .ui-datatable-data td.course-status span.opened,
#adminSpaceForm .ui-datatable-data td.course-status span.filled {
    background-position: center bottom;
    background-repeat: no-repeat;
}

#courseDataTable_data.ui-datatable-data td.course-status span.opened,
#companySpaceForm .ui-datatable-data td.course-status span.opened,
#adminSpaceForm .ui-datatable-data td.course-status span.opened{
    background-image: url("../../resources/images/s3e/enattente.png");
}

#courseDataTable_data.ui-datatable-data td.course-status span.filled,
#companySpaceForm .ui-datatable-data td.course-status span.filled,
#adminSpaceForm .ui-datatable-data td.course-status span.filled {
    background-image: url("../../resources/images/s3e/valide.png");
}

#studentSpaceForm .ui-datatable-data td.candidature-status span,
#referentSpaceForm .ui-datatable-data td.candidature-status span,
#companySpaceForm .ui-datatable-data td.candidature-status span,
#adminSpaceForm .ui-datatable-data td.candidature-status span{
    display: block;
    height: 2.8rem; /* Converted to rem */
    text-align: center;
/*    white-space: nowrap;*/
    background-position: center bottom;
    background-repeat: no-repeat;
}

#studentSpaceForm .ui-datatable-data td.candidature-status span.accepted,
#referentSpaceForm .ui-datatable-data td.candidature-status span.accepted,
#companySpaceForm .ui-datatable-data td.candidature-status span.accepted,
#adminSpaceForm .ui-datatable-data td.candidature-status span.accepted{
    background-image: url("../../resources/images/s3e/valide.png");
}

#studentSpaceForm .ui-datatable-data td.candidature-status span.rejected,
#referentSpaceForm .ui-datatable-data td.candidature-status span.rejected,
#companySpaceForm .ui-datatable-data td.candidature-status span.rejected,
#referentSpaceForm .ui-datatable-data td.candidature-status span.rejected_student,
#referentSpaceForm .ui-datatable-data td.candidature-status span.rejected_company,
#referentSpaceForm .ui-datatable-data td.candidature-status span.rejected_referent,
#referentSpaceForm .ui-datatable-data td.candidature-status span.withdrawn
#adminSpaceForm .ui-datatable-data td.candidature-status span.rejected_student,
#adminSpaceForm .ui-datatable-data td.candidature-status span.rejected_company,
#adminSpaceForm .ui-datatable-data td.candidature-status span.rejected_referent,
#adminSpaceForm .ui-datatable-data td.candidature-status span.withdrawn{
    background-image: url("../../resources/images/s3e/refus.png");
}

#studentSpaceForm .ui-datatable-data td.candidature-status span.timeout,
#referentSpaceForm .ui-datatable-data td.candidature-status span.timeout,
#companySpaceForm .ui-datatable-data td.candidature-status span.timeout,
#adminSpaceForm .ui-datatable-data td.candidature-status span.timeout {
    background-image: url("../../resources/images/s3e/out.png");
}

#studentSpaceForm .ui-datatable-data td.candidature-status span.waiting,
#referentSpaceForm .ui-datatable-data td.candidature-status span.waiting,
#referentSpaceForm .ui-datatable-data td.candidature-status span.waiting_referent,
#referentSpaceForm .ui-datatable-data td.candidature-status span.waiting_company,
#referentSpaceForm .ui-datatable-data td.candidature-status span.waiting_student,
#companySpaceForm .ui-datatable-data td.candidature-status span.waiting,
#adminSpaceForm .ui-datatable-data td.candidature-status span.waiting_referent,
#adminSpaceForm .ui-datatable-data td.candidature-status span.waiting_company,
#adminSpaceForm .ui-datatable-data td.candidature-status span.waiting_student{
    background-image: url("../../resources/images/s3e/enattente.png");
}

#studentSpaceForm .ui-datatable-data td.candidature-status span.closed,
#referentSpaceForm .ui-datatable-data td.candidature-status span.closed,
#companySpaceForm .ui-datatable-data td.candidature-status span.closed,
#adminSpaceForm .ui-datatable-data td.candidature-status span.closed{
    background-image: url("../../resources/images/s3e/closed.png");
}

/*#courseDataTable_data.ui-datatable-data td.course-date,
#companySpaceForm .ui-datatable-data td.date-candidature,
#studentSpaceForm .ui-datatable-data td.date-candidature,
#adminSpaceForm .ui-datatable-data td.date-candidature,
#referentSpaceForm .ui-datatable-data td.date-candidature,
#companySpaceForm .ui-datatable-data td.course_place_date,
#companySpaceForm .ui-datatable-data td.course-date,
#adminSpaceForm .ui-datatable-data td.course_place_date,
#adminSpaceForm .ui-datatable-data td.course-date{
    text-align: center;
}*/

#courseDataTable_paginator_bottom,
#candidaturesToValidPPRSDataTable_paginator_bottom,
#candidaturesPPRSDataTable_paginator_bottom {
    text-align: center;
    background-color: transparent;
    font-family: Roboto, sans-serif;
    font-size: 11pt;
    font-weight: lighter;
}

#courseDataTable_paginator_bottom span,
#candidaturesToValidPPRSDataTable_paginator_bottom span,
#candidaturesPPRSDataTable_paginator_bottom span{
    text-align: center;
    background-color: transparent;
    border:none;
}

/* Default styles */

#courseDataTable .ui-widget-content{
    border-bottom: 0;
}

#courseDataTable td.ui-datagrid-column{
    padding: 0.625rem; /* Converted to rem */
    width: 0.625rem; /* Not sure if this is intended, but converted to rem */
}

#courseListForm .ui-datatable .ui-sortable-column-icon,
#companySpaceForm .ui-datatable .ui-sortable-column-icon,
#studentSpaceForm .ui-datatable .ui-sortable-column-icon,
#referentSpaceForm .ui-datatable .ui-sortable-column-icon,
#adminSpaceForm .ui-datatable .ui-sortable-column-icon{
    float: left;
    margin: 0.313rem 0.125rem 0 -0.25rem;
}

/*
.ui-datatable tr.ui-state-highlight {
    background: none;
    text-shadow: none;
}

.ui-datatable .ui-datatable-data tr.ui-state-hover {
    background: none;
}*/

#adminSpaceForm .ui-datatable td.action-user .action-link-delete-user {
    background-image: url("../../resources/images/s3e/refus.png");
}

#adminSpaceForm .ui-datatable td.action-user .action-link-validate-user {   
    background-image: url("../../resources/images/s3e/valide.png");
}

/* Default styles */

action-user {
    width: 60px;
    height: 20px;
    text-align: center;
}

#adminSpaceForm .ui-datatable td.action-user .action-link-delete-user,
#adminSpaceForm .ui-datatable td.action-user .action-link-validate-user {
    background-position: center bottom;
    background-repeat: no-repeat;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-right: 0.625rem;
}

/*** Création d'utilisateurs spéciaux dans l'espace administrateur ***/

.user-panel h1{
    border-top: #0095ff 0.125rem solid;
    padding-top: 30px;
    margin-top: 30px;
    color: #0095ff;
}

.user-panel input{
    /*width: 23.75rem; /* Converted to rem */
}

/*** Formulaire de proposition d'offre ***/

.form-side {
    width: 48%;
}

.form-side.form-bottom {
    width: 100%;
    margin-top: 20px;
    margin-right: 0.188rem;
    float: right;
}

.form-terms-of-use, .required-field {
    width: 100%;
    margin-top: 30px;
    margin-left: 0.125rem;
    float: right;
}

.form-bottom {
    width: 53.75rem; /* Converted to rem */
    margin-top: 20px;
    margin-right: 0.625rem;
    float: right;
}

.form-bottom-sponsor {
    display: inline-block;
}

.required-field {
    font-family: Roboto, sans-serif;
    font-size: 1.125rem;
    width: 100%;
    margin-top: 30px;
    margin-left: 0.125rem;
    float: right;
}

.ui-editor.ui-widget-content {
    width: 26.5625rem !important; /* Converted to rem */
}



#adminSpaceForm.request-form  select {
    width: 12.5rem; /* Converted to rem */
    margin-left: 1.25rem; /* Converted to rem */
}

.form-left {
    float: left;
}

.form-right {
    float: right;
}

.form-vertical-align {
    margin-top: 42px;
}

.ui-corner-all {
    border-radius: 0;
}

input::-webkit-input-placeholder {
    color: #999;
}
input:-moz-placeholder {
    color: #999;
}
input:-ms-input-placeholder {
    color: #999;
}

textarea::-webkit-input-placeholder {
    color: #999;
}
textarea:-moz-placeholder {
    color: #999;
}
textarea:-ms-input-placeholder {
    color: #999;
}

/*.ui-outputlabel-rfi {
    display: none;
}*/

/* Base styles */
.form-side h2 {
    text-transform: uppercase;
    font-family: Roboto, sans-serif;
    font-size: 1.25rem; /* Adjusted font size */
}

.form-img {
    float: left;
    margin-right: 0.625rem;
    height: 0rem; /* 20px converted to rem */
    width: 1.25rem; /* 20px converted to rem */
}

.form-title:not(:first-of-type) {
    margin-top: 0.25rem; /* 30px converted to rem */
}

.request-form .form-option label {
    margin-top: 0.625rem;
    font-size: 1.2rem; /* Adjusted font size */
}

/* Base styles */
.action-buttons .button-stat:nth-child(2) {
    float: none;
    margin-left: 8.125rem; /* 130px converted to rem */
}

.home-content .action-buttons button:not(:last-of-type) {
    margin-right: 0.0078125rem; /* 0.125px converted to rem */
    margin-bottom: 0.625rem;
}

.home-content .action-buttons > button > span.ui-button-text {
    padding: 1.5rem 0.375rem; /* 0.938px converted to rem */
}

.home-content .ui-carousel .ui-carousel-header {
    padding: 0.0039375rem; /* 0.063px converted to rem */
}

.home-content .ui-carousel li img {
    width: 43.75rem; /* 700px converted to rem */
    height: 11.875rem; /* 190px converted to rem */
}

.home-content .ui-carousel .ui-carousel-viewport ul li {
    margin: 0;
}

.home-content .carousel-title {
    font-size: 0.6875rem; /* 11pt converted to rem */
}

.home-content .ui-carousel div {
    padding: 0;
}

.home-content .ui-icon-radio-off,
.home-content .ui-icon-radio-on {
    background-size: 100% 100%;
}

.ui-accordion .ui-accordion-content {
    padding: 0.0625rem 0 !important; /* 1px converted to rem */
}

.home-content h3.single-title {
    color: #E02363;
    font-size: 0.75rem; /* 12pt converted to rem */
    font-weight: bold;
    padding-top: 1.125rem; /* 1.125rem converted to rem */
}

.search-content .form-side {
    margin-bottom: 0.625rem;
}

#companyType {
    width: 9.6875rem; /* Converted to rem */
}

#optionActionCompany {
    margin-bottom: 1rem; /* Converted to rem */
}

.contact-gender label,
#createOrSelectCompany label {
    color: #0047a3;
}

.request-form .company-siret,
.request-form .contact-lastname{
    width: 12.4375rem; /* Converted to rem */
    margin-right: 0.625rem;
}

.request-form .company-naf,
.request-form .contact-firstname{
    width: 12.375rem; /* Converted to rem */
}

.request-form .company-zipcode {
    width: 5rem; /* Converted to rem */
    margin-right: 1rem !important;
    /*margin-left: 4rem;*/
}

.request-form .company-city {
    width: 16rem; /* Converted to rem */
}

#companyPhonenumber {
    width: 6.125rem; /* Converted to rem */
}

.request-form .candidature-delay {
    width: 5.625rem; /* Converted to rem */
}

.form-img-tel {
    margin-right: 0.438rem;
}

.form-img-googlemap {
    float: right;
    margin-right: 25rem;
    height: 0.1rem;
    width: 0.1rem;
    margin-top: 0.7rem;
}

.label-name-contact {
    width: 13.75rem; /* Converted to rem */
}

.label-fname-contact {
    width: 12.5rem; /* Converted to rem */
}

.request-form p.date label {
    width: 13.125rem; /* Converted to rem */
}

p.date {
    display: inline-block;
    width: 15rem; /* Converted to rem */
}

.request-form .period-table.ui-datatable-scrollable .ui-datatable-scrollable-header table,
.request-form .period-table.ui-datatable-scrollable .ui-datatable-scrollable-body table,
.request-form .period-table.ui-datatable-scrollable .ui-datatable-scrollable-footer table {
    width: 100%;
}

.request-form .period-table .ui-datatable-scrollable-body > table > tbody > tr > td > div.ui-dt-c {
    padding: 0.125rem 0.313rem;
}

.hide-column-names table thead tr {
    display: none;
}

/*#periodTable tr.ui-widget-content {
    width: 1.5em;
}*/

/* Responsive CSS with rem units */

/* Common styles for all devices */
.period-detail .ui-spinner {
    margin: 0.313rem 1.25rem 0 0; /* Converted to rem */
    vertical-align: top;
}

.period-detail input.ui-spinner-input {
    width: 4.375rem; /* Converted to rem */
    margin: 0;
    padding-right: 1.5rem; /* Converted to rem */
}

.request-form .period-table input.ui-spinner-input {
    width: 1.875rem; /* Converted to rem */
    margin: 0;
}

.request-form .period-detail-panel {
    width: 34.375rem; /* Converted to rem */
    height: 15.625rem; /* Converted to rem */
    overflow-y: scroll;
}

.request-form .period-detail-panel label {
    margin-bottom: 0.938rem; /* Converted to rem */
    margin-top: 1.25rem; /* Converted to rem */
    font-family: Roboto, sans-serif;
    font-size: 1rem; /* Converted to rem */
    display: inline-block;
}

a.ui-spinner-button {
    height: 46%;
}

#searchFormS3e.search-box > a.ui-commandlink {
    background-image: url("../../resources/images/s3e/btn-recherche.png");
    background-size: 100% 100%;
    float: left;
    height: 1.875rem; /* Converted to rem */
    width: 1.875rem; /* Converted to rem */
}

#searchFormS3e.search-box > a.ui-commandlink:hover {
    background-image: url("../../resources/images/s3e/btn-recherche-hover.png");
    background-size: 100% 100%;
    float: left;
    height: 1.875rem; /* Converted to rem */
    width: 1.875rem; /* Converted to rem */
}

.ui-dialog .action-buttons > button,
.action-buttons > button,
.action-buttons > button.ui-state-default {
    color: #ffffff;
    font-family: Roboto, sans-serif;
    font-weight: 100;
    font-size: 1rem !important; /* Converted to rem */
    /*text-transform: uppercase;*/
    min-width: 8.75rem; /* Converted to rem */
    box-shadow: none;
    text-shadow: none;
}

.action-buttons {
    margin-bottom: 0.5rem; /* Converted to rem */
}

.action-buttons button:first-of-type {
    float: left;
}

.action-buttons button:not(:first-of-type) {
    /*float: right;*/
}

.action-buttons button:not(:last-of-type) {
    margin-right: 1.875rem; /* Converted to rem */
}

.action-buttons > button > span.ui-button-text {
    padding: 0 1.25rem; /* Converted to rem */
}

/* Responsive CSS with rem units */

/* Common styles for all devices */
.sponsor-content .action-buttons > button,
.action-buttons.sponsor-ab-color > button,
.action-buttons.company-ab-color > button,
.home-content #home-form .action-buttons > button:last-of-type {
    background: #0047a3;
    min-width: 11.563rem; /* Converted to rem */
    white-space: pre;
    background-image: url(../../resources/images/s3e/icon_home2.png);
    background-repeat: no-repeat;
    background-size: 20%;
    background-position: 5.625rem 5.625rem; /* Converted to rem */
    border: 0rem solid #000000 !important;
    border-radius: 0.25rem;
}

.students-space .action-buttons > button,
.students-content .action-buttons > button,
.action-buttons.student-ab-color > button,
.home-content #home-form .action-buttons > button:not(:last-of-type) {
    background: #2c62cb;
    min-width: 1.563rem; /* Converted to rem */
    white-space: pre;
    background-image: url(../../resources/images/s3e/icon_home1.png);
    background-repeat: no-repeat;
    background-size: 20%;
    background-position: 5.625rem 5.625rem; /* Converted to rem */
    border-radius: 0.25rem; /* Converted to rem */
}

.school-content .action-buttons > button,
.action-buttons.school-ab-color > button,
.action-buttons.referent-ab-color > button {
    border: #00af5e solid 0.063rem; /* Converted to rem */
    background: #00af5e;
    min-width: 11.563rem; /* Converted to rem */
    white-space: pre;
    border-radius: 0.25rem; /* Converted to rem */
}

.parents-content .action-buttons > button,
.action-buttons.parents-ab-color > button {
    border: #da1984 solid 0.063rem; /* Converted to rem */
    background: #da1984;
    min-width: 11.563rem; /* Converted to rem */
    white-space: pre;
    border-radius: 0.25rem; /* Converted to rem */
}

/* Common styles for all devices */
.parents-content .action-buttons > button.ui-state-hover,
.action-buttons.parents-ab-color > button.ui-state-hover {
    border: #ffffff solid 0; /* Removed px */
    background: #ffffff;
    color: #da1984;
    border-radius: 0.25rem; /* Converted to rem */
}

.parents-content .action-buttons > button.ui-state-hover > .ui-button-text,
.action-buttons.parents-ab-color > button.ui-state-hover > .ui-button-text {
    border: #da1984 solid 0.063rem; /* Converted to rem */
    border-radius: 0.25rem; /* Converted to rem */
}

.action-buttons.plateform-ab-color > button,
.action-buttons.plateform-ab-color > button.ui-state-hover,
.action-buttons.candidature-ab-color > button,
.action-buttons.candidature-ab-color > button.ui-state-hover {
    border: #0095ff solid 0.063rem; /* Converted to rem */
    background: #0095ff;
    border-radius: 0.25rem; /* Converted to rem */
}

.action-buttons.plateform-ab-color > button.ui-state-hover,
.action-buttons.candidature-ab-color > button.ui-state-hover {
    border: #ffffff solid 0; /* Removed px */
    background: #ffffff;
    border-radius: 0.25rem; /* Converted to rem */
        color: #0095ff;
}

.action-buttons.plateform-ab-color > button.ui-state-hover > .ui-button-text,
.action-buttons.candidature-ab-color > button.ui-state-hover > .ui-button-text {
    border: #0095ff solid 0.063rem; /* Converted to rem */
    border-radius: 0.25rem; /* Converted to rem */
}

.search-content .action-buttons {
    margin: 0.625rem auto; /* Converted to rem */
}

.search-content .action-buttons > button,
.search-content .action-buttons > button.ui-state-hover {
    border: #8b8b8b solid 0.063rem; /* Converted to rem */
    background: #8b8b8b;
    border-radius: 0.25rem; /* Converted to rem */
}

.search-content .action-buttons > button.ui-state-hover > .ui-button-text {
    border: #8b8b8b solid 0.063rem; /* Converted to rem */
    border-radius: 0.25rem; /* Converted to rem */
}

.ui-inputfield,
.ui-widget-content .ui-inputfield,
.ui-widget-header .ui-inputfield {
    box-shadow: 0 0.125rem 0.125rem rgba(0, 0, 0, 0.25) inset;
}

.ui-dialog .filter-buttons > button,
.filter-buttons > button,
.filter-buttons > button.ui-state-default {
    color: #ffffff;
    font-family: Roboto, sans-serif;
    font-weight: 100;
    font-size: 1.2rem !important;
    text-transform: uppercase;
   /* min-width: 8.75rem; /* Converted to rem */
    box-shadow: none;
    text-shadow: none;
    /*margin-bottom: 1.25rem; /* Converted to rem */
}

#courseListForm #menuFilter {
    background-color: white;
    padding-top: 0.625rem; /* Converted to rem */
}

/* Responsive CSS with rem units */

.search-buttons.search-color > button {
    border: #0047a3 solid 0.063rem; /* Converted to rem */
    background: #0047a3;
    color: #ffffff;
    font-family: Roboto, sans-serif;
    font-weight: 100;
    font-size: 12pt !important; /* Converted to rem */
    text-transform: uppercase;
    min-width: 12.5rem; /* Converted to rem */
    box-shadow: none;
    text-shadow: none;
    border-radius: 2rem;
    /*margin-left: 60%; /* Converted to rem */
}

.search-buttons.search-color > button.ui-state-hover {
    border: #0047a3 solid 0.063rem; /* Converted to rem */
    background: #ffffff;
    color: #0047a3;
}

.search-buttons > button > span.ui-button-text {
    border: #0047a3 solid 0; /* Removed px */
    padding: 0 1.25rem; /* Converted to rem */
}

.filter-buttons.filter-color > button {
    border: #0047a3 solid 0.063rem; /* Converted to rem */
    background: #0047a3;
    min-width: 12.5rem; /* Converted to rem */
    height: 2.375rem; /* Converted to rem */
    white-space: pre;
    border-radius: 2rem;
}

.filter-buttons.filter-color > button.ui-state-hover {
    border: #0047a3 solid 0.063rem; /* Converted to rem */
    background: #ffffff;
    color: #0047a3;
}

.filter-dialog label {
    font-size: 1rem; /* Converted to rem */
    font-family: Roboto, sans-serif;
}

filter-checkboxes {
    font-size: 1rem !important; /* Converted to rem */
    display: none;
}

.filter-checkboxes label{
    font-size: 2rem !important; 
    font-weight: bold;
}

.filter-dialog {
    border: #ffffff solid 0.063rem; /* Converted to rem */
    color: #ffffff;
    font-family: Roboto, sans-serif;
    font-weight: 400;
    font-size: 0.625rem !important; /* Converted to rem */
    min-width: 8.75rem; /* Converted to rem */
    box-shadow: none;
    text-shadow: none;
    background: white;
    padding: 0 !important;
    opacity: 96%;
}

/* Categories picker dialog (course / unlisted-course edit forms) */
.filter-dialog.categories-picker-dialog {
    /* Surface d'affichage large, MAIS sans !important sur display/position/width :
       PrimeFaces pilote la fermeture (display:none inline), le déplacement et le
       redimensionnement par styles inline — un !important les neutraliserait.
       Les dimensions sont donc plafonnées, jamais imposées. */
    max-width: 93.75rem;   /* ~1500px, suit la taille de police utilisateur */
    max-height: 92vh;
}

/* Largeur souhaitée : appliquée seulement tant que l'utilisateur n'a pas
   redimensionné lui-même (jQuery UI pose alors un width inline qui prend le dessus). */
.filter-dialog.categories-picker-dialog:not(.ui-resizable-resizing) {
    width: 95vw;
}

/* Le corps du dialog défile si le contenu dépasse (pas de flex : inutile ici
   et cela empêcherait le masquage du dialog). */
.filter-dialog.categories-picker-dialog .ui-dialog-content {
    max-height: calc(92vh - 6rem);
    overflow-y: auto;
    overflow-x: hidden;
}

.filter-dialog.categories-picker-dialog #menuFilter {
    height: auto;
    min-height: 0;
    background-color: white;
    padding-top: 0;
}

.filter-dialog.categories-picker-dialog #menuFilter .ui-tabs-panels {
    height: auto;
    overflow: visible;
}

.filter-dialog.categories-picker-dialog #menuFilter table.list-filters.ui-panelgrid {
    width: 100%;
    table-layout: fixed;
}

.filter-dialog.categories-picker-dialog #menuFilter .list-filters.ui-panelgrid td {
    vertical-align: top;
    overflow: visible;
    white-space: normal;
    word-wrap: break-word;
}

.filter-dialog.categories-picker-dialog #menuFilter .title-filter {
    line-height: normal;
    display: block;
    white-space: normal;
}

/* Case + libellé sur une même ligne : la cellule devient un conteneur flex.
   Indispensable : donner sa largeur à la table interne du selectManyCheckbox,
   sinon les cellules flex se réduisent au minimum et le texte se coupe
   caractère par caractère. */
.filter-dialog.categories-picker-dialog #menuFilter .ui-selectmanycheckbox {
    width: 100% !important;
    table-layout: fixed;
}

.filter-dialog.categories-picker-dialog #menuFilter .ui-selectmanycheckbox tbody,
.filter-dialog.categories-picker-dialog #menuFilter .ui-selectmanycheckbox tr {
    width: 100%;
}

.filter-dialog.categories-picker-dialog #menuFilter .ui-selectmanycheckbox td {
    display: flex !important;
    align-items: flex-start;
    gap: 0.4rem;
    width: 100% !important;
    padding: 0.15rem 0.4rem 0.15rem 0;
    white-space: normal;
}

.filter-dialog.categories-picker-dialog #menuFilter .ui-selectmanycheckbox .ui-chkbox {
    flex: 0 0 auto;
    margin: 0.1rem 0 0 0;
}

.filter-dialog.categories-picker-dialog #menuFilter .ui-selectmanycheckbox label {
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
    line-height: 1.25;
    margin: 0;
    white-space: normal;
    overflow-wrap: break-word;
}

/* Colonnes de catégories : réparties équitablement, libellés jamais tronqués */
.filter-dialog.categories-picker-dialog #menuFilter .list-filters.ui-panelgrid > tbody > tr {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
}

.filter-dialog.categories-picker-dialog #menuFilter .list-filters.ui-panelgrid > tbody > tr > td {
    flex: 1 1 12rem;
    min-width: 11rem;
    padding: 0 0.6rem;
}

/* Responsive : 2 colonnes sur tablette, 1 sur mobile */
@media only screen and (max-width: 62rem) {
    .filter-dialog.categories-picker-dialog #menuFilter .list-filters.ui-panelgrid > tbody > tr > td {
        flex: 1 1 45%;
    }
}

@media only screen and (max-width: 40rem) {
    .filter-dialog.categories-picker-dialog {
        width: 98vw !important;
        max-height: 95vh !important;
    }
    .filter-dialog.categories-picker-dialog .ui-dialog-content {
        max-height: calc(95vh - 5rem) !important;
    }
    .filter-dialog.categories-picker-dialog #menuFilter .list-filters.ui-panelgrid > tbody > tr > td {
        flex: 1 1 100%;
    }
}

.ui-dialog-titlebar {
    font-family: Roboto, sans-serif;
    font-weight: 100;
    font-size: 1.3rem !important; /* Converted to rem */
    text-transform: uppercase;
    width: 100%; /* Converted to rem */
    height: 3.5rem;
    box-shadow: none;
    text-shadow: none;
   /* margin-bottom: 1.25rem;
    background: #0047a3;  */
}

.title-filter {
    font-size:1.1rem;
    font-weight:bold;
    line-height:3rem;
}

/*** Formulaire de proposition d'offre : Prévisualisation ***/

.course-detail.content,
.candidature-detail.content {
    max-width: 34.375rem; /* 550px converted to rem */
    margin-bottom: 1rem;
    color: #272727;
    font-family: Roboto, sans-serif;
    font-size: 1rem; /* 10pt converted to rem */
    text-align: justify;
    padding-left: 2.25rem; /* 30px converted to rem */
    line-height: 1.5rem; /* Assuming line-height remains unchanged */
    font-weight: normal;
    /*width:100%;*/
}

.course-detail.content.preview-color,
.candidature-detail.content.preview-color { /*.course-detail.content.grey, .candidature-detail.content.grey */
    color: #707070;
    font-size: 1rem; /* 11pt converted to rem */
}

a.candidature-detail.content.link {
    color: #2c62cb;
}

/*** Formulaire de postulation ***/
.label-left {
    width: 13.75rem; /* 220px converted to rem */
}

.label-right {
    width: 12.5rem; /* 200px converted to rem */
}

.request-form label.labelRadio,
.radioTitle {
    float: left;
    margin-top: 0;
    margin-left: 0.625rem;
}

.request-form label.labelRadio {
    width: 6.25rem; /* 100px converted to rem */
}

.ui-radiobutton-box {
    border: #2c62cb solid 0.063rem;
    background: #ffffff;
  /*  box-shadow: 0 0.125rem 0.125rem 0 rgba(0, 0, 0, 0.25) inset;
    -webkit-box-shadow: inset 0rem 0.125rem 0.125rem 0rem rgba(0, 0, 0, 0.25);*/
}

#createOrSelectCompany .ui-radiobutton-box,
.contact-gender .ui-radiobutton-box {
    border: #0047a3 solid 1px;
    background: #ffffff;
    /*box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25) inset;
    -webkit-box-shadow: inset 0px 2px 2px 0px rgba(0, 0, 0, 0.25);*/
}

.school-content .gender .ui-radiobutton-box {
    border: #0047a3 solid 1px;
    background: #ffffff;
    /*box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25) inset;
    -webkit-box-shadow: inset 0px 2px 2px 0px rgba(0, 0, 0, 0.25);*/
}

.user-gender .ui-radiobutton-box,
.plateform-content .gender .ui-radiobutton-box,
.admin-content .moderationLevel .ui-radiobutton-box{
    border: #0047a3 solid 1px;
    background: #ffffff;
    /*box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.25) inset;
    -webkit-box-shadow: inset 0px 2px 2px 0px rgba(0, 0, 0, 0.25);*/
}

.ui-radiobutton-box.ui-state-hover,
.ui-radiobutton-box.ui-state-active {
    box-shadow: none;
    background: rgba(228, 103, 38, 0.5);
    border: #0047a3 solid 10px;
}

#createOrSelectCompany .ui-radiobutton-box.ui-state-hover,
#createOrSelectCompany .ui-radiobutton-box.ui-state-active,
.contact-gender .ui-radiobutton-box.ui-state-hover,
.contact-gender .ui-radiobutton-box.ui-state-active {
    box-shadow: none;
    background: #0047a3;
    border: #0047a3 solid 10px;
}

.school-content .gender .ui-radiobutton-box.ui-state-hover,
.school-content .gender .ui-radiobutton-box.ui-state-active{
    box-shadow: none;
    background: rgba(0, 61, 121, 0.5);
    border: #0047a3 solid 10px;
}

.user-gender .ui-radiobutton-box.ui-state-hover,
.user-gender .ui-radiobutton-box.ui-state-active,
.plateform-content .gender .ui-radiobutton-box.ui-state-hover,
.plateform-content .gender .ui-radiobutton-box.ui-state-active,
.admin-content .moderationLevel .ui-radiobutton-box.ui-state-hover,
.admin-content .moderationLevel .ui-radiobutton-box.ui-state-active {
    box-shadow: none;
    background: rgba(196, 36, 22, 0.5);
    border: #0047a3 solid 10px;
}

/* Additional styling for different sections */
/* Base Styles */
#filterkeyw {
    width: 12.5rem; /* 200px converted to rem */
    margin-right: 0.625rem;
    margin: 0 0.625rem 0 1.25rem; /* Adjusted margin */
}

#filternumber {
    width: 3.125rem; /* 50px converted to rem */
    margin-right: 0.625rem;
    margin: 0 0.625rem 0 1.25rem; /* Adjusted margin */
}

#funding-title,
.request-form .funding-title {
    width: 10rem; /* 100px converted to rem */
    margin-right: 2.6875rem; /* 43px converted to rem */
}

#funding-value,
.request-form .funding-value {
    width: 3.125rem;
    text-align: right !important;/* 50px converted to rem */
}

.request-form .funding-detail {
    width: 10rem; /* 145px converted to rem */
    margin-left: 1.875rem; /* 30px converted to rem */
}

#funding-other,
.request-form .funding-other {
    width: 5.875rem; /* 94px converted to rem */
}

#funding-other-value,
.request-form .funding-value-other {
    width: 3.4375rem; /* 55px converted to rem */
}

label.custom-select {
    position: relative;
    display: inline-block;
    font-size: 0.6875rem; /* 11pt converted to rem */
}

#checkmargin {
    margin-top: 0;
}

.ui-selectcheckboxmenu-label {
    display: inherit !important;
    border: 0.063rem solid #A8A8A8;
    font: inherit;
    outline: none;
    background: transparent;
    box-shadow: 0 0.125rem 0.125rem rgba(0, 0, 0, 0.25) inset;
    line-height: 1.2;
    font-size: 0.875rem; /* 14pt converted to rem */
    padding: 0rem !important;
}

.ui-selectcheckboxmenu-panel .ui-selectcheckboxmenu-header .ui-chkbox-box {
    display: none;
}

.custom-select select,
#courseDataTable thead tr[role="row"] .course-status > select,
#courseDataTable thead tr[role="row"] .course-prof-cat > select {
    border: 0.063rem solid #A8A8A8;
    font: inherit;
    outline: none; /* remove focus ring from Webkit */
    background: #fff;
    box-shadow: 0 0.125rem 0.125rem rgba(0, 0, 0, 0.25) inset;
    line-height: 1.2;
    font-size: 0.875rem; /* 14pt converted to rem */
}

#city,
#district{
    width: 26.0625rem; /* 417px converted to rem */
}

#email {
    margin-top: 0.938rem;
}

.request-form  .referent-email {
    margin-right: 0.313rem;
    width: 19.0625rem; /* 305px converted to rem */
    margin-left: 1.25rem;
}

#district {
    margin-left: 0.438rem;
}

/*label.custom-select {
    margin-top: 0;
    font-family: Arial;
}

#courseDataTable thead tr[role="row"] .course-status > .ui-dt-c > select, 
.custom-select select {
    border: 0.063rem solid #A8A8A8;
    font: inherit;
    outline:none;  remove focus ring from Webkit 
    background: #fff;
    box-shadow: 0 0.125rem 0.125rem rgba(0, 0, 0, 0.25) inset;
    -webkit-appearance:none;  remove the strong OSX influence from Webkit 
    line-height: 1.2;
}

.custom-select select {
    display: inline-block;
    padding: 0.25rem 0.188rem 0.188rem 0.313rem;
    margin: 0;
}

#courseDataTable thead tr[role="row"] .course-status > .ui-dt-c > select {
    padding: 0.125rem 0.25rem;
    font-size: 1em;
}*/

/* Select arrow styling */
#courseDataTable thead tr[role="row"] .course-status > .ui-dt-c:after,
.custom-select:after {
    content: "▼";
    position: absolute;
    bottom: 0;
    padding: 0 0.438rem;
    background: #fff;
    border: 0.063rem solid #A8A8A8;
    border-left: none;
    pointer-events: none;
    box-shadow: 0 0.125rem 0.125rem rgba(0, 0, 0, 0.25) inset;
    font-size: 1.2rem; /* Equivalent to 12px */
}

.custom-select:after {
    top: 0;
    right: 0;
    line-height: 1.5rem; /* Equivalent to 15px */
}

.candidature-select:after {
    color: #2c62cb;
}

.referent-select:after {
    color: #00af5e;
}

.request-form label.course-select {
    margin-top: 0.125rem;
}

.course-select:after {
    color: #0047a3;
}

.custom-select.course-select.status-select,
.custom-select.candidature-select.status-select {
    margin-top: 0.313rem;
}

#courseDataTable thead tr[role="row"] .course-status > .ui-dt-c:after {
    bottom: 0.438rem;
    line-height: 1.25rem; /* Equivalent to 12.5px */
    right: 1.563rem; /* Equivalent to 25px */
}

.no-pointer-events .custom-select:after {
    content: none;
}

/*** Pagination ***/
#candidatures-student_paginator_top,
#candidatures-student-to-validate_paginator_top,
#candidatures-referent_paginator_top,
#courses_paginator_top {
    display: none;
}

#searchedCourses_paginator_top {
    display: none;
}

.ui-datalist-content.ui-widget-content {
    border: none;
}

.ui-datalist .ui-paginator-bottom {
    float: right;
    margin-bottom: 1.25rem; /* Equivalent to 20px */
}

.list-box-c {
    margin-bottom: 0.625rem; /* Equivalent to 10px */
}

.ui-datalist-content > .list-item:nth-of-type(2n+2),
.ui-datatable-odd,
.ui-datatable-odd.ui-state-hover {
    background: #f1f1f1; /* Old browsers */
}

.ui-datalist-content > .list-item:nth-of-type(2n+1),
.ui-datatable-even.ui-state-hover {
    background-color: #ffffff;
}

.ui-datalist-content > .list-item:hover,
.ui-datatable-data > .ui-state-hover {
    box-shadow: 0 -0.125rem 0.125rem 0 rgba(0, 0, 0, 0.25) inset;
    -webkit-box-shadow: inset 0rem -0.125rem 0.125rem 0rem rgba(0, 0, 0, 0.25);
    -moz-box-shadow: inset 0rem -0.125rem 0.125rem 0rem rgba(0, 0, 0, 0.25);
}

.list-item > .left .course-title,
.list-item > .left .course-title,
.list-item > .left .course-title {
    font-family: Roboto, sans-serif;
    font-weight: bold;
    font-size: 1.2rem; /* Equivalent to 12px */
}




/* Base Styles */
#candidatures-student_content > .list-item > .left .course-title,
#candidatures-student-to-validate_content > .list-item > .left .course-title,
#candidatures-referent_content > .list-item > .left .course-title,
#company-courses .list-item > .left .course-title {
    color: rgb(224, 35, 99);
}

#plateform-courses .list-item > .left .course-title,
#plateform-candidatures .list-item > .left .course-title {
    color: #0095ff;
}

#courses_content > .list-item > .left .course-title {
    color: rgb(228, 103, 38);
}

#searchedCourses_content > .list-item > .left .course-title {
    color: #8b8b8b;
}

.list-item > .left .company-name,
.list-item > .left .company-name,
.list-item > .left .company-name {
    font-family: Roboto, sans-serif;
    margin-top: 0.625rem; /* Equivalent to 10px */
    font-size: 1.2rem; /* Equivalent to 12px */
    color: #272727;
    font-weight: 600;
}

.list-item > .left .company-city,
.list-item > .left .company-city,
.list-item > .left .company-city {
    margin-top: 0.375rem; /* Equivalent to 6px */
    font-size: 0.9rem; /* Equivalent to 9px */
    color: #272727;
    font-style: italic;
}

.ui-datalist-content > .list-item > .right {
    font-family: Roboto, sans-serif;
    font-weight: lighter;
    font-size: 11pt; /* Equivalent to 11px */
    color: #272727;
}

.ui-datalist-content > .list-item > .left span:first-of-type {
    font-family: Roboto, sans-serif;
    margin-top: 0.625rem; /* Equivalent to 10px */
    font-size: 1.2rem; /* Equivalent to 12px */
    color: #272727;
    font-weight: 600;
}

.ui-datalist-content > .list-item > .left span:not(:first-of-type) {
    margin-top: 0.375rem; /* Equivalent to 6px */
    font-size: 0.9rem; /* Equivalent to 9px */
    color: #272727;
    font-style: italic;
}

.list-header > span {
    font-family: Roboto, sans-serif;
    font-size: 1.6rem; /* Equivalent to 1rem */
}

.ui-datalist-content > .list-item > .left,
.list-header > span.left {
    padding-left: 1.25rem; /* Equivalent to 20px */
    width: 34.375rem; /* Equivalent to 550px */
}

.course-filter {
    margin: 0 1.25rem 0.625rem 1.25rem; /* Equivalent to 20px */
}

.course-filter > .left {
    padding-left: 1.25rem; /* Equivalent to 20px */
}

.floating-box .leftL {
    float: left;
}

#candidatures-referent .ui-datalist-content > .list-item > .left,
#company-courses .ui-datalist-content > .list-item > .left,
#plateform-courses .ui-datalist-content > .list-item > .left,
.list-header.referent > span.left,
.company-courses-header .list-header.company > span.left,
.plateform-courses-header .list-header.plateform > span.left {
    width: 25rem; /* Equivalent to 400px */
}

#candidatures-referent .ui-datalist-content > .list-item > .centerL,
#company-courses .ui-datalist-content > .list-item > .centerL,
#plateform-courses .ui-datalist-content > .list-item > .centerL,
.list-header.referent > span.centerL,
.company-courses-header .list-header.company > span.centerL,
.plateform-courses-header .list-header.plateform > span.centerL {
    width: 9.375rem; /* Equivalent to 150px */
    float: left;
    text-align: center;
}

.list-header > span.center {
    width: 9.375rem; /* Equivalent to 150px */
    float: left;
    text-align: center;
}

/* Base Styles */
.ui-datalist-content > .list-item > .center {
    width: 9.375rem; /* Equivalent to 150px */
    float: left;
    height: 2.313rem; /* Equivalent to 37px */
    text-align: center;
}

.ui-datalist-content > .list-item > .right,
.list-header > span.right {
    padding-right: 1.25rem; /* Equivalent to 20px */
}

.ui-datalist .ui-paginator-bottom,
.ui-datatable .ui-paginator-bottom {
    border: none;
    background: none;
}

.ui-datalist .ui-paginator-bottom span.ui-state-default,
.ui-datalist .ui-paginator-bottom span.ui-state-default:hover,
.ui-datatable .ui-paginator-bottom span.ui-state-default,
.ui-datatable .ui-paginator-bottom span.ui-state-default:hover {
    background: none;
    border: none;
    box-shadow: none;
    font-family: Roboto, sans-serif;
    font-size: 11pt; /* Equivalent to 11px */
    font-weight: lighter;
}

candidatures-student_paginator_bottom span.ui-state-default,
candidatures-student_paginator_bottom span.ui-state-default:hover,
candidatures-referent_paginator_bottom span.ui-state-default,
candidatures-referent_paginator_bottom span.ui-state-default:hover {
    color: #434343;
}

searchedCourses_paginator_bottom span.ui-state-default,
searchedCourses_paginator_bottom span.ui-state-default:hover {
    color: #8b8b8b;
}

#courses_paginator_bottom span.ui-state-active,
#courses_paginator_bottom span.ui-paginator-page:hover,
#courseDataTable_paginator_bottom span.ui-state-active,
#courseDataTable_paginator_bottom span.ui-paginator-page:hover {
    background-color: #2c62cb;
    color: #ffffff;
}

#coursesDataTable_paginator_bottom span.ui-state-active,
#coursesDataTable_paginator_bottom span.ui-paginator-page:hover {
    background-color:  #0095ff;
    color: #ffffff;
}

#moderateCoursesDataTable_paginator_bottom span.ui-state-active,
#moderateCoursesDataTable_paginator_bottom span.ui-paginator-page:hover {
    background-color:   #0095ff;
    color: #ffffff;
}

#candidaturesDataTable_paginator_bottom span.ui-state-active,
#candidaturesDataTable_paginator_bottom span.ui-paginator-page:hover {
    background-color:  #0095ff;
    color: #ffffff;
}

#companyContactsDataTable_paginator_bottom span.ui-state-active,
#companyContactsDataTable_paginator_bottom span.ui-paginator-page:hover {
    background-color: #0095ff;
    color: #ffffff;
}

#referentsDataTable_paginator_bottom span.ui-state-active,
#referentsDataTable_paginator_bottom span.ui-paginator-page:hover {
    background-color:  #0095ff;
    color: #ffffff;
}

#studentsDataTable_paginator_bottom span.ui-state-active,
#studentsDataTable_paginator_bottom span.ui-paginator-page:hover {
    background-color: #0095ff;
    color: #ffffff;
}

#candidatures-student-to-validate_paginator_bottom span.ui-state-active,
#candidatures-student-to-validate_paginator_bottom span.ui-paginator-page:hover,
#candidatures-student_paginator_bottom span.ui-state-active,
#candidatures-student_paginator_bottom span.ui-paginator-page:hover,
#candidatures-referent_paginator_bottom span.ui-state-active,
#candidatures-referent_paginator_bottom span.ui-paginator-page:hover {
    background-color: #E02363;
    color: #ffffff;
}

#searchedCourses_paginator_bottom span.ui-state-active,
#searchedCourses_paginator_bottom span.ui-paginator-page:hover {
    background-color: #8b8b8b;
    color: #ffffff;
}

.ui-datalist .ui-paginator-bottom span.ui-state-default:not(.ui-paginator-page),
.ui-datatable .ui-paginator-bottom span.ui-state-default:not(.ui-paginator-page) {
    padding: 0.125rem 0rem;
}

#content .ui-message-info, #content .ui-message-error, #content .ui-message-warn, #content .ui-message-fatal {
    margin-left: 10%;
    margin-bottom: 3%;
    width: 75%; /* Equivalent to 427px */
}

.ui-datalist-content > .list-item > .center.rejected,
.ui-datalist-content > .list-item > .center.inactive,
.ui-datalist-content > .list-item > .center.withdrawn{
    background-image: url("../../resources/images/s3e/refus.png");
}

.ui-datalist-content > .list-item > .center.waiting {
    background-image: url("../../resources/images/s3e/enattente.png");
}

.ui-datalist-content > .list-item > .center.closed,
.ui-datalist-content > .list-item > .center.filled,
.ui-datalist-content > .list-item > .center.validated,
.ui-datalist-content > .list-item > .center.accepted {
    background-image: url("../../resources/images/s3e/valide.png");
}

.ui-datalist-content > .list-item > .center {
    background-repeat: no-repeat;
    background-position: center bottom;
}

.list-tabs {
    margin-top: 0.625rem; /* Equivalent to 10px */
    height: 2.188rem; /* Equivalent to 35px */
}


/* Base Styles */
.list-tabs > ul {
    border-bottom: #1767c2 0.188rem solid;
    float: left;
    width: 100%;
}

#adminSpaceForm .list-tabs > ul {
    border-bottom: #0095ff 0.188rem solid;
}

#courseListForm .list-tabs > ul {
    border-bottom: #0047a3 0.188rem solid;
}

.list-tabs > ul > li {
    float: left;
    height: 2.188rem; /* Equivalent to 35px */
    background: #fff;
    border-top: #1767c2 0.063rem solid;
    border-left: #1767c2 0.063rem solid;
    color: #fefdfd00;
}

.list-tabs > ul > li.selected {
    background: #1767c2;
}

.list-tabs > ul > li.list-courses {
    border-top:#0047a3 0.063rem solid;
    border-left: #0047a3 0.063rem solid;
}

.list-tabs > ul > li.plateform {
    border-top: #0095ff 0.063rem solid;
    border-left: #0095ff 0.063rem solid;
}

.list-tabs > ul > li.selected.plateform {
    background: #0095ff;
}

.list-tabs > ul > li.selected.list-courses {
    background: #0047a3;
}

.list-tabs > ul > li > a {
    color: #1767c2;
    min-height: 2.188rem; /* Equivalent to 35px */
    line-height: 2.188rem; /* Equivalent to 35px */
    font-size: 1.3rem; /* Equivalent to 13pt */
    padding: 0.625rem;
    font-family: inherit;
}

.list-tabs > ul > li.list-courses > a {
    color: #0047a3;
}

.list-tabs > ul > li.plateform > a {
    color: #0095ff;
}

.list-tabs > ul > li.selected > a {
    color: #ffffff;
}

.list-tabs > ul > li {
    z-index: 5;
}

.list-tabs > ul > li.selected {
    z-index: 10;
}

.list-tabs > ul > li.matrix {
    width: 1.25rem; /* Equivalent to 20px */
    -moz-transform: matrix(1, 0, 0.5, 1, -10, 0);
    -webkit-transform: matrix(1, 0, 0.5, 1, -10, 0);
    -o-transform: matrix(1, 0, 0.5, 1, -10, 0);
    -ms-transform: matrix(1, 0, 0.5, 1, -10, 0);
    transform: matrix(1, 0, 0.5, 1, -10, 0);
    border-right: #0047a3 0.063rem solid;
    border-left: none;
}

.list-tabs > ul > li.list-courses.matrix {
    border-right: #0047a3 0.063rem solid;
}

.list-tabs > ul > li.plateform.matrix {
    border-right: #0095ff 0.063rem solid;
}

/*** Candidature dans espace perso ***/

.top-left {
    float: left;
    margin-left: 0;
    width: 21.875rem; /* Equivalent to 350px */
}

.top-right {
    float: right;
    margin-right: 0;
    width: 10.938rem; /* Equivalent to 175px */
}
.top-right-showcandidature {
    float: right;
    margin-right: 6.25rem; /* Equivalent to 100px */
    width: 21.875rem; /* Equivalent to 350px */
}

.top-left .course-detail.content, .top-left .candidature-detail.content,
.top-right .course-detail.content, .top-right .candidature-detail.content,
.form-side.form-top {
    width: inherit;
}

a.candidature-detail.content {
    color: #2c62cb;
    text-decoration: underline;
}

.form-side.form-top {
    border-bottom: #E02363 0.188rem solid;
    float: left;
    width:100%; /* Equivalent to 890px */
    padding-bottom: 1.25rem; /* Equivalent to 20px */
    margin: 0 20px 0.938rem 20px;
}

#refuse-dialog {
    border: rgb(224, 35, 99) solid 0.063rem;
}

#refuse-dialog .form-side.form-bottom {
    margin-bottom: 0rem;
    margin-right: 0rem;
    width: auto;
}

#refuse-dialog .action-buttons {
    margin-right: 0rem;
}

#refuse-reason {
    padding-top: 0.5rem;
}

#refuse-reason .ui-outputlabel {
    font-weight: bold;
}

#refuse-reason-text {
    margin-top: 0.625rem;
}

/*** Recherche par numéro ***/

#searchByNumInput {
    width: 14.688rem; /* Equivalent to 235px */
    margin-bottom: 1.25rem; /* Equivalent to 20px */
}

.action-buttons.left {
    float: left;
}

/*** Login ***/

.loginFormS3e {
    width: 30%;
    /*height: 16.25rem; /* 260px converted to rem */
    margin-left: auto;
    margin-right: auto;
    padding: 1.563rem; /* 25px converted to rem */
    border: #1767c2 solid 0.188rem; /* Border width in rem */
    /* background-color: #2B96BD; */
    color: #1767c2;
    border-radius: 0.5rem;
}

.loginFormS3e .action-buttons button:first-of-type {
    float: none;
}

.loginFormS3e a {
    color: #1767c2;
    font-size:0.85rem; /* Converted font size to rem */
    text-decoration: underline;
    margin-right: 1.25rem; /* Converted margin to rem */
}

/* Converted border width to rem */
.loginFormS3e .action-buttons > button,
.lost-password.action-buttons > button,
.access-denied.action-buttons > button,
.login-sponsor-box .action-buttons > button,
.login-student-box .action-buttons > button {
    border: #1767c2 solid 0.063rem;
    background: #1767c2;
}

/* Converted border width to rem */
.loginFormS3e .action-buttons > button.ui-state-hover,
.lost-password.action-buttons > button.ui-state-hover,
.access-denied.action-buttons > button.ui-state-hover,
.login-sponsor-box .action-buttons > button.ui-state-hover,
.login-student-box .action-buttons > button.ui-state-hover {
    border: #ffffff solid 0rem;
    background: #ffffff;
    color: #1767c2;
}

/* Converted border width to rem */
.loginFormS3e .action-buttons > button.ui-state-hover > .ui-button-text,
.lost-password.action-buttons > button.ui-state-hover > .ui-button-text,
.access-denied.action-buttons > button.ui-state-hover > .ui-button-text,
.login-sponsor-box .action-buttons > button.ui-state-hover > .ui-button-text,
.login-student-box .action-buttons > button.ui-state-hover > .ui-button-text {
    border: #1767c2 solid 0.188rem;
}

#lost-password {
    margin-top: 2.5rem; /* Converted margin to rem */
}

span.lost-password {
    font-size: 1.2rem; /* Converted font size to rem */
    margin-top: 1.25rem; /* Converted margin to rem */
    margin-bottom: 2.8125rem; /* Converted margin to rem */
}

/*** Page de demande de connexion ou de création de compte avant de déposer une offre de stage ***/

.login-sponsor-box{
    width:100%; 
    /*height: 22.5rem; 
    display: inline-block;
    font-size: 1.2rem; */
}

.login-sponsor-box .title {
    color: #0047a3;
    line-height: 1.375rem; /* Equivalent to 22px */
    height: 3rem; /* Equivalent to 48px */
    font-size: 1.3rem; /* Equivalent to 20.8px */
    text-transform: uppercase;
    border-bottom: #0047a3 solid 0.063rem;
    margin-bottom: 1.25rem; /* Equivalent to 20px */
}

.login-sponsor-box .left{
    float: left;
    width: 50%; /* Equivalent to 448px */
    border-right: #0047a3 solid 0.063rem;
}

.login-sponsor-box .right{
    width: 50%; /* Equivalent to 448px */
    float: right;
}

.login-sponsor-box form {
    margin: 1.563rem; /* Equivalent to 25px */
}

.login-sponsor-box label{
    width: 7.5rem; /* Equivalent to 120px */
}

.login-sponsor-box input{
    /*width: 16.688rem; /* Equivalent to 267px */
    border-color: #0047a3;
    box-shadow: 0 0 0;
   /* width:80% !important;*/
}

.login-sponsor-box .right .action-buttons > button {
    width:80%; /* Equivalent to 397px */
    margin-top: 1.5rem; /* Equivalent to 24px */
}

.login-sponsor-box .left .action-buttons {
    /*margin-top: 1rem; /* Equivalent to 1rem */
    margin-bottom: 3.938rem; /* Equivalent to 63px */
}

.login-sponsor-box .left .action-buttons > button {
    width: 80%;
    margin-left: 1.3rem;
}

.login-sponsor-box .left .login-link{
    margin-left: 1.3rem; /* Equivalent to 120px */
    text-decoration: underline;
}

/*** Page de demande de connexion ou de création de compte avant de postuler une offre de stage ***/

.login-student-box{
    width: 56.125rem; /* Equivalent to 898px */
    height: 22.5rem; /* Equivalent to 360px */
    display: inline-block;
    font-size: 1.2rem; /* Equivalent to 19.2px */
    border-top: #0047a3 solid 0.063rem;
    padding-top: 1.875rem; /* Equivalent to 30px */
}

.login-student-box .title {
    float: left;
    color: #1767c2;
    line-height: 1.375rem; /* Equivalent to 22px */
    height: 3rem; /* Equivalent to 48px */
    font-size: 1.3rem; /* Equivalent to 20.8px */
    padding-top: 0.625rem; /* Equivalent to 10px */
    padding-left: 7.5rem; /* Equivalent to 120px */
}

.login-student-box .middle{
    width: 18.75rem; /* Equivalent to 300px */
    margin: auto;
    margin-bottom: 1.75rem; /* Equivalent to 50px */
}

.login-student-box .ui-inputtext, .login-student-box .ui-password{
    width: 18.75rem; /* Equivalent to 300px */
    border-color: #0047a3;
    font-size: 0.9rem; /* Equivalent to 14.4px */
    box-shadow: 0 0 0;
}

.login-student-box .action-buttons > button {
    width: 18.75rem;
    float: none;
    /*margin: 0.313rem 1.25rem;*/
}

.login-student-box .right .action-buttons > button {
    width: 24.813rem; /* Equivalent to 397px */
    margin-top: 1.5rem; /* Equivalent to 24px */
}

.login-student-box .left .action-buttons {
    margin-top: 1rem; /* Equivalent to 1rem */
    margin-bottom: 3.938rem; /* Equivalent to 63px */
}

.login-student-box .left .action-buttons > button {
    width: 18.75rem; /* Equivalent to 300px */
    margin-left: 7.5rem; /* Equivalent to 120px */
}

.login-student-box .left .login-link{
    margin-left: 7.5rem; /* Equivalent to 120px */
    text-decoration: underline;
}


/*** Comptes utilisateurs ***/

.account-box {
    width:100%; /* Equivalent to 828px */
    height: 16rem; /* Equivalent to 228px */
    display: inline-block;
    font-size: 1.5rem; /* Equivalent to 24px */
    /*margin-left: 2.188rem; /* Equivalent to 35px */
    cursor: pointer;
}

.account-box span {
    display: inline-block;
    padding-left: 1.875rem; /* Equivalent to 30px */
    text-align: left;
}

.account-box img {    
    margin-bottom: 1.375rem; /* Equivalent to 22px */
}

.account-box-title {
    font-size: 20pt; /* Equivalent to 40pt */
    font-weight: 600;
    /*text-align: center;*/
    margin-top: 1.125rem; /* Equivalent to 1.125rem */
    margin-bottom: 1.563rem; /* Equivalent to 25px */
}

.account-box .left, .account-box .right {
    padding-bottom: 1.563rem;
    border: #1767c2 solid 0.375rem;
    width:30%; /* Equivalent to 246px */
    color: #1767c2;
    border-radius: 0.5rem;
    height: 16rem;
}

.account-box .middle {
    background-color: lightgray;
    border: gray solid 0.375rem;
    width: 30%;
    color: gray;
    padding-left: 0.4rem;
    padding-bottom: 0.625rem;
    margin-left: 5%;
    margin-right: 5%;
    border-radius: 0.5rem;
    height: 16rem;

}

.account-box .left:hover, .account-box .right:hover {
    background-color: #fff;
    border: #0047a3 solid 0.375rem;
    color: #0047a3;
}

.account-box .account-box .middle:hover {
    background-color: lightgray;
    border: gray solid 0.375rem;
    color: lightcoral;
}

.account-box .left {
    float: left;
}

.account-box span, .account-box img, .account-box-title {
    padding-left: 1.438rem; /* Equivalent to 23px */
}

.account-box .middle {
    float: left;
}

.account-box .right {
    float: right;
    padding-bottom: 2.938rem; /* Equivalent to 47px */
}

.contact-panel {
    clear: both;
}

/*** Espaces ***/
.space-content p,
.home-content p,
.student-content p {
    font-family: Roboto, sans-serif;
    font-size: 1rem !important;
    text-align: justify;
    line-height: 1.4rem;
}

.student-content h1, .student-content h3 {
  color: #2c62cb;
}

.space-content .ui-accordion .ui-accordion-header a,
.home-content .ui-accordion .ui-accordion-header a {
    font-weight: bold;
    font-size: 1.2rem; /* Equivalent to 19.2px */
    padding-left: 1.125rem; /* Equivalent to 1.125rem */
}

.space-content .ui-accordion .ui-accordion-header.ui-state-hover,
.home-content .ui-accordion .ui-accordion-header.ui-state-hover {
    box-shadow: none;
}

.space-content .ui-accordion-header > span,
.home-content .ui-accordion-header > span {
    display: none;
}

.home-content .ui-accordion li {
    color: #272727;
    font-family: Roboto, sans-serif;
    font-size: 0.625rem; /* Equivalent to 10pt */
    list-style-type: circle;
    list-style-position: outside;
}

.home-content .ui-accordion li a {
    color: #272727;
    text-decoration: underline;
}

.home-content .ui-accordion li a:hover {
    text-decoration: none;
}


/*.parents-content .ui-accordion .ui-accordion-header {
    background: url("../../resources/images/s3e/liste-parents-rotate.png") no-repeat left;
}

.parents-content .ui-accordion .ui-accordion-header.ui-state-active {
    background: url("../../resources/images/s3e/liste-parents.png") no-repeat left;
}*/



.parents-content .ui-accordion .ui-accordion-header a {
    color: #6b991d;
}



.school-content .ui-accordion .ui-accordion-header {
    background: url("../../resources/images/s3e/liste-school-rotate.png") no-repeat left;
}

.school-content .ui-accordion .ui-accordion-header.ui-state-active {
    background: url("../../resources/images/s3e/liste-school.png") no-repeat left;
}

.school-content .ui-accordion .ui-accordion-header a {
    color: #00af5e;
}

.home-content .ui-accordion .ui-accordion-header {
    background: url("../../resources/images/s3e/liste-home-rotate.png") no-repeat left;
}

.home-content .ui-accordion .ui-accordion-header.ui-state-active {
    background: url("../../resources/images/s3e/liste-home.png") no-repeat left;
}

.home-content .ui-accordion .ui-accordion-header a {
    color: #E02363;
}

.students-content .ui-accordion .ui-accordion-header {
    background: url("../../resources/images/s3e/liste-student-rotate.png") no-repeat left;
}

.students-content .ui-accordion .ui-accordion-header.ui-state-active {
    background: url("../../resources/images/s3e/liste-student.png") no-repeat left;
}

.students-content .ui-accordion .ui-accordion-header a {
    color: #2c62cb;
}

.sponsor-content .ui-accordion .ui-accordion-header {
    background: url("../../resources/images/s3e/liste-sponsor-rotate.png") no-repeat left;
}

.sponsor-content .ui-accordion .ui-accordion-header.ui-state-active {
    background: url("../../resources/images/s3e/liste-sponsor.png") no-repeat left;
}

.sponsor-content .ui-accordion .ui-accordion-header a {
    color: #0047a3;
}

.space-content p.subtitle:not(:first-of-type),
.home-content p.subtitle:not(:first-of-type) {
    margin-top: 1.25rem; /* Equivalent to 20px */
}

.space-content p.blackTitle,
.home-content p.blackTitle {
    font-weight: bold;
}

.space-content p.blackTitle:not(:first-of-type),
.home-content p.blackTitle:not(:first-of-type) {
    margin-top: 0.938rem; /* Equivalent to 15px */
}

.space-content li {
    color: #272727;
    font-family: Roboto, sans-serif;
    font-size: 0.625rem; /* Equivalent to 10pt */
    list-style-type: circle;
    list-style-position: outside;
}

.space-content a {
    color: #272727;
    text-decoration: underline;
    line-height: 0.75rem; /* Equivalent to 12pt */
}

.space-boxes {
    margin-bottom: 1.25rem; /* Equivalent to 20px */
}


.flex-container {
    display: flex;
    justify-content: space-between; /* Distribute items evenly along the main axis */
    flex-wrap: wrap; /* Allow items to wrap to the next line if needed */
}

.sizingbox {
    flex-basis: calc(33.33% - 20px); /* Set the initial size of each box */
    margin-bottom: 20px; /* Add some margin between the boxes */
}

.space-box,
.space-box-schools {
    width: 32%; /* Adjust as needed */
    height: 11.563rem; /* Equivalent to 185px */
    background-color: #464646;
    background-repeat: no-repeat;
    background-position: 95% 92%;
    color: white;
    padding: 0.313rem; /* Equivalent to 5px */
    display: inline-flex;
    border-radius: 0.25rem;
}

.space-box-teach {
    width: 32%; /* Adjust as needed */
    height: 11.563rem; /* Equivalent to 185px */
    background-color: #17558d;
    background-repeat: no-repeat;
    background-position: 95% 92%;
    color: white;
    padding: 0.313rem; /* Equivalent to 5px */
    display: inline-flex;
    border-radius: 0.25rem;
}

.space-box-perdir {
    width: 32%; /* Adjust as needed */
    height: 11.563rem; /* Equivalent to 185px */
    background-color: #4b8f24;
    background-repeat: no-repeat;
    background-position: 95% 92%;
    color: white;
    padding: 0.313rem; /* Equivalent to 5px */
    display: inline-flex;
    border-radius: 0.25rem;
}


.space-box-schools {
    height: 12.5rem; /* Equivalent to 200px */
}

.space-box .box-img,
.space-box-schools .box-img {
    background-image: url("../../resources/images/s3e/box-arrow-right.png");
    background-repeat: no-repeat;
    float: left;
    height: 2.188rem; /* Equivalent to 35px */
    transform: translateY(-0.625rem); /* Equivalent to -10px */
    -moz-transform: translateY(-0.625rem); /* Equivalent to -10px */
    -webkit-transform: translateY(-0.625rem); /* Equivalent to -10px */
    -o-transform: translateY(-0.625rem); /* Equivalent to -10px */
    -ms-transform: translateY(-0.625rem); /* Equivalent to -10px */
    width: 2.188rem; /* Equivalent to 35px */
}

.space-box.selected .box-img {
    background-image: url("../../resources/images/s3e/box-arrow-bottom.png");
}

.space-box:not(.selected):hover .box-img {
    background-image: url("../../resources/images/s3e/box-arrow-rightFULL.png");
    transform: translateY(-0.625rem) rotate(90deg); /* Equivalent to -10px */
    -moz-transform: translateY(-0.625rem) rotate(90deg); /* Equivalent to -10px */
    -webkit-transform: translateY(-0.625rem) rotate(90deg); /* Equivalent to -10px */
    -o-transform: translateY(-0.625rem) rotate(90deg); /* Equivalent to -10px */
    -ms-transform: translateY(-0.625rem) rotate(90deg); /* Equivalent to -10px */
    transition: transform 0.3s linear;
}

.space-box:not(.selected) {
    cursor: pointer;
    box-shadow: 0rem 0.188rem 0.188rem rgba(0, 0, 0, 0.25);
}

.space-box:not(:first-of-type) {
    margin-left: 0.313rem; /* Equivalent to 5px */
}

/* Common styles */
.space-box-sponsor {
    width: 40%; /* 40% of the parent container width */
    height: 11.5625rem; /* Equivalent to 185px */
    background-color: #464646;
    background-repeat: no-repeat;
    background-position: 95% 92%;
    color: white;
    padding: 0.5rem;
    display: inline-block;
    border-radius: 0.25rem;
}

.space-box-sponsor .box-img {
    background-image: url("../../resources/images/s3e/box-arrow-right.png");
    background-repeat: no-repeat;
    float: left;
    height: 2.1875rem; /* Equivalent to 35px */
    transform: translate(0rem, -1rem); /* Move 1rem (1rem) upward */
    -moz-transform: translate(0rem, -1rem);
    -webkit-transform: translate(0rem, -1rem);
    -o-transform: translate(0rem, -1rem);
    -ms-transform: translate(0rem, -1rem);
    width: 2.1875rem; /* Equivalent to 35px */
}

.space-box-sponsor.selected .box-img {
    background-image: url("../../resources/images/s3e/box-arrow-bottom.png");
}

.space-box-sponsor:not(.selected):hover .box-img {
    background-image: url("../../resources/images/s3e/box-arrow-rightFULL.png");
    transform: translate(0rem, -1rem) rotate(90deg); /* Rotate 90 degrees clockwise */
    -moz-transform: translate(0rem, -1rem) rotate(90deg);
    -webkit-transform: translate(0rem, -1rem) rotate(90deg);
    -o-transform: translate(0rem, -1rem) rotate(90deg);
    -ms-transform: translate(0rem, -1rem) rotate(90deg);
    transition: transform 0.3s linear; /* Smooth transition */
}

.space-box-sponsor:not(.selected) {
    cursor: pointer;
    box-shadow: 0rem 0.188rem 0.188rem rgba(0, 0, 0, 0.25);
}

.space-box-sponsor:not(:first-of-type) {
    margin-left: 0.625rem; /* Equivalent to 10px */
}

/* Common styles */
.space-box-schools {
    width: 32%; /* 32% of the parent container width */
    height: 11.25rem; /* Equivalent to 180px */
    background-color: #464646;
    background-repeat: no-repeat;
    background-position: 95% 92%;
    color: white;
    padding: 0.5rem;
    display: inline-block;
    border-radius: 0.25rem;
}

.space-box-schools .box-img {
    background-image: url("../../resources/images/s3e/box-arrow-right.png");
    background-repeat: no-repeat;
    float: left;
    height: 2.1875rem; /* Equivalent to 35px */
    transform: translate(0rem, -1rem); /* Move 1rem (1rem) upward */
    -moz-transform: translate(0rem, -1rem);
    -webkit-transform: translate(0rem, -1rem);
    -o-transform: translate(0rem, -1rem);
    -ms-transform: translate(0rem, -1rem);
    width: 2.1875rem; /* Equivalent to 35px */
}

.space-box-schools.selected .box-img {
    background-image: url("../../resources/images/s3e/box-arrow-bottom.png");
}

.space-box-schools:not(.selected):hover .box-img {
    background-image: url("../../resources/images/s3e/box-arrow-rightFULL.png");
    transform: translate(0rem, -1rem) rotate(90deg); /* Rotate 90 degrees clockwise */
    -moz-transform: translate(0rem, -1rem) rotate(90deg);
    -webkit-transform: translate(0rem, -1rem) rotate(90deg);
    -o-transform: translate(0rem, -1rem) rotate(90deg);
    -ms-transform: translate(0rem, -1rem) rotate(90deg);
    transition: transform 0.3s linear; /* Smooth transition */
}

.space-box-schools:not(.selected) {
    cursor: pointer;
    box-shadow: 0rem 0.188rem 0.188rem rgba(0, 0, 0, 0.25);
}

.space-box-schools:not(:first-of-type) {
    margin-left: 0.625rem; /* Equivalent to 10px */
}

.students-space h3,
.platform-content h1,
.platform-content h3 {
    font-weight: bold;
    font-size: 0.75rem; /* Equivalent to 12px */
}

.school-content h3 {
    color: #00af5e;
}

.platform-content h1,
.platform-content h3 {
    color: #0095ff;
}

.platform-content h3,
.platform-content h3 {
    font-weight: bold;
    font-size: 0.75rem; /* Equivalent to 12px */
}

.admin-action-desactivation {
    font-size: 1.3rem; /* Equivalent to 20px */
    font-family: Roboto, sans-serif;
    padding-bottom: 1.875rem; /* Equivalent to 30px */
}

.title-admin-action {
    padding-bottom: 0.313rem; /* Equivalent to 5px */
}

.boxDesc,
.boxDesc-sponsor,
.boxDesc-schools {
    width: 19%; /* Adjust based on your design */
    font-size: 0.85rem; /* Equivalent to 13.6px */
    position: absolute;
    margin-top: 2.5rem; /* Equivalent to 20px */
    line-height: 1.125rem; /* Equivalent to 1.125rem */
    font-family: Roboto, sans-serif;
}

.boxDesc2 {
    width: 19%; /* Adjust based on your design */
    font-size: 0.85rem; /* Equivalent to 13.6px */
    position: absolute;
    margin-top: 5.5rem; /* Equivalent to 20px */
    line-height: 1.125rem; /* Equivalent to 1.125rem */
    font-family: Roboto, sans-serif;
}


.boxDesc-sponsor {
    margin-top: 0.313rem; /* Equivalent to 5px */
}

.boxDesc-schools {
    margin-bottom: 1.25rem; /* Equivalent to 20px */
}

.boxLabel,
.boxLabel-sponsor,
.boxLabel-schools {
    width: 18%; /* Equivalent to 260px */
    font-size: 1rem; /* Equivalent to 16px */
    position: absolute;
}

.boxLabel-sponsor {
    font-size: 1rem; /* Equivalent to 12px */
}

.boxLabel-schools {
    width: 17em; /* Equivalent to 272px */
}

.boxBottom {
    bottom: -9.4rem; /* Equivalent to -95px */
    position: relative;
    line-height: 0;
}

.boxBottom-sponsor {
    bottom: -3.8rem; /* Equivalent to -95px */
    position: relative;
    line-height: 0;
}

.boxTitle-sponsor {
  float: none;
  font-size: 0.938rem;
  margin-left: 0.625rem;
  transform: translate(-0.313rem, 0.313rem);
}

.boxNumber {
    float: right;
    font-size: 2.125rem; /* Equivalent to 34px */
    transform: translate(-0.313rem, 0); /* Equivalent to -5px */
}

.boxTitle {
    float: right;
    font-size: 0.938rem; /* Equivalent to 15px */
    margin-left: 0.625rem; /* Equivalent to 10px */
    transform: translate(-0.313rem, 0.313rem); /* Equivalent to -5px, 5px */
}

/** Popup de détails d'une offre dans les espaces employeur et pprs */
.course-detail-dialog {
    border: 0.313rem solid #1767c2 !important;
    width: 34.375rem !important; /* Equivalent to 550px */
    padding: 1.5rem 0rem 0.625rem 0rem !important; /* Equivalent to 24px 0 10px 0 */
}

.course-detail-dialog h1 {
    color: #1767c2;
    font-size: 2rem; /* Equivalent to 32px */
    height: 2.1875rem !important; /* Equivalent to 35px */
}

.course-detail-dialog div td {
    vertical-align: middle;
}

.course-detail-dialog div td:nth-child(2) {
    width: 12.5rem; /* Equivalent to 200px */
}

.course-detail-dialog.workflow-candidature div td label,
#adminSpaceForm .course-detail-dialog div td label,
.course-detail-dialog div td label {
    text-align: left;
    white-space: pre-line;
    font-size: 1.2rem; /* Equivalent to 19.2px */
}

.course-detail-dialog.workflow-candidature div td label,
#adminSpaceForm .course-detail-dialog div td label {
    display: inline;
    font-family: inherit;
}

.course-detail-dialog div tr {
    height: 4.0625rem; /* Equivalent to 65px */
    vertical-align: top;
}

.available-detail {
    font-weight: bold;
}

.course-detail-dialog.workflow-candidature td,
.course-detail-dialog.workflow-candidature tr {
    border: none; /* Changed from "medium none" */
}

.course-detail-dialog div tr {
    height: 4.6875rem; /* Equivalent to 75px */
}

.course-detail-dialog.workflow-candidature {
    font-size: 1rem; /* Equivalent to 1rem */
    text-align: center;
}

.course-detail-dialog.workflow-candidature .ui-dialog-titlebar {
   /* padding: 0;*/
    background: none;
}

.course-detail-dialog.workflow-candidature .ui-helper-clearfix::after {
    display: none;
}

.course-detail-dialog.workflow-candidature .ui-widget-header .ui-icon {
    background-image: url("../../resources/images/s3e/close.png");
    background-position: center;
    margin-right: -0.938rem; /* Equivalent to -15px */
    height: 1.25rem; /* Equivalent to 20px */
    width: 1.25rem; /* Equivalent to 20px */
    border-radius: none;
}

.course-detail-dialog.workflow-candidature .ui-dialog-titlebar .ui-state-hover {
    background: none;
    border-color: transparent;
    box-shadow: none;
}

.course-detail-dialog.workflow-candidature h1 {
    /*padding-top: 0.625rem; /* Equivalent to 10px */
}

/** Formulaire de connexion **/
.connexion-form input {
    width: 18.125rem; /* Equivalent to 290px */
}

.connexion-form .ui-messages-info,
.connexion-form .ui-messages-error {
    background-color: white;
    border-color: white;
    padding-left: 0;
}

.connexion-form .ui-messages-info-icon,
.connexion-form .ui-messages-error-icon {
    display: none;
}

.connexion-form .ui-messages ul {
    margin-left: 0;
}

.connexion-form li {
    font-family: inherit;
    list-style: none;
}

.connexion-form .ui-messages-info li {
    color: green;
}

.connexion-form .ui-messages-error li {
    color: red;
}

.connexion-form .ui-messages-info-summary,
.connexion-form .ui-messages-error-summary {
    margin-left: 0;
    font-weight: normal;
}

.home-content .ui-carousel,
.home-content .ui-carousel-viewport > ul > li,
.home-content .ui-widget-header {
    background: transparent;
    color: white;
    border-color: black;
    padding: 0;
    border: none;
}

.home-content .ui-carousel {
    float: left;
}

#home-form {
    float: right;
    margin-bottom: 1.063rem;
}

#map > div > div > div > div > div > div > div > div {
 /*   overflow: hidden !important;*/
}

.map:not(:last-of-type) {
    border-bottom: #2c62cb solid 1px;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

.map a {
    color: #2c62cb;
    font-size: 1.1em;
}

.map h3 {
    font-size: 1.3em;
    color: #2c62cb;
}

.map h4 {
    font-size: 1.1em;
}

.home-content .action-buttons {
    width: 11.75rem; /* Equivalent to 188px */
    margin: 1.125rem 0; /* Equivalent to 1.125rem */
}

#searchCourseField {
    margin-top: 0.375rem; /* Equivalent to 6px */
}

.identList {
    margin-left: 3.125rem; /* Equivalent to 50px */
}

.space-content .identList li,
.home-content .identList li {
    font-family: Roboto, sans-serif;
    font-size: 0.5625rem; /* Equivalent to 9pt */
    line-height: 0.6875rem; /* Equivalent to 11pt */
    text-align: justify;
    list-style-type: disc;
}

.puceNum {
    height: 1.375rem; /* Equivalent to 22px */
    width: 1.375rem; /* Equivalent to 22px */
    margin-right: 0.625rem; /* Equivalent to 10px */
    background-repeat: no-repeat;
    float: left;
}

.puceNum_label {
    float: left;
    line-height: 1.375rem !important; /* Equivalent to 22px */
}

.private {
    background: #f3f3f3;
    padding-top: 1.875rem; /* Equivalent to 30px */
    padding-bottom: 1.25rem; /* Equivalent to 20px */
    margin-bottom: 0.625rem;
}

.private-img {
    width: 26.875rem; /* Equivalent to 430px */
    height: 4.0625rem; /* Equivalent to 65px */
    background-image: url("../../resources/images/s3e/privateContent.png");
    background-repeat: no-repeat;
}

.new-public-data {
    /*padding-bottom: 1.25rem;
    margin-bottom: 0.625rem;*/
}


.form-oneButt .action-buttons {
    width: 100%;
}

.form-oneButt-student .actions-buttons,
.form-oneButt-parents .actions-buttons {
    width: 30%;
    margin-right: 1.25rem; /* Equivalent to 20px */
}

.student-ab-color {
    margin-right: 1.25rem; /* Equivalent to 20px */
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
    text-shadow: none;
    color: #000000;
    background: rgba(228, 103, 38, 0.2);
}

#courses-counter {
    margin-top: 2.5rem; /* Equivalent to 40px */
    text-align: right;
    font-size: 1.125rem; /* Equivalent to 1.8em */
}

#counter-digit {
    background-image: url("../../resources/images/s3e/fond-chiffre.png");
    background-size: auto 2.3125rem; /* Equivalent to auto 37px */
    height: 2.3125rem; /* Equivalent to 37px */
    width: 6.875rem; /* Equivalent to 110px */
    padding-right: -0.938rem; /* Not sure about this */
}

#counter-digit p {
    height: 100%;
    line-height: 2.3125rem; /* Equivalent to 37px */
    text-align: right;
    width: 6.4375rem; /* Equivalent to 103px */
    word-spacing: 0.75rem;
}

#counter-text {
    text-align: center;
    /*width: 4.5rem; /* Equivalent to 72px */
}

#counter-text > span {
    display: block;
}

#counter-text > .top-text {
    letter-spacing: 0.063rem; /* Equivalent to 1px */
}

#counter-text > .bottom-text {
    font-size: 0.6rem; /* Equivalent to 0.6em */
}

.carousel-counter {
    width: 13.125rem; /* Equivalent to 210px */
    height: 2.5rem; /* Equivalent to 40px */
    top: 4.25rem; /* Equivalent to 68px */
    left: 27.5rem; /* Equivalent to 440px */
    position: absolute;
    color: #BCBCBC;
    font-size: 1.125rem; /* Equivalent to 1.3em */
    border: 0.063rem solid #9F9F9E;
    padding: 0.313rem;
}

.carousel-counter.opened {
    top: 1.4375rem; /* Equivalent to 23px */
}

.carousel-counter.closed {
    top: 4.875rem; /* Equivalent to 78px */
}

.carousel-counter.visitors {
    top: 8.3125rem; /* Equivalent to 133px */
}

.plateform-counter {
    color: #000;
    font-size: 1.3em; /* Equivalent to 20.8px */
    padding: 0.313rem; /* Equivalent to 5px */
    border: 0.063rem solid #000; /* Equivalent to 1px */
    display: inline-block;
    margin-right: 3.125rem; /* Equivalent to 50px */
    border-radius: 0.25rem; /* Equivalent to 4px */
}

.plateform-counter #counter-digit {
    background-image: url("../../resources/images/s3e/fond-chiffre-carousel.png");
    background-size: auto auto;
    height: 1.8125rem; /* Equivalent to 29px */
    margin-top: 0.188rem; /* Equivalent to 3px */
    margin-right: 0.313rem; /* Equivalent to 5px */
}

.plateform-counter #counter-digit p {
    height: 100%;
    line-height: 1.8125rem; /* Equivalent to 29px */
    text-align: right;
    width: 6.25rem; /* Equivalent to 100px */
    word-spacing: 1rem; /* Equivalent to 1rem */
    font-size: 1em; /* Equivalent to 1rem */
}

.plateform-counter #counter-text {
    padding-left: 0.313rem; /* Equivalent to 5px */
    padding-top: 0.188rem; /* Equivalent to 3px */
    padding-right: 0.313rem; /* Equivalent to 5px */
    font-size: 1.1em; /* Equivalent to 17.6px */
}

.plateform-counter.visitors #counter-digit {
    background-image: url("../../resources/images/s3e/fond-visit-carousel.png");
    background-size: auto auto;
    height: 1.4375rem; /* Equivalent to 23px */
    margin-top: 0.375rem; /* Equivalent to 6px */
    margin-right: 0.313rem; /* Equivalent to 5px */
}

.plateform-counter.visitors #counter-digit p {
    height: 100%;
    line-height: 1.4375rem; /* Equivalent to 23px */
    text-align: right;
    width: 6.25rem; /* Equivalent to 100px */
    word-spacing: 0.3rem; /* Equivalent to 12px */
    font-size: 0.8em; /* Equivalent to 12.8px */
}

.plateform-counter #counter-text > .bottom-text {
    font-size: 0.8em; /* Equivalent to 12.8px */
}

#selectOneExistingCandidatures,
#moderationLevel {
    margin-left: 1.25rem; /* Equivalent to 20px */
}

#selectOneExistingCandidatures label {
    margin-left: 0.625rem; /* Equivalent to 10px */
    font-size: 1.2em; /* Equivalent to 19.2px */
}

#moderationLevel label {
    margin-left: 0.625rem; /* Equivalent to 10px */
    font-size: 1em; /* Equivalent to 1rem */
    margin-top: 0;
}

#selectOneExistingCandidatures .ui-radiobutton .ui-radiobutton-box,
#moderationLevel .ui-radiobutton .ui-radiobutton-box {
    border-radius: 0.5rem; /* Equivalent to 8px */
    height: 0.75rem; /* Equivalent to 12px */
    width: 0.75rem; /* Equivalent to 12px */
}

.request-form .ui-chkbox-box {
    margin-right: 0.313rem; /* Equivalent to 5px */
    background: none repeat scroll 0 0 #FFFFFF;
    box-shadow: 0 0.125rem 0.125rem 0 rgba(0, 0, 0, 0.25) inset;
}

.request-form.admin-content .admin-action-options,
.request-form.admin-content .admin-action-statitics,
.request-form.admin-content .admin-action-newschoolyear,
.request-form.admin-content .admin-parameter-options {
    font-size: 1.2em; /* Equivalent to 19.2px */
    margin-left: 1.25rem; /* Equivalent to 20px */
    margin-bottom: 1.875rem; /* Equivalent to 30px */
}

.overlaypanel-content {
    width: 700px;
    padding-left: 10px;
    font-family: Roboto, sans-serif;
}

h3.overlay-title {
    font-family: Roboto, sans-serif;
}

.overlaypanel-content ul li:before {
    content: "• ";
    margin-left: -0.688rem; /* Equivalent to -11px */
}

.overlaypanel-content ul li {
    padding-bottom: 0.625rem; /* Equivalent to 10px */
}

.ui-messages-warn-summary,
.ui-messages-error-summary,
.ui-messages-info-summary {
    font-size: 1.1em; /* Equivalent to 17.6px */
}

#candidaturesToValidateDataTable_data.ui-datatable-data td.action-candidature .action-link-accept,
#candidaturesToValidateDataTable_data.ui-datatable-data td.action-candidature .action-link-refuse {
    background-position: center bottom;
    background-repeat: no-repeat;
    display: inline-block;
    width: 1.25rem; /* Equivalent to 20px */
    height: 1.25rem; /* Equivalent to 20px */
}

#candidaturesToValidateDataTable_data.ui-datatable-data td.action-candidature .action-link-accept {
    background-image: url("../../resources/images/s3e/valide.png");
}

#candidaturesToValidateDataTable_data.ui-datatable-data td.action-candidature .action-link-refuse {
    background-image: url("../../resources/images/s3e/refus.png");
    padding-left: 0.438rem; /* Equivalent to 7px */
}

#profFundingFields .funding-title,
#studentFundingFields .funding-title {
    display: none;
}

#fundingValueError {
    width: 100%;
    font-size: 0.8em; /* Equivalent to 12.8px */
}

.fieldsetSum {
    border: 0.063rem solid #E02363;
    margin-left: 2rem; /* Equivalent to 32px */
}

.legendfielsetSum {
    color: #e02363;
    font-size: 1rem; /* Equivalent to 1rem */
    margin-left: 0.25rem;
}

.contentSumFieldset {
    margin-left: 44%;
    color: #e02363;
    font-size: 1rem; /* Equivalent to 1rem */
}

.expired {
    color: #707070;
    font-size: 13pt; /* Equivalent to 16.9px */
}

.home-padding {
    /*padding-top: 230px;*/
}

#requestForm\:gender label,
#requestForm\:contactGender label,
#contactGender label,
#gender label,
#createOrSelectCompany label {
    display: initial;
    margin-top: 20px;
}

.addseparator:after {
    display: block;
    position: absolute;
    content: " ";
    width: 0;
    height: 70%;
    border: 0.063rem solid white;
    margin: 0.313rem; /* Equivalent to 5px */
}

.homebutton-style {
    width: 14.063rem; /* Equivalent to 225px */
    height: 9.375rem; /* Equivalent to 150px */
    position: relative;
    left: 0.625rem; /* Equivalent to 10px */
    top: -0.188rem; /* Equivalent to -3px */
}

.homebutton-style > span {
    position: relative;
    top: -20px;
    text-transform: none !important;
}

.home-content .action-buttons > button {
    border-radius: 0.25rem; /* Equivalent to 4px */
}

.text-block {
    position: absolute;
    bottom: 84%; /* Equivalent to 84px */
    left: 73.2%; /* Equivalent to 73.2px */
    width: 6.25rem; /* Equivalent to 100px */
    height: 3.125rem; /* Equivalent to 50px */
    background-color: #0047a3;
    color: white;
    padding-left: 1.25rem; /* Equivalent to 20px */
    padding-right: 0;
    border-radius: 0.25rem;
}

.container {
    position:relative;
    height: 23.125rem !important; /* Equivalent to 370px */
    width:100% !important;
}

.container-img{
    position: relative;
    height: 23.125rem; /* Equivalent to 370px */
    width: 100% !important;
    border-radius: 0.25rem;
    object-fit: cover;
    object-position: left;
}

.counter {
    font-family: Roboto, sans-serif;
    font-size: 1.813rem !important; /* Equivalent to 29px */
    text-align: center !important;
    font-weight: 900;
    padding-top: 0.625rem; /* Equivalent to 10px */
}

.countertext {
    white-space: pre;
    font-weight: bold;
    text-align: center;
    position: relative;
    right: 1rem; /* Equivalent to 10px */
    top: 0.625rem; /* Equivalent to 10px */
}

.login-fg-color {
    color:#1767c2;
}

.home-content-alignment {
    width: 100%;
    font-size: 1.5rem; /* Equivalent to 24px */
}

/* Orejime */
#orejime {
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 1000;
    transition: all 0.25s ease-in;
    display: flex;
    justify-content: center;
    align-items: center;
}

#orejime .orejime-AppContainer .orejime-Notice {
    background-color: #FFF;
    box-shadow: 0rem 0.813rem 20px 0rem rgba(0, 0, 0, 0.35);
    width: 100%;
    max-width: 64em; /* Equivalent to 64px */
    padding: 1.5rem 3rem; /* Equivalent to 24px 48px */
    position: relative;
    z-index: 10;
    /*max-height: 90vh;*/
    overflow-x: auto;
    border-radius: 0;
    bottom: 3rem;
    right: 3rem;
}

#orejime .orejime-AppContainer .orejime-Notice .orejime-Notice-logoContainer {
  text-align: center;
}

#orejime .orejime-AppContainer .orejime-Notice .orejime-Notice-description {
  color: #000;
  font-family: Muli, Arial, Helvetica, sans-serif !important;
  font-size: 0.9rem; /* Equivalent to 14.4px */
  line-height: 1.6;
  letter-spacing: 0.32px;
}

#orejime .orejime-AppContainer .orejime-Notice .orejime-Notice-purposes {
  color: #000;
}

#orejime .orejime-AppContainer .orejime-Notice .orejime-Notice-actions {
  padding: 0;
  text-align: center;
}

#orejime .orejime-AppContainer .orejime-Notice .orejime-Notice-actions .orejime-Button {
  background-color: #FFF;
  border-color: #000;
  color: #000;
}

#orejime .orejime-AppContainer .orejime-Notice .orejime-Notice-actions .orejime-Button.orejime-Button--save {
  background-color: #1767c2;
  border-color: #1767c2;
}

#orejime .orejime-AppContainer .orejime-Notice .orejime-Notice-actions .orejime-Notice-actionItem--decline {
  display: contents !important;
  visibility: visible !important;
}

#orejime .orejime-AppContainer .orejime-Notice .orejime-Notice-body {
  padding-top: 0;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay {
  background-color: rgba(0, 0, 0, 0.66);
  padding: 3rem; /* Equivalent to 48px */
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-ModalWrapper {
  background-color: #FFF;
  width: 100%;
  max-width: 64em; /* Equivalent to 64rem */
  padding: 1.5rem 3rem; /* Equivalent to 24px 48px */
  position: relative;
  z-index: 10;
  max-height: 90vh;
  overflow-x: auto;
  border-radius: 0;
  box-shadow: none;
  bottom: 0;
  right: 0;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal {
  font-family: Muli, Arial, Helvetica, sans-serif;
  background: #FFF;
  color: #000;
  border-radius: 0;
  box-shadow: none;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-title {
  font-size: 1.75em; /* Equivalent to 28px */
  font-family: "Blogger Sans", Arial, Helvetica, sans-serif;
  font-weight: 700;
  padding: 0 1.5rem; /* Equivalent to 24px */
  line-height: 1.2;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 55%, #1767c2 55%);
  display: inline;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-description {
  margin-top: 2rem; /* Equivalent to 32px */
  font-size: 0.9723rem !important; /* Equivalent to 15.5568px */
  line-height: 1.6;
  letter-spacing: 0.32px;
}

/* Common styles */
#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-body {
  padding: 2rem 2rem 3rem 2rem; /* Equivalent to 32px 32px 48px 32px */
  border: 0.063rem solid #1767c2; /* Equivalent to 1px */
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-body .orejime-AppItem-input:checked + .orejime-AppItem-label .orejime-AppItem-slider {
  background-color: #000;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-body .orejime-AppItem-input[disabled] ~ label {
  filter: none;
  opacity: 1;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-body .orejime-AppItem-optOut,
#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-body .orejime-AppItem-required,
#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-body .orejime-AppItem-purposes,
#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-body .orejime-AppItem-switch--disabled .orejime-AppItem-switchLabel {
  color: #5C5C5C;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-body .orejime-Button[disabled] {
  background-color: #000;
  border-color: #000;
  opacity: 1;
  filter: none;
  color: #FFF;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-body .orejime-Button--info {
  background: #FFF;
  color: #000;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-saveButton {
  background-color: #1767c2;
  border-color: #1767c2;
  color: #000;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-header,
#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-footer {
  border: 0;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-AppToggles .orejime-AppToggles-disableAll {
  background-color: #ffffff;
  color: #000;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-poweredByLink {
  display: none;
  visibility: hidden;
}

#orejime .orejime-ModalPortal .orejime-ModalOverlay .orejime-Modal .orejime-Modal-closeButton {
  color: #000;
}

#orejime button {
  color: #FFF;
  font-family: Muli, Arial, Helvetica, sans-serif !important;
  font-size: 0.9rem; /* Equivalent to 14.4px */
  min-height: 2.4rem !important; /* Equivalent to 38.4px */
  cursor: pointer;
  font-weight: bold !important;
}

#orejime button.orejime-Modal-closeButton {
  border: none;
  box-shadow: none;
}

#orejime button * {
  cursor: pointer;
}

.ui-datatable-tablewrapper {
    overflow: inherit !important;
}

/*  admin list scrollpanel  start   */


.ui-scrollpanel-content {
    padding-left: 0px !important;
    right: 13px;
}

.ui-scrollpanel {
    width: 100% !important;
}

.ui-scrollpanel-container,
.ui-scrollpanel-content {
    width: auto !important;
}

body .ui-scrollpanel {
    padding: 0 !important;
}

.admin_list_scroll_panel.ui-button{
    color:#a25a5a;
}


body .ui-datatable thead th .ui-column-title {
    font-weight: 700;
    vertical-align: sub;
}

body .ui-datatable thead th .ui-sortable-column-badge{
    
    min-width: 0rem !important;
}

.admin_list_header{
    height:45px;
}


.responsive-scrollPanel {
    width: 100%;
    height:auto;
    overflow-x: hidden;
}

.responsive-dataTable {
    width: 100%;
    table-layout: auto;
}
/*  admin list scrollpanel end   */











/* added styles, by paul */

body .ui-panel{

    border-radius: .52rem;
    overflow: clip;
}


#content-wrapperS3e {
    width: 100% !important;
    max-width: 100vw;
}


#content-wrapperS3e {
    /*width: 92rem;*/
    margin: 0 auto;
}




body #mainpart-panel_content{
    padding: .82rem .5rem;
    padding-bottom: 0px !important;
}



#mainpart{
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 100vw;
}

.bienvenue-header{
    text-align: center;
}




.bienvenue-header img {
    border: 1px solid #c7bdbd;
    width: auto;
    height: 5.2rem;
    border-radius: 1rem;
    margin-bottom: 1rem;
}


.bienvenue-header span{
    display: inline-block;
    width: 100%;
    font-size: 1.3rem !important;
    font-weight: 100;
    text-align: left;
}


#bienvenue-2.bienvenue-header img{
    border-radius: unset !important;
    border: unset !important;

}




button#right-panel-button{
    width: 100%;
    background-color: #00accc;
    margin: 2.85rem auto !important;
    font-weight: 500 !important;
}



#second-part-panel-offres,#second-carousel-zoom,#seconde-colonne-carousel-zoom{
    max-width: 100%;
}







.modern-button,#panel-buttons button,#right-panel-button{
   /* margin: auto;*/
    height: auto;
    padding: .45rem 0px;
    font-size: .9rem !important;
    border-color: transparent;
    position: initial !important;
    border-radius: .45rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}



#right-panel-button span{
    display: inline-block;
    position: initial !important;
    padding: 0px !important;
}

#right-panel-button span.ui-icon{
    margin-top: 0px !important;
    padding: 4px !important;
}




#first-galleria{
    max-height: 125%;
    /*width: 52vmin !important;*/
    /* max-width: 423px; */
    /*overflow: cilp;*/
    /* flex: 1; */
    /*margin: auto;*/
    /*aspect-ratio: 1;*/
    /*min-width: 280px;*/
}

body * #first-galleria{
    width: 100% !important;
    border: solid 1px gray;
    border-radius:4px;
}


#first-galleria button{
    width: 1.75rem !important;
    height: 2rem !important;
}

#first-galleria button span{
    font-size: 1.28rem !important;
}


#first-galleria .ui-galleria-caption-item{
    padding: .5rem 1rem;
}

#first-galleria .ui-galleria-caption-item h4{
    margin-bottom: 0px !important;
    padding-bottom: .1rem !important;
    font-size: 1.3rem !important;
    font-weight: 500;
}


#first-galleria .ui-galleria-caption-item p{
    font-size: .935rem !important;
}







#home-form-2{
    margin-top: auto;
}

div#panel-buttons{
    margin-top: auto;
    display: flex;
    width: 100%;
    position: initial !important;
    margin-top: 2rem;
}

div#panel-buttons button{
    width: 49%;
}

div#panel-buttons button span{
    position: initial !important;
    padding: unset !important;
    font-size:1.2rem;
    font-weight:bolder;
}

#panel-buttons .ui-icon{
    display: contents !important;
}
#panel-buttons .ui-icon::before{
    padding: 8px !important;
    font-size:1.5rem;
    margin-right:8px;
}


body .styleorange{
    background-color: #FF9F42 !important;
}

.styleblue{
    background-color: #2659B5 !important;
}

.panelcontent{
    border: 1px solid #dee2e6 !important;
}

.panel-link{
/*    color: #555;*/
    color: #6b7280;;
    text-decoration: underline !important;
}




#bottom-galleria{
    display: none;
}





#inside-bottom-panel{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}






#carousel-zoom .product-item .product-item-content {
        border: 1px solid var(--surface-d);
        border-radius: 3px;
        margin: .3rem;
        text-align: center;
        padding: 2rem 0;
}

#carousel-zoom .product-item .product-image {
        width: 50%;
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23)
}





#footer{
    margin-bottom: 0px !important;
    box-sizing: initial !important;

}


#footer-bottomleft,#footer-bottomright{
    height: 7rem;
    line-height: 7rem;
}

#footer-bottomleft {
    text-align: left !important;
}

#footer-bottomright{
    text-align: right !important;
}

#footer-bottomleft img,#footer-bottomright img{
    max-height: 100%;
    width: auto;
}


div.ui-g#off_mobile > div{
    flex: 1;
}

body div.ui-g#off_mobile > #footerText{
    flex: 2;
}




#footerText{
    margin-top: .3rem;
    font-size: .9rem !important;
    font-family: "Roboto";
    display: flex;flex-direction: column;
    color: #c8c8c9;
    text-transform: uppercase;
}

#footer-menu{
    box-sizing: content-box !important;
    font-size: .9rem !important;
    font-family: "Roboto";
    font-weight: 100;
    margin-top: .3rem;
    margin-top: 0.5rem;
    margin-bottom: .25rem;
    color: white;
}

#footer-menu a{
    color: white;
}







body .ui-panel .ui-panel-content {
    border: 1px solid #dee2e6 !important;
    /*border-bottom: 0px !important;*/
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}



.ui-carousel-item{
    /*  padding odesnt make elements larger, unlike margin   */
    padding: .5%;
    visibility: visible !important;
/*    width: 33%;*/
    margin:0px;
}
.carousel-item *{
    visibility: visible !important;

}

.image-box{
    width: 100%;height: auto;
}


/*CAROUSEL ITEM PART*/

#carousel-form {
    border-radius: 4px;
    padding-top: 1rem;
    box-shadow: 0 0 5px #9d9999;
}


.carousel-form .ui-carousel-item img {
    width: 96%;
    text-align: center;
    margin: auto;
    display: block;
    margin-top: .75rem;
}

.carousel-form .ui-carousel-item .offer-title{
    background-image: url(../../resources/images/s3e/prevention-nouveau.png);
    background-size: contain;
    background-repeat: no-repeat;
    /* width: 20px; */
    display: inline-block;
    width: 42%;
    height: 100%;
    pointer-events: none;
    user-select: none;
    position: absolute;
    left: 0px;
    /* overflow: hidden; */
    color: transparent;
    top: .35rem;

}



.offer-title2{
    background-image: url(../../resources/images/s3e/prevention-nouveau.png);
    background-size: contain;
    background-repeat: no-repeat;
    /* width: 20px; */
    display: inline-block;
    width: 42%;
    height: 100%;
    pointer-events: none;
    user-select: none;
    position: absolute;
    left: 0px;
    /* overflow: hidden; */
    color: transparent;
    top: .35rem;

}

.carousel-form .ui-panel .ui-panel-content {
    border-bottom: 0px !important;
    border-bottom-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    position: relative;
    text-align: center;
}


.carousel-form .ui-panel .ui-panel-footer{
    text-align: center;
}

/*TITLE*/

.carousel-form .ui-carousel-item h3.carousel-panel {
    text-align: center;
    font-weight: 500;
    color: #555;
    font-size: 1.3rem;
}


/*DESCRIPTION*/

.carousel-form .ui-carousel-item h5.carousel-panel {
    text-align: center;
    font-weight: 300;
    color: #5f5f5f;
    font-size: 1rem !important;
    margin-top: 1.5rem;
}

html body .carousel-button{
    font-weight: 600 !important;
    border-radius: .83rem/50%;
    background-color: #1767C2;
    color: white;
    display: inline-block;
    line-height: unset !important;
    padding: .38rem .52rem !important;
    text-align: center;
    margin: .5rem auto;
    font-size: .4rem !important;
}

html body .carousel-button.orange{
    background-color: #F49B13 !important;
}


.carousel-form .ui-carousel-item{
    cursor: pointer;
}



/*MARGIN ADDED TO THE CAROUSEL'S ITEMS*/

body #carousel-form .carousel-form .ui-carousel-item {
    flex: 1 0 23% !important;
    margin: .97%;
}








/** SECOND CAROUSEL FOR THE VERY FAMOUS WELL KNOWN DSP **/

    body #carousel-form-2{
        width: 57%;
        margin-left: auto;
/*        margin: auto;*/
    }


    body #carousel-form-2 .ui-carousel-item {
    flex: 1 0 48% !important;
    margin: .97%;
}



    body #carousel-form-2 .ui-carousel{
        max-width: 100%;
    } 






/** second-line for dsp **/





    #second-line-dsp{

        display: flex;
        flex-direction: row;
        max-width: 100%;
        margin: 4.35rem auto;
    }

    #second-line-dsp #panel-dsp * {
        border: unset !important;

    }

    #panel-dsp{
        margin: auto;
        max-width: 39rem;

    }

    #panel-dsp .textual-list{
        padding-left: inherit;
    }

    .textual-list li{
        list-style-type: disc;
        margin: .6rem 0px;
    }



    .intext-img{
        height: 2.35rem;
        width: auto;
    }

    #panel-dsp .ui-panel-title{
        display: flex;
        flex-direction: row;
        align-items: center;
    }

    #panel-dsp .ui-panel-title span{
        font-size: 1.1rem;
        color: #0070c0;
        margin-left: .33rem;
    }


    #panel-dsp .ui-panel-footer{
        display: flex;
    }

    #panel-dsp .ui-panel-footer button{
        min-width: 73%;
        margin: auto;
    }


















@media all and (min-width:48.01rem) and (max-width:1289px) {

    #footer-bottomleft, #footer-bottomright {
        height: 7rem;
        line-height: 7rem;
    }
    
    #footer .ui-g-12.ui-md-6.ui-lg-4{
        width: initial !important;
        margin: auto;
    }



    #footerText{
        width: 46% !important;
        margin:auto;
    }

}






/*MOBILE FOOTER WHEN DISPLAYED*/
@media screen and (max-width: 48rem) {
    #on_mobile {
        display: flex !important;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }

    #on_mobile > div{
        width: initial !important;

    }

    #on_mobile > div:last-child{
        margin-left: unset !important;
    }



    #on_mobile #footerText{
        order: -1;
        width: 100% !important;
    }

    #on_mobile div.ui-g-12.ui-md-6.ui-lg-4{
        width: 8.5rem !important;height: auto;
        overflow: clip;
        overflow: hidden;
    }

    #on_mobile div.ui-g-12.ui-md-6.ui-lg-4 img{
        max-width: 100% !important;height: auto;
    }


}








/*** LAYOUT HEADER ***/


body .alignthatleft{
    display: block;
    position: absolute;
    top: 1rem;
    left: 1rem;
    height: 3.25rem;
    width: auto;
}








#menuS3e{
    /*padding: .4rem 0px !important;*/
}

body #menuS3e ul{
    justify-content: space-around;
/*    justify-content: space-around;*/
    width: 100%;
}




body #menuS3e ul li{
    border-radius: .35rem !important;
    width: initial !important;
    min-width: initial !important;
    max-width: initial !important;
    height: initial !important;
    margin: 0px 1vw !important;
}

#menuS3e ul li,#menuS3e ul span{
    background-color: transparent;
    height: initial;
    margin: unset !important;
/*    height: 2.125rem;*/
/*    border-radius: 0.5rem;*/
}

#menuS3e ul button,.same-as-menu-button a{
    background: transparent;
    border: unset;
    color: white;
    text-align: center;
    /* height: 38px; */
    font-family: Roboto, sans-serif;
    font-weight: bolder;
    font-size: 1rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    align-items: baseline;
    outline: unset !important;
/*    background: #f3f4f6;*/
    color: white;
    padding: .5rem 1.6rem;
    line-height: initial !important;
    white-space: nowrap;



}

#menuS3e ul span,.same-as-menu-button{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
}

#menuS3e .ui-state-focus{
    outline: unset !important;
    border: unset !important;
}

#menuS3e .ui-button.ui-state-focus {
    outline: 0 none !important;
    outline-offset: 0;
    box-shadow: unset !important;
}


#menuS3e ul button .ui-button-text{
    width: 100%;
    text-align: center;
}




#menuS3e button:before {
    content: "\276f";
    font-size: 1rem; /* Equivalent to 16px */
    padding-right:0.7625rem; /* Equivalent to 5px */
    margin: unset;
    position: relative;
}

/*#menuS3e ul button:before {
    color: #0047a3;
}

#menuS3e ul li.students-item a:before {
    color: #2c62cb;
}

#menuS3e ul li.sponsors-item a:before {
    color: #0047a3;
}

#menuS3e ul li.parents-item a:before {
    color: #da1984;
}

#menuS3e ul li.school-item a:before {
    color: #00af5e;
}

#menuS3e ul li:hover a:after,
#menuS3e ul li.selected a:after {
    color: #fb8c00;
}


#menuS3e_options ul li:hover a:after,
#menuS3e_options ul li.selected a:after {
    color: #fb8c00;
}

*/


div.ui-menu.ui-menu-dynamic{ 
/*    background-color: red !important;   */

}


#menuS3e ul li.home-item.selected{
    background-color: white;
    color: #4B5563;
}

.selected2{
    background-color: white !important;
    color: #4B5563 !important;
}

#menuS3e ul li:hover{
    background: white !important;
}

body #menuS3e ul li:hover *{
    color: #4B5563 !important;
}

body #menuS3e ul #second-arrow button:before{
    color: #5AAE25 !important;
}

body #menuS3e ul #third-arrow button:before{
    color: #F69300 !important;
}



body #menuS3e ul #fourth-arrow button:before{
    color: #DA2F38 !important;
}

body #menuS3e ul #fifth-arrow button:before{
    color: #A90EB6 !important;
}




/** New updates, minimal changes**/


body #first-galleria .container-img{
    position: relative;
    height: 100% !important;
    /*width: 100% !important;*/
    border-radius: 0.25rem;
    object-fit: contain;
    object-position: center center;
}


#mainpart button,#mainpart button span{
    white-space: nowrap;
}



#mainpart-panel-and-buttons{
    flex-direction: row;
    width: 100%;
    margin: auto;
    display: flex;
    flex: 1;
/*    flex-wrap: wrap;*/
}

#mainpart-panel-and-buttons p{
    font-size: 80% !important;
    line-height: 98% !important;
    padding-bottom: 2px;
}


div#first-galeria-container{
/*    flex: 2;*/
    align-self: flex-start !important;
}

.leftpart{
    flex: 1;
    margin-right: 2.7rem;

}


#first-galleria{
    margin: unset !important;
}










/** FILTERS THE IN PUBLIC LIST **/



#courseListForm div.filter-dialog{

}



@media screen and (min-width: 48rem) and (max-width: 64rem) {
    body .filter-dialog .ui-dialog-content {
        width: 90% !important;
        max-width: none !important;
/*        margin: auto !important;*/
    }
}


#courseListForm .ui-tabs-panels .ui-inputgroup{
    white-space: nowrap;

}


.ui-inputgroup>.ui-inputtext:not(:first-child), .ui-inputgroup>.ui-inputtextarea:not(:first-child), .ui-inputgroup>.ui-password:not(:first-child), .ui-inputgroup>.ui-inputnumber:not(:first-child)>.ui-inputtext, .ui-inputgroup>.ui-inputmask:not(:first-child), .ui-inputgroup>.ui-calendar:not(:first-child)>.ui-inputfield, .ui-inputgroup>.ui-chips:not(:first-child)>.ui-chips-container, .ui-inputgroup>.ui-selectonemenu:not(:first-child), .ui-inputgroup>.ui-selectonebutton:not(:first-child)>.ui-button, .ui-inputgroup>.ui-autocomplete:not(:first-child)>.ui-autocomplete-input, .ui-inputgroup>.ui-spinner:not(:first-child), .ui-inputgroup>.ui-spinner:not(:first-child)>.ui-spinner-input {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-left: 0 none;
    width: initial;
    flex: 1;
}

#courseListForm .ui-inputgroup-addon{
    flex: 1;
}

#courseListForm input{
    flex: 0;
}

#courseListForm .ui-tabs-panels .ui-inputgroup {
    white-space: nowrap;
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: nowrap;
}

@media screen and (min-width: 48rem) {
    .md\:col-4 {
        flex: 0 0 auto;
        padding: 0.5rem;
        width: initial !important;
        min-width: 39%;
        max-width: 100%;

        /* It was the thing that was hiding some part of the button */
    }
}

#courseListForm input {
    flex: 1;
}

#courseListForm .ui-dialog-content.ui-widget-content{
    height: initial !important;
    padding: 1rem 0;
    width: 96% !important;
    margin: auto !important;
}

#courseListForm table.ui-panelgrid.ui-widget.list-filters tr.ui-widget-content{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}



#courseListForm div.ui-dialog.filter-dialog{
    min-width: 5rem;
    max-width: 94vw;
    height: auto;
    overflow-y: auto;
    resize: both;
    max-height: 100%;
}

#courseListForm div::-webkit-scrollbar {
    -webkit-appearance: none;
}

#courseListForm div::-webkit-scrollbar:vertical {
    width: 12px;
}

#courseListForm div::-webkit-scrollbar:horizontal {
    height: 12px;
}

#courseListForm div::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .5);
    border-radius: 1rem;
    border: 2px solid #ffffff;
}

#courseListForm div::-webkit-scrollbar-track {
    border-radius: 1rem;
    background-color: #ffffff;
}



#menuFilter .search-buttons {
    display: flex !important;
    flex-direction: row;
/*    max-width: 100vw !important;*/
    width: 100% !important;
    float: left !important;
    justify-content: center;
    align-items: center;
}



#menuFilter .search-buttons button{
    display: flex !important;
    flex-direction: row;
    max-width: 48vw;

    min-width: initial !important;
    text-align: center;
}

@media screen and (max-width: 48rem){

#menuFilter .search-buttons button{
    flex: 1 !important;
    display: flex;
    flex-direction: row;
    justify-content: center;
}


#courseListForm input {
    flex: 2;
    width: 9rem !important;
}


}


@media screen and (min-width: 48rem) {
    #menuFilter .search-buttons.search-color button{
        max-width: 46%;
        margin:2%;
    }


}


#courseListForm div#map{
    max-width: 100% !important;
    width: 100% !important;

}



@media screen and (min-width: 62.5rem) {
    #courseListForm table.ui-panelgrid.ui-widget.list-filters tr.ui-widget-content{
        flex-direction: row;
    }

}








/*
@media screen and (max-width: 64rem){
    
    div#mainpart-panel-and-buttons {
        flex-direction: column !important;
    }


}*/




/* NEW MOBILE HEADER  */


body #topS3e #menuS3e button#dynaButton,.userName-Mobile{
    background-color: #2659B5 !important;
    border: 3px solid #3B82F6 !important;
    border-radius: 5px;
    display: flex;
    min-width: 3.3rem;
    height: 2.6rem;
    justify-content: center;
    align-items: center;
    margin: 1px;
}

body #topS3e #menuS3e  #dynaButton .ui-button-text{
    display: none !important;
}

body #topS3e #menuS3e .ui-icon{
    position: static !important;
    margin-top: 0px !important;
    width: 100%;
    text-align: center;
    color: white;
}


.userName-Mobile .ui-button-text.ui-c{
    padding: 0;
}

.userName-Mobile button{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 97%;
}

.userName-Mobile button::before{
    display: none !important;
}

.userName-Mobile button .ui-button-text:empty{
/*    display: none !important;*/
}

.userName-Mobile button .ui-button-text{
    color: white !important;
    padding: 0 !important;
}


.userName-Mobile *{
    width: 100%;
}

.userName-Mobile{
    margin-right: .3rem;
    z-index: 2 !important;
}


h2.bienvenue-ode,.bienvenue-header,#bienvenue-ode{
    padding-top: 0px;
    width: 100%;
}


#bienvenue-ode-img-mobile,.other-image{
    height: 2.5rem !important;
    display: block;
    margin: auto;
    cursor: pointer;
    pointer-events: all;
/*    pointer-events: none !important;*/
}

body img.other-image{
    margin-left: 3px !important;
    height: 2.222rem !important;
}



.Menu-Mobile-box span[rendered="false"]{
    display: none;
}

.Menu-Mobile-box span[rendered="true"] *:before{
    margin-right: 0px !important;
}


#alignthatlogo{
    position: absolute;
    left: 0px;
/*    top: 3px;*/
    width: 100%;
    max-height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
/*    z-index: -1;*/
    pointer-events: none;
}


#alignthatlogo img{
    max-height: 100% !important;
    width: auto;
}





.userName-Mobile{
/*    background-color: transparent !important;*/
/*    border-color: transparent !important;*/
    margin-top: 1px;
}


.userName-Mobile:hover *{
    color: white !important;
}

/*.userName-Mobile:hover{
    transform: scale(1.05);
}
*/


/*LOGIN PAGE CHANGES*/



#loginFormS3e div .ui-password{
    flex-direction: row-reverse;
}


#loginFormS3e .form-side-width > div{

    display: flex;
    flex-direction: column;

}


#loginFormS3e .form-side-width > div input{
    margin: 1rem 0px;
    width: 100% !important;
/*    max-width: 400px;*/
    padding: .3rem;

}

#loginFormS3e .form-side-width .ui-password-icon {
    margin-right: unset !important;
}


#loginFormS3e input{
    margin:auto;
    min-width: 90%;
}





/* STATS PART */


    .stat-title{
        color: #2659b5;
        margin: .2rem;
        font-size: 1.3rem;
        margin-bottom: 1.35rem;
    }


    .stats-line{
        display: flex;
        flex-direction: row;
        width: 89%;
        margin: auto;
        flex-wrap: wrap;
    }

   .stats-line .stats-box{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        margin: auto;
    }

    .stats-line .stats-box div.ui-knob{
        height: 115px !important;
    }

    /*.stats-line .fake-chart{
        height: 10rem;
        width: 10rem;
        border-radius: 50%;
    }

    */


    .stats-box h2{
        margin: 0rem auto 0.8rem auto;
        padding: 0px !important;
        font-size: 1.05rem;
    }



    .stats-line .stats-box div.ui-knob input{
        background-color: transparent !important;
    }
    


    .stats-line .export-data-button{
        background-color: #58873B ;
        padding: .4rem 2.5rem !important;
        display: flex;
        justify-content: center;
        align-items: center;
        border: none;
    }

    .stats-line button *{
        position: static !important;
        margin: 0px !important;
        padding: 3px !important;
   }


    form#data-tabs{
        border: 2px solid #e5e7eb;
/*        border-top: unset !important;*/
    }





/** partnerForm **/




/*
#partnerForm .ui-panel-content{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

#partnerForm span.card{
    width: unset !important;
    margin: 0px;
    max-width:45%;
    margin-left: 2rem;
    margin-right: 1rem;
    margin-top: 4rem !important;
}

#partnerForm .ui-panel-content .ui-carousel{
    width: 97%;
    margin: auto;
    min-width: 90%;
}

body #partnerForm span.card tr i{
    padding-right: .25rem;
}

body #partnerForm span.card tr .ui-panel-content.ui-widget-content{
    flex-wrap: nowrap;
    color: #2c62cb !important;
    border: unset !important;
    padding:1.4rem 0px 0.2rem;
    flex-direction: row !important;
}

#partnerForm span.card thead{
    background-color: #f8f9fa;
    padding: 1rem .1rem ;
    display: block;
    border-bottom: 1px solid #dee2e6 !important;
}

#partnerForm span.card thead .ui-widget-header{
    text-align: left !important;
}

#partnerForm span.card tr div.ui-panel-content.ui-widget-content label{
    white-space: nowrap;
    font-weight: 500;
    font-size: 95%;
}

#partnerForm  span.card tr{
    display: flex;
    flex-direction: column;
}


#partnerForm span table {
    border: 1px solid #dee2e6;
    border-radius: 3px;


}

#partnerForm span table *{
    border: unset !important;
}



#partnerForm span.card .ui-panelgrid-cell{
    border-bottom: unset !important;
    border-top: unset !important;
    padding: .1rem .8rem;
}

#partnerForm div.ui-panel-content{
    padding: 1rem 0px;
} 


#partnerForm .list-links{
    display: flex;
    margin:auto;
    margin-bottom: 1.2rem;
}
#partnerForm .list-links li{
    margin:0px .6rem;
}

#partnerForm .list-links li a{
    color: inherit;
}

#partnerForm .pi-info-circle{
    margin: 0px .2rem !important; 
} 

#partnerForm .ui-carousel{
    margin-top: 2rem;
}*/

#partnerForm div.clipper-bg{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    /*max-height: 7rem;
    overflow-y: hidden;*/
}

#partnerForm .top-bg-img{
    width: 100%;
    height: auto;

}



#partnerForm .logo-plus-title{
    display: flex;
    flex-direction: row;
    max-width: 100%;
}

#partnerForm .logo-plus-title div{
    overflow: hidden;
}

#partnerForm .logo-plus-title div h2{
    color: #0370AB !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: absolute;
    max-width: 64%; 
}

#partnerForm .top-logo-img{
    /*aspect-ratio: 1;*/
    width: 8rem;
    /*height: 8rem;*/
    /*margin-top: -4.25rem;*/
    margin-right: 1.5rem;
    margin-left: 1.5rem;
    z-index: 88; 
    box-shadow: 0 1px 4px black;
}

#partnerForm .mtop{
    margin-top: 1rem;
    line-height: 124%;
}

#partnerForm .top-logo-img2{
    /*aspect-ratio: 1;*/
    /*width: 8rem;*/
    /*height: 8rem;
    margin-top: -8.25rem;*/
    margin-right: 1.5rem;
    margin-left: 1.5rem;
    z-index: 88; 
    box-shadow: 0 1px 4px black;
}
/*
#partnerForm .ui-outputpanel{
    flex: 1;
}

body #partnerForm #galleria-box-company .ui-galleria-item-nav{
    width: 2rem;
    height: 2rem;
    margin: 2px;
    top: calc( 50% - 1rem );
}

#partnerForm #galleria-box-company .ui-state-highlight{
    background-color: unset !important;
}

#partnerForm #galleria-box-company > *{
    display: flex;
}


body #partnerForm #galleria-box-company{
    margin: 1rem auto;
    margin-top: 1.5rem;
    max-width: 90%;
}

#partnerForm .ui-galleria-item-container
{
    border-radius: .275rem;
}

#partnerForm #galleria-box-company .ui-galleria-content{
    width: 30rem !important;
    min-width: 300px;
    min-height: 300px;
    margin: auto;

}

body #partnerForm #galleria-box-company .ui-galleria-content img{
    object-fit: cover;
    padding-right: unset !important;
}


#partnerForm > div > div.ui-panel-content{
    padding-top: 0px !important;
}

#partnerForm .ui-panel-title{
    color: #0370AB !important;
}

#partnerForm .ui-carousel-header{
    margin: 1rem;
}

#partnerForm .ui-carousel{
    border: 1px solid #dbd8d8;
    border-radius: 8px;
    box-shadow: 0px 2px 6px #c8c4c4;
}*/


/** 22 of July new update**/

#courseListForm{
    display: flex;
    flex-direction: row;
}

#courseListForm .list-tabs{
    display: none;
}

#courseListForm .filter-container-aside{
    display: flex;
}

#courseListForm .filter-container-aside div.filter-dialog{
    width: 21rem;
}

#courseListForm .filter-container-aside #menuFilter{
    height: initial !important;
}

#courseListForm #courseDataTable{
    flex: 1;
    margin-left: 1.5rem;
}

#courseListForm #menuFilter .ui-tabs-panels{
    padding: 0px;
    border: unset !important;

}



#courseListForm #menuFilter .ui-tabs-panels .ui-widget-content{
    padding: 0px;
}

#courseListForm #menuFilter .ui-tabs-panels .grid{
    width: 100% !important;
    margin: 0px !important;
}


#courseListForm #menuFilter .ui-tabs-panels .grid > div{
    box-shadow: inset -1px 0px 4px 0px #adabab;
    border-radius: 0.4rem;
    width: 93% !important;
    margin: auto;
   margin-bottom: 0.625rem;
}

#courseListForm #menuFilter .pi-search:before {
    content: "\e908";
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}



#courseListForm #menuFilter input{
    appearance: none;
    box-shadow: unset !important;
    border: unset !important;
}

#courseListForm .ui-panel .ui-panel-content{
    padding: 0px !important;
}


body #courseListForm .filter-container-aside .ui-icon{
        display: inline-block !important;
}

body #courseListForm .filter-container-aside .ui-accordion{
    width: 100% !important;
}

body #courseListForm .filter-container-aside .ui-accordion-content{
    width: 100% !important;
    display: flex;
    flex-direction: column;
    padding: 1rem .6rem !important;
} 


#courseListForm .filter-container-aside .ui-panelmenu-content {
    width: 100% !important;
}

#courseListForm .filter-container-aside .aside-bottom-erase-filters{
    width: 100%;
    background: #f8f9fa;
    color: #47494c;
    border: 1px solid #d3c5c5;
    margin-bottom: .2rem;
    display: flex;
    flex-direction: row;
    font-weight: 400;
    padding: .2rem .1rem;
    margin-top: -1px !important;
    height: 53% !important;

}

#courseListForm .filter-container-aside .ui-accordion .ui-accordion-header {
    background: none !important;
    padding: .75rem 1rem;
    border-top: 1px solid #dee2e6 !important;
    outline: unset !important;
    box-shadow: unset !important;
}

#courseListForm .filter-container-aside .form-button-mobile{
    display: none;
}


#courseListForm .form-button-mobile span{
    background: #2658B0;
}



/* ============================================================
   Listes admin des offres (moderateCourses / publishCourses /
   coursesDataTable) : largeurs de colonnes proportionnelles
   au contenu affiché.
   - N° (accessKey)      : bouton clé + icône info   ->  7%
   - Offre (course-label): titre + société + ville   ->  reste (~55-60%)
   - Période d'accueil   : "Du dd/MM/yyyy au dd/MM/yyyy" -> 15%, une ligne
   - Statut              : libellé + filtre liste    -> 10%
   - Rang (si activé)    : nombre court              ->  5%
   - Date de mise en ligne : dd/MM/yyyy              ->  9%
   Les tables candidatures gardent leurs largeurs inline (prioritaires).
   ============================================================ */
[id$=":moderateCoursesDataTable"] thead th.course-accessKey,
[id$=":publishCoursesDataTable"] thead th.course-accessKey,
[id$=":coursesDataTable"] thead th.course-accessKey {
    width: 5%;
}
[id$=":moderateCoursesDataTable"] thead th.course-period,
[id$=":publishCoursesDataTable"] thead th.course-period,
[id$=":coursesDataTable"] thead th.course-period {
    width: 15%;
}
[id$=":moderateCoursesDataTable"] td.course-period,
[id$=":publishCoursesDataTable"] td.course-period,
[id$=":coursesDataTable"] td.course-period {
    white-space: nowrap;
}
[id$=":moderateCoursesDataTable"] thead th.course-status,
[id$=":publishCoursesDataTable"] thead th.course-status,
[id$=":coursesDataTable"] thead th.course-status {
    width: 8%;
}
[id$=":coursesDataTable"] thead th.course-rank {
    width: 4%;
}
[id$=":moderateCoursesDataTable"] thead th.course-date,
[id$=":publishCoursesDataTable"] thead th.course-date,
[id$=":coursesDataTable"] thead th.course-date {
    width: 8%;
}
/* Les champs de filtre restent contenus dans leur colonne */
[id$=":moderateCoursesDataTable"] thead .course-period .ui-column-filter,
[id$=":publishCoursesDataTable"] thead .course-period .ui-column-filter,
[id$=":coursesDataTable"] thead .course-period .ui-column-filter,
[id$=":moderateCoursesDataTable"] thead .course-date .ui-column-filter,
[id$=":publishCoursesDataTable"] thead .course-date .ui-column-filter,
[id$=":coursesDataTable"] thead .course-date .ui-column-filter,
[id$=":moderateCoursesDataTable"] thead .course-status .ui-column-filter,
[id$=":publishCoursesDataTable"] thead .course-status .ui-column-filter,
[id$=":coursesDataTable"] thead .course-status .ui-column-filter {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* ============================================================
   Resserrage complémentaire (les entêtes restent sur une ligne,
   la colonne titre récupère la largeur libérée)
   ============================================================ */
/* Période d'accueil : 12% sur les files à modérer / à publier,
   15% conservés sur Toutes les offres (déjà posé plus haut) */
[id$=":moderateCoursesDataTable"] thead th.course-period,
[id$=":publishCoursesDataTable"] thead th.course-period {
    width: 12%;
}
/* Entêtes sur une seule ligne pour les tables retravaillées */
[id$=":moderateCoursesDataTable"] thead th,
[id$=":publishCoursesDataTable"] thead th,
[id$=":coursesDataTable"] thead th,
[id$=":coursesCompanyDataTable"] thead th,
[id$=":draftCoursesCompanyDataTable"] thead th,
[id$=":candidaturesDataTable2"] thead th,
[id$=":candidaturesDraftDataTable"] thead th {
    white-space: nowrap;
}
/* space-company : Statut et Date de mise en ligne réduits,
   la colonne Offres éducatives (course-label) prend le reste */
[id$=":draftCoursesCompanyDataTable"] thead th.course-accessKey {
    width: 5%;
}
[id$=":coursesCompanyDataTable"] thead th.course-status,
[id$=":draftCoursesCompanyDataTable"] thead th.course-status {
    width: 8%;
}
[id$=":coursesCompanyDataTable"] thead th.course-date,
[id$=":draftCoursesCompanyDataTable"] thead th.course-date {
    width: 9%;
}
/* Les filtres restent bornés à leur colonne */
[id$=":coursesCompanyDataTable"] thead .ui-column-filter,
[id$=":draftCoursesCompanyDataTable"] thead .ui-column-filter,
[id$=":candidaturesDraftDataTable"] thead .ui-column-filter {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* Icônes de tri : sur la même ligne que le libellé (le thème les rend en block) */
[id$=":moderateCoursesDataTable"] thead th .ui-sortable-column-icon,
[id$=":publishCoursesDataTable"] thead th .ui-sortable-column-icon,
[id$=":coursesDataTable"] thead th .ui-sortable-column-icon,
[id$=":coursesCompanyDataTable"] thead th .ui-sortable-column-icon,
[id$=":draftCoursesCompanyDataTable"] thead th .ui-sortable-column-icon,
[id$=":candidaturesDataTable2"] thead th .ui-sortable-column-icon,
[id$=":candidaturesDraftDataTable"] thead th .ui-sortable-column-icon {
    display: inline-block;
    vertical-align: middle;
}

/* Filtres de colonne en liste déroulante (selectOneMenu) : pleine largeur de
   colonne, comme les filtres texte — toutes dataTables confondues. Neutralise
   la classe .sizingbox (flex-basis 33%) et le min-width inline calculé par
   PrimeFaces sur la plus large option. */
.ui-datatable thead th .ui-selectonemenu {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    flex: none !important;
    box-sizing: border-box;
}

/* Galleria plein écran (agrandissement d'illustration) : le mask (.ui-galleria-mask) reste
   présent dans le DOM en permanence pour chaque p:galleria fullScreen de la page (seul son
   CONTENU interne est masqué tant qu'on ne clique pas sur l'image) ; seule la classe
   ui-galleria-visible, ajoutée/retirée par le widget PrimeFaces de façon synchrone dans
   show()/hide(), indique qu'un aperçu est réellement affiché. Le fond assombri et
   l'interactivité (pointer-events) doivent donc être scopés à .ui-galleria-visible : les
   appliquer sans cette condition (comme dans une première version de ce correctif) rendait
   TOUTES les pages d'offre en fond noir plein écran en permanence, même sans clic utilisateur -
   régression corrigée ici. On évite par ailleurs de dépendre de la classe ui-widget-overlay
   (ajoutée seulement à la fin d'une transition CSS qui ne se déclenche pas toujours de façon
   fiable) : ui-galleria-visible est fiable car posée directement par show()/hide().
   IMPORTANT : la couleur de fond évite volontairement le noir quasi-pur (rgb proche de 0,0,0).
   Sur la galleria "Photos supplémentaires" (numVisible>1, avec flèches de navigation), cliquer
   sur une flèche déclenche une transition CSS transform sur .ui-galleria-items ; testé en
   conditions réelles (inspection DOM + captures), après ce clic un fond en rgba(0,0,0,0.85) (et
   même rgba(1,1,1,0.85)) ne se peint plus que sur une fine bande autour de l'image alors que
   getComputedStyle/getBoundingClientRect/elementFromPoint confirment tous que le mask couvre
   bien tout le viewport avec le bon z-index et pointer-events (donc pas un souci de layout/JS,
   mais un souci de rendu propre au noir quasi-pur, probablement lié à un plan de superposition
   GPU). Un gris très foncé (ex. rgba(45,45,48,x)) se peint correctement en toutes circonstances
   et reste visuellement indissociable d'un fond noir pour l'utilisateur.
   IMPORTANT (constaté sur Firefox, corrige le même symptôme que le projet école) : le mask
   PrimeFaces natif se dimensionne via "width:100%;height:100%" (voir galleria.css du jar). Sur un
   position:fixed, un pourcentage de largeur/hauteur se résout par rapport au containing block,
   qui peut changer si un ancêtre du mask (ex. wrapper de mise à l'échelle/scroll interne de la
   page) pose un transform - Firefox résout alors width/height:100% par rapport à CET ancêtre
   (souvent plus petit que le vrai viewport), alors que Chrome/Safari s'avèrent plus tolérants ici :
   résultat sur Firefox, le fond assombri ne couvre qu'une partie de l'écran et du contenu de la
   page apparaît par-dessus l'image agrandie. On force donc le positionnement via les 4 offsets
   (top/right/bottom/left:0) plutôt que via width/height:100% : contrairement à un pourcentage de
   largeur/hauteur, un offset à 0 n'a pas besoin de "résoudre" une hauteur/largeur du containing
   block, il ancre directement les bords - fiable quel que soit le navigateur ou le containing
   block réel. */
.ui-galleria-mask.ui-galleria-visible {
    background-color: rgba(45, 45, 48, 0.9) !important;
    pointer-events: auto !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: auto !important;
    height: auto !important;
}
.ui-galleria-mask.ui-galleria-visible .ui-galleria-close {
    pointer-events: auto !important;
    z-index: 100000 !important;
    top: 1.2rem !important;
    right: 1.5rem !important;
    width: 2.75rem;
    height: 2.75rem;
    border: none;
    border-radius: 50%;
    background: rgba(45, 45, 48, 0.6);
    cursor: pointer;
}
.ui-galleria-mask.ui-galleria-visible .ui-galleria-close:hover {
    background: rgba(45, 45, 48, 0.9);
}
.ui-galleria-mask.ui-galleria-visible .ui-galleria-close .ui-galleria-close-icon {
    color: #ffffff;
    font-size: 1.4rem;
}