/*@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@100;300;400;500;600;700&display=swap');*/
/*@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;500;600;700&family=Roboto:wght@100;400;500;600;700&display=swap');*/
/*@import url("fonts/GillSansNova/stylesheet.css");
@import url("fonts/GillSans/stylesheet.css");
@import url("fonts/NunitoSans/stylesheet.css");*/
@import url("fonts/SFProDisplay/stylesheet.css");
@import url("messagebox.css");
@import url("bottomside.css");
@import url("topside.css");
@import url("leftside.css");
/*@import url('https://fonts.cdnfonts.com/css/sf-pro-display');*/
html{
    height:100%;
    scrollbar-color: #FFCC00;     /* «цвет ползунка» «цвет полосы скроллбара» */
    scrollbar-width: thin;  /* толщина */
}



body *{
    crollbar-color: #FFCC00;     /* «цвет ползунка» «цвет полосы скроллбара» */
    scrollbar-width: thin;  /* толщина */
}

body{
    font-family: 'SF Pro Display', sans-serif;
    font-weight: 400;
    font-style: normal;
    color: #5F5C5C;
    background: #F5F5F5;
    margin: 0;
    /*height:100%;*/
    /*padding-left: 225px;
    padding-top: 105px;
    padding-right: 25px;*/
    scrollbar-color: #FFCC00;     /* «цвет ползунка» «цвет полосы скроллбара» */
    scrollbar-width: thin;  /* толщина */
    font-size: 12px;

}

::-webkit-scrollbar-button {
    background-image:url('');
    background-repeat:no-repeat;
    width:8px;
    height:0px
}

::-webkit-scrollbar-track {
    background-color:#ecedee
}

::-webkit-scrollbar-thumb {
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background-color:#9D9CDE;
}

::-webkit-scrollbar-thumb:hover{
    background-color:#9D9CDE;
}

::-webkit-resizer{
    background-image:url('');
    background-repeat:no-repeat;
    width:8px;
    height:0px
}

::-webkit-scrollbar{
    width: 8px;
}


a:hover {
    color: hotpink;
}

a:active, a:focus {
    outline: none;
}

input, textarea, password {
    outline:none;
    font-size: 14px;
    color: #006CDA;
}
input:active, textarea:active, password:active {
    outline:none;
}
:focus {
    outline:none;
}
textarea {
    resize:none;
}
textarea {
    resize:vertical;
}
textarea {
    resize:horizontal;
}
table{
    border-collapse: collapse;
}
table .selected{
    background-color: #e5ebf5;

}

table td {
    border: solid 1px transparent;
    padding-left: 5px;
}

tr:hover td{
    background-color: #e5ebf5;
    cursor: pointer;
}

button{
    padding: 5px;
    background-color: #e5ebf5;
    cursor: pointer;
    border: transparent;
    border-radius: 3px;
}
button:hover{
    box-shadow: 0px 0px 1px #2571B7;
}
.mainField{
    display:flex;
    background-color: #F1F4FA;
    /*height: 100dvh;*/
}
.rightSideMainContainer{
    width: calc(100vw - 50px);
    overflow-x: hidden;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                          supported by Chrome, Edge, Opera and Firefox */
}

.mainSpace{
    margin-left: 15px;
    margin-top:15px;
}

.pageLabel{
    color: #06152B;
    font-size: 28px;
    margin-left: 40px;
}

.pageWiteSpace{
    background-color: #FEFEFE;
    border-radius: 20px;
    width: calc(100vw - 260px);
    height: calc(100vh - 100px);
    padding-left: 20px;
    padding-top: 20px;
    margin-top: 10px;
}

.pageData{

}


.checkbox-ios {
    display: inline-block;
    height: 21px;
    line-height: 21px;
    position: relative;
    vertical-align: middle;
    font-size: 14px;
    user-select: none;
}
.checkbox-ios .checkbox-ios-switch {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    width: 41px;
    height: 21px;
    border: 1px solid #968CE2;
    border-radius: 25%/50%;
    vertical-align: top;
    background: none;
    transition: .2s;
    box-shadow: none;
}
.checkbox-ios .checkbox-ios-switch:before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    display: inline-block;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #968CE2;
    transition: ease .3s;
}
.checkbox-ios input[type=checkbox] {
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    z-index: -1;
    opacity: 0;
}
.checkbox-ios input[type=checkbox]:not(:disabled):active + .checkbox-ios-switch:before {
    /*box-shadow: inset 0 0 2px #968CE2;*/

}
.checkbox-ios input[type=checkbox]:checked + .checkbox-ios-switch {
    transition: ease 0.3s;
    background: #968CE2;
}

.checkbox-ios input[type=checkbox]:checked  + .checkbox-ios-switch:before {
    background: white;
}


.checkbox-ios input[type=checkbox]:checked + .checkbox-ios-switch:before {
    transform:translateX(20px);
}

/* Hover */
.checkbox-ios:hover input[type="checkbox"]:not(:disabled) + .checkbox-ios-switch {
    cursor: pointer;
    box-shadow: 0px 0px 1px #2571B7 ;
    transition: 0s;
}

/* Disabled */
.checkbox-ios input[type=checkbox]:disabled + .checkbox-ios-switch {
    filter: grayscale(70%);
    border-color: rgba(0, 0, 0, .1);
}
.checkbox-ios input[type=checkbox]:disabled + .checkbox-ios-switch:before {
    background: #eee;
}

/* Focus */
.checkbox-ios.focused .checkbox-ios-switch {
    /*box-shadow: inset 0px 0px 4px #ff5623;*/
    box-shadow: 0px 0px 1px #2571B7 ;
    transition: 0s;
}

input::-webkit-input-placeholder {
    font-family: 'SF Pro Display', sans-serif;
    color: #9E9ABE;
    opacity:  1;
}
input:-ms-input-placeholder {
    font-family: 'SF Pro Display', sans-serif;
    color: #9E9ABE;
    opacity:  1;
}
input:-moz-placeholder {
    font-family: 'SF Pro Display', sans-serif;
    color: #9E9ABE;
    opacity:  1;
}
input::-moz-placeholder {
    font-family: 'SF Pro Display', sans-serif;
    color: #9E9ABE;
    opacity:  1;
}

.mainOverlay{
    position: fixed;
    top: 0px;
    left: 0px;
    background-color: rgba(0,0,0,0.1);
    z-index: 1000;
    width: 100%;
    height: 100%;
    margin: 0;
    display: none;
}

.mainEditWindow{
    height: fit-content;
    width: fit-content;
    background-color: white;
    border-radius: 5px;
    margin: auto;
    display: none;
}

.mainEditWindowInnerSpace{
    margin: 5px;
}
.mainEditWindowInnerSpace {
    display: flex;
    flex-direction: column;
}
.closeEditWindow>a{
    text-decoration: none;
}
.closeEditWindow>a:hover{
    color: inherit;
}
.closeEditWindow{
    margin-left: auto;
    color: #2662F0;
    font-size: 14px;
    text-align: left;
}
.closeEditWindow:hover{
    cursor: pointer;
    text-decoration: underline;
}

.editWindowCaption{
    font-size: 18px;
    font-weight: 600;
    margin-left: 10px;
}
.editWindowContents{
    margin: 20px;
}

.searchLine{
    width: 100%;
    text-align: left;
    height: 80px;
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.searchLineWrapper{
    display: flex;
    justify-content: space-between;

}
.searchBox{
    display: flex;
    flex-direction: row;
    width: 411px;
    height: 40px;
    background-color: #F7F7F7;
    border-radius: 12px;
    margin-left: auto;
    margin-right: 20px;
    justify-content: space-between;
}

.searchImg{
    width: 24px;
    height: 24px;
    background-image: url('../img/css/find.png');
    background-size: 24px 24px;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: 10px;

}
.searchInputBox{
    width: calc(100% - 50px);

}
.waitForLoading{
    margin-left: auto;
    margin-right: auto;
    width: 60px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.addButton {
    width: 40px;
    height: 40px;
    font-size: 40px;
    line-height: 35px;
    color: #2662F0;
    text-align: center;
    border-radius: 40px;
    box-shadow: 0px 0px 3px rgba(128,128,128,0.3);
    margin-left: 40px;
    margin-top: 20px;
    transition: 0.2s;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                          supported by Chrome, Edge, Opera and Firefox */
}

.addButton:hover{
    cursor: pointer;
    box-shadow: 0px 0px 3px rgba(38,98,240,0.5);
}
:root{
    --select-arrow-down: url("data:image/svg+xml,%3Csvg width='16' height='12' viewBox='0 0 16 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.79241 10.9706C8.3921 11.4906 7.6079 11.4906 7.20759 10.9706L0.579121 2.35999C0.0729218 1.70243 0.541685 0.75 1.37152 0.75L14.6285 0.75C15.4583 0.75 15.9271 1.70243 15.4209 2.35999L8.79241 10.9706Z' fill='%232662F0'/%3E%3C/svg%3E%0A");
    --select-arrow-up:  url("data:image/svg+xml,%3Csvg width='16' height='12' transform='rotate(180 0 0)' viewBox='0 0 16 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8.79241 10.9706C8.3921 11.4906 7.6079 11.4906 7.20759 10.9706L0.579121 2.35999C0.0729218 1.70243 0.541685 0.75 1.37152 0.75L14.6285 0.75C15.4583 0.75 15.9271 1.70243 15.4209 2.35999L8.79241 10.9706Z' fill='%232662F0'/%3E%3C/svg%3E");
}

.dropdownSelect{
    width: 100%;
    height: 30px;
    border: solid 1px white;
    border-radius: 2px;
    box-shadow: 0px 0px 3px rgba(128,128,128,0.3);
    box-shadow: none;
    margin-right: 10px;
    padding-left: 7px;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
    -ms-appearance: none;
    appearance: none;
    cursor: pointer;
    background:  var(--select-arrow-down) no-repeat white;
    background-position: center right 7px;
}



.dropdownSelect:hover{
    background: var(--select-arrow-down) no-repeat white;
    background-position: center right 7px;
    /*border: solid 1px #1558A4;*/
    transition: 0.2s;
}


.dropdownSelect:focus{
    background: var(--select-arrow-up) no-repeat white;
    background-position: center right 7px;
}


.dropdownSelect:focus option{
    color: #1558A4;
    cursor: pointer;
    border: solid 1px #1558A4;
}

.dropdownSelect:focus option:hover {
    color: #1558A4;
    background-color: #A2C0D4;
}

.actionButtonPanel{
    width: calc(100% - 20px);
    height: 40px;
    margin-top: 10px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    margin-left: 10px;
}

.actionButton{
    width: 104px;
    height: 40px;
    border-radius: 20px;
    color: white;
    background-color: #FA7979;
    text-align: center;
    line-height: 40px;
    cursor: pointer;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                          supported by Chrome, Edge, Opera and Firefox */
}

.actionButton:hover{
    box-shadow: 0px 0px 5px #FA7979;
}

.actionButton.accept{
    background-color: #2662F0;
}

.actionButton.accept{
    background-color: #2662F0;
}

.actionButton.accept:hover{
    box-shadow: 0px 0px 5px #2662F0;
}

.actionButton.cancel{
    background-color: #2662F0;
    color: #2662F0;
    box-shadow: 0px 0px 5px rgba(128,128,128, 0.2);
}

.actionButton.cancel{
    background-color: white;
}

.actionButton.cancel:hover{
    box-shadow: 0px 0px 5px rgba(128,128,128, 0.4);
}

.paginator{

    font-size: 12.5px;
    color: #2571B7;
    position: fixed;
    width: calc(100% - 85px);
    background: white;
    bottom: 50px;
    width: calc(100vw - 280px);
}

.paginatorLeft{
    margin-left: 20px;
    margin-right: 5px;
    margin-top: 4px;
    cursor: pointer;
}
.paginatorRight{
    margin-left: 5px;
    margin-top: 4px;
    cursor: pointer;
}
.paginatorLeft>svg>*,.paginatorRight>svg>*{
    fill:var(--defbutton-color);
}
.paginatorData{
    display: flex;
    flex-direction: row;
    justify-content: left;
    cursor: pointer;
    flex-wrap: wrap;

}

.paginatorPageLink{
    margin-left: 5px;
    width: 19px;
    height: 19px;
    line-height: 1.5;
    text-align: center;
}

.paginatorPageLink.selected{
    background-color: #2571B7;
    border-radius: 19px;
    color: white;
}
.backwardButton{
    display: none;
}

.reloadButton{
    cursor: pointer;
    line-height: 20px;
    display: flex;
    align-items: center;
}

.reloadButton::after{
    content: "";
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg width='800px' height='800px' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.90321 7.29677C1.90321 10.341 4.11041 12.4147 6.58893 12.8439C6.87255 12.893 7.06266 13.1627 7.01355 13.4464C6.96444 13.73 6.69471 13.9201 6.41109 13.871C3.49942 13.3668 0.86084 10.9127 0.86084 7.29677C0.860839 5.76009 1.55996 4.55245 2.37639 3.63377C2.96124 2.97568 3.63034 2.44135 4.16846 2.03202L2.53205 2.03202C2.25591 2.03202 2.03205 1.80816 2.03205 1.53202C2.03205 1.25588 2.25591 1.03202 2.53205 1.03202L5.53205 1.03202C5.80819 1.03202 6.03205 1.25588 6.03205 1.53202L6.03205 4.53202C6.03205 4.80816 5.80819 5.03202 5.53205 5.03202C5.25591 5.03202 5.03205 4.80816 5.03205 4.53202L5.03205 2.68645L5.03054 2.68759L5.03045 2.68766L5.03044 2.68767L5.03043 2.68767C4.45896 3.11868 3.76059 3.64538 3.15554 4.3262C2.44102 5.13021 1.90321 6.10154 1.90321 7.29677ZM13.0109 7.70321C13.0109 4.69115 10.8505 2.6296 8.40384 2.17029C8.12093 2.11718 7.93465 1.84479 7.98776 1.56188C8.04087 1.27898 8.31326 1.0927 8.59616 1.14581C11.4704 1.68541 14.0532 4.12605 14.0532 7.70321C14.0532 9.23988 13.3541 10.4475 12.5377 11.3662C11.9528 12.0243 11.2837 12.5586 10.7456 12.968L12.3821 12.968C12.6582 12.968 12.8821 13.1918 12.8821 13.468C12.8821 13.7441 12.6582 13.968 12.3821 13.968L9.38205 13.968C9.10591 13.968 8.88205 13.7441 8.88205 13.468L8.88205 10.468C8.88205 10.1918 9.10591 9.96796 9.38205 9.96796C9.65819 9.96796 9.88205 10.1918 9.88205 10.468L9.88205 12.3135L9.88362 12.3123C10.4551 11.8813 11.1535 11.3546 11.7585 10.6738C12.4731 9.86976 13.0109 8.89844 13.0109 7.70321Z' fill='rgba(128,128,128,0.3)' /%3E%3C/svg%3E");
    width: 15px;
    height: 15px;
    background-size: cover;
    cursor: pointer;
}

.buttonPanel{
    display: flex;
    justify-content: space-between;
    margin-bottom: 5px;
    padding: 5px;
}

.checkbox *{
    cursor: pointer;
}

.flex{
    display: flex;
}

.littleText{
    width: 30px;
}
.littleText input{
    width: 100%;
}

.pageLines{
    overflow-y: auto;
}

.plate_approved{
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 511.999 511.999' style='enable-background:new 0 0 511.999 511.999;' xml:space='preserve'%3E%3Cpath style='fill:%23B7E183;' d='M502.87,75.474c-12.201-12.204-31.952-12.205-44.154-0.001L163.89,370.299L53.284,259.693 c-12.201-12.204-31.952-12.205-44.154-0.001c-12.173,12.174-12.173,31.981,0,44.153L141.814,436.53 c12.199,12.198,31.953,12.2,44.153,0L502.87,119.626C515.042,107.453,515.042,87.645,502.87,75.474z'/%3E%3Cpath style='fill:%2371DE56;' d='M502.87,75.474c-12.201-12.204-31.952-12.205-44.154-0.001L243.511,290.678v88.306L502.87,119.626 C515.042,107.453,515.042,87.645,502.87,75.474z'/%3E%3C/svg%3E");
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-size: contain;
    margin-left: 10px;
    margin-top: -5px;
}
.plate_approve{
    background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'%3E%3Cpath style='fill:%234CD1B6;' d='M466.526,498.526H45.474c-17.673,0-32-14.327-32-32V45.474c0-17.673,14.327-32,32-32h421.053 c17.673,0,32,14.327,32,32v421.053C498.526,484.2,484.2,498.526,466.526,498.526z'/%3E%3Cg%3E%3Crect x='185.263' y='13.474' style='fill:%23ECF0F1;' width='141.474' height='175.158'/%3E%3Cpath style='fill:%23ECF0F1;' d='M156.295,292.379L156.295,292.379c-23.068,0-41.768,18.7-41.768,41.768v164.379h83.537V334.147 C198.063,311.079,179.363,292.379,156.295,292.379z'/%3E%3C/g%3E%3Cg%3E%3Cpath style='fill:%23231F20;' d='M466.526,0H45.474C20.399,0,0,20.401,0,45.474v421.053C0,491.6,20.399,512,45.474,512h421.053 C491.601,512,512,491.6,512,466.526V45.474C512,20.401,491.601,0,466.526,0z M313.263,26.947v148.211H198.737V26.947H313.263z M128,485.053V334.147c0-15.601,12.692-28.295,28.295-28.295s28.295,12.694,28.295,28.295v150.905H128z M485.053,466.526 c0,10.216-8.311,18.526-18.526,18.526H211.537V334.147c0-30.46-24.782-55.242-55.242-55.242s-55.242,24.782-55.242,55.242v150.905 H45.474c-10.216,0-18.526-8.311-18.526-18.526V45.474c0-10.216,8.311-18.526,18.526-18.526h126.316v161.684 c0,7.44,6.032,13.474,13.474,13.474h141.474c7.442,0,13.474-6.034,13.474-13.474V26.947h126.316 c10.216,0,18.526,8.311,18.526,18.526V466.526z'/%3E%3Cpath style='fill:%23231F20;' d='M300.463,336.168h88.926c7.442,0,13.474-6.034,13.474-13.474c0-7.44-6.032-13.474-13.474-13.474 h-88.926c-7.441,0-13.474,6.034-13.474,13.474C286.989,330.135,293.022,336.168,300.463,336.168z'/%3E%3Cpath style='fill:%23231F20;' d='M433.853,363.116H303.158c-7.441,0-13.474,6.034-13.474,13.474c0,7.44,6.032,13.474,13.474,13.474 h130.695c7.442,0,13.474-6.034,13.474-13.474C447.326,369.149,441.294,363.116,433.853,363.116z'/%3E%3Cpath style='fill:%23231F20;' d='M433.853,417.011H303.158c-7.441,0-13.474,6.034-13.474,13.474c0,7.44,6.032,13.474,13.474,13.474 h130.695c7.442,0,13.474-6.034,13.474-13.474C447.326,423.044,441.294,417.011,433.853,417.011z'/%3E%3C/g%3E%3C/svg%3E");
    width: 20px;
    height: 15px;
    background-repeat: no-repeat;
    background-size: contain;
    margin-left: 10px;
    cursor: pointer;
    background-position: center;
}
.plate_approve:hover{
    box-shadow: 0px 0px 8px 0px rgba(34, 60, 80, 0.2);
}

.eventModalDiv{
    display: none;
    top: 0;
    height: calc(100vh - 50px);
}

.eventModalDiv img{
    width: 100%;
    height: 100%;
}

.eventFullPic{
    cursor: pointer;

}


@media screen and (max-width: 1336px) {
    .pageWiteSpace{
        width: calc(100vw - 70px);
    }
    .rightSideMainContainer{
        margin-left: 5px;
        width: calc(100% - 10px);
    }
    .paginator{
        width: calc(100% - 90px);

    }

}