/*::-webkit-scrollbar {width: 6px;border-radius:3px;}

::-webkit-scrollbar-track {-webkit-box-shadow:0 0 6px rgba(0,0,0,0.3);border-radius:3px;}

::-webkit-scrollbar-thumb {background-color: #6200EA;outline: 1px solid #6200EA;border-radius:3px;}*/

.col-12{padding:0;}


*{margin:0;border:0;padding:0;font-family: 'Open Sans', sans-serif;}

body{background: #fff;background: -webkit-linear-gradient(to right, #eef2f3, #fff);background: #e3e5e6;background-repeat: repeat-y;}


a{color:#1E88E5;}

p{margin-bottom:0;}


/*header{width:100%;height:50px;position:fixed;z-index:100;}

header .col-12{display:flex;flex-wrap:wrap;justify-content: space-between;}

footer{width:100%;margin:15px 0;}

footer p{font-size:14px;line-height:18px;color:#455A64;}*/

main{width:100%;min-height:calc(100vh - 98px);padding-bottom:15px;/*padding-top:50px;*/box-sizing: border-box;}

main .page-title{width:100%;font-size:24px;font-weight:600;margin: 30px 0 30px 0;color:#263238;text-shadow:0px 2px 6px rgba(0,0,0,.2);}

main .form .in{width:100%;position:relative;margin-top:30px;}

main .form input,main .form select{padding: .375rem .75rem;width:300px;height:30px;font-size:14px;padding-left:15px;border-radius:15px;max-width:100%;box-shadow:0px 1px 6px rgba(0,0,0,0.2);position:relative;outline:none;clear:both;}

main .form textarea{padding-top: 5px;font-size: 14px;padding-left: 15px;border-radius: 15px;max-width: 100%;box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.2);width: 75%;}

main .form select + label{position:absolute;left:0;top:0;}

main .form select:valid + label{top:-30px;}

main .form select:focus:valid + label{top:-30px;}

main .submit{width:200px;height:40px;font-size:14px;text-align: center;color:#fff;background: #ee0979;background: -webkit-linear-gradient(to right, #ff6a00, #ee0979);background: linear-gradient(to right, #ff6a00, #ee0979);box-shadow:0px 1px 6px rgba(0,0,0,0.4);border-radius:20px;margin-top:1px;cursor: pointer;}

main .restart{width:200px;height:40px;font-size:14px;text-align: center;color:#fff;background: #ff6a00;background: -webkit-linear-gradient(to right, #fff300, #ff6a00);background: linear-gradient(to right, #fff300, #ff6a00);box-shadow:0px 1px 6px rgba(0,0,0,0.4);border-radius:20px;margin-top:1px;cursor: pointer;}

main .item{width:100%;margin-top:15px;background:#fff;border-radius:3px;box-shadow:0px 2px 6px rgba(0,0,0,0.4);padding:15px;display:flex;flex-wrap:wrap;align-items: center;}

.row.button a button {text-align: center;}

.font-logs{font-size: 14px;}

@media (max-width: 520px) {
    header .profile .username{display:none;}
}

.select-date{font-size:14px;padding:5px 10px;border-radius:6px;box-shadow:0px 1px 6px rgba(0,0,0,0.2);outline: none;}

.nav-link{padding:0;}

.th-log{font: status-bar;font-weight: bold;}


/* NEW */

.reating-arkows {
    position: relative;
}
.reating-arkows *, .reating-arkows *:before, .reating-arkows *:after {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    cursor:pointer;
}
.reating-arkows input[type="checkbox"] {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
}
.reating-arkows input[type="checkbox"][disabled] ~ label {
    pointer-events: none;
}
.reating-arkows input[type="checkbox"][disabled] ~ label .trianglesusing {
    opacity: 0.4;
}
.reating-arkows input[type="checkbox"]:checked ~ label .trianglesusing:before {
    content: attr(data-unchecked);
    left: 0;
}
.reating-arkows input[type="checkbox"]:checked ~ label .trianglesusing:after {
    content: attr(data-checked);
}
.reating-arkows label {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.reating-arkows label .moresharpened {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-left: 32px;
}
.reating-arkows label .trianglesusing {
    position: relative;
}
.reating-arkows label .trianglesusing:before {
    content: attr(data-checked);
    position: absolute;
    top: 0;
    text-transform: uppercase;
    text-align: center;
}
.reating-arkows label .trianglesusing:after {
    content: attr(data-unchecked);
    position: absolute;
    z-index: 5;
    text-transform: uppercase;
    text-align: center;
    background: white;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.reating-arkows input[type="checkbox"][disabled] ~ label {
    color: rgba(119, 119, 119, 0.5);
}
.reating-arkows input[type="checkbox"]:focus ~ label .trianglesusing, .reating-arkows input[type="checkbox"]:hover ~ label .trianglesusing {
    background-color: #696464;
}
.reating-arkows input[type="checkbox"]:focus ~ label .trianglesusing:after, .reating-arkows input[type="checkbox"]:hover ~ label .trianglesusing:after {
    color: #484242;
}
.reating-arkows input[type="checkbox"]:hover ~ label {
    color: #615b5b;
}
.reating-arkows input[type="checkbox"]:checked ~ label:hover {
    color: #38962d;
}
.reating-arkows input[type="checkbox"]:checked ~ label .trianglesusing {
    background-color: #46963e;
}
.reating-arkows input[type="checkbox"]:checked ~ label .trianglesusing:after {
    color: #388e2e;
}
.reating-arkows input[type="checkbox"]:checked:focus ~ label .trianglesusing, .reating-arkows input[type="checkbox"]:checked:hover ~ label .trianglesusing {
    background-color: #45a53a;
}
.reating-arkows input[type="checkbox"]:checked:focus ~ label .trianglesusing:after, .reating-arkows input[type="checkbox"]:checked:hover ~ label .trianglesusing:after {
    color: #39942f;
}
.reating-arkows label .moresharpened {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.reating-arkows label .trianglesusing {
    -webkit-transition: background-color 0.3s cubic-bezier(0, 1, 0.5, 1);
    transition: background-color 0.3s cubic-bezier(0, 1, 0.5, 1);
    background: #736d6d;
}
.reating-arkows label .trianglesusing:before {
    color: rgba(255, 255, 255, 0.5);
}
.reating-arkows label .trianglesusing:after {
    -webkit-transition: -webkit-transform 0.3s cubic-bezier(0, 1, 0.5, 1);
    transition: transform 0.3s cubic-bezier(0, 1, 0.5, 1);
    color: #6b6565;
}
.reating-arkows input[type="checkbox"]:focus ~ label .trianglesusing:after, .reating-arkows input[type="checkbox"]:hover ~ label .trianglesusing:after {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4);
}
.reating-arkows input[type="checkbox"]:checked ~ label .trianglesusing:after {
    -webkit-transform: translate3d(65px, 0, 0);
    transform: translate3d(65px, 0, 0);
}
.reating-arkows input[type="checkbox"]:checked:focus ~ label .trianglesusing:after, .reating-arkows input[type="checkbox"]:checked:hover ~ label .trianglesusing:after {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4);
}
.reating-arkows label {
    font-size: 14px;
}
.reating-arkows label .trianglesusing {
    height: 36px;
    -webkit-flex: 0 0 134px;
    -ms-flex: 0 0 134px;
    flex: 0 0 134px;
    border-radius: 4px;
}
.reating-arkows label .trianglesusing:before {
    left: 67px;
    font-size: 12px;
    line-height: 36px;
    width: 67px;
    padding: 0 12px;
}
.reating-arkows label .trianglesusing:after {
    top: 2px;
    left: 2px;
    border-radius: 2px;
    width: 65px;
    line-height: 32px;
    font-size: 12px;
}
.reating-arkows label .trianglesusing:hover:after {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4);
}
.reating-arkows.twokadjacent input[type="checkbox"]:focus ~ label .trianglesusing:after, .reating-arkows.twokadjacent input[type="checkbox"]:hover ~ label .trianglesusing:after {
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
}
.reating-arkows.twokadjacent input[type="checkbox"]:checked ~ label .trianglesusing:after {
    -webkit-transform: translate3d(44px, 0, 0);
    transform: translate3d(44px, 0, 0);
}
.reating-arkows.twokadjacent input[type="checkbox"]:checked:focus ~ label .trianglesusing:after, .reating-arkows.twokadjacent input[type="checkbox"]:checked:hover ~ label .trianglesusing:after {
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
}
.reating-arkows.twokadjacent label {
    font-size: 13px;
}
.reating-arkows.twokadjacent label .trianglesusing {
    height: 28px;
    -webkit-flex: 0 0 90px;
    -ms-flex: 0 0 90px;
    flex: 0 0 90px;
    border-radius: 2px;
}
.reating-arkows.twokadjacent label .trianglesusing:before {
    left: 45px;
    font-size: 10px;
    line-height: 28px;
    width: 45px;
    padding: 0 12px;
}
.reating-arkows.twokadjacent label .trianglesusing:after {
    top: 1px;
    left: 1px;
    border-radius: 1px;
    width: 44px;
    line-height: 26px;
    font-size: 10px;
}
.reating-arkows.twokadjacent label .trianglesusing:hover:after {
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
}
.reating-arkows.transparentin input[type="checkbox"]:focus ~ label .trianglesusing:after, .reating-arkows.transparentin input[type="checkbox"]:hover ~ label .trianglesusing:after {
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);
}
.reating-arkows.transparentin input[type="checkbox"]:checked ~ label .trianglesusing:after {
    -webkit-transform: translate3d(130px, 0, 0);
    transform: translate3d(130px, 0, 0);
}
.reating-arkows.transparentin input[type="checkbox"]:checked:focus ~ label .trianglesusing:after, .reating-arkows.transparentin input[type="checkbox"]:checked:hover ~ label .trianglesusing:after {
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);
}
.reating-arkows.transparentin label {
    font-size: 14px;
}
.reating-arkows.transparentin label .trianglesusing {
    height: 40px;
    -webkit-flex: 0 0 255px;
    -ms-flex: 0 0 255px;
    flex: 0 0 255px;
    border-radius: 4px;
}
.reating-arkows.transparentin label .trianglesusing:before {
    left: 121px;
    font-size: 14px;
    line-height: 40px;
    width: 133px;
    padding: 0 12px;
}
.reating-arkows.transparentin label .trianglesusing:after {
    top: 2px;
    left: 2px;
    border-radius: 2px;
    width: 120px;
    line-height: 36px;
    font-size: 14px;
}
.reating-arkows.transparentin label .trianglesusing:hover:after {
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);
}
.reating-arkows.imagexplains input[type="checkbox"][disabled] ~ label {
    color: rgba(181, 62, 116, 0.5);
}
.reating-arkows.imagexplains input[type="checkbox"]:focus ~ label .trianglesusing, .reating-arkows.imagexplains input[type="checkbox"]:hover ~ label .trianglesusing {
    background-color: #b53e74;
}
.reating-arkows.imagexplains input[type="checkbox"]:focus ~ label .trianglesusing:after, .reating-arkows.imagexplains input[type="checkbox"]:hover ~ label .trianglesusing:after {
    color: #82224d;
}
.reating-arkows.imagexplains input[type="checkbox"]:hover ~ label {
    color: #8e2a58;
}
.reating-arkows.imagexplains input[type="checkbox"]:checked ~ label:hover {
    color: #2d825c;
}
.reating-arkows.imagexplains input[type="checkbox"]:checked ~ label .trianglesusing {
    background-color: #379a6e;
}
.reating-arkows.imagexplains input[type="checkbox"]:checked ~ label .trianglesusing:after {
    color: #368a65;
}
.reating-arkows.imagexplains input[type="checkbox"]:checked:focus ~ label .trianglesusing, .reating-arkows.imagexplains input[type="checkbox"]:checked:hover ~ label .trianglesusing {
    background-color: #3d9c72;
}
.reating-arkows.imagexplains input[type="checkbox"]:checked:focus ~ label .trianglesusing:after, .reating-arkows.imagexplains input[type="checkbox"]:checked:hover ~ label .trianglesusing:after {
    color: #2f7757;
}
.reating-arkows.imagexplains label .moresharpened {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.reating-arkows.imagexplains label .trianglesusing {
    -webkit-transition: background-color 0.3s ease-in-out;
    transition: background-color 0.3s ease-in-out;
    background: #c14b81;
}
.reating-arkows.imagexplains label .trianglesusing:before {
    color: rgba(255, 255, 255, 0.6);
}
.reating-arkows.imagexplains label .trianglesusing:after {
    -webkit-transition: -webkit-transform 0.3s ease-in-out;
    transition: transform 0.3s ease-in-out;
    color: #b53e74;
}
.reating-arkows.zatujgdsanuk input[type="checkbox"][disabled] ~ label {
    color: rgba(68, 68, 68, 0.5);
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:focus ~ label .trianglesusing, .reating-arkows.zatujgdsanuk input[type="checkbox"]:hover ~ label .trianglesusing {
    background-color: #444;
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:focus ~ label .trianglesusing:after, .reating-arkows.zatujgdsanuk input[type="checkbox"]:hover ~ label .trianglesusing:after {
    color: #2b2b2b;
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:hover ~ label {
    color: #373737;
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:checked ~ label:hover {
    color: #62b125;
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:checked ~ label .trianglesusing {
    background-color: #75d32d;
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:checked ~ label .trianglesusing:after {
    color: #5da924;
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:checked:focus ~ label .trianglesusing, .reating-arkows.zatujgdsanuk input[type="checkbox"]:checked:hover ~ label .trianglesusing {
    background-color: #69be28;
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:checked:focus ~ label .trianglesusing:after, .reating-arkows.zatujgdsanuk input[type="checkbox"]:checked:hover ~ label .trianglesusing:after {
    color: #52941f;
}
.reating-arkows.zatujgdsanuk label .moresharpened {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.reating-arkows.zatujgdsanuk label .trianglesusing {
    -webkit-transition: background-color 0.3s cubic-bezier(0.86, 0, 0.07, 1);
    transition: background-color 0.3s cubic-bezier(0.86, 0, 0.07, 1);
    background: #515151;
}
.reating-arkows.zatujgdsanuk label .trianglesusing:before {
    color: rgba(255, 255, 255, 0.7);
}
.reating-arkows.zatujgdsanuk label .trianglesusing:after {
    -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.86, 0, 0.07, 1);
    transition: transform 0.3s cubic-bezier(0.86, 0, 0.07, 1);
    color: #444;
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:focus ~ label .trianglesusing:after, .reating-arkows.zatujgdsanuk input[type="checkbox"]:hover ~ label .trianglesusing:after {
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:checked ~ label .trianglesusing:after {
    -webkit-transform: translate3d(58px, 0, 0);
    transform: translate3d(58px, 0, 0);
}
.reating-arkows.zatujgdsanuk input[type="checkbox"]:checked:focus ~ label .trianglesusing:after, .reating-arkows.zatujgdsanuk input[type="checkbox"]:checked:hover ~ label .trianglesusing:after {
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);
}
.reating-arkows.zatujgdsanuk label {
    font-size: 13px;
}
.reating-arkows.zatujgdsanuk label .trianglesusing {
    height: 60px;
    -webkit-flex: 0 0 120px;
    -ms-flex: 0 0 120px;
    flex: 0 0 120px;
    border-radius: 60px;
}
.reating-arkows.zatujgdsanuk label .trianglesusing:before {
    left: 60px;
    font-size: 13px;
    line-height: 60px;
    width: 60px;
    padding: 0 12px;
}
.reating-arkows.zatujgdsanuk label .trianglesusing:after {
    top: 2px;
    left: 2px;
    border-radius: 30px;
    width: 58px;
    line-height: 56px;
    font-size: 13px;
}
.reating-arkows.zatujgdsanuk label .trianglesusing:hover:after {
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.4);
}