/* font config  */
@font-face {
    font-family: dana;
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/dana-regular.woff') format('woff2'),
        /* FF39+,Chrome36+, Opera24+*/ url('../fonts/dana-regular.woff') format('woff');
    /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
}

@font-face {
    font-family: dana;
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/dana-bold.woff2') format('woff2'),
        /* FF39+,Chrome36+, Opera24+*/ url('../fonts/dana-bold.woff') format('woff');
    /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
}

@font-face {
    font-family: dana-fanum;
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/dana-fanum-regular.woff') format('woff2'),
        /* FF39+,Chrome36+, Opera24+*/ url('../fonts/dana-fanum-regular.woff') format('woff');
    /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
}

@font-face {
    font-family: dana-fanum;
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/dana-fanum-bold.woff2') format('woff2'),
        /* FF39+,Chrome36+, Opera24+*/ url('../fonts/dana-fanum-bold.woff') format('woff');
    /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
}
body{
    text-align:right;
}

.fal {
    font-family: "Font Awesome 5 Pro";
    font-weight: 300;
}

.fa-num {
    font-family: dana-fanum;
}

* {
    font-family: dana-fanum, dana;
}

input {
    font-family: dana-fanum, dana;
}

label {
    color: #00677F !important;
}

/* loading page  */
section#loading,
section#sms {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100vh;
}

/* sms page */
section#sms, section#password, section#code {
    background-position: bottom;
    background-repeat: no-repeat;
}

div.logo-dark {
    background-image: url(../images/logo-dark.svg);
    background-position: center center;
    background-repeat: no-repeat;
}

#phone_number {
    text-align: center;
    background-color: white;
    font-size: 28px;
    letter-spacing: 5px;
}

#phone_number:focus,
#phone_number:active {
    background-color: white !important;
}

.form_text {
    font-size: 0.8rem;
    text-align: center;
}

.form_text a {
    text-decoration: underline;
    color: #FF9E1B;
}

#sms button.btn,
#password button.btn {
    border-radius: 30px !important;
    background: linear-gradient(60deg, #00677F, #62B5E5);
    border: none;
}

/* user page styles  */
#user {
    height: 100vh;
}

#user label {
    font-size: 1.1rem;
    color: lightgray !important;
}

#user i {
    color: lightgray;
}

.radio-tile-group {
    display: -webkit-box;
    display: flex;
    flex-direction: column;
    -webkit-box-pack: center;
    justify-content: center;
    align-items: center;
}

.radio-tile-group .input-container {
    position: relative;
    height: 7rem;
    width: 75%;
    margin: 0.5rem;
}

.radio-tile-group .input-container .radio-button {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    margin: 0;
    cursor: pointer;
}

.radio-tile-group .input-container .radio-tile {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border: 1px solid lightgray;
    border-radius: 5px;
    padding: 1rem;
    -webkit-transition: -webkit-transform 300ms ease;
    transition: -webkit-transform 300ms ease;
    transition: transform 300ms ease;
    transition: transform 300ms ease, -webkit-transform 300ms ease;
}

.radio-tile-group .input-container .radio-tile-label {
    text-align: center;
    font-size: 0.75rem;
    color: lightgray;
}

.radio-tile-group .input-container .radio-button:checked + .radio-tile {
    background: linear-gradient(60deg, #00677F, #62B5E5);
    color: white !important;
    -webkit-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

.radio-tile-group .input-container .radio-button:checked + .radio-tile,
.radio-tile-group .input-container .radio-button:checked + .radio-tile i {
    color: white !important;
}

.radio-tile-group .input-container .radio-button:checked + .radio-tile .radio-tile-label {
    color: white !important;
}

/* code page  */
#code {
    height: 100vh;
}

#code input {
    border: none;
    border-bottom: 2px solid #00677F;
    border-radius: 0px;
    font-size: 2.2rem;
    letter-spacing: 1rem;
    color: #FF9E1B;
    text-align: center;
}

#code a {
    text-decoration: underline;
    color: #FF9E1B;
}

/* password page styles */
#pass-container {
    border-bottom: 1px solid #00677F;
}

#pass-container input {
    border: none !important;
    outline: none !important;
    text-align: center;
    font-size: 1.2rem;
}

#pass-container input:focus {
    border-color: none;
    box-shadow: none;
    outline: 0 none;
}

#pass-container input:active {
    border-color: transparent;
    box-shadow: none;
    outline: 0 none;
}

/* password page styles end */
#password {
    color: #00677F;
    height: 100vh;
}

/* index page style */
#index {
    height: 100vh;
}

header {
    height: 50px;
}

#index header button,
#support header button {
    background-color: #F6F9FF;
}

#bottom-nav {
    background-color: #F6F9FF;
    width: 100%;
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    z-index: 998;
    box-shadow: 5px 0 0 rgba(0, 103, 127, 0.1),
    -5px 0 0 rgba(0, 103, 127, 0.1);
    bottom: 0;
    height: unset !important;
}

#bottom-nav a i, #bottom-nav a div {
    color: #4b4b4b;
}

#bottom-nav a {
    text-decoration: none !important;
}


#nav-title {
    text-align: center;
    font-size: 0.5rem;
}

#nav-title a {
    color: rgb(0, 103, 127);
    font-size: 0.5rem;
}

#box p {
    font-size: 0.9rem;
    color: white;
    margin-bottom: 0;
}

#box div,
#box div i {
    /*color: white;*/
}

#sideNav {
    width: 270px;
    position: absolute;
    height: 100vh;
    background-color: #F6F9FF;
    right: -270px;
    top: 0;
    z-index: 999 !important;
}

.navOpen {
    right: 0 !important;
}

.layer.open {
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0.5;
    filter: blur(5px);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 998 !important;
    width: 100vw;
    height: 100vh;
    transition-property: all;
}

#profile-info {
    /*height: 10vh;*/
}

.currency {
    color: #FF9E1B;
}

.currency-container {
    border-bottom: 1px solid #FF9E1B;
}

.currency-container button i {
    color: #00677F;
}

.role::before,
.role::after {
    content: ' - ';
    color: #FF9E1B;
}

#announcementIcon {
    position: relative;
    background-color: #F6F9FF;
}

#sideNavBtn {
    background-color: #F6F9FF;
}

#announcementIcon span.badge {
    position: absolute;
    left: 25px;
    height: 15px;
}

.carousel-indicators li {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.badge-info {
    background-color: #FF9E1B;
}

/* support styles  */
#support {
    height: 100vh;
}

div.map + img {
    width: 10%;
}

div.map + img + p {
    font-size: 0.65rem;
    text-align: center;
    font-family: dana-fanum;
}

/* support styles end  */
/* components */
#samll-carousel .card {
    /*height: 258px;*/
    border-radius: 0.7rem;
    box-shadow: 1px 3px 5px 2px rgba(240, 240, 240, 1);
}

#samll-carousel .card-img-top {
    height: 145px;
    background-color: #00677F;
}

#samll-carousel .card .card-title {
    font-size: 11px !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

#samll-carousel .card .card-text {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    font-size: 10px;
    color: rgba(0, 103, 127, 0.75);
}

#samll-carousel .card .card-body {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding: 0.7rem !important;
}

#samll-carousel a {
    font-size: 12px;
}

hr {
    margin: 0.75rem;
}

.slide-container div {
    width: 145px;
}

/* components end */

#singlePost p {
    text-align: justify;
    text-align-last: right;
}

#singlePost h4::before {
    content: ' - ';
    color: #FF9E1B;
}

.brand-card {
    background-color: white;
    border-radius: 4px;
}
.brand-card.seen {
    background-color: #f8f9fa;
}


.brand-card h6 {
    font-size: 1rem;
}

.brand-card .no-gutters div:nth-child(2) div button:nth-child(1) {
    font-weight: bold;
}

input {
    border: 1px solid #00677F;
    border-radius: 3px;
    padding: 3px 6px;
}

input::placeholder {
    color: #03a6ca;
}


#station p:before,
#station p:after,
#profilecompletion p:after,
#profilecompletion p:before {
    content: ' - ';
    color: #FF9E1B;
}


.btn {
    outline: none !important;
    box-shadow: none !important;
}

.btn.btn-outline-warning i {
    color: #ffc107;
}

.btn.btn-outline-warning:active i,
.btn.btn-outline-warning:focus i {
    color: #000000;
}

.btn.btn-outline-primary i {
    color: #007bff;
}

.btn.btn-outline-primary:active i,
.btn.btn-outline-primary:focus i {
    color: #ffffff;
}

.btn.btn-outline-success i {
    color: #28a745;
}

.btn.btn-outline-success:active i,
.btn.btn-outline-success:focus i {
    color: #ffffff;
}

.jGrowl-closer {
    width: 95vw;
    font-size: 1.9em;
}

.jGrowl-notification {
    width: 95vw;
}

.jGrowl-notification .jGrowl-message {
    font-size: 25px;
}

.jGrowl-notification .jGrowl-header {
    font-size: 22px;
}

.jGrowl-notification .jGrowl-close {
    font-size: 50px;
}

#counter {
    border-bottom: 1px solid #FF9E1B !important;
}

#club, #profile {
    height: 100vh;
}

#profile span {
    font-size: 0.8rem;
}

.navBtnActive i, .navBtnActive div {
    color: #00677F !important;
    font-weight: bold;
}

.navBtnActive i {
    font-size: 20px;
}

#sideNav ul li a {
    text-decoration: none !important;
}

.card-input-element + .card {
    color: var(--primary);
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 2px solid var(--light);
    border-radius: 4px;
}

.card-input-element + .card:hover {
    cursor: pointer;
}

.card-input-element:checked + .card {
    background-color: white !important;
    color: var(--success) !important;
    -webkit-transition: background-color .7s;
    -o-transition: background-color .7s;
    transition: background-color .7s;
    border: 2px solid var(--success);
}

/* new input style */


.inp {
    position: relative;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}

.inp .label {
    position: absolute;
    top: 12px;
    left: 10px;
    color: #9098a9;
    transform-origin: 0 0;
    transition: all 0.2s ease;
}


.inp .border {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    width: 100%;
    background: #07f;
    transform: scaleX(0);
    transform-origin: 0 0;
    transition: all 0.15s ease;
}

.inp input {
    -webkit-appearance: none;
    width: 100%;
    padding: 12px 10px;
    height: 38px;
    border: 1px solid #ccc;
    background: none;
    border-radius: 0.5em;
    color: #223254;
    transition: all 0.15s ease;
}

.inp input:hover {
    background: rgba(34, 50, 84, 0.03);
}

.inp input:not(:placeholder-shown) ~ .label {
    color: #5a667f;
    transform: translateY(-23px) scale(0.9);
    background-color: white;
    padding: 0 5px;
    /*comment for test*/
}

html[dir='rtl'] .inp .label {
    direction: rtl !important;
    right: 10px !important;
    left: auto !important;
}

.inp .tokenfield + .label {
    color: #5a667f;
    transform: translateY(-23px) scale(0.9);
    background-color: white;
    padding: 0 5px;
}

.inp .tokenfield input {
    width: auto !important;
    padding-right: 5px;
    padding-left: 5px;
}

.inp .tokenfield {
    padding-top: 10px;
}

.inp input:focus {
    background: none;
    outline: none;
}

.inp input:focus ~ .label {
    color: #07f;
    transform: translateY(-23px) scale(0.9);
    background-color: white;
    padding: 0 5px;
}

.inp input:focus ~ .label + .border {
    transform: scaleX(1);
}

/*.validation-valid-label {*/
/*    display: none !important;*/
/*}*/


/* new select2 input template */
.inpSelect {
    position: relative;
    width: 100%;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

.inpSelect label {
    width: 100%;
}

.inpSelect .label {
    position: absolute;
    top: -12px;
    left: 10px !important;
    color: #5a667f;
    transform-origin: 0 0;
    transition: all 0.2s ease;
    background-color: white;
    padding: 0 5px;
    transform: scale(0.9);
}

.inpSelect.rtl .label {
    right: 10px !important;
    left: auto !important;
}

.inpSelect .border {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 2px;
    width: 100%;
    background: #07f;
    transform: scaleX(0);
    transform-origin: 0 0;
    transition: all 0.15s ease;
}

.inpSelect input:hover {
    background: rgba(34, 50, 84, 0.03);
}

.inpSelect input:not(:placeholder-shown) ~ .label {
    color: #5a667f;
    transform: translateY(-23px) scale(0.9);
    background-color: white;
    padding: 0 5px;
    /*comment for test*/
}

.inpSelect .tokenfield + .label {
    color: #5a667f;
    transform: translateY(-23px) scale(0.9);
    background-color: white;
    padding: 0 5px;
}

.inpSelect .tokenfield input {
    width: auto !important;
    padding-right: 5px;
    padding-left: 5px;
}

.inpSelect .tokenfield {
    padding-top: 10px;
}

.inpSelect input:focus {
    background: none;
    outline: none;
}

.inpSelect input:focus ~ .label {
    color: #07f;
    transform: translateY(-23px) scale(0.9);
    background-color: white;
    padding: 0 5px;
}

.inpSelect input:focus ~ .label + .border {
    transform: scaleX(1);
}

.ltr {
    direction: ltr;
}

.rtl {
    text-align: right;
    direction: rtl;
}
ul{
    padding-right:0px;
}

.bg-primary {
    background-color: #00677f !important;
}

.flex_center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.text-primary {
    color: #00677f !important;
}

.border-primary {
    border-color: #00677f !important;
}

#announcement .card-text {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

#announcement p {
    font-size: 0.9rem
}

#announcement h6 {
    font-size: 0.7rem;
}

/*map animation*/
#support p {
    font-size: 0.9rem;
}

#announcement a {
    color: #00677f !important;
}

/*map animation end*/
.homeIcon:hover {
    text-decoration: none;
    opacity: 0.7;
}

.card:hover {
    text-decoration: none;
    border: 1px solid grey;
}

.card img {
    border-top-left-radius: 0.7rem;
    border-top-right-radius: 0.7rem;
}

.card-filter {
    font-size: 14px;
}

main {

}

.select2-container {
    width: 100% !important;
}
.validation-error-label {
    color: red!important;
}
html[dir='rtl'] .modal-header .close{
    margin: 0!important;
    padding: 0!important;
    font-size:3rem;
}
.modal-header .close{
    margin: 0!important;
    padding: 0!important;
    font-size:3rem;
}

/* Start CKEditor */

/*
 * CKEditor 5 (v23.1.0) content styles.
 * Generated on Thu, 29 Oct 2020 12:17:48 GMT.
 * For more information, check out https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/content-styles.html
 */

:root {
    --ck-color-mention-background: hsla(341, 100%, 30%, 0.1);
    --ck-color-mention-text: hsl(341, 100%, 30%);
    --ck-highlight-marker-blue: hsl(201, 97%, 72%);
    --ck-highlight-marker-green: hsl(120, 93%, 68%);
    --ck-highlight-marker-pink: hsl(345, 96%, 73%);
    --ck-highlight-marker-yellow: hsl(60, 97%, 73%);
    --ck-highlight-pen-green: hsl(112, 100%, 27%);
    --ck-highlight-pen-red: hsl(0, 85%, 49%);
    --ck-image-style-spacing: 1.5em;
    --ck-todo-list-checkmark-size: 16px;
    /* Overrides the border radius setting in the theme. */
    --ck-border-radius: 4px;

    /* Overrides the default font size in the theme. */
    --ck-font-size-base: 14px;

    /* Helper variables to avoid duplication in the colors. */
    --ck-custom-background: hsl(270, 1%, 29%);
    --ck-custom-foreground: hsl(255, 3%, 18%);
    --ck-custom-border: hsl(300, 1%, 22%);
    --ck-custom-white: hsl(0, 0%, 100%);

    /* -- Overrides generic colors. ------------------------------------------------------------- */

    --ck-color-base-foreground: var(--ck-custom-background);
    --ck-color-focus-border: hsl(208, 90%, 62%);
    --ck-color-text: hsl(0, 0%, 98%);
    --ck-color-shadow-drop: hsla(0, 0%, 0%, 0.2);
    --ck-color-shadow-inner: hsla(0, 0%, 0%, 0.1);

    /* -- Overrides the default .ck-button class colors. ---------------------------------------- */

    --ck-color-button-default-background: var(--ck-custom-background);
    --ck-color-button-default-hover-background: hsl(270, 1%, 22%);
    --ck-color-button-default-active-background: hsl(270, 2%, 20%);
    --ck-color-button-default-active-shadow: hsl(270, 2%, 23%);
    --ck-color-button-default-disabled-background: var(--ck-custom-background);

    --ck-color-button-on-background: var(--ck-custom-foreground);
    --ck-color-button-on-hover-background: hsl(255, 4%, 16%);
    --ck-color-button-on-active-background: hsl(255, 4%, 14%);
    --ck-color-button-on-active-shadow: hsl(240, 3%, 19%);
    --ck-color-button-on-disabled-background: var(--ck-custom-foreground);

    --ck-color-button-action-background: hsl(168, 76%, 42%);
    --ck-color-button-action-hover-background: hsl(168, 76%, 38%);
    --ck-color-button-action-active-background: hsl(168, 76%, 36%);
    --ck-color-button-action-active-shadow: hsl(168, 75%, 34%);
    --ck-color-button-action-disabled-background: hsl(168, 76%, 42%);
    --ck-color-button-action-text: var(--ck-custom-white);

    --ck-color-button-save: hsl(120, 100%, 46%);
    --ck-color-button-cancel: hsl(15, 100%, 56%);

    /* -- Overrides the default .ck-dropdown class colors. -------------------------------------- */

    --ck-color-dropdown-panel-background: var(--ck-custom-background);
    --ck-color-dropdown-panel-border: var(--ck-custom-foreground);

    /* -- Overrides the default .ck-splitbutton class colors. ----------------------------------- */

    --ck-color-split-button-hover-background: var(--ck-color-button-default-hover-background);
    --ck-color-split-button-hover-border: var(--ck-custom-foreground);

    /* -- Overrides the default .ck-input class colors. ----------------------------------------- */

    --ck-color-input-background: var(--ck-custom-foreground);
    --ck-color-input-border: hsl(257, 3%, 43%);
    --ck-color-input-text: hsl(0, 0%, 98%);
    --ck-color-input-disabled-background: hsl(255, 4%, 21%);
    --ck-color-input-disabled-border: hsl(250, 3%, 38%);
    --ck-color-input-disabled-text: hsl(0, 0%, 46%);

    /* -- Overrides the default .ck-list class colors. ------------------------------------------ */

    --ck-color-list-background: var(--ck-custom-background);
    --ck-color-list-button-hover-background: var(--ck-color-base-foreground);
    --ck-color-list-button-on-background: var(--ck-color-base-active);
    --ck-color-list-button-on-background-focus: var(--ck-color-base-active-focus);
    --ck-color-list-button-on-text: var(--ck-color-base-background);

    /* -- Overrides the default .ck-balloon-panel class colors. --------------------------------- */

    --ck-color-panel-background: var(--ck-custom-background);
    --ck-color-panel-border: var(--ck-custom-border);

    /* -- Overrides the default .ck-toolbar class colors. --------------------------------------- */

    --ck-color-toolbar-background: var(--ck-custom-background);
    --ck-color-toolbar-border: var(--ck-custom-border);

    /* -- Overrides the default .ck-tooltip class colors. --------------------------------------- */

    --ck-color-tooltip-background: hsl(252, 7%, 14%);
    --ck-color-tooltip-text: hsl(0, 0%, 93%);

    /* -- Overrides the default colors used by the ckeditor5-image package. --------------------- */

    --ck-color-image-caption-background: hsl(0, 0%, 97%);
    --ck-color-image-caption-text: hsl(0, 0%, 20%);

    /* -- Overrides the default colors used by the ckeditor5-widget package. -------------------- */

    --ck-color-widget-blurred-border: hsl(0, 0%, 87%);
    --ck-color-widget-hover-border: hsl(43, 100%, 68%);
    --ck-color-widget-editable-focus-background: var(--ck-custom-white);

    /* -- Overrides the default colors used by the ckeditor5-link package. ---------------------- */

    --ck-color-link-default: hsl(190, 100%, 75%);
}

/* ckeditor5-image/theme/imagestyle.css */
.ck-content .image-style-side {
    float: right;
    margin-left: var(--ck-image-style-spacing);
    max-width: 50%;
}
/* ckeditor5-image/theme/imagestyle.css */
.ck-content .image-style-align-left {
    float: left;
    margin-right: var(--ck-image-style-spacing);
}
/* ckeditor5-image/theme/imagestyle.css */
.ck-content .image-style-align-center {
    margin-left: auto;
    margin-right: auto;
}
/* ckeditor5-image/theme/imagestyle.css */
.ck-content .image-style-align-right {
    float: right;
    margin-left: var(--ck-image-style-spacing);
}
/* ckeditor5-image/theme/image.css */
.ck-content .image {
    display: table;
    clear: both;
    text-align: center;
    margin: 1em auto;
}
/* ckeditor5-image/theme/image.css */
.ck-content .image img {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    min-width: 50px;
}
/* ckeditor5-image/theme/imagecaption.css */
.ck-content .image > figcaption {
    display: table-caption;
    caption-side: bottom;
    word-break: break-word;
    color: hsl(0, 0%, 20%);
    background-color: hsl(0, 0%, 97%);
    padding: .6em;
    font-size: .75em;
    outline-offset: -1px;
}
/* ckeditor5-image/theme/imageresize.css */
.ck-content .image.image_resized {
    max-width: 100%;
    display: block;
    box-sizing: border-box;
}
/* ckeditor5-image/theme/imageresize.css */
.ck-content .image.image_resized img {
    width: 100%;
}
/* ckeditor5-image/theme/imageresize.css */
.ck-content .image.image_resized > figcaption {
    display: block;
}
/* ckeditor5-highlight/theme/highlight.css */
.ck-content .marker-yellow {
    background-color: var(--ck-highlight-marker-yellow);
}
/* ckeditor5-highlight/theme/highlight.css */
.ck-content .marker-green {
    background-color: var(--ck-highlight-marker-green);
}
/* ckeditor5-highlight/theme/highlight.css */
.ck-content .marker-pink {
    background-color: var(--ck-highlight-marker-pink);
}
/* ckeditor5-highlight/theme/highlight.css */
.ck-content .marker-blue {
    background-color: var(--ck-highlight-marker-blue);
}
/* ckeditor5-highlight/theme/highlight.css */
.ck-content .pen-red {
    color: var(--ck-highlight-pen-red);
    background-color: transparent;
}
/* ckeditor5-highlight/theme/highlight.css */
.ck-content .pen-green {
    color: var(--ck-highlight-pen-green);
    background-color: transparent;
}
/* ckeditor5-font/theme/fontsize.css */
.ck-content .text-tiny {
    font-size: .7em;
}
/* ckeditor5-font/theme/fontsize.css */
.ck-content .text-small {
    font-size: .85em;
}
/* ckeditor5-font/theme/fontsize.css */
.ck-content .text-big {
    font-size: 1.4em;
}
/* ckeditor5-font/theme/fontsize.css */
.ck-content .text-huge {
    font-size: 1.8em;
}
/* ckeditor5-block-quote/theme/blockquote.css */
.ck-content blockquote {
    overflow: hidden;
    padding-right: 1.5em;
    padding-left: 1.5em;
    margin-left: 0;
    margin-right: 0;
    font-style: italic;
    border-left: solid 5px hsl(0, 0%, 80%);
}
/* ckeditor5-block-quote/theme/blockquote.css */
.ck-content[dir="rtl"] blockquote {
    border-left: 0;
    border-right: solid 5px hsl(0, 0%, 80%);
}
/* ckeditor5-basic-styles/theme/code.css */
.ck-content code {
    background-color: hsla(0, 0%, 78%, 0.3);
    padding: .15em;
    border-radius: 2px;
}
/* ckeditor5-table/theme/table.css */
.ck-content .table {
    margin: 1em auto;
    display: table;
}
/* ckeditor5-table/theme/table.css */
.ck-content .table table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    height: 100%;
    border: 1px double hsl(0, 0%, 70%);
}
/* ckeditor5-table/theme/table.css */
.ck-content .table table td,
.ck-content .table table th {
    min-width: 2em;
    padding: .4em;
    border: 1px solid hsl(0, 0%, 75%);
}
/* ckeditor5-table/theme/table.css */
.ck-content .table table th {
    font-weight: bold;
    background: hsla(0, 0%, 0%, 5%);
}
/* ckeditor5-table/theme/table.css */
.ck-content[dir="rtl"] .table th {
    text-align: right;
}
/* ckeditor5-table/theme/table.css */
.ck-content[dir="ltr"] .table th {
    text-align: left;
}
/* ckeditor5-page-break/theme/pagebreak.css */
.ck-content .page-break {
    position: relative;
    clear: both;
    padding: 5px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* ckeditor5-page-break/theme/pagebreak.css */
.ck-content .page-break::after {
    content: '';
    position: absolute;
    border-bottom: 2px dashed hsl(0, 0%, 77%);
    width: 100%;
}
/* ckeditor5-page-break/theme/pagebreak.css */
.ck-content .page-break__label {
    position: relative;
    z-index: 1;
    padding: .3em .6em;
    display: block;
    text-transform: uppercase;
    border: 1px solid hsl(0, 0%, 77%);
    border-radius: 2px;
    font-family: Helvetica, Arial, Tahoma, Verdana, Sans-Serif;
    font-size: 0.75em;
    font-weight: bold;
    color: hsl(0, 0%, 20%);
    background: hsl(0, 0%, 100%);
    box-shadow: 2px 2px 1px hsla(0, 0%, 0%, 0.15);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* ckeditor5-list/theme/todolist.css */
.ck-content .todo-list {
    list-style: none;
}
/* ckeditor5-list/theme/todolist.css */
.ck-content .todo-list li {
    margin-bottom: 5px;
}
/* ckeditor5-list/theme/todolist.css */
.ck-content .todo-list li .todo-list {
    margin-top: 5px;
}
/* ckeditor5-list/theme/todolist.css */
.ck-content .todo-list .todo-list__label > input {
    -webkit-appearance: none;
    display: inline-block;
    position: relative;
    width: var(--ck-todo-list-checkmark-size);
    height: var(--ck-todo-list-checkmark-size);
    vertical-align: middle;
    border: 0;
    left: -25px;
    margin-right: -15px;
    right: 0;
    margin-left: 0;
}
/* ckeditor5-list/theme/todolist.css */
.ck-content .todo-list .todo-list__label > input::before {
    display: block;
    position: absolute;
    box-sizing: border-box;
    content: '';
    width: 100%;
    height: 100%;
    border: 1px solid hsl(0, 0%, 20%);
    border-radius: 2px;
    transition: 250ms ease-in-out box-shadow, 250ms ease-in-out background, 250ms ease-in-out border;
}
/* ckeditor5-list/theme/todolist.css */
.ck-content .todo-list .todo-list__label > input::after {
    display: block;
    position: absolute;
    box-sizing: content-box;
    pointer-events: none;
    content: '';
    left: calc( var(--ck-todo-list-checkmark-size) / 3 );
    top: calc( var(--ck-todo-list-checkmark-size) / 5.3 );
    width: calc( var(--ck-todo-list-checkmark-size) / 5.3 );
    height: calc( var(--ck-todo-list-checkmark-size) / 2.6 );
    border-style: solid;
    border-color: transparent;
    border-width: 0 calc( var(--ck-todo-list-checkmark-size) / 8 ) calc( var(--ck-todo-list-checkmark-size) / 8 ) 0;
    transform: rotate(45deg);
}
/* ckeditor5-list/theme/todolist.css */
.ck-content .todo-list .todo-list__label > input[checked]::before {
    background: hsl(126, 64%, 41%);
    border-color: hsl(126, 64%, 41%);
}
/* ckeditor5-list/theme/todolist.css */
.ck-content .todo-list .todo-list__label > input[checked]::after {
    border-color: hsl(0, 0%, 100%);
}
/* ckeditor5-list/theme/todolist.css */
.ck-content .todo-list .todo-list__label .todo-list__label__description {
    vertical-align: middle;
}
/* ckeditor5-media-embed/theme/mediaembed.css */
.ck-content .media {
    clear: both;
    margin: 1em 0;
    display: block;
    min-width: 15em;
}
/* ckeditor5-html-embed/theme/htmlembed.css */
.ck-content .raw-html-embed {
    margin: 1em auto;
    min-width: 15em;
}
/* ckeditor5-horizontal-line/theme/horizontalline.css */
.ck-content hr {
    margin: 15px 0;
    height: 4px;
    background: hsl(0, 0%, 87%);
    border: 0;
}
/* ckeditor5-code-block/theme/codeblock.css */
.ck-content pre {
    padding: 1em;
    color: hsl(0, 0%, 20.8%);
    background: hsla(0, 0%, 78%, 0.3);
    border: 1px solid hsl(0, 0%, 77%);
    border-radius: 2px;
    text-align: left;
    direction: ltr;
    tab-size: 4;
    white-space: pre-wrap;
    font-style: normal;
    min-width: 200px;
}
/* ckeditor5-code-block/theme/codeblock.css */
.ck-content pre code {
    background: unset;
    padding: 0;
    border-radius: 0;
}
/* ckeditor5-mention/theme/mention.css */
.ck-content .mention {
    background: var(--ck-color-mention-background);
    color: var(--ck-color-mention-text);
}
@media print {
    /* ckeditor5-page-break/theme/pagebreak.css */
    .ck-content .page-break {
        padding: 0;
    }
    /* ckeditor5-page-break/theme/pagebreak.css */
    .ck-content .page-break::after {
        display: none;
    }
}

/* End CKEditor */