@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap');

:root {
    --space: 8px;
    --border: #d5e3ec;
    --background: #f7fafb;
    --color:#2271e0;
}
a{
    color: var(--color);
    text-decoration: none;
}
a{
    color: var(--color);
    text-decoration: none;
}
html,body{
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
    height: 100%;
    font-family: 'Roboto', sans-serif;
    background-color: #F7FAFB;
}
* {
    box-sizing: border-box;
}
.fa-space-before-1x{
    padding-right: 10px;
}
.fa-space-after-1x{
    padding-left: 10px;
}
.button{
    outline: none;
    margin: 10px;
    padding: 10px;
    color: white;
    background-color: var(--color);
    font-family: 'Roboto', sans-serif;
    border: none;
    cursor: pointer;
}
.content-button {
    outline: none;
    user-select: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color .25s ease;
    font-size: 13px;
    border-radius: 3px;
    padding-top: 5px;
    padding-right: 10px;
    padding-bottom: 5px;
    padding-left: 10px;
    text-align: center;
    color: #edf6fd;
    background-color: #4163EA;
    border: 1px solid transparent;
}
.button-primary{
    background: rgb(29, 94, 191);
}
.button-second{
    background: rgb(71, 71, 71);
}
.menu-button{
    align-items: center;
    margin: 0 10px;
    width: 55px;
    justify-content: center;
    z-index: 0;
}
.menu-button{
    display: none;
}
.menu-button .menu-button-inner{
    transition: .3s;
    height: 2px;
    background: #fff;
    width: 25px;
    position: relative;
}
.menu-button .menu-button-inner:before{
    top: -6px;
}
.menu-button .menu-button-inner:before, .menu-button .menu-button-inner:after{
    transition: inherit;
    content: '';
    width: 25px;
    height: 2px;
    background: inherit;
    position: absolute;
    left: 0;
}
.menu-button .menu-button-inner:after{
    bottom: -6px;
}
.menu-button:hover .menu-button-inner{
    background: var(--color);
}
.menu-button .menu-button-inner.menu-is-active:before{
    transform: rotate(45deg);
    transform-origin: top left;
    left: -8px;
    top: -9px;
}
.menu-button .menu-button-inner.menu-is-active{
    width: 0;
}
.menu-button .menu-button-inner.menu-is-active:after{
    transform: rotate(-45deg);
    transform-origin: bottom left;
    left: -8px;
    bottom: -8px;
}
/*header*/
.large-header{
    background: #232833;
}
.content-button-header .button
{
    display: flex;
    align-items: center;
    font-size: 15px;
    height: 55px;
    padding: 0 21px 0 21px;
}
.under-header{
    background: rgb(40 44 57);
    box-shadow: 0 1px 0 rgba(255,255,255,.04);
}
.in-header{
    display: inline-flex;
    width: 100%;
}
.search-bar{
    display: flex;
    justify-items: center;
    flex: 1;
    z-index: 1;
}

.wrapper {
    position: relative;
    display: flex;
    width: 100%;
    align-items: center;
    padding: 0 10px;
    height: 75px;
}
.search-bar-logo{
    font-size: 25px;
    color: white;
    width: 10px;
}
.logo{
    width: 100%;
    max-width: 200px;
    border-right: 1px solid #2d303b;
}
.button-search span{
    display: none;
}
.search-bar{
    border-right: 1px solid #2d303b;
}
.content-button-header{
    border-right: 1px solid #2d303b;
}
.content-button-header:last-child{
    border-right:none;
}
.search{
    border: none;
    border-radius: 5px;
    height: 55px;
    width:100%;
    color: white!important;
    padding: 2px 23px 2px 50px;
    outline: 0;
    font-size: 20px;
    background-color: transparent!important;
    margin:  10px 0;
}
.search::placeholder{
    color: white;
}
.search-icon {
    position: absolute;
    top: 8px;
    left: 8px;
    width: 14px;
}
.input-bar-logo{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.search:hover, .search:focus {
    background-color: white;

}
.search:focus{
    box-shadow: 0 0 15px rgba(0, 0, 0, .1) inset;
}
.logo img{
    height: 40px;
    width: auto;
    margin: 0 5px ;
}
.other-side{
    display: inline-flex;
    justify-items: center;
    margin: auto;
}

.in-under-header{
    height: 60px;
    justify-items: center;
    margin: auto;
}
.in-under-header ul{
    list-style: none;
    margin: 0;
    height: 100%;
    font-family: 'Roboto', sans-serif;
    padding: 0;
}
.in-under-header ul li{
    height: 100%;
    display: inline-block;
    border-right: 1px solid #2d303b;
}
.in-under-header ul li a {
    padding: 0 20px;
    align-self: center;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    color: white;
    position: relative;
}
.in-under-header ul li a:after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 0;
    height: 5px;
    transition: .3s;
    background: var(--color);
    left: 50%;
    z-index: 1;
    transform: translateX(-50%);
}
.in-under-header ul li a:hover:after{
    width: 100%;
}

/*main*/
main{
    height: auto;
    margin-bottom: auto;
}
.block-with-border{
    background: #FFFFFF;
    border: 1px solid #D5E3EC;
    box-shadow: 0 2px 4px rgba(228, 237, 244, 0.8);
    margin-bottom: 10px;
    padding: 10px;
}
.block-header {
    padding: 6px 10px;
    margin: 0;
    font-weight: 400;
    text-decoration: none;
    font-size: 20px;
    border-bottom: 1px solid #dfdfdf;
}
.p-main{
    max-width: 1400px;
    margin: 0 auto;
}
main .p-title-pageAction {
    margin-bottom: 5px;
}
.p-title-pageAction .button{
    font-size: 13px;
    border-radius: 5px ;
}
.menuTrigger:after {
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 400;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f0d7";
    width: 1.2em;
    display: inline-block;
    text-align: center;
    font-weight: 900;
    unicode-bidi: isolate;
}
main .p-title-value {
    padding: 0;
    font-weight: 400;
    min-width: 0;
    margin-right: auto;
    margin-top: 0;
}
main .p-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    max-width: 100%;
    margin-bottom: -5px;
}
.button-menu{
    position: absolute;
    display: none;
    opacity: 0;
    -webkit-transition: all .25s ease, -xf-opacity .25s ease;
    transition: all .25s ease, -xf-opacity .25s ease;
    z-index: 200;
    margin: 8px 0 0;
    min-width: 240px;
    max-width: 320px;
    border-radius: 2px;
    box-shadow: 0 5px 10px 0 rgba(0,0,0,0.35);
}

.menu-arrow {
    position: absolute;
    width: 0;
    height: 0;
    top: -8px;
    left: 50%;
    margin-left: -8px;
    border: 8px solid transparent;
    border-top-width: 0;
    border-bottom-color: #f7f8f9;
}
.button-menu-inner{
    background-color: white;
}
.button-menu h3{
    padding: 10px 24px;
    margin: 0;
    font-weight: 400;
    text-decoration: none;
    font-size: 17px;
    color: var(--color);
    background: #f7f8f9;
    border-bottom: 1px solid #e0e0e0;
    background: linear-gradient(0deg, #f7f8f9, #fbfcfc);
}
.button-menu .menu-item a{
    padding: 10px 24px;
    display: flex;
    color: black;
}
.button-menu.menu-is-open{
    display: block;
    opacity: 1;
}
/*form*/
.content-form{
    box-shadow: 0 0 4px rgba(228, 237, 244, 0.8);
    background: #FFFFFF;
    border: 1px solid #D5E3EC;
    margin: 10px 0;
}
.form-header h2{
    padding: 10px;
    background: #fdfdfd;
    margin: 0;
}
.form-header{
    border-bottom: 1px solid #D5E3EC;
    box-shadow: 0 4px 2px -2px rgba(228, 237, 244, 0.8);
}
.p-form label {
    display: inline-block;
    margin-bottom: .5rem;
}
.input-editor-new{
    margin: 0;
    padding: 0;
}
.input-editor-new .base-style-editor{
    font-weight: normal;
}
.form-action{
    padding: 10px;
}
input[type=file].content-input {
    opacity: 0!important;
    cursor: pointer;
}
.fa-input-right{
    padding: .375rem 1.50rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    outline: none;
    background-color: #eae9e9;
    background-clip: padding-box;
    border: none;
    transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out;
    display: flex;
    align-items: center;
}
.input{
    display: none;
}
.p-new-input + .p-new-input {
    margin-top: 20px;

}
.p-new-input.str{
    height: 60px;
}
.p-new-input.txt{
    min-height: auto;
    height: auto;
    padding: 0;
    width: 100%!important;
    margin-right: 0;
    padding-top: 23px;
    padding-bottom: 20px;
}
.p-new-input textarea {
    position: relative;
    padding-top: 0;
    overflow: hidden;
}
.p-new-input {
    width: 100%;
    position: relative;
    box-shadow: 0 0 3px rgba(228, 237, 244, 0.8);
    background: #fdfdfd;
    border: 1px solid #D5E3EC;
    margin: 0;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    outline: none;
}
.p-new-input .p-new-label {
    top: 0;
    opacity: .4;
    transition: .15s;
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
    padding-top: 23px;
    font-weight: 400;
}
.p-new-input.input-active .p-new-label {
    opacity: .7;
    font-size: 10px;
    padding-top: 8px ;
}
.p-new-input > * {
    padding-left: 60px;
}
.content-attachment{
    display: flex;
    border-top: 1px solid #D5E3EC;
    padding: 10px;
    align-items: center;
}
.list-img-upload{
    padding-left: 0!important;
}
.attachment-name{
    flex: 1;
}
.attachment-img{
    width: 50px;
}
.attachment-img img{
    max-width: 50px;
    max-height: 50px;
}
.attachment-name{
    padding-left: 10px;
}
.input-div  .p-new-input{
    box-shadow: none;
    background: none;
    border: none;
}
.input-active .content-input {
    opacity: 1;
}
.input-focus:before {
    color: var(--color);
}
.p-form-img{
    width: 10px;
    border-radius: 50%;
}
.content-input {
    font-size: inherit;
    z-index: 10;
    position: absolute;
    top: 0;
    left: 0;
    padding-top: 2px;
    height: 100%;
    width: 100%;
    border: none;
    background: 0 0;
    font-family: 'Roboto', sans-serif;
    outline: none;
    opacity: .4;
}
.form-button-right{
    float: right;
    display: flex;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 11;
}
.content-input-inner .content-input {
    padding-left: 60px;
    padding-right: 60px;
}
.first-focus .button-inc:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f067";
    display: inline-block;
    width: 1.88em;
}
.first-focus .spinner-button{
    display: block;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    outline: none;
    background-color: #eae9e9;
    background-clip: padding-box;
    border: none;
    transition: background-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.first-focus .spinner-button:focus{
    background-color: var(--color);
    color: white;
}



.p-new-input .p-new-input-choice{
    padding-left: 48px;
}
.p-new-radio{
    position: relative;
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    margin-top: 20px;
    font-weight: initial;
}
.p-new-radio-iconic > input {
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0 0 0 0);
    overflow: hidden;
    position: absolute;
    left: 0;
    width: auto;
    height: auto;
    opacity: 0;
}

.p-new-radio li{
    flex: 1;
    position: relative;
    max-width: 7rem;
}
.p-new-radio-iconic{
    width: 100%;
    display: flex;
    align-items: center;
}
.p-new-radio-iconic .iconic-label{
    padding-left: 10px;
}
.p-new-radio-iconic > input[type=radio]+i:before{
    content: "\f111";
    width: 1em;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.p-new-radio-iconic > input + i:before, .p-new-radio-iconic > input + i:after {
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 1;
    color: rgb(29, 94, 191);
    transition: opacity 0.3s;
}
.p-new-radio-iconic > input[type=radio] + i:after{
    content: "\f058";
    width: 1em;
    display: flex;
    align-items: center;
    border-radius: 50%;
}
.p-new-radio-iconic > input + i:after {
    opacity: 0;
}
.p-new-radio-iconic > input:checked + i:after {
    opacity: 1;
}
.p-new-radio-iconic > input:checked + i:before {
    opacity: 0;
}
.p-new-radio > .p-new-radio-choice .p-new-radio-iconic {
    position: static;
}
.p-new-radio {
    display: inline-block;
    position: relative;
}
.p-new-radio > .p-new-radio-choice {
    margin-bottom: 6px;
    padding-left: 1.5em;
}




.first-focus .button-dec:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f068";
    display: inline-block;
    width: 1.88em;
}
.p-new-input:before {
    width: 60px;
    line-height: 60px;
    text-align: center;
    font-size: 18px;
    position: absolute;
    transition: background-color 0.3s;
    top: 0;
    left: 0;
    height: 100%;
    font-family: 'font awesome 5 pro';
}
.hr-new-form{
    box-shadow: 0 0 4px rgba(228, 237, 244, 0.8);
    border: 1px solid #D5E3EC;
}
.p-new-submit{
    text-align: center;
}
.input-date .datepicker{
    padding-left: 60px;
}
.input-date .inputDate-icon::before {
    content: "\f133";
    display: inline-block;
    width: .88em;
}

.input-date .inputDate-icon {
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 400;
    text-rendering: auto;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    line-height: .75em;
    vertical-align: -15%;
    cursor: pointer;
    width: 45px;
    justify-content: center;
    z-index: 11;
    background-color: #eae9e9;
    padding: 0 30px;
}
.more-info-form {
    text-align: center;
    padding: 10px;
}
.block-form-other{
    box-shadow: 0 0 60px 0 rgba(71,74,182,0.12);
    border-radius: 10px;
    background-color: white;
}
textarea {
    resize: none;
    width: 99%;
}
.block-form-other .input {
    font-size: 13px;
    color: #141414;
    background: #f7faff;;
    border: 1px solid #cbcbcb;
    border-bottom-color: #dfdfdf;
    border-radius: 4px;
    padding: 6px;
    display: block;
    width: 100%;
    transition: all 0.25s ease;
}
.block-form-other .input:focus{
    background-color:#ffffff ;
}
.block-form-other .form--input {
    display: table;
    table-layout: fixed;
    width: 100%;
    margin: 0;
}
.block-form-other .form--input dt{
    border-right: 1px solid #dfdfdf;
    background: #f7fafd;
    width: 33%;
    padding: 15px 12px 15px 12px;
    display: table-cell;
    text-align: end;
}
.block-form-other .form--input dd{
    margin: 0;
    text-align: initial;
    margin-left: 10px;
}
.block-form-other .form-hint{
    display: block;
    font-style: normal;
    font-size: 12px;
    color: #8c8c8c;
}
.block-form-other .form--input dd{
    padding: 10px 10px 10px 0;
}
.block-form-other .form--input.label-absent{
    border-top: solid 1px #dfdfdf;
}
.block-form-other .block-form .form--input.first{
    border-top: solid 1px #dfdfdf;
}
.block-form-other .formSubmitRow-main {
    text-align: left!important;
}

.block-form-other .formSubmitRow-controls {
    position: relative;
    padding-left: 33%;
    margin-left: 10px;
    margin-right: 10px;
}
.input-checkbox{
    list-style: none;
    padding: 0;
    margin: 0;
}
.input-checkbox-content{
    position: relative;
}
.input-checkbox [type="checkbox"]:not(:checked),.input-checkbox [type="checkbox"]:checked {
    position: absolute;
    left: 0;
    opacity: 0.01;
}
.input-checkbox [type="checkbox"]:not(:checked) + .input-checkbox-check,.input-checkbox [type="checkbox"]:checked + .input-checkbox-check {
    position: relative;
    padding-left: 1.3em;
    font-size: 1.05em;
    line-height: 1.7;
    cursor: pointer;
}

.input-checkbox-check:before{
    content: "\f0c8";
    display: inline-block;
    text-align: center;
}

.input-checkbox-check:before, .input-checkbox-check:after{
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
    left: 0;
    opacity: 1;
    width: 100%;
    color: var(--color);
}
.input-checkbox-check:after {
    content: "\f14a";
    display: inline-block;
    text-align: center;
    opacity: 0;
}
.input-checkbox-input[type=checkbox]:checked + .input-checkbox-check:after {
    opacity: 1;
}
.input-checkbox-input[type=checkbox]:checked + .input-checkbox-check:before {
    opacity: 0;
}
.input{
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    outline: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.input:focus{
    border-color: #4163EA;
    box-shadow: 0 0 0 2px rgba(65, 99, 234, 0.57);
}

.block-form form{
    background-color: white;
    border: 1px solid #D5E3EC;
    box-sizing: border-box;
    box-shadow: 0 2px 4px rgba(228, 237, 244, 0.8);
    border-radius: 5px;

}
.forum-connexion form{
    border: none;
}
.block-form form .p-form{
    margin: 10px;
}
.hr-form{
    margin: -1px 10px 0;
    border: none;
    border-top: 1px solid #d8d8d8;
}
.block-form form .p-submit{
    background: #F7FAFD;
    text-align: center;
    padding: 10px;
    border-top: 1px solid #D5E3EC;
}
.custom-checkbox {
    position: relative;
    display: block;
    min-height: 1.5rem;
    padding-left: 1.5rem;
}
.block-delete {
    background-color: white;
    color: #141414;
    border-width: 1px;
    border-style: solid;
    border-top-color: #dfdfdf;
    border-right-color: #d8d8d8;
    border-bottom-color: #cbcbcb;
    border-left-color: #d8d8d8;
    border-radius: 4px;
}
.block-delete .block-text {
    border-radius: 12px;
    text-align: center;
    padding: 15px 10px;
}
.formSubmitRow-main{
    background: #F7FAFD;
    text-align: center;
    padding: 10px;
    border-top: 1px solid #D5E3EC;
}
input[type=checkbox], input[type=radio] {
    box-sizing: border-box;
    padding: 0;
}
.number-bock {
    display: flex;
}

.number-bock .input-number {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    min-width: 149px;
    max-width: 150px;
    text-align: right;
}

.number-bock .input-number::-webkit-inner-spin-button,
.number-bock .input-number::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.number-bock #inc:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f067";
    display: inline-block;
    width: 1.88em;
}
.number-bock .spinner-button{
    display: block;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    outline: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;border-left: none;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.number-bock .spinner-button:focus{
    border-color: #4163EA;
    box-shadow: 0 0 0 2px rgba(65, 99, 234, 0.57);
}
.number-bock #dec:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f068";
    display: inline-block;
    width: 1.88em;
}
.checkBox-custom-input {
    position: absolute;
    z-index: -1;
    opacity: 0;
}
.checkBox-custom-label {
    margin-bottom: 0;
}
.custom-checkbox .checkBox-custom-input:checked~.checkBox-custom-label::before {
    background-color: #007bff;
}
.checkBox-custom-input:checked~.checkBox-custom-label::before {
    color: #fff;
    background-color: #007bff;
}
.custom-checkbox .checkBox-custom-label::before {
    border-radius: 5px;
}
.checkBox-custom-label::before {
    position: absolute;
    top: .25rem;
    left: 0;
    display: block;
    width: 1rem;
    height: 1rem;
    pointer-events: none;
    content: "";
    user-select: none;
    background-color: #dee2e6;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.custom-checkbox .checkBox-custom-input:checked~.checkBox-custom-label::after {
    content: "\f00c";
    color: white;
    font-size: 10px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    font-weight: bold;
    margin-top: 4px;
    display: flex;
    align-items: center;
    justify-content: center;

}
.checkBox-custom-label::after {
    font-family: 'Font Awesome 5 Pro';
    position: absolute;
    top: .25rem;
    left: 0;
    display: block;
    width: 1rem;
    height: 1rem;
    content: "";
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%;
}
.checkBox-custom-input:focus + .checkBox-custom-label::after{
    border-color: #4163EA;
    box-shadow: 0 0 0 2px rgba(65, 99, 234, 0.57);
    border-radius: 5px;
}
.block-form form .custom-form-multiple{
    display: flex;
    margin: 0;
    border-top: 1px solid #D5E3EC;
}
.block-form form .p-multiple-label{
    width: 25%;
    background: #F7FAFD;
    text-align: end;
    border-right: 1px solid #D5E3EC;
}
.block-form form .p-custom-multiple{
    padding: 10px;
}
.block-form .form--input dt {
    border-right: 1px solid #dfdfdf;
    background: #f5f5f5;
    width: 33%;
    padding: 15px 12px 15px 12px;
    display: table-cell;
    text-align: end;
}
.block-form .form--input dd {
    padding: 10px 10px 10px 0;
    margin-left: 10px;
}
.block-form .form--input {
    display: table;
    table-layout: fixed;
    width: 100%;
    border: 2px solid rgb(235,239,243);
    border-radius: 12px;
    overflow: hidden;
    margin: 10px 0;
}
.inputGroup{
    display: flex;
}

.inputGroup .inputGroup-splitter {
    display: inline-block;
    width: 6px;
    flex-shrink: 0;
}
/*forum*/
.p-body-content {
    display: table-cell;
    padding-right: 10px;
    vertical-align: top;
}
/*node*/
.block-node-list {
    margin-bottom: 20px;
}
.block-node-list.block-with-border{
    padding: 0;
}
.block-container {
    color: #141414;
    background: #fefefe;
    border: 2px solid rgb(235,239,243);
    border-radius: 4px;
}
.node-main {
    display: table-cell;
    vertical-align: middle;
    padding: 10px;
}
.node-title {
    margin: 0;
    padding: 0;
    font-size: 17px;
    font-weight: 400;
}
.node-body {
    display: table;
    table-layout: fixed;
    width: 100%;
}
.node-icon {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    width: 46px;
    padding: 10px 0 10px 10px;
}
.node + .node {
    border-top: 1px solid #e7e7e7;
}
.node-meta {
    font-size: 13px;
}
.node-subNodeFlatList {
    list-style: none;
    margin: 0;
    padding: 0;
}
.node-subNodeFlatList>li {
    display: inline-block;
    margin-right: 1em;
}
.node-icon i {
    display: block;
    line-height: 1.125;
    font-size: 32px;
}
.threads-list{
    position: relative;
    margin-top: 40px;
    margin-bottom: 70px;
    padding: 10px;
    border-radius: 5px;
    border: 2px solid rgb(235, 239, 243);
}
.discussionListItems{
    margin: 0;
    padding: 0;
}
.discussionListItem {
    background-color: rgb(255, 255, 255);
    border-bottom: 1px solid rgb(235, 239, 243);
}
.discussionListItem:last-child{
    border-bottom: none;
}
.discussionList .sectionHeaders, .discussionListItem {
    display: table;
    width: 100%;
    word-wrap: normal;
}
.discussionListItem .posterAvatar {
    padding-top: 10px;
    padding-bottom: 10px;
    width: 1%;
}
.discussionListItem .title{
    margin: 0;
}
.discussionList .posterAvatar {
    width: 50px;
}
.discussionListItem .listBlock{
    display: table-cell;
    vertical-align: middle;
}
.muted {
    color: rgb(153, 153, 153);
    font-size: 13px;
}
.discussionList .main {
    width: auto;
}
.discussionListItem .titleText {
    padding: 10px;
    overflow: hidden;
    position: relative;
}
.discussionListItem .posterDate {
    float: left;
}
.discussionListItem .posterAvatar .avatar {
    width: 36px;
    height: 36px;
    font-size: 22px;
}
/*post avatar */
.message.block-with-border{
    padding: 0;
}
.threads-list{
    position: relative;
    margin-top: 40px;
    margin-bottom: 70px;
    padding: 10px;
    border-radius: 5px;
    border: 2px solid rgb(235, 239, 243);
}
.discussionListItems{
    margin: 0;
    padding: 0;
}
.discussionListItem {
    background-color: rgb(255, 255, 255);
    border-bottom: 1px solid rgb(235, 239, 243);
}
.discussionListItem:last-child{
    border-bottom: none;
}
.discussionList .sectionHeaders, .discussionListItem {
    display: table;
    width: 100%;
    word-wrap: normal;
}
.discussionListItem .posterAvatar {
    padding-top: 10px;
    padding-bottom: 10px;
    width: 1%;
}
.discussionListItem .title{
    margin: 0;
}
.discussionList .posterAvatar {
    width: 50px;
}
.discussionListItem .listBlock{
    display: table-cell;
    vertical-align: middle;
}
.muted {
    color: rgb(153, 153, 153);
    font-size: 13px;
}
.discussionList .main {
    width: auto;
}
.discussionListItem .titleText {
    padding: 10px;
    overflow: hidden;
    position: relative;
}
.discussionListItem .posterDate {
    float: left;
}
.discussionListItem .posterAvatar .avatar {
    width: 36px;
    height: 36px;
    font-size: 22px;
}
.message-inner{
    display: flex;
}
.message-cell--user{
    padding: 15px;
    border-right: 1px solid #dfdfdf;
    text-align: center;
    color: #141414;
    flex: 0 0 185px;
    position: relative;
}
.message-cell--main {
    flex: 1;
    margin: 10px;
    display: flex;
    flex-direction: column;
}
.message-userTitle {
    font-size: 12px;
    font-weight: normal;
    text-align: center;
    margin: 0;
}
.message-name {
    font-weight: 700;
    font-size: inherit;
    text-align: center;
    margin: 0;
}
.message-attribution{
    color: #7c9292;
    font-size: 12px;
    padding-bottom: 3px;
    border-bottom: 1px solid #e0e0e0;
}
.message {
    border-radius: 4px;
    margin-bottom: 20px;
}
.message-body{
    margin-top: 10px;
    word-break: break-all;
    margin-bottom: 10px;
}
.message .contentRow-minor{
    margin-left: 0;
}
.block-form-message {
    border: 2px solid rgb(235,239,243);
    border-radius: 4px;
    padding: 15px;
    padding-bottom: 0;
}
.block-form-message .input{
    background: none;
    border: 2px solid rgb(235,239,243);
    border-radius: 4px;
    outline: none;
    padding: 10px;
}
.editor-write{
    outline: none;
    padding: 10px;
}
.editor.is-focus{
    background: #fefefe;
    border-color: #91c5ca #8dd2d8 #8dd2d8 #91c5ca;
}
.editor.is-focus .button-editor{
    background: linear-gradient(180deg, #f3feff, #fefefe);
}
.block-form-message .list-button {
    text-align: end;
    margin-top: 10px;
    margin-bottom: 10px;
}
.message-userArrow {
    position: absolute;
    top: 20px;
    right: -1px;
    border: 10px solid transparent;
    border-left-width: 0;
    border-right-color: #d8d8d8;
}
.footer-message {
    margin-top: auto;
}
.footer-message-action-set.actionBar-set--external {
    float: right;
    margin-right: -3px;
}
.footer-message-action-set.actionBar-set--int{
    margin-bottom: 5px;
    height: 20px;
}
.footer-message-action-set a{
    padding: 0;
    margin: 0;
    font-size: 12px;
}
.reactionsBar{
    transition: all .25s ease, -xf-opacity .25s ease;
    overflow-y: hidden;
    background: #f9fafa;
    border: 1px solid #e0e0e0;
    border-left: 2px solid var(--ocean-blue);
    padding: 10px;
    font-size: 12px;
    margin-top: 10px;
}
.reactionsBar ul{
    margin: 0;
    padding: 0;
    display: inline-flex;
}
.editor-write p {
    margin-bottom: 0;
    margin-top: 0;
}
.reactionsBar ul li{
    list-style: none;
}

.reactionsBar ul li:after{
    content: ', ';
}
.reactionsBar ul li:last-child:after{
    content: '';
}
.message-userArrow:after {
    position: absolute;
    top: -9px;
    right: -10px;
    content: "";
    border: 9px solid transparent;
    border-left-width: 0;
    border-right-color: #fefefe;
}
.button-editor .button-editor-content {
    background: transparent;
    color: #505050;
    outline: 0;
    border: 0;
    line-height: 1;
    cursor: pointer;
    margin: 0 1px;
    border-radius: 0;
    background-clip: padding-box;
    z-index: 2;
    position: relative;
    box-sizing: border-box;
    text-decoration: none;
    user-select: none;
    padding: 0;
    width: 32px;
    height: 32px;
    text-align: center;
}
.button-list-popup{
    background: white;
    position: absolute;
    width: 100%;
    display: none;
}
.button-list-popup {
    height: auto;
    max-height: 275px;
}
.button-list-popup {
    background: #fefefe;
    border: 1px solid #d8d8d8;
}
.button-list-popup ul.fr-dropdown-list li {
    padding: 0;
    margin-bottom: 10px;
    font-size: 15px;

}
.button-list-popup.button-list-linkInsert, .button-list-popup.button-list-foreColor{
    width: 200px;
    right: -90px;
}
.button-list-popup .button{
    width: 50%;
    margin: 10px;
    margin-top: 0;
}
.fr-input-line{
    padding: 10px;
}
.fr-sr-only{
    display: none;
}
.fr-select-color{
    display: inline-block;
    width: 32px;
    height: 32px;
    position: relative;
    z-index: 1;
}
.editor{
    background: #f3feff;
    border: solid 1px #d8d8d8;
    border-color: #cbcbcb #dfdfdf #dfdfdf #cbcbcb;
    border-radius: 4px;
    background-clip: padding-box;
}
a.button.button--link {
    background: #fefefe;
    color: var(--ocean-blue);
    border-color: #e5e5e5 #cbcbcb #cbcbcb #e5e5e5;
}
.block-message{
    padding-top: 10px;
}
.footer-message a.button.button--link{
    margin-right: 5px;
}

/*avatar*/
.avatar.avatar--default{
    font-family: 'Arial', sans-serif;
    font-weight: normal;
    text-align: center;
    text-decoration: none !important;
    line-height: 1;
    user-select: none;
}
.avatar.avatar--m {
    width: 96px;
    height: 96px;
    font-size: 58px;
}

.avatar.avatar--xxs {
    width: 24px;
    height: 24px;
    font-size: 14px;
}
.avatar.avatar--l {
    width: 192px;
    height: 192px;
    font-size: 115px;
}
.avatarWrapper {
    display: inline-block;
    position: relative;
}
.avatar {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    vertical-align: top;
    overflow: hidden;
}
.avatar.avatar--s {
    width: 48px;
    height: 48px;
    font-size: 29px;
}
/*error*/
.blockMessage {
    padding: 12px 12px;
}
.block-rowMessage {
    margin: 6px 0;
    padding: 6px 10px;
    border-width: 1px;
    border-style: solid;
    border-top-color: #dfdfdf;
    border-right-color: #d8d8d8;
    border-bottom-color: #cbcbcb;
    border-left-color: #d8d8d8;
    border-radius: 4px;
}
.block-rowMessage.block-rowMessage--error {
    border-left: 3px solid #c84448;
    background: #fde9e9;
    color: #c84448;
}
.blockMessage.blockMessage--error{
    border-left: 3px solid #c84448;
    background: #fde9e9;
    color: #c84448;
}
.block-rowMessage.block-rowMessage--success {
    border-left: 3px solid #63b265;
    background: #daf3d8;
    color: #3d793f;
}
.no-popup{
    margin-bottom: 20px;
    padding: 12px 12px;
    color: #141414;
    background: #fefefe;
    border: 1px solid #d8d8d8;
    border-radius: 4px;
}
.blockMessage--iconic{
    text-align: left;
    position: relative;
    padding-left: 4em;
    min-height: 4em;
}
.blockMessage.no-popup:before, .blockMessage.no-popup:after {
    content: " ";
    display: table;
}
.blockMessage--iconic:before{
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 400;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 280%;
    position: absolute;
    top: 0;
    left: 12px;
}
.blockMessage--iconic::before {
    top: 50%;
    transform: translateY(-50%);
}
.blockMessage--error.blockMessage--iconic:before {
    content: "\f057";
    color: #c84448;
}
.get-error.active-overlay, .get-delete.active-overlay, .get-form.active-overlay, .get-view.active-overlay {
    display: block;
}
.get-error, .get-delete, .get-form, .get-view {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 100000000;
    background: rgba(0, 0, 0, 0.35);
    opacity: 0;
    -webkit-transition: opacity 0.25s ease;
    transition: opacity 0.25s ease;
    overflow: auto;
}
.get-error .overlay .overlay-content, .get-delete .overlay .overlay-content, .get-form .overlay .overlay-content, .get-view .overlay .overlay-content {
    background-color: white;

}
.get-delete .overlay, .get-form .overlay, .get-error .overlay, .get-view .overlay{
    position: relative;
    margin: 40px auto 10px;
    margin-top: 4vh;
    width: 100%;
    max-width: 800px;
    background: #ececec;
    color: #141414;
    border-radius: 4px;
    box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.5);
    outline: none;
    overflow: hidden;
}
.get-delete .overlay > .overlay-title:first-child {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.get-delete .overlay .overlay-title, .get-form .overlay .overlay-title, .get-error .overlay .overlay-title, .get-view .overlay .overlay-title{
    margin: 0;
    font-weight: 400;
    font-size: 24px;
    color: white;
    border-bottom: 1px solid #4163EA;
    padding-top: 6px;
    padding-right: 10px;
    padding-bottom: 6px;
    padding-left: 10px;
    background: #4163EA;
}
.block-miner .form-submit{
    background: #F7FAFD;
    text-align: center;
    padding: 10px;
    border-top: 1px solid #D5E3EC;
}
.overlay .block-miner form{
    border: 0;
    box-shadow : none;
}
[data-xf-click], a[tabindex] {
    cursor: pointer;
}
.overlay-titleCloser {
    float: right;
    cursor: pointer;
    margin-left: 5px;
    text-decoration: none;
    opacity: .5;
    -webkit-transition: all 0.25s ease;
    transition: all 0.25s ease;
    color: white;
}
.block-delete {
    background-color: white;
    color: #141414;
    border-width: 1px;
    border-style: solid;
    border-top-color: #dfdfdf;
    border-right-color: #d8d8d8;
    border-bottom-color: #cbcbcb;
    border-left-color: #d8d8d8;
    border-radius: 4px;
}
.formSubmitRow-main {
    background: #F7FAFD;
    text-align: center;
    padding: 10px;
    border-top: 1px solid #D5E3EC;
}
.block-delete .block-text {
    border-radius: 12px;
    text-align: center;
    padding: 15px 10px;
}
.overlay-titleCloser:after {
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 400;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f00d";
}
.bock-errors-ajax{
    padding: 10px;
    background-color: white;
    border: 1px solid #D5E3EC;
    box-shadow: 0 2px 4px rgba(228, 237, 244, 0.8);
}
.overlay-content .bock-errors-ajax{
    border : none;
    box-shadow: none;
}
.overlay-content .p-form{
    margin: 0;
    padding: 10px;
}
/*product*/
.products{
    display: table;
    table-layout: fixed;
    width: 100%;
    margin-bottom: auto;
    min-height: 1px;
}
.product-sidebar{
    display: table-cell;
    vertical-align: top;
    width: 280px;
    padding: 0;
    margin: 10px 0;
}
.product-sidebar .block-with-border{
    padding: 0;
}
.products-content{
    display: flex;
    vertical-align: top;
    padding-left: 10px;
    flex-flow: row wrap;
}
.product-sidebar{
    padding: 0;
}
.product-sidebar .product-sidebar--header{
    margin: 0;
    padding: 10px;
    border-bottom: 1px solid #D5E3EC;
    box-shadow: 0 4px 2px -2px rgb(228 237 244 / 80%);
}
.product-sidebar-content-main{
    padding: 10px;
}
.product-sidebar-content-footer{
    padding: 10px;
    text-align: center;
    border-top: 1px solid #D5E3EC;
}
.block-product{
    max-width: 250px;
    width: 100%;
    height: 100%;
    position: relative;
    border: 1px solid #D5E3EC;
    box-shadow: 0 2px 4px rgb(228 237 244 / 80%);
    padding-bottom: 10px;
    background: white;
    margin: 10px;
}
.logo-platform{
    position: absolute;
    background: white;
    border-radius: 50%;
    right: 3px;
    top: -12px;
    border: 1px solid #D5E3EC;
    padding: 2px;
    box-shadow: 0 2px 4px rgb(228 237 244 / 80%);
    z-index: 20;
}
.logo-platform img{
    max-width: 20px;
    max-height: 20px;
}
.product-image{
    position: relative;
}
.product-image img {
    max-height: 300px;
    max-width: 250px;
    width: 100%;
    height: fit-content;
    text-indent: 100%;
    overflow: hidden;
    white-space: nowrap;
    word-wrap: normal;
    display: block;
    border-radius: inherit;
}
.product-image-box{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    box-shadow: inset 0 -43px 15px -22px rgb(0 0 0 / 75%);
}
.product-title{
    font-size: 13px;
    text-align: center;
    padding: 10px;
    position: relative;
}
.block-product .rating-displays{
    text-align: center;
    font-size: 13px;
}
.product-price{
    position: absolute;
    bottom: 0;
    color: white;
    right: 0;
    padding: 5px;
}
.product-stock{
    position: absolute;
    bottom: 0;
    color: white;
}
.product-stock .is-stock:before{
    position: absolute;
    bottom: 0;
    content: '\f00c';
    color: #00d200;
}
.product-stock .is-no-stock:before{
    position: absolute;
    bottom: 0;
    content: '\f00d';
    color: #f66363;
}
.product-stock span:before{
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    padding: 5px;
}
.product-no-img{
    max-width: 250px;
    max-height: 300px;
    width: 100%;
    height: auto;
    display: flex;
    font-size: 100px;
    align-items: center;
    justify-content: center;
    background: #e2e2e2 !important;
}
.product-no-img:before{
    content: '\f11b';
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    max-width: 250px;
    max-height: 300px;
    width: 100%;
    height: 100%;
    padding: 100%;
    text-align: center;
}
.product-view-header{
    padding: 10px 0;
    display: flex;
    flex-flow: row wrap;
}
.product-view-header--content-slider{
    border: 1px solid #D5E3EC;
    box-shadow: 0 2px 4px rgb(228 237 244 / 80%);
    background: white;
    position: relative;
    overflow: hidden;
    max-width: 300px;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.product-view-header--title{
    margin: 0;
    padding: 10px;
    border-bottom: 1px solid #D5E3EC;
    background: #f1f1f1;
    text-align: center;
}
.product-view-header--display-game{
    height: 400px;
    position: relative;
    overflow: hidden;
    max-width: 300px;
    /*height: 100%;*/
    /*display: flex;*/
    /*align-items: center;*/
}
.product-view-header--info{
    margin-left: 10px;
    border: 1px solid #D5E3EC;
    box-shadow: 0 2px 4px rgb(228 237 244 / 80%);
    background: white;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.product-view-header--info-header{
    margin: 0;
    border-bottom: 1px solid #D5E3EC;
}
.product-view-header--info-header-title{
    border-bottom: 1px solid #D5E3EC;
    margin: 0;
    padding: 10px;
    text-align: center;
}
.product-view-header--start{
    display: flex;
    align-items: center;
}
.product-view-header--start-content{
    flex: 1;
    display: flex;
    padding: 10px;
    justify-content: center;
}
.product-view-header--info-header-title-content{
    margin: 0;
}
.product-view-header--start-user{
    border-right: 1px solid #D5E3EC;
}
.product-view-header--info-display{
    display: table;
    table-layout: fixed;
    width: 100%;
    margin: 0;
    position: relative;
}

.product-view-header--info-display dt{
    border-right: 1px solid #D5E3EC;
    background: #f9fafa;
    text-align: right;
    padding: 15px 10px 15px 10px;
}
.product-view-header--info-display dd{
    width: 67%;
    padding: 15px 10px 15px 10px;
    display: table-cell;
    vertical-align: top;
    margin: 0;
}
.product-view-header--info-main{
    border-bottom: 1px solid #D5E3EC;

}
.product-view-header--info-footer{
    height: 100%;
    background: #f9fafa;

}
.product-view-header--info-footer-content{
    display: flex;
    align-items: center;
    height: 100%;
}
.product-view-header--info-footer-content div {
    flex: 1;
    margin-right: 10px;
}
.product-view-header--info-footer-price{
    font-size: 60px;
    text-align: right;
}
.product-view-header--info-footer-button-buy{
    background: var(--color);
    color: white;
    font-size: 17px;
    padding: 19px 0;
    width: 200px;
    display: inline-block;
    text-align: center;
    border-radius: 10px;
    outline: none;
    border:none;
    position: relative;
}
.product-view-header--info-footer-button-buy:after{
    position: absolute;
    top: 4px;
    right: -15px;
    width: 50px;
    height: 50px;
    border-radius: 10px 4px 10px 0;
    -ms-transform: rotate(45deg) skew(15deg,15deg);
    transform: rotate(45deg) skew(-3deg, -5deg);
    background: var(--color);
    content: "";
    transition: all .1s;

}
.product-view-header--display-game-other{
    display: grid;
    height: 100%;
    align-items: center;
}
/*Sliders product*/
.product-view--sliders{
    margin: 0;
    padding: 0;
    list-style: none;
    width: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    height: 100%;
}
/*@media only screen and (max-width: 1000px)*/
/*{*/
/*    .sliders {*/
/*        height: auto;*/
/*        padding-bottom: 35%;*/
/*    }*/
/*}*/
.product-view--sliders li
{
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
    height: 100%;
    display: flex;
    align-items: center;
}
.product-view--sliders li img {
    display: block;
    margin: auto;
    max-width: 100%;
    border: none;
    border: 0;
    vertical-align: middle;
    height: auto;
}
.sliders-other{
    position: relative;
}
.product-view--slider-next {
    right: 10px;
}
.product-view--slider-next, .product-view--slider-prev {
    background: black;
    background: none repeat scroll 0 0 rgba(0,0,0,0.5);
    border-radius: 100% 100% 100% 100%;
    color: #FFFFFF;
    font-size: 20px;
    font-weight: bold;
    height: 44px;
    line-height: 44px;
    margin-top: -22px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 44px;
    cursor: pointer;
    z-index: 6;
    opacity: .5;
    transition: opacity .3s;
}
.product-view--slider-next:hover, .product-view--slider-prev:hover {
    opacity: .8;
}
.product-view--slider-prev{
    left: 10px;
}
.action-buy{
    background: #f9fafa;
    font-size: 17px;
    text-align: center;
}
.block-collapse-active + .block-info-view {
    border-top: 1px solid #D5E3EC;
}
.block-tab-style{
    display: none;
}
.product-view--tab .block-tab ul{
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
}
.product-view--tab .block-tab li{
    display: inline-block;
    padding: 10px;
    background: #FFFFFF;
    border: 1px solid #D5E3EC;
    box-shadow: 0 -2px 4px rgb(228 237 244 / 80%);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom: none;
    cursor: pointer;
}
.block-tab-style.tabHasActive{
    display: block;
}

/*star*/
.rating-theme-stars .xs-widget a:after {
    content: "\f005";
    width: 1.28571429em;
    display: inline-block;
    text-align: center;
    color: #dfdfdf;
}
.rating-theme-stars .rating-widget a {
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 120%;
    text-decoration: none;
    margin-right: 2px;
}
.rating-theme-stars .rating-widget a:hover {
    opacity: 1;
}
.rating-theme-stars .rating-widget a.rating-start-is-active:after {
    color: #f9c479;
}
.rating-widget--withSelected{
    height: 40px;
}
.rating-rating-text {
    display: block;
    font-size: 80%;
}
.rating-rating-stars{
    position: relative;
}
.rating-rating-star:before {
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f005";
    width: 1.28571429em;
    display: inline-block;
    text-align: center;
    color: #dfdfdf;
}
.rating-rating-star.xs-rating-star--full:before {
    color: #f9c479;
}
.rating-rating-star{
    position: relative;
    margin-left: 2px;
}
.rating-rating-star.xs-rating-star--half:after {
    position: absolute;
    left: 0;
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f089";
    width: 1.28571429em;
    display: inline-block;
    text-align: center;
    color: #f9c479;
}
/*end star*/

/*payment*/
.payment-content .form-action{
    padding: 0;
}
.block-info-view{
    padding: 10px;
}
.block-header-view{
    margin: 0;
    padding: 10px;
    border-bottom: 1px solid #D5E3EC;
    border-top: 1px solid #D5E3EC;
    color: var(--color);
    font-weight: initial;
}
.payment-table{
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    margin-bottom: 20px;
}
.payment-table .jacket {
    border-right: none;
    width: 1%;
    padding-right: 0;
}
.jacket img{
    max-width: 67px;
}
.payment-table td, .payment-table th {
    border: 1px solid #999;
    padding: 7px 9px 4px 7px;
    text-align: center;
}
.payment-table .total td:first-child {
    border: 0;
}
/*collapse*/
.collapse-section{
    display: block;
}
.collapse-section {
    cursor: pointer;
}
.collapse-section:before {
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f0da";
    width: 1.28571429em;
    display: inline-block;
    text-align: center;
    font-size: 80%;
    margin-right: .2em;
}

.collapse-section:before {
    float: right;
    margin-right: 0;
    margin-left: 5px;
    font-size: 100%;
    line-height: inherit;
}

.collapse-section.collapse-active:before {
    content: "\f0d7";
    width: 1.28571429em;
    display: inline-block;
    text-align: center;
}
.block-collapse-section{
    display: none;
}
/*footer*/
.large-footer{
    background-color: whitesmoke;
    margin-top: auto;
}
.content-footer{
    font-family: 'Roboto', sans-serif;
}
.inline-footer{
    display: inline-flex;
}
.text-footer, .right-part{
    margin: 0 10px;
}
.block-footer{
    display: flex;
    max-width: 1200px;
    margin: auto;
}
/*Editor*/
.editor-write {
    outline: none;
    padding: 10px;
}

.base-style-editor{
    border-radius: 4px;
    background-clip: padding-box;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    background-color: #f7fbfe;
}
.base-style-editor.is-focus {
    border-top-color: #a6d3f2;
    border-right-color: #c9e5f7;
    border-bottom-color: #c9e5f7;
    border-left-color: #a6d3f2;
    background: #fefefe;
}
select.input, .input.input--select {
    padding-right: 1em !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4.9 10'%3E%3Cstyle%3E._xfG%7Bfill:%23141414;%7D%3C/style%3E%3Cpath class='_xfG' d='M1.4 4.7l1.1-1.5 1 1.5m0 .6l-1 1.5-1.1-1.5'/%3E%3C/svg%3E") !important;
    background-size: 1em !important;
    background-repeat: no-repeat !important;
    background-position: 100% !important;
    white-space: nowrap;
    word-wrap: normal;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    overflow-x: hidden;
    overflow-y: auto;
}
.base-style-editor.is-focus .button-editor {
    background: linear-gradient(180deg, #f7fbfe, #fefefe);
}
.base-style-editor .button-editor .button-editor-content {
    background: transparent;
    color: rgba(29, 70, 99, 0.85);
    outline: 0;
    border: 0;
    line-height: 1;
    cursor: pointer;
    margin: 0 1px;
    border-radius: 0;
    background-clip: padding-box;
    z-index: 2;
    position: relative;
    box-sizing: border-box;
    text-decoration: none;
    user-select: none;
    padding: 0;
    width: 32px;
    height: 32px;
    text-align: center;
    font-size: 16px;
}
.base-style-editor .button-editor .button-editor-content.button-has-active {
    color: #3bb9f2;
}
.base-style-editor .editor-write p{
    margin-bottom: 0;
    margin-top: 0;
}
.input-editor{
    font-size: 15px;
    color: #191e1e;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 3px;
    padding: 10px;
    margin: 0;
    margin-bottom: 10px;
    line-height: 1.4;
    -webkit-transition: background .25s ease, color .25s ease;
    transition: background .25s ease, color .25s ease;
    height: auto;
}
.color-has-active:before {
    font-family: 'Font Awesome 5 Pro';
    font-style: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: '\f00c';
    width: 100%;
    height: 100%;
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    line-height: 32px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    text-align: center;
    cursor: default;
}
.fr-color-hex-layer .fr-input-line .input-editor{
    margin-bottom: 0;
    max-width: 205px;
}
.order-button-right{
    float: right;
}
.base-style-editor .button-list-popup {
    position: absolute;
    display: none;
    color: #191e1e;
    background: #fff;
    box-shadow: 0 3px 5px -1px rgba(0,0,0,0.2), 0 6px 10px 0 rgba(0,0,0,0.14), 0 1px 18px 0 rgba(0,0,0,0.12);
    font-family: 'Segoe UI','Helvetica Neue',Helvetica,Roboto,Oxygen,Ubuntu,Cantarell,'Fira Sans','Droid Sans',sans-serif;
    box-sizing: border-box;
    user-select: none;
    margin-top: 10px;
    z-index: 2147483635;
    text-align: left;
    border-radius: 6px;
    background-clip: padding-box;
    text-rendering: optimizelegibility;
    line-height: 1.2;
    overflow: hidden;
}
.base-style-editor .button-list-popup .fr-popup.fr-desktop
{
    padding-bottom:10px;
    display: flex;
    flex-flow: row wrap;
    max-width: 500px;
}
.base-style-editor .button-list-popup.popup-clickable{
    max-width: 276px;
}
.button-editor button.button-editor-content:hover{
    background-color: #dcebf0;
    color: black;
    border-radius: 5px;
}
.base-style-editor .button-list-popup ul.fr-dropdown-list{
    list-style-type: none;
    margin: 0;
    padding: 8px 0;
    min-width: 72px;
}
.base-style-editor .button-list-popup ul.fr-dropdown-list li {
    padding: 0;
    margin: 0;
    font-size: 15px;
}
.button-editor .fr-dropdown-list li a.button-editor-content {
    padding: 0 22px;
    line-height: 200%;
    display: flex;
    cursor: pointer;
    white-space: nowrap;
    color: inherit;
    text-decoration: none;
    border-radius: 0;
    background-clip: padding-box;
}
/*.base-style-editor .button-list-popup.button-list-linkInsert,*/
/*.base-style-editor .button-list-popup.button-list-foreColor{*/
/*    width: 200px;*/
/*    right: -90px;*/
/*}*/
.fr-color-hex-layer{
    display: flex;
    align-items: center;
}
.button-list-popup-inner
{
    margin: 10px;
}
.base-style-editor .button-list-popup .fr-color-hex-layer .name-button.button{
    margin: 10px;
    width: auto;
}
.base-style-editor .button-list-popup .button {
    margin: 0;
    width: 100%;
}
.name-button{
    margin: 10px;
}
.base-style-editor .button-list-popup .fr-select-color  {
    display: inline-block;
    width: 32px;
    height: 32px;
    position: relative;
    z-index: 1;
    outline: none;
    transition: all 0.3s;
}
.base-style-editor .button-list-popup .fr-select-color:hover  {
    border: solid 1px;
}
.base-style-editor .button-list-popup .fr-select-color .fr-sr-only {
    display: none;
}
.fr-dropdown-list li a i {
    font-size: 16px;
    margin: 8px 7px;
}
.fr-select-color  > i{
    text-align: center;
    line-height: 32px;
    height: 24px;
    width: 24px;
    margin: 4px;
    font-size: 13px;
    position: absolute;
    bottom: 0;
    cursor: default;
    left: 0;
}

/*avatar*/
.avatar {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 0;
    vertical-align: top;
    overflow: hidden;
}
.avatar img:not(.cropImage) {
    text-indent: 100%;
    overflow: hidden;
    white-space: nowrap;
    word-wrap: normal;
    display: block;
    border-radius: inherit;
    width: 100%;
    height: 100%;
}
.avatar.avatar--l {
    width: 192px;
    height: 192px;
    font-size: 115px;
}
.avatar.avatar--xxl{
    max-width: 300px;
    max-height: 300px;
}
.avatar.avatar--m{
    width: 80px;
    height: 80px;
    font-size: 40px;
}
.avatar.avatar--platform-s{
    width: 30px;
    height: 20px;
    font-size: 40px;
}
/*PageNave*/
.pageNav-jump {
    display: inline-block;
    background: #FFFFFF;
    border: 1px solid #D5E3EC;
    box-shadow: 0 2px 4px rgb(228 237 244 / 80%);
    color: black;
    font-size: 13px;
    white-space: nowrap;
    border-radius: 2px;
    padding: 5px 8px;
    margin-right: 6px;
}
.block-form-message .base-style-editor{
    border: 1px solid #D5E3EC;
}
.pageNav-inner{
    margin: 10px 0 ;
}
.pageNav-jump--prev {
    margin-right: 6px;
}
.pageNav-main {
    list-style: none;
    margin: 0;
    padding: 0;
    display: inline-table;
}
.pageNav-page:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}
.pageNav-page:not(:last-child) {
    border-right: none;
}
.pageNav-page {
    display: table-cell;
    color: black;
    border-width: 1px;
    font-size: 13px;
    white-space: nowrap;
}

.pageNav-page > a, .pageNave-empty {
    display: block;
    padding: 5px 8px;
    text-decoration: none;
    border-radius: 3px;
    background: #FFFFFF;
    border: 1px solid #D5E3EC;
    box-shadow: 0 2px 4px rgb(228 237 244 / 80%);
    color: inherit;
    margin-right: 6px;
}
.pageNav-page--current > a, a.pageNavSimple.pageNavSimple-current
{
    background-color: var(--color);
    color: white;
}
.pageNav-simple{
    display: none;
}
.pageNavSimple{
    display: block;
    padding: 5px 8px;
    text-decoration: none;
    border-radius: 3px;
    background-color: rgb(246, 249, 250);
    color: inherit;
}
.pageNavSimple-first {
    margin-right: 6px;
}
.pageNavSimple-last {
    margin-left: 6px;
}
.pageNavSimple-current {
    margin-left: 6px;
    margin-right: 6px;
}
.pageNaveSimple-first-last {
    background: none;
    border-radius: 3px;
    transition: all 0.3s;
}
.u-srOnly {
    position: absolute;
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0 0 0 0);
    overflow: hidden;
}
.pageNavSimple-first i:before {
    content: "\f04a";
    display: inline-block;
    width: 1em;
}
.pageNavSimple-last i:before {
    content: "\f04e";
    display: inline-block;
    width: 1em;
}
.pageNaveSimple-first-last i:before {
    font-family: 'Font Awesome 5 Pro';
    font-size: inherit;
    font-style: normal;
    font-weight: 900;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.pageNaveSimple-first-last:hover
{
    background-color: rgb(246, 249, 250);
}
/*end pageNave*/
/*media*/
@media screen and (max-width: 800px){
    .content-button-header .button span{
        display: none;
    }
    .search-bar{
        display: none;
        top: 0;
        left: 0;
        right: 0;
        background-color: #232833;
    }
    .button-search span{
        display: flex;
        align-items: center;
        margin: 0 10px;
        padding: 10px;
        height: 100%;
        color: white;
        font-size: 15px;
        width: 55px;
        justify-content: center;
    }
    .logo{
        max-width: 100%;
    }
    .menu-button{
        display: flex;
    }
}
@media (max-width: 650px) {

    thead {
        display: none;
    }
    table.content-table tr{
        margin-bottom: 40px;
        border: thin solid #D5E3EC;
    }
    table.content-table td {
        border: none;
        display: block;
        text-align: right;
    }
    table.content-table td.any:before {
        float: none;
        padding-right: inherit
    }
    table.content-table td.table-title:before{
        display: none;
    }
    table.content-table td.table-float-left
    {
        float: left;
        z-index: 100;
        position: relative;
    }
    .table-background-color{
        background: #f1f1f1;
    }
    table.content-table td.table-float-left-content-right{
        display: flex;
        font-size: 20px;
        justify-content: center;
        align-items: center;
    }
    table.content-table td.table-float-left:before
    {
        display: none;
    }
    .any-repo {
        display: none;
    }
    .any {
        text-align: center;
        background: #f1f1f1;
    }
    table.content-table td:before {
        content: attr(data-cell-label) " :";
        float: left;
        font-weight: 500;
    }
    table.content-table tr.other-table{
        border: none;
    }
    .other-table td:before{
        display: none;
    }
    .other-table td:first-child{
        width: 100%;
    }
    .other-table .thead{
        float: left;
        width: 50%;
        text-align: left;
        border-left: thin solid #D5E3EC;
        border-top: thin solid #D5E3EC;
        border-bottom: thin solid #D5E3EC;
    }
    .other-table .tbody{
        float: right;
        width: 50%;
        border-right: thin solid #D5E3EC;
        border-top: thin solid #D5E3EC;
        border-bottom: thin solid #D5E3EC;
    }
    .other-table.padding-table-top{
        margin-top: 10px ;
    }
}
@media (max-width: 650px) {
    .pageNav-inner{
        text-align: center;
    }
    .pageNav-simple {
        display: inline-flex;
    }
    .pageNav {
        display: none;
    }
    .message-inner{
        flex-direction: column;
    }
    .message-cell--user
    {
        flex: 1;
        border-right: 0;
        border-bottom: 1px solid #dfdfdf;
    }
    .message-cell--user section{
        display: flex;
    }
    .contentRow-minor{
        display: none;
    }
    .message-userDetails{
        flex: 1;
        text-align: left;
        margin-left: 10px;
    }

    .message-userDetails .message-userTitle
    {
        margin: 0;
    }
    .message-userDetails .message-name
    {
        margin: 0;
    }
    .message .message-avatar .avatar
    {
        width: 48px;
        height: 48px;
        font-size: 29px;
    }
    .message .message-userArrow {
        top: auto;
        right: auto;
        bottom: -1px;
        left: 24px;
        border: none;
        border: 10px solid transparent;
        border-top-width: 0;
        border-bottom-color: #d8d8d8;
    }
    .message .message-userArrow:after {
        top: auto;
        right: auto;
        left: -9px;
        bottom: -10px;
        border: none;
        border: 9px solid transparent;
        border-top-width: 0;
        border-bottom-color: #fefefe;
    }
    .member_div_lit{
        position: static;
        visibility: visible;
    }
    .member_div_lit{
        font-size: 8px;
        display: none;
    }
    .members_div{
        display: block;
    }
}