/** * INFO-SUPENSION FRONT-END */ #infos-suspension {margin: 1em;} .container {padding: 2em 0;} /* header */ .dropdown:hover ul {display: block;} .logo-header {max-height: 64px;} .logo-login {} /* table */ .table thead {font-weight: bold;} /* établissement */ .row-import-cvs {text-align: right;} .row-import-cvs .input-group {justify-content: flex-end;} /* HEADER */ #cssdpis-main {font-size: 1rem; font-family: CircularStd;} #cssdpis-main > div {margin: 15px 0;} #cssdpis-headerlinks {display: flex; column-gap: 10px; font-size: 0.9em;} #cssdpis-headerlinks a {display: flex; align-items: center; padding: 5px; justify-content: center; } #cssdpis-headerlinks a:hover {opacity: 0.6;} #cssdpis-headerlinks a img {width: 80px;} #cssdpis-headerlinks a.employes {background: #002865 !important; color: white; } #cssdpis-headerlinks a.visiteur {background: none !important; color: #002865; border: solid 1px #002865;} #cssdpis-header {display: flex; column-gap: 10px;} #cssdpis-header > div {flex-grow: 1; position: relative; text-align: center; font-size: 0.9em; align-self: center; min-height: 45px; display: flex; justify-content: center; align-items: center;} #cssdpis-header .toggle-block-button {cursor: pointer; width: 100%; height: 45px; vertical-align: middle; display: flex; align-items: center; justify-content: center;} #cssdpis-header .toggle-block-button:hover {opacity: 0.6;} #cssdpis-header .toggle-block-button i {font-size: 0.8em; font-weight: bold; -webkit-text-stroke: 1px #002865; margin-left: 5px;} #cssdpis-header .toggle-block-content {position: absolute; left: 0; top: 100%; background-color: #fff; z-index: 2; margin-top: 0; text-align: left; padding: 14px; border: solid 1px #999; box-sizing: border-box; width: 100%; display: none;} /* #infos-suspensions-actions .toggle-block-content {position: absolute; left: 50%; transform: translate(-50%, 0); top: 100%; background-color: #fff; z-index: 2; margin-top: 0!important;} #infos-suspensions-actions .infos-actions-subscribe .toggle-block-content {width: 100%;} #infos-suspensions-actions .infos-help .toggle-block-content {width: 420px;} */ #cssdpis-header #cssdpis-subscribe .toggle-block-button{border: solid 1px #0b2865; color: #0b2865;} #cssdpis-header #cssdpis-help .toggle-block-button{border: solid 1px #0b2865; color: #0b2865;} #cssdpis-header #cssdpis-help .toggle-block-content span {font-style: italic; font-size: 0.9em;} #cssdpis-header #cssdpis-lastupdate {background-color: #d35167; color: #fff;} #cssdpis-header #cssdpis-nextupdate {background-color: #a7a7a7; color: #fff;} /* Subscribe form */ #cssdpis-header #cssdpis-subscribe-form .input-wrapper {display: flex; margin-bottom: 10px;} #cssdpis-header #cssdpis-subscribe-form .input-wrapper .row-checkbox {min-width: 130px; color: #549ac3; display: flex;} .checkbox-label {display: flex; cursor: pointer; margin: 0;} .checkbox-label-box {display: inline-block; position: relative; height: 15px; width: 15px; min-width: 15px; margin-top: 2px; margin-right: 0.3em; border: 2px solid #1b366f; box-sizing: border-box;} .checkbox-label-text {margin-right: 0.6em;} .hidden-box:checked + .checkbox-label .checkbox-label-box:after {content: ''; display: block; position: absolute; top: -1px; left: 3px; width: 5px; height: 10px; border: solid #000; border-width: 0 2px 2px 0; transform: rotate(45deg);} #cssdpis-header #cssdpis-subscribe-form button.subscribe {cursor: pointer; width: 100%; text-align: center; margin-top: 15px; background: #549ac3; border: none; color: #FFF; padding: 4px; font-size: 1.1em; text-transform: uppercase;} #cssdpis-header #cssdpis-subscribe-form button.unsubscribe {cursor: pointer; display: block; width: 100%; text-align: center; margin-top: 5px; background: none; border: solid 2px #1b366f; color: #1b366f; padding: 4px; font-weight: bold; font-size: 0.95em;} #cssdpis-header #cssdpis-subscribe-form button.subscribe:hover {opacity: 0.6;} #cssdpis-header #cssdpis-subscribe-form button.unsubscribe:hover {opacity: 0.6;} .btn-subscribe-wrapper {text-align: center;} .btn-subscribe-wrapper .btn-subscribe {display: inline-block; margin: 0 auto; width: 100%; text-align: center;} .btn-subscribe-wrapper:not(:last-child) {margin-bottom: 0.6em;} .infos-actions-subscribe .infos-subtitle.btn-subscribe {display: inline-block;} #btn-subscribe {border: 2px solid #000012; color: #fff; background-color: #006583; margin-top: 15px;} .btn-subscribe {padding: 0.3em 0.6em; border: 2px solid #0185ac;} #cssdpis-header #cssdpis-subscribe-form .input-wrapper .row-input {flex: 1;} #cssdpis-header #cssdpis-subscribe-form .input-wrapper .row-input input {border-radius: 0; border: solid 1px #666; background-color: #fff; width: 100%; color:#666; padding: 0 8px;} #cssdpis-header #cssdpis-subscribe-form .input-wrapper .row-input input::placeholder {color:#ccc;} #cssdpis-header #cssdpis-subscribe-form .input-wrapper .row-input input:disabled {border: solid 1px #ccc; background-color: #eee; color:#ccc;} #cssdpis-header #cssdpis-subscribe-form .input-wrapper .row-input input:disabled::placeholder {color:#ccc;} #cssdpis-header #cssdpis-subscribe-form .cssdpis-subscribe-response {color:#F00;} #cssdpis-header #cssdpis-subscribe-form .cssdpis-subscribe-response.success {color:#3ac329;} /*#0b2865*/ /* MAP */ #cssdpis-map #cssdpis-canvas {height: 400px;} #cssdpis_bigmap { padding-bottom: 15px; font-size: 2em; color:#0b2865; font-family: CircularStd; font-weight: bold; cursor: pointer;} #cssdpis_bigmap .cssdpis_close {display: none;} #cssdpis_bigmap.is_opened .cssdpis_open { display: none; } #cssdpis_bigmap.is_opened .cssdpis_close { display: block; } #cssdpis-map #cssdpis-legend {background-color: #fff; padding: 25px; font-size: 1.5em;} #cssdpis-map #cssdpis-legend > div {display: flex; justify-content:space-between; flex-wrap: wrap;} #cssdpis-map #cssdpis-legend > div:first-child {margin-bottom: 5px;} #cssdpis-map #cssdpis-legend > div > div {display: flex;} #cssdpis-map #cssdpis-legend .status-icon {width: 34px; min-width: 34px; height: 34px; font-size: 34px; line-height: 34px; margin-right: 12px; } #cssdpis-map #cssdpis-legend .status-circle {width: 24px; min-width: 24px; height: 24px; font-size: 24px; line-height: 24px; margin-right: 12px; } /* ALERT */ #cssdpis-alert {display: flex; align-items: center; border-radius: 40px; padding: 15px; background: white; font-size: 1.5em;} #cssdpis-alert .status-icon {width: 80px; min-width: 80px; height: 80px; font-size: 80px; line-height: 80px; margin-right: 20px; text-align: center;} #cssdpis-alert.ouvert {border: solid 15px #b2ddb1;} #cssdpis-alert.fermeture {border: solid 15px #f05169;} #cssdpis-alert.suspension {border: solid 15px #fdce69;} #cssdpis-alert.a_venir {border: solid 15px #ebacac;} #cssdpis-alert.reouverture {border: solid 15px #ddb4f0;} #cssdpis-alert .comment p {margin-bottom: 8px;} #cssdpis-alert .comment p:last-child {margin-bottom: 0;} #cssdpis-alert.is_banner {border: none; background: none;} #cssdpis-alert.is_banner a {text-decoration: underline;} #cssdpis-alert.is_banner a:hover {opacity: 0.6;} /* LIST */ #cssdpis-list #cssdpis-list-controls {display: flex; justify-content:end; column-gap: 10px; font-size: 1.2em; margin-bottom: 35px; text-transform: uppercase; color: #549ac3;} #cssdpis-list #cssdpis-list-controls .order-button {cursor: pointer;} #cssdpis-list #cssdpis-list-controls .order-button:hover {opacity: 0.6;} #cssdpis-list #cssdpis-list-controls .order-button.active {text-decoration: underline;} #cssdpis-list #cssdpis-list-controls .cssdpis-search-block {position: relative; margin-left: 20px; display: flex;} #cssdpis-list #cssdpis-list-controls .cssdpis-search-block input {padding: 5px; height: 26px; border: none; border-radius: 0; background-color: #FFF; color: #666; margin-bottom: 0; box-sizing: border-box; outline: none; max-width: 100%; font-size: 0.8em; margin-right: 0px;} #cssdpis-list #cssdpis-list-controls .cssdpis-search-block input::placeholder {font-style: italic; color: #ccc;} #cssdpis-list #cssdpis-list-controls .cssdpis-search-block i {height:26px; width: 26px; font-size: 18px; line-height: 26px; text-align: center;background-color: #549ac3; color: #FFF; margin: 0px;} .infos-school-search-block {position: relative; margin-left: 8px;} .clearfix {content: ""; display: block; height: 1px; clear: both;} .infos-school-search-block .infos-school-search {padding: 2px; border-radius: 0; border: 1px solid #b5b5b5; background-color: transparent; color: #666666; margin-bottom: 0; box-sizing: border-box; outline: none; max-width: 100%;} .infos-school-search-block .fa {position: absolute; right: 0; top: 0; color: #0185ac; pointer} #cssdpis-list #cssdpis-list-schools {display: flex; justify-content:start; flex-wrap: wrap; row-gap: 30px; margin: 0 -15px 0 -15px;} #cssdpis-list #cssdpis-list-schools .cssdpis-school {width: calc((100% / 3) - 30px); margin: 0 15px;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-title {display: flex;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-title h3 {font-size: 1.8em; margin: 0;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-title .status-circle {width: 24px; min-width: 24px; height: 24px; font-size: 24px; line-height: 24px; margin-left: 12px; } #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-date {font-size: 1.1em;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-date:first-letter {text-transform: capitalize;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-content {display: flex; font-size: 0.92em; margin: 12px 0; margin-right: 30px;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-content {} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-content .status-icon {width: 30px; min-width: 30px; height: 30px; font-size: 30px; line-height: 30px; margin-right: 10px; text-align: center; } #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-content .status-icon.status_ouvert {display: none;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-content .comment {margin: 0; margin-bottom: 2px; } #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-content .comment p {margin: 0; margin-bottom: 2px; } #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-content .comment p.servicegarde {font-style: italic; } #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-content .comment p.courssoiree {font-style: italic; } #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-favorite {font-size: 1em; cursor: pointer;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-favorite i {font-size: 0.8em; font-weight: bold; -webkit-text-stroke: 1px #002865;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-unfavorite {display: none; font-size: 1em; color: #549ac3; cursor: pointer;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-unfavorite i {font-size: 0.8em; font-weight: bold; -webkit-text-stroke: 1px #549ac3;} #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-favorite:hover, #cssdpis-list #cssdpis-list-schools .cssdpis-school .school-unfavorite:hover {opacity: 0.6;} #cssdpis-list #cssdpis-list-schools .cssdpis-school.is_favorite .school-unfavorite {display: block;} #cssdpis-list #cssdpis-list-schools .cssdpis-school.is_favorite .school-favorite {display: none;} #cssdpis-list #cssdpis-list-schools .cssdpis-school-separator {width: calc(100% - 30px); margin: 0 15px; background: #549ac3; color: white; padding: 10px 20px; text-transform: uppercase;} #cssdpis-list #cssdpis-list-schools #no-search-result {margin: 1em auto; text-align: center; color: #d12c2c;} /* Google map info-window style */ .gm-style-iw .cssdpis-school {width: 320px;} .gm-style-iw .cssdpis-school .school-title {display: flex;} .gm-style-iw .cssdpis-school .school-title h3 {font-size: 1.8em; margin: 0;} .gm-style-iw .cssdpis-school .school-title .status-circle {width: 24px; min-width: 24px; height: 24px; font-size: 24px; line-height: 24px; margin-left: 12px; } .gm-style-iw .cssdpis-school .school-date {font-size: 1.1em;} .gm-style-iw .cssdpis-school .school-content {display: flex; font-size: 0.92em; margin: 12px 0; margin-right: 30px;} .gm-style-iw .cssdpis-school .school-content {} .gm-style-iw .cssdpis-school .school-content .status-icon {width: 30px; min-width: 30px; height: 30px; font-size: 30px; line-height: 30px; margin-right: 5px; } .gm-style-iw .cssdpis-school .school-favorite {display: none; } .gm-style-iw .cssdpis-school .school-unfavorite {display: none; } .infos-suspension-list .cssdpis-block.isFavoris { border-color:#dfdfdc; -webkit-box-shadow: 6px 6px 15px 5px rgba(0,0,0,0.15); -moz-box-shadow: 6px 6px 15px 5px rgba(0,0,0,0.15); box-shadow: 6px 6px 15px 5px rgba(0,0,0,0.15); } .status_ouvert {color: #b2ddb1;} .status_fermeture {color: #f05169;} .status_suspension {color: #fdce69;} .status_a_venir {color: #ebacac;} .status_reouverture {color: #ddb4f0;} .infos-school-search-block {position: relative; margin-left: 8px;} .clearfix {content: ""; display: block; height: 1px; clear: both;} .infos-school-search-block .infos-school-search {padding: 2px 17px 2px 2px; border-radius: 0; border: 1px solid #b5b5b5; background-color: transparent; color: #666666; margin-bottom: 0; box-sizing: border-box; outline: none; max-width: 100%;} .infos-school-search-block .fa {position: absolute; right: 0; top: 0; color: #0185ac; pointer} /* FORMS */ #cssdpis-main .subform {} #cssdpis-main .subform input[type=text] { text-align: center; font-size: 1.1em; width:300px; } #cssdpis-main .subform input[type=submit]{ margin: 10px; cursor: pointer; } #cssdpis-main .subform.sms {} #cssdpis-main .subform.list hr {border: dashed 1px;} #cssdpis-main .subform.list .all {} #cssdpis-main .subform.list .all .input-wrapper {width: 200px; margin: 0 auto;} #cssdpis-main .subform.list .list {display: flex; justify-content:start; flex-wrap: wrap; row-gap: 12px; margin: 0 -3px 0 -3px;} #cssdpis-main .subform.list .list .input-wrapper {width: calc((100% / 4) - 6px); margin: 0 3px; min-width: 200px;} #cssdpis-main .subform.list .list.disabled {opacity: 0.5; pointer-events: none;} #cssdpis-main .subform.delete {margin-top: 30px;} #cssdpis-main .subform.delete input[type=submit] { color: #F00; border: solid 1px #F00; border-radius: 4px; } #cssdpis-main .subform.delete input[type=submit]:hover {opacity: 0.6; } .hidden-box { display: none;} .hidden-box:checked + .check--label .check--label-box:after {content: ''; display: block; position: absolute; top: -1px; left: 4px; width: 3px; height: 8px; border: solid #000; border-width: 0 2px 2px 0; transform: rotate(45deg);} .hidden-box:checked + .check--label .check--label-text {width: 85%;} .fa-exclamation-triangle {font-size: 0.9em;} /* admin info suspension */ .avis-controls>div:not(:last-child) {margin-right: 15px;} .school-status, .school-reason {margin-right: 10px;} .avis-editor textarea {width: 100%} /* mobile */ @media screen and (max-width: 10240px) { .navbar-expand-lg .navbar-nav .nav-link {padding-right: 0.5rem; padding-left: 0.5rem;} .navbar-expand-lg .navbar-nav {flex-direction: row!important;} } @media screen and (max-width: 991px) { #cssdpis-header {flex-wrap: wrap; row-gap: 5px;} #cssdpis-map #cssdpis-legend {padding: 10px; font-size: 1.2em;} #cssdpis-map #cssdpis-legend h3 {width: 100%;} #cssdpis-list #cssdpis-list-controls {font-size: 1em;} #cssdpis-list #cssdpis-list-schools .cssdpis-school {width: calc((100% / 2) - 30px); margin: 0 15px;} } @media screen and (max-width: 768px) { #cssdpis-alert {font-size: 1.2em;} #cssdpis-map #cssdpis-legend {padding: 10px; font-size: 1em;} #cssdpis-map #cssdpis-legend h3 {width: 100%;} #cssdpis-list #cssdpis-list-controls {font-size: 0.8em; flex-wrap: wrap; justify-content: center;} #cssdpis-list #cssdpis-list-controls .cssdpis-search-block {font-size: 1.2em; margin-right: 15px; width: 100%;} #cssdpis-list #cssdpis-list-controls .cssdpis-search-block #cssdpis-search {width: 100%;} #cssdpis-list #cssdpis-list-schools .cssdpis-school {width: calc(100% - 50px); margin: 0 25px;} } @media screen and (max-width: 640px) { .navbar {display: none!important;} }