body { overflow-x: hidden; margin-bottom: 48px; } .form-auth-forgot-password, .form-auth-register, .form-auth-login { margin-top: 20px; margin-bottom: 200px; } .c-offcanvas.is-open { z-index: 1080; } .btn-circle.btn-xl { width: 70px; height: 70px; padding: 10px 16px; border-radius: 35px; font-size: 24px; line-height: 1.33; } .btn-circle { width: 30px; height: 30px; padding: 6px 0px; border-radius: 15px; text-align: center; font-size: 12px; line-height: 1.42857; } @media( min-width: 1200px ) { body.body-content .container { max-width: 720px; } } @media( min-width: 992px ) { body.body-content .container { max-width: 720px; } } @media( max-width : 768px ) { .navbar { padding: 0.5rem 0.25rem; } body.body-content .container-fluid, body.body-content .container { padding-left: 0; padding-right: 0; } } nav a:hover, nav a:active, nav a { color: white; } .navbar-brand { padding-left: 12px; } body.body-content .container-fluid { max-width: 992px; } body.body-content { color: #2B2D42; background-color: #F2F2F2; } .content { margin-top: 72px; } .c-offcanvas--right { z-index: 1080; } .navbar-nav .dropdown-menu { position: absolute; min-width: 280px; } .ul-offcanvas-nav { margin: 0; padding: 0; list-style: none; } .li-offcanvas-menu-item { border-bottom: 1px solid #FFFFFF; font-size: 14px; color: white; } .dropdown-item { padding-left: 0.7rem; padding-right: 0.7rem; } .dropdown-menu { font-size: 0.8rem; } .li-offcanvas-menu-item-inverted { border-bottom: 1px solid #FFFFFF; font-size: 14px; background-color: white; } .text-primary { color: #2B2D42!important; } .pb_cover_v3 a { color: #2B2D42!important; } a:hover, a { color: #2B2D42; } a.btn { color: white; } .invalid-feedback, .text-danger { color: #C13C2A!important; } .btn-primary { color: #fff; background-color: #2B2D42; border-color: #2B2D42; } .btn-primary:active, .btn-primary:hover { color: #fff; background-color: #152332; border-color: #152332; } .btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle { color: #fff; background-color: #152332; border-color: #152332; } .btn-danger { color: #fff; background-color: #C13C2A; border-color: #C13C2A; } .btn-danger:active, .btn-danger:hover { color: white; background-color: #C13C2A; border-color: #C13C2A; } .bg-danger { background-color: #C13C2A!important; } .custom-radio .custom-control-input:checked~.custom-control-label::before { background-color: #2B2D42; } .custom-control-input:checked~.custom-control-label::before { background-color: #2B2D42; } .custom-checkbox .custom-control-input:checked~.custom-control-label::before { background-color: #2B2D42; } .custom-control-input:checked~.custom-control-label::before { background-color: #2B2D42; } .custom-select.is-invalid, .form-control.is-invalid, .was-validated .custom-select:invalid, .was-validated .form-control:invalid { border-color: #C13C2A; } .btn-declined { color: #C13C2A; background-color: transparent; background-image: none; border-color: #F2F2F2; } .custom-control-input.is-invalid~.custom-control-label::before, .was-validated .custom-control-input:invalid~.custom-control-label::before { background-color: #C13C2A; } .custom-control-input.is-invalid~.custom-control-label, .was-validated .custom-control-input:invalid~.custom-control-label { color: #C13C2A; } .custom-control-input.is-valid~.custom-control-label::before, .was-validated .custom-control-input:valid~.custom-control-label::before, .custom-control-input.is-valid:checked~.custom-control-label::before, .was-validated .custom-control-input:valid:checked~.custom-control-label::before { background-color: #87AD71; } .no-padding { padding: 0; } .btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle, .btn-secondary { background-color: #696773; border-color: #696773; } .custom-select.is-valid, .form-control.is-valid, .was-validated .custom-select:valid, .was-validated .form-control:valid { border-color: #87AD71; } .custom-control-input.is-valid~.custom-control-label, .was-validated .custom-control-input:valid~.custom-control-label, .valid-feedback { color: #87AD71; } .container-rsvp-icon { margin-top: 16px; } .btn-accepted { color: #87AD71; background-color: transparent; background-image: none; border-color: #F2F2F2; } .btn-rsvp-not-selected { color: white; background-color: #C1C1C1; background-image: none; border-color: #F2F2F2; } .btn-not-selected { color: #C1C1C1; background-color: transparent; background-image: none; border-color: #F2F2F2; } .btn-waiting { color: #E1B860; background-color: transparent; background-image: none; border-color: #F2F2F2; } .badge-primary { color: #fff; background-color: #2B2D42; } .badge-success { color: #fff; background-color: #87AD71; } .badge-danger { color: #fff; background-color: #C13C2A; } .h4, h4 { font-size: 1.4rem; color: #2B2D42; } .li-offcanvas-menu-header { font-size: 18px; padding: 48px 24px; background-color: transparent; } a.a-offcanvas-menu-link, a:hover.a-offcanvas-menu-link { color: white; display: block; width: 100%; padding: 6px 24px; text-decoration: none; line-height: 32px; } .li-offcanvas-menu-item-inverted a.a-offcanvas-menu-link, .li-offcanvas-menu-item-inverted a:hover.a-offcanvas-menu-link { color: #2B2D42; } /* Customize the label (the container) */ .checkbox-container { display: block; position: relative; padding-left: 35px; margin-bottom: 12px; cursor: pointer; font-size: 22px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /* Hide the browser's default checkbox */ .checkbox-container input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .dropdown-menu { font-size: 0.85rem; } .c-offcanvas { background: #2B2D42; background: -moz-linear-gradient(45deg, #2B2D42 0%, #8D99AE 100%); background: -webkit-linear-gradient(45deg, #2B2D42 0%, #8D99AE 100%); background: -o-linear-gradient(45deg, #2B2D42 0%, #8D99AE 100%); background: linear-gradient(45deg, #2B2D42 0%, #8D99AE 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8D99AE', endColorstr='#2B2D42',GradientType=1 ); } /* Create a custom checkbox */ .checkbox-checkmark { position: absolute; top: 0; left: 0; height: 25px; width: 25px; background-color: #eee; } /* On mouse-over, add a grey background color */ .checkbox-container:hover input ~ .checkbox-checkmark { background-color: #ccc; } /* When the checkbox is checked, add a blue background */ .checkbox-container input:checked ~ .checkbox-checkmark { background-color: #2B2D42; } /* Create the checkmark/indicator (hidden when not checked) */ .checkbox-checkmark:after { content: ""; position: absolute; display: none; } /* Show the checkmark when checked */ .checkbox-container input:checked ~ .checkbox-checkmark:after { display: block; } /* Style the checkmark/indicator */ .checkbox-container .checkbox-checkmark:after { left: 9px; top: 5px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .bg-gradient { background: #2B2D42; /* background: -moz-linear-gradient(45deg, #665fee 0%, #27c2de 100%); background: -webkit-linear-gradient(45deg, #665fee 0%, #27c2de 100%); background: -o-linear-gradient(45deg, #665fee 0%, #27c2de 100%); background: linear-gradient(45deg, #665fee 0%, #27c2de 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#665fee', endColorstr='#27c2de',GradientType=1 ); */ box-shadow: 0 0px 10px 0px rgba(0, 0, 0, 0.14), 0 4px 12px -4px rgba(33, 33, 33, 0.8); } .nav-item { padding-left: 12px; padding-right: 12px; } .badge:empty.badge-dot { display: inline-block; } .badge-dot { position:absolute; left: 24px; top: 20px; height: 10px; width: 10px; border-radius: 50%; display: inline-block; } .fixed-top { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } body.body-auth .action-button { display: none!important; } .action-button { position: fixed; -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); bottom: 20px; right: 20px; text-align: center; font-size: 20px; line-height: 50px; width: 50px; height: 50px; background-color: #2B2D42; color: #FFF; border-radius: 50%; cursor: pointer; overflow: hidden; z-index: 100; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12); } .action-list { color: #2B2D42; font-size: initial; text-align: initial; line-height: initial; position: absolute; bottom: 0; right: 0; opacity: 0; background-color: white; } .action-list-item { padding: 20px; white-space: nowrap; } .action-list-item a { text-decoration: none; } .action-list-item:hover a:hover, .action-list-item:hover a, .action-list-item a:hover { color: white; } .action-list-item:hover { color: white; background-color: #2B2D42; cursor: pointer; } .action-list-item i, .action-list-item span { display: inline-block; vertical-align: middle; } .action-list-item i { margin-right: 5px; } .disable-select { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } [class*="col-"] { margin-bottom: 12px; } .page-nav li { padding-left: 0; padding-right: 0; } [data-id="member-header"] { padding-bottom: 0; } [data-id="member-header"] .nav-tabs { margin-bottom: -1px; } [data-id="member-header"] .nav-tabs .nav-link { cursor: pointer; } .group-members-content { display: none; } .group-members-content.active { display: block; } ::-webkit-input-placeholder { font-style: italic; } :-moz-placeholder { font-style: italic; } ::-moz-placeholder { font-style: italic; } :-ms-input-placeholder { font-style: italic; } .btn-circle.btn-xl { width: 40px; height: 40px; padding: 9px 10px; border-radius: 20px; font-size: 16px; line-height: 1.33; } .btn-circle { width: 30px; height: 30px; padding: 6px 0px; border-radius: 15px; text-align: center; font-size: 12px; line-height: 1.42857; } .rsvp-loading-icon { padding-top: 2px; padding-right: 1px; } .rsvp-loading-icon > i { color: #C1C1C1; font-size: 37px; } .rsvp-draft-icon { padding-top: 6px; padding-right: 8px; } .rsvp-draft-icon > i { color: #C1C1C1; font-size: 22px; } .rsvp-checkmark__circle { stroke-dasharray: 166; stroke-dashoffset: 166; stroke-width: 2; stroke-miterlimit: 10; stroke: #87AD71; fill: none; } .rsvp-checkmark__circle-waiting { stroke: #E1B860; } .rsvp-checkmark { text-align: right; width: 40px; height: 40px; border-radius: 50%; display: block; stroke-width: 2; stroke: #fff; stroke-miterlimit: 10; box-shadow: inset 0px 0px 0px #87AD71; animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both; } .rsvp-chcekmark-waiting { box-shadow: inset 0px 0px 0px #E1B860; animation: fill-waiting .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both; } .rsvp-checkmark__check { transform-origin: 50% 50%; stroke-dasharray: 48; stroke-dashoffset: 48; animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards; } @keyframes stroke { 100% { stroke-dashoffset: 0; } } @keyframes scale { 0%, 100% { transform: none; } 50% { transform: scale3d(1.1, 1.1, 1); } } @keyframes fill { 100% { box-shadow: inset 0px 0px 0px 30px #87AD71; } } @keyframes fill-waiting { 100% { box-shadow: inset 0px 0px 0px 30px #E1B860; } } .team-header { padding-bottom: 24px; } .numberCircle { border-radius: 50%; width: 68px; height: 68px; padding: 8px; border: 2px solid #2B2D42; color: #2B2D42; text-align: center; font-size: 32px; margin: auto; margin-bottom: 12px; } .notify-message { color: white; } .modal-header.modal-header-primary { background-color: #2B2D42; color: white; } .modal-header.modal-header-primary > button.close, .modal-header.modal-header-primary > button.close:hover { color: white; } .pusher { background: rgba(0, 0, 0, 0.1); height: 5px; margin: 10px auto 0; overflow: hidden; position: relative; width: 160px; } .pusher::before, .pusher::after { background: rgba(43, 45, 66, 0.8); content: ''; display: block; height: 5px; left: 0; position: absolute; top: 0; transform: translate3d(-100%, 0, 0); width: 50%; } .pusher::before { animation: pusher 2s infinite; } .pusher::after { animation: pusher 2s -1s infinite; } @keyframes pusher { 0% { transform: translate3d(-100%, 0, 0); } 100% { transform: translate3d(200%, 0, 0); } } .action-button { } .news-collpase-icon-rotate { -moz-transition: all .25s linear; -webkit-transition: all .25s linear; transition: all .25s linear; } .news-collpase-icon-rotate.news-collapse-icon-rotate-down{ -moz-transform:rotate(180deg); -webkit-transform:rotate(180deg); transform:rotate(180deg); } .col-news-icon { -ms-flex: 0 0 42px; flex: 0 0 44px; text-align: right; } .col-news-headline { } .col-news-collapse-icon { flex: 0 0 52px; margin-right: 18px; text-align: right; font-size: 32px; } .col-news-detail { padding-left: 72px; padding-right: 72px; font-size: small; } .col-appointment-date { -ms-flex: 0 0 42px; flex: 0 0 42px; text-align: right; } .col-appointment-bar { -ms-flex: 0 0 10px; flex: 0 0 10px; text-align: center; padding-top: 4px; padding-left: 6px; } .appointment-bar { width: 4px; height: 50px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .appointment-bar-cancelled { background-color: #C13C2A; } .appointment-bar-waiting { background-color: #E1B860; } .appointment-collapse-container { font-size: smaller; } .appointment-collapse-bar { text-align: center; border-radius: 4px; padding: 6px 12px; color: white; font-weight: bold; margin-bottom: 12px; } .appointment-collapse-bar-deadlineover, .appointment-collapse-bar-cancelled { background-color: #C13C2A; } .appointment-collapse-bar-waiting { background-color: #E1B860; } .appointment-collapse-container .table td{ padding: 0; } .col-subject { padding-left: 6px; } .col-appointment-response { -ms-flex: 0 0 52px; flex: 0 0 52px; margin-right: 12px; text-align: right; } .news-item, .hint-container, .appointment-item { cursor: pointer; background-color: white; min-height: 32px; padding: 12px; border-top: 1px solid #eee; } .news-item-collapse-container, .news-item { background-color: #2B2D42; color: white; } .appointment-item .appointment-date-container { } .appointment-item .appointment-date-container > .weekday{ font-size: 12px; margin-bottom: -7px; } .appointment-item .appointment-date-container > .day{ font-size: 24px; margin-top: -4px; } .appointment-item .appointment-date-container > .month { font-size: 12px; margin-top: -7px; } .appointment-item .appointment-category { font-size: 12px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .appointment-item .appointment-subject { } .appointment-item .appointment-datetime { font-size: 12px; color: #666; } .appointment-detail-content table th, .appointment-detail-content table td { padding: 0; } .appointment-detail-content table th { width: 30%; } .btn-rsvp { padding: 1px 6px; } h1, h2, h3, h4, h5, h6 { padding-left: 12px; } h4 { padding-top: 6px; } h4:first-child { padding-top: 0px; } .table-messages tr th:nth-child(1), .table-messages tr td:nth-child(1), .table-configuration-profile tr th:nth-child(1) { width: 1px; white-space: nowrap; } img.profile-image-big { width: 128px; height: 128px; margin: auto; } .profile-card-image { width: 128px; height: 128px; top: -64px; margin: auto; border: 4px solid white; z-index: 11; padding: 6px; border-radius: 50%; } .table-messages tr th, .table-messages tr td, .table-groups tr td, .table-profiles tr td { padding-top: 0.4rem; padding-bottom: 0.4rem; } .table-course-categories thead tr th, .table-messages thead tr th, .table-groups tr:nth-child( 1 ) td, .table-profiles tr:nth-child(1) td { border-top: none; } .table-groups td:nth-child( 1 ), .table-profiles td:nth-child( 1 ) { padding-left: 0; padding-right: 0; width: 38px; } .table-messages td:nth-child( 1 ) { padding-left: 0; padding-right: 0; } .table-messages td:nth-child( 5 ), .table-groups td:nth-child( 3 ), .table-profiles td:nth-child( 3 ) { padding-right: 0; text-align: right; } img.group-image-table, img.profile-image-table { width: 36px; height: 36px; padding: 0; border: none; } body { font-size: 0.9rem; } .appointment-detail-appointment-category { font-size: smaller; } .appointment-detail-appointment-name { font-weight: bolder; font-size: larger; margin-bottom: 12px; } .group-header, .profile-header, .group-members-header, .appointment-detail-header, .home-detail-header { font-size: smaller; font-weight: bolder; } .group-header, .profile-header { margin-top: 6px; } .group-header, .group-content { text-align: center; } .appointment-detail-header { margin-bottom: 4px; } .group-members-content { margin-top: 12px; } .appointment-detail-content, .home-detail-content { margin-bottom: 12px; } .appointment-original-status { margin-top: -4px; font-color: #666; } .clickable { cursor: pointer; } .trVAlignMiddle td { vertical-align: middle; } .group-detail-name { font-size: 1.4rem; } .chat-row { margin-bottom: 6px; } .chat-message { } .chat-message p { background: #F7F7F7 none repeat scroll 0 0; border: 1px solid rgba(0,0,0,.125); border-radius: 3px; font-size: 14px; margin: 0; padding: 5px 10px 5px 12px; width: 100%; } img.profile-image-chat { width: 48px; height: 48px; padding: 0; border: none; } .modal-footer, .modal-header { padding: 0.5rem; } .body-auth a { text-decoration: underline; } .modal.show .modal-dialog { -webkit-transform: translate(0,15%); transform: translate(0,15%); } .header-help-button-container { float: right!important; padding-right: 18px; } .header-help-button-container > button.btn-circle { width: 26px; height: 26px; padding: 3px 0; } .help-info { font-size: smaller; padding: 6px; font-style: italic; } .stat-box { border: 1px solid #F2F2F2; text-align: center; padding: 6px; width: 100%; } .stat-box-header { font-size: 10px; font-weight: bolder; } .stat-box-body { font-size: 18px; } .stat-box-footer { font-size: 10px; } h6.in-card { margin-top: 12px; padding-left: 0; } .dropdown-header { font-size: 0.75rem; } h6.calendar-week { margin-top: 0; margin-bottom: 0; padding-top: 3px; padding-bottom: 3px; border-top: 1px solid #C5C3C6; border-bottom: 1px solid #C5C3C6; } .chart-legend { font-size: smaller; } .ct-chart { margin-top: 12px; height: 33vh; } .ct-series-a .ct-bar, .ct-series-a .ct-slice-pie, .ct-series-a .ct-point, .ct-series-a .ct-line { stroke: #2B2D42; fill: #2B2D42; } .ct-series-b .ct-slice-pie .ct-series-b .ct-point, .ct-series-b .ct-line { stroke: #2B2D42; fill: #2B2D42; } .ct-series-c .ct-slice-pie .ct-series-c .ct-point, .ct-series-c .ct-line { stroke: #E1B860; fill: #E1B860; } .ct-series-d .ct-slice-pie .ct-series-d .ct-point, .ct-series-d .ct-line { stroke: #2B2D42; fill: #2B2D42; } .ct-label { fill: rgba( 0,0,0,0.8); color: rgba(0,0,0,0.8); } .table-standard td:first-child { padding: 4px 12px 4px 0px; } .autocomplete-suggestions { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #999; background: #FFF; cursor: default; overflow: auto; -webkit-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); -moz-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); } .autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; } .autocomplete-no-suggestion { padding: 2px 5px;} .autocomplete-selected { background: #F0F0F0; } .autocomplete-suggestions strong { font-weight: bold; color: #000; } .autocomplete-group { padding: 2px 5px; font-weight: bold; font-size: 16px; color: #000; display: block; border-bottom: 1px solid #000; } .btn-primary.disabled, .btn-primary:disabled { background-color: #2B2D42; border-color: #2B2D42; }