﻿#rexeliumContent div.Tile.DesignModern {
    background: white !important;
    height: 268px !important;
    min-height: 268px !important;
    border-bottom: solid 5px #e1e1e1;
}

#rexeliumContent div.Tile.DesignModern .card-img-container {
    position: relative !important;
    height: 79.3% !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay {
    position: absolute !important;
    z-index: 1 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(255, 255, 255, 0) !important;
    opacity: 0 !important;
    padding: 5px !important;
    padding-bottom: 80px !important;
}

#rexeliumContent .TileGroup.solFeature {
    padding-bottom: 0px;
}

#rexeliumContent .TileGroup.solFeature .couleurSolPicker {
    font-size: 0.85em;
    line-height: 12px;
}

#rexeliumContent .Tile.Masked {
    display: none !important;
}

.Splitter {
    position: absolute;
    left: 0;
    bottom: 0px;
    min-height: unset !important;
    max-width: none !important;
    height: 60px !important;
}

#subpageConfig input {
    height: 37px;
    border: 1px solid #ddd;
    padding: 5px 10px;
    text-align: right;
}

#rexeliumContent .typeDeLuminaireTile,
#rexeliumContent .sousTypeDeLuminaireTile,
#rexeliumContent .TypeEclairageTile {
    width: 120px;
}

#rexeliumContent .typeDeLuminaireTile .titleContener,
#rexeliumContent .sousTypeDeLuminaireTile .titleContener,
#rexeliumContent .TypeEclairageTile .titleContener {
    min-height: 110px;
}

#rexeliumContent .typeDeLuminaireTile img,
#rexeliumContent .sousTypeDeLuminaireTile img,
#rexeliumContent .TypeEclairageTile img {
    width: 100%;
}

#rexeliumContent .typeDeLuminaireTile img.hover,
#rexeliumContent .sousTypeDeLuminaireTile img.hover,
#rexeliumContent .TypeEclairageTile img.hover {
    display: none;
}

#rexeliumContent .typeDeLuminaireTile .imgcontener,
#rexeliumContent .sousTypeDeLuminaireTile .imgcontener,
#rexeliumContent .TypeEclairageTile .imgcontener {
    width: 100%;
    height: 60px;
}

#rexeliumContent .typeDeLuminaireTile:hover img.hover,
#rexeliumContent .sousTypeDeLuminaireTile:hover img.hover,
#rexeliumContent .TypeEclairageTile:hover img.hover {
    display: block;
}

#rexeliumContent .typeDeLuminaireTile:hover img.nothover,
#rexeliumContent .sousTypeDeLuminaireTile:hover img.nothover,
#rexeliumContent .TypeEclairageTile:hover img.nothover {
    display: none;
}

#rexeliumContent .typeDeLuminaireTile.selected img.hover,
#rexeliumContent .sousTypeDeLuminaireTile.selected img.hover,
#rexeliumContent .TypeEclairageTile.selected img.hover {
    display: block;
}

#rexeliumContent .typeDeLuminaireTile.selected img.nothover,
#rexeliumContent .sousTypeDeLuminaireTile.selected img.nothover,
#rexeliumContent .TypeEclairageTile.selected img.nothover {
    display: none;
}

div.couleurFeature {
    width: 100%;
    color: #194788;
    background: transparent;
    border: none;
    cursor: pointer;
    max-width: 160px;
    margin: auto;
}

div.couleurFeature div {
    border: none;
}

div.couleurFeature div.pastille {
    width: 40px;
    height: 40px;
    position: absolute;
    top: -10px;
    left: 10px;
    border-radius: 20px;
}

div.couleurFeature.couleurSolFeature div.pastille {
    top: -12px;
}

div .couleurFeature div.Blanc1 div.pastille {
    background: #fdfdfd;
    border: 2px solid #eee;
}

div .couleurFeature div.Blanc div.pastille {
    background: #f5f5f5;
    border: 2px solid #eee;
}

div.couleurFeature div.Clair div.pastille {
    border: 0px;
    background: rgb(224, 222, 201);
}

div.couleurFeature div.Moyen div.pastille {
    border: 0px;
    background: rgb(197, 196, 177);
}

div.couleurFeature div.Fonce div.pastille {
    border: 0px;
    background: rgb(169, 168, 150);
}

div.couleurFeature div.Noir div.pastille {
    border: 3px solid #222;
    background: #333;
}

.eclairementFeature,
.largeurFeature,
.longueurFeature,
.hauteurFeature,
.hauteurPlanUtileFeature {
    position: relative;
    max-width: 150px !important;
    overflow: visible !important;
}

.NbSolutionContener {
    color: #2e4eaa;
    padding: 6px;
    font-size: 0.8em;
}

div.Unite {
    position: absolute;
    top: calc(50% - 9px);
    right: 10px;
    color: #194788;
}

.splitButton {
    margin-right: 12px;
    /* width: 100px; */
    padding: 4px;
    padding-top: 20px;
    border-right: 1px solid #0056b3;
    cursor: pointer;
}

.splitButton img {
    width: 13px;
}

.splitButton div {
    width: 80px;
    /* display: inline-block; */
    vertical-align: middle;
    padding: 5px;
    color: #0056b3;
}

.TypeDeLuminairePart1,
.TypeDeLuminairePart2,
.TypeDeLuminairePart3 {
    transition: 0.5s;
}

.TypeDeLuminairePart1.masked,
.TypeDeLuminairePart2.masked,
.TypeDeLuminairePart3.masked {
    max-width: 0px !important;
    opacity: 0;
}

#rexeliumContent .TileGroup.AddedZone {
    max-height: 560px !important;
}

#rexeliumContent .Tile .titleContener h3,
#rexeliumContent .Tile .titleContener span {
    padding-top: 10px;
}

#rexeliumContent .form-basic input.InputWithUnit {
    padding-right: 30px;
}

.AddedZone Tile.selected {
    background: #2e4eaa;
}

.AddedZone Tile.selected h3 {
    color: #fff;
}

#rexeliumContent .Tile {
    background-color: #fff;
    border-bottom: 3px solid #e1e1e1;
}

#rexeliumContent .Performance h4 {
    border-bottom: 1px solid #eee;
    margin: 0;
    padding: 5px;
}

#rexeliumContent .Performance {
    background: #fff;
}

#rexeliumContent .Performance table {
    width: 100%;
    background: #fff;
}

#rexeliumContent .Performance ul {
    list-style-type: none;
    padding: 0;
}

#rexeliumContent .Performance ul li {
    border-bottom: none;
    padding: 3px;
}

#rexeliumContent .Performance ul li:hover {
    background: transparent;
    color: #697487;
}

#rexeliumContent .ConfigRow {
    border-top: solid 1px #ddd;
    /* background:url("/img/optionPanelTitleh60.png") no-repeat 10px 10px;*/
    overflow: hidden;
    min-height: 90px;
}

#rexeliumContent .finalizeGroup button.ResultButton {
    display: none !important;
}

.ConfigRow h1 {
    padding-top: 10px;
    padding-left: 10px;
    text-align: left;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container:hover>.overlay {
    background-color: rgba(255, 255, 255, .6) !important;
    opacity: 1 !important;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay-description,
#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay-cta {
    margin: 0 !important;
    font-size: 12px !important;
    padding: 0 27px !important;
    background-color: white !important;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    margin-bottom: 5px !important;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container.fullsize {
    height: 180px !important;
    width: 100% !important;
    border-radius: 0px !important;
    padding: 0 !important;
    margin: 0 !important;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay-description p,
#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay-cta p {
    margin: 0 !important;
    padding: 0 !important;
    color: #2e4eaa !important;
    font-size: 12px !important;
    width: 100%;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay-description p,
#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay-cta p {
    margin: 0 !important;
    padding: 0 !important;
    color: #2e4eaa !important;
    font-size: 12px !important;
    width: 100%;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay-description {
    height: 111px !important;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay-cta {
    height: 62px !important;
    text-transform: capitalize !important;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay-cta:hover {
    background-color: #2e4eaa !important;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .overlay-cta:hover>p {
    color: white !important;
}

#rexeliumContent div.Tile.DesignModern2 .card-img-container {
    opacity: 0.6;
    background: transparent;
}

#rexeliumContent div.Tile.DesignModern2:hover .card-img-container {
    opacity: 1;
}

.fullHeightRow {
    min-height: 400px;
}

#MenuCol,
#MenuColSol {
    min-height: 400px;
    padding: 0 !important;
    position: relative;
    padding-top: 25px;
}

#MenuCol .Tile,
#MenuColSol .Tile {
    width: 100% !important;
    margin: 1px 0 !important;
    padding: 0 !important;
    padding-left: 7px !important;
    border: none;
    background: #ddd;
    color: #0a287d !important;
}

#MenuCol .Tile.selected,
#MenuColSol .Tile.selected {
    background: linear-gradient(157deg, rgba(245, 184, 0, 1) 0%, rgba(208, 252, 69, 1) 100%) !important;
}

#MenuCol .Tile:hover,
#MenuColSol .Tile:hover {
    background: linear-gradient(157deg, rgba(245, 184, 0, 1) 0%, rgba(208, 252, 69, 1) 100%) !important;
}

#MenuCol .Tile.selected,
#MenuCol .Tile.selected h3,
#MenuColSol .Tile.selected,
#MenuColSol .Tile.selected h3 {
    color: #0a287d !important;
}

#MenuCol .Tile:hover h3,
#MenuColSol .Tile:hover h3 {
    color: #0a287d !important;
}

#MenuCol .Tile .titleContener,
#MenuColSol .Tile .titleContener {
    background: #f5f5f5;
}

#MenuCol .Tile.selected .titleContener,
#MenuColSol .Tile.selected .titleContener {
    background: #eaeaea;
}

#MenuCol .Tile h3,
#MenuColSol .Tile h3 {
    font-weight: 700;
    font-size: 13px;
}

#rexeliumContent #MenuCol .Tile:hover .titleContener,
#rexeliumContent #MenuColSol .Tile:hover .titleContener {
    background: #ddd;
    color: #0a287d !important;
}

#rexeliumContent #typeDeVerticalFeature .card-title-container {
    height: 20.7% !important;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
}

#rexeliumContent .Tile.ZonetypeDeVerticalTile:hover {
    background: #fafafa !important;
}

#rexeliumContent #typeDeVerticalFeature .card-title-container p {
    font-size: 15px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #0a287d !important;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .arrow-separator-container {
    height: 70px !important;
    /* background-image: url(https://rexeliumrec-cdn.azurewebsites.net/rexelium/images/tile_arrow.png) !important; */
    background-size: cover !important;
    position: absolute !important;
    bottom: 0 !important;
    width: 100% !important;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .arrow-separator-container .arrow-separator-image {
    position: absolute !important;
    z-index: 2 !important;
    background-image: url(https://rexeliumrec-cdn.azurewebsites.net/rexelium/images/cobbacmcokmkefbe.png) !important;
    background-size: cover !important;
    width: 100% !important;
    height: 100% !important;
}

#rexeliumContent #typeDeVerticalFeature .card-img-container .bottom-cover {
    position: absolute !important;
    bottom: 0 !important;
    z-index: 1 !important;
    width: 100% !important;
    height: 45% !important;
    background-color: #f5f5f5 !important;
}

#rexeliumContent #typeDeVerticalFeature .ZonetypeDeVerticalBureauxTile .card-img-container {
    background-image: url("/img/Bureaux.png") !important;
}

#rexeliumContent #typeDeVerticalFeature .ZonetypeDeVerticalCommerceDeDetailTile .card-img-container {
    background-image: url("/img/Commerce de détail.png") !important;
}

#rexeliumContent #typeDeVerticalFeature .ZonetypeDeVerticalEnseignementTile .card-img-container {
    background-image: url("/img/Enseignement.png") !important;
}

#rexeliumContent #typeDeVerticalFeature .ZonetypeDeVerticalEntrepotsEtIndustrieTile .card-img-container {
    background-image: url("/img/Entrepots et industrie.png") !important;
}

#rexeliumContent #typeDeVerticalFeature .ZonetypeDeVerticalHorecaTile .card-img-container {
    background-image: url("/img/Horeca.png") !important;
}

body {
    background: url(/img/zoneBackgroung.png) repeat scroll 0% 0%, transparent linear-gradient(135deg, #132e4e 0%, #0f3b76 51%, #0d1d31 100%) repeat scroll 0% 0%;
}

.CircuitMenu {
    /* background: url(/img/zoneBackgroung.png) repeat scroll 0% 0%,transparent linear-gradient(135deg,#132e4e 0%,#0f3b76 51%,#0d1d31 100%) repeat scroll 0% 0%;*/
}

#rexeliumContent .form-basic.featureform .CircuitMenu .form-row.form-select-row {
    background: transparent;
}

#rexeliumContent .form-basic.featureform .Configsubpage .form-row.form-select-row {
    min-height: 80px;
    /*height:auto;*/
}

#rexeliumContent .FeatureGroup {
    padding: 3px;
}

#rexeliumContent .form-basic .FeatureGroup .form-row .form-row-description {
    border: none;
    padding: 5px 12px;
}

#implantation {
    max-width: 200px;
}

#implantationContent {
    width: 100%;
    position: relative;
}

#implantationGrid {
    width: 100%;
    position: relative;
    border-collapse: collapse;
}

#implantationGrid td {
    border: 1px solid #ddd;
}

.implantation {
    position: relative;
    width: 100%;
    margin-bottom: 15px;
}

.cercle {
    position: absolute;
    top: 0;
    left: 0;
    border: 1px solid #999;
    border-radius: 50%;
    background-color: #FCE644;
}
.cercle .crossX {
    width: 300%;
    height: 1px;
    background: blue;
    left: -100%;
    position: relative;
    top: calc(50% - 1px);
}
.cercle .crossY {
    width: 1px;
    height: 300%;
    background: blue;
    left: calc(50% - 1px);
    position: relative;
    top: -100%;
}
.halo {
    position: absolute;
    top: 0;
    left: 0;
    border: 1px solid rgba(252, 230, 68, 0.5);
    border-radius: 50%;
    background: radial-gradient(rgba(252, 230, 68, 0.4), rgba(252, 230, 68, 0));
}

#rexeliumContent table,
#rexeliumContent table a {
    color: #2c4150 !important;
    font-size: 0.95em;
}

.halo2 {
    position: absolute;
    top: 0;
    left: 0;
    border: 1px solid rgba(252, 230, 68, 0.3);
    border-radius: 50%;
    background: radial-gradient(rgba(252, 230, 68, 0.3), rgba(252, 230, 68, 0));
}

#topGradGrid {
    border-left: 2px solid #666;
    border-bottom: 2px solid #666;
    border-right: 2px solid #666;
}

#topGradGrid td {
    border-left: 1px solid #666;
    padding-left: 2px;
}

#LumGradGrid {
    border-left: 2px solid #666;
    border-bottom: 2px solid #666;
    border-right: 2px solid #666;
}

#LumGradGrid td {
    border-left: 1px solid #777;
    padding-left: 2px;
}

#rexeliumContent #typeDeVerticalFeature {
    padding: 20px;
    max-width: 1040px;
    /*max-width: 800px;*/
    margin: auto;
}

#rexeliumContent #typeDeVerticalFeature .TileCollection {
    margin: 10px;
}

#rexeliumContent .mui-btn.filterButton {
    display: inline-block;
    width: auto !important;
    font-size: 14px !important
}

#rexeliumContent .subpage {
    padding: 0;
}

#FilterResearchinnerreader table {
    width: 600px;
    margin: auto;
}

#FilterResearchinnerreader table tr td:nth-child(2) {
    width: 140px;
    text-align: right;
    padding-right: 20px;
}

#FilterResearchinnerreader table tr td:nth-child(2) input,
#FilterResearchinnerreader table tr td:nth-child(2) select {
    width: 120px;
    border: 1px solid #ddd;
    padding: 3px;
}

#RowConfig {
    padding-right: 2px;
    padding-left: 0;
}

.RexeliumInput {
    width: 120px;
    border: 1px solid #ddd;
    padding: 10px 6px;
    text-align: right;
}

#rexeliumContent .form-row-selection {
    min-height: unset;
}

.ButtonRow {
    display: flex;
    padding: 5px;
    background: white !important;
    border: 1px solid #2e4eaa !important;
    color: #2e4eaa !important;
    cursor: pointer;
}

.PhotometrieFilterFeature {
    margin: 0 !important;
    position: relative;
    top: 5px;
}

#rexeliumContent .SolutionContener {
    height: 460px;
}

.ButtonRow.right {
    background: #2e4eaa !important;
    color: #fff !important;
    border: 1px solid #2e4eaa !important;
}

.ButtonRow p {
    margin: 3px auto;
}

.ButtonRow img {
    height: 18px;
    margin-top: 3px;
}

.typeDeZoneFeature.TileGroup {
    max-height: unset !important;
}

.Tile.typeDeZoneFeature .titleContener h3 {
    min-height: 50px;
    padding-top: 5px;
}

.titleContener p {
    font-weight: bold;
}

#rexeliumContent .form-basic input,
#rexeliumContent .form-basic select {
    border-color: #ddd;
}

.Tile .TileSubrow {
    display: flex;
    justify-content: center;
    font-size: 0.95em;
    padding-bottom: 5px;
    opacity: 0.9;
    color: #0a297d;
}

.Tile:hover .TileSubrow {
    color: #ddd;
}

#rexeliumContent .Tile.ZonetypeDeZoneTile .titleContener h3 {
    font-weight: 600;
}

.Tile .TileSubrow div {
    margin: 0 5px;
}

#rexeliumContent .Performance button.rexeliumBtn,
#rexeliumContent .AddToCartContainer button.rexeliumBtn {
    border-radius: 0px !important;
    width: calc( 100% - 6px) !important;
    border: 1px solid #aaa !important;
    background: #fff !important;
}

#rexeliumContent .Performance button.rexeliumBtn:hover,
#rexeliumContent .AddToCartContainer button.rexeliumBtn:hover {
    background: #eee !important;
}

.loadFicheSolution {
    /*display:none;*/
}

#FiltersTypeCol {
    padding: 0;
    padding-right: 1px;
}

.form-header {
    position: absolute;
    height: 42px;
    z-index: 10;
}
.form-header .form-title-row{
    display:flex;
}
#rexeliumContent .form-header input{
    padding: 5px !important;
    font-size: 1.1em;
    min-width: 250px;
    margin-right: 10px;
    margin:5px;
    border-color:#eee;
}

#rexeliumContent .form-header span{
    padding-top: 12px !important;
}
#rexeliumContent .headerblock .blueSpan{
    color: #bbb !important;
}
#rexeliumContent .headerblock:hover .blueSpan{
    color: #19477E !important;
}
#rexeliumContent .blueInput::placeholder{
    color: #bbb !important;
}
#rexeliumContent .headerblock:hover .blueInput{
    border-color: #19477E !important;
}

#rexeliumContent .Performance table td {
    padding: 0 3px;
}
.divFooter{
    border-top:1px solid #ddd;
    color:#ddd;
    display: none;
}
.CharpterDesc2{
    display: none;
}
@media print {
    .no-print,
    .no-print *,
    .ligneDeVie,
    button,
    header,
    footer,
    .projectIdentityBlock {
        display: none !important;
    }
    body {
        background: #fff !important;
        background-color: #fff !important;
    }
    .newPrintChapter {
        break-before: page;
    }
    .CharpterDesc2{
        display:none;
    }
    #MainSection,
    #MainContener,
    .conteneurLarge,
    .conteneurShort {
        width: 100%;
        max-width: unset;
    }
    .divFooter{
        position: fixed;
        bottom: 0;
        display: block;
    }
    .CharpterDesc2{
        display:block;
    }
}