@import url('https://fonts.googleapis.com/css2?family=Lora:ital@1&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Lato:wght@100&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@200&display=swap'); * { margin: 0; padding: 0; } body { height: 100%; background-image: url(/static/app/img/f_blur.AVIF); background-size: cover; background-attachment: fixed; color: #5B5B5B; font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; line-height: 1.42857143; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-size: 16px; overflow-x: hidden; } .wrapper { position: relative; min-height: calc(100vh - 68.2px); } .mob-header { display: none; } .main-header { position: absolute; margin-left: 0px; top: 0; border-bottom: 1px solid #dee2e6; z-index: 1034; position: fixed; display: -ms-flexbox; display: -webkit-box; display: flex; width: 100%; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: center; -webkit-box-align: center; align-items: center; -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; padding: 0; margin: 0; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; background: #fff !important; -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 10%); box-shadow: 0 0 10px 0 rgb(0 0 0 / 10%); } .logo_btn, .header_buttons { position: relative; margin: 0; padding: 0; float: right; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-direction: row; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; vertical-align: middle; padding-left: 0; margin-bottom: 0; list-style: none; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; } .head_nav_btn, .head_nav_btn_log_out, .head_nav_btn_help { position: relative; height: 67.2px; display: flex; flex-direction: row; margin: auto 0; color: #000; font-size: 14px; font-family: sans-serif; font-weight: 100; vertical-align: middle; border: none; outline: none; text-decoration: none; background: transparent; padding: 0 25px; cursor: pointer; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; } .head_nav_btn>i { position: relative; width: auto; height: auto; align-self: center; margin: 0; color: rgba(0, 0, 0, .5); font-size: 26px; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; } .head_nav_btn_log_out>i { position: relative; width: auto; height: auto; align-self: center; margin: 0; color: rgba(0, 0, 0, .5); font-size: 29px; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; } .head_nav_btn_help>i { position: relative; width: auto; height: auto; align-self: center; margin: 0; color: rgba(0, 0, 0, .5); font-size: 22px; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; } .back_ic { fill: #21A7B9; } .svg_ic_btn { position: relative; width: auto; height: 26px; align-self: center; margin: 0; fill: rgba(0, 0, 0, .5); -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; } .head_nav_btn>i:hover, .head_nav_btn_log_out>i:hover, .head_nav_btn_help>i:hover, .svg_ic_btn:hover { -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; color: #21A7B9; fill: #21A7B9; } .notification { text-decoration: none; position: relative; } .notification .badge { position: absolute; top: 10px; right: 3px; padding: 4px 8px; border-radius: 10px; background-color: #e34140; color: white; font-size: 12px; } .head_btn_reg { position: relative; display: flex; flex-direction: row; margin: auto 0; padding-top: .7rem; padding-bottom: .7rem; padding-left: 20px; padding-right: 20px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; color: rgba(0, 0, 0, .5); text-decoration: none; background-color: transparent; cursor: pointer; border: 1px solid transparent; height: auto; vertical-align: middle; align-self: center; font-size: 16px; font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; width: auto; text-decoration: none; white-space: nowrap; outline: none; cursor: pointer; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: no; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; } .head_btn_reg:hover { -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; color: #21A7B9; -webkit-transition: .6s; -o-transition: .6s; transition: .6s; border: 1px solid #21A7B9; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; } .navbar-nav { float: left; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-direction: row; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; padding-left: 0; margin-bottom: 0; list-style: none; } .navbar-nav_log { float: right; display: -ms-flexbox; display: -webkit-box; display: flex; -ms-flex-direction: row; -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; padding-left: 0; margin-bottom: 0; list-style: none; } .navbar-brand { font-family: 'Work Sans', sans-serif; display: inline-block; padding-top: 0.3125rem; padding-bottom: 0.3125rem; padding-left: 0.3125rem; margin-right: 1rem; font-size: 1.25rem; line-height: inherit; letter-spacing: -.5px; white-space: nowrap; font-weight: 800; line-height: .9; font-size: 20px; text-transform: uppercase; text-decoration: none; color: #343a40; -webkit-transition: 0.8s; -o-transition: 0.8s; transition: 0.8s; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: no } .openbtn, .closebtn, #login_btn { display: block; font-size: 26px; padding: 5px 20px; color: rgba(0, 0, 0, .5); text-decoration: none; background-color: transparent; cursor: pointer; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; -webkit-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; } .logo_OGPT { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; margin: 0; padding: 0; -webkit-transition: 0.8s; -o-transition: 0.8s; transition: 0.8s; } .ogpt_anim { position: relative; -webkit-transition: -webkit-transform 1s ease-in-out; transition: transform 1s ease-in-out; } .ogpt_anim:hover { -webkit-transform: rotate(-500deg); transform: rotate(-500deg); } #registr_btn { display: block; padding-top: .7rem; padding-bottom: .7rem; padding-left: 20px; padding-right: 20px; margin-right: 20px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; color: rgba(0, 0, 0, .5); text-decoration: none; background-color: transparent; cursor: pointer; border: 1px solid transparent; -webkit-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: no; } #registr_btn:hover, #registr_btn_mob:hover { -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; color: #78d5ef; -webkit-transition: .6s; -o-transition: .6s; transition: .6s; border: 1px solid #78d5ef; } #registr_btn_mob { display: block; padding-top: .7rem; padding-bottom: .7rem; padding-left: 20px; padding-right: 20px; margin: 0 auto; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; width: 40%; color: rgba(0, 0, 0, .5); text-decoration: none; background-color: transparent; cursor: pointer; border: 1px solid transparent; -webkit-transition: .6s; -o-transition: .6s; transition: .6s; } .tablinks, .nav-link { display: block; padding-top: .9rem; padding-bottom: .9rem; padding-left: 20px; padding-right: 20px; margin: 0 4px 0 4px; color: rgba(0, 0, 0, .5); -webkit-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; text-decoration: none; background-color: transparent; cursor: pointer; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently not supported by any browser */ } .openbtn:focus, .closebtn:focus, #login_btn:focus { -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; color: #adadad; } .openbtn:hover, .closebtn:hover, #login_btn:hover { -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; color: #29bae4; } .openbtn.active, .closebtn.active, #login_btn.active { color: #29bae4; -webkit-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; } .tablinks:focus, .nav-link:focus { background: #29bae4; border-radius: 7px; -webkit-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; } .tablinks:hover, .nav-link:hover { -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; background: #29bae4; border-radius: 7px; color: #fff; } .tablinks.active, .nav-link.active { background: #29bae4; border-radius: 7px; color: #fff; -webkit-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; } .openbtn { display: none; } .closebtn, #login_btn { display: block; font-size: 26px; padding: 5px 20px; color: rgba(0, 0, 0, .5); text-decoration: none; background-color: transparent; cursor: pointer; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; -webkit-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; } #login_btn:focus { transition: 0.6s ease; color: #adadad; } #login_btn:hover { transition: 0.6s ease; color: #29bae4; } #login_btn.active { color: #29bae4; transition: 0.6s; } .logo_OGPT { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; margin: 0; padding: 0; -webkit-transition: 0.8s; -o-transition: 0.8s; transition: 0.8s; } .ogpt_anim { position: relative; -webkit-transition: 0.8s; -o-transition: 0.8s; transition: 0.8s; } .ogpt_anim:hover { -webkit-animation: preloader-rotate 2s infinite linear; animation: preloader-rotate 2s infinite linear; -webkit-transition: 0.8s; -o-transition: 0.8s; transition: 0.8s; } #registr_btn { display: block; padding-top: .7rem; padding-bottom: .7rem; padding-left: 20px; padding-right: 20px; margin-right: 20px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; color: rgba(0, 0, 0, .5); text-decoration: none; background-color: transparent; cursor: pointer; border: 1px solid transparent; -webkit-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; } #registr_btn:hover, #registr_btn_mob:hover { -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; color: #78d5ef; -webkit-transition: .6s; -o-transition: .6s; transition: .6s; border: 1px solid #78d5ef; } #registr_btn_mob { display: block; padding-top: .7rem; padding-bottom: .7rem; padding-left: 20px; padding-right: 20px; margin: 0 auto; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; width: 40%; color: rgba(0, 0, 0, .5); text-decoration: none; background-color: transparent; cursor: pointer; border: 1px solid transparent; -webkit-transition: .6s; -o-transition: .6s; transition: .6s; } .er-start { margin: 0px; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } .er-start>.nav_start { position: fixed; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: 100%; top: 68.2px; -webkit-box-align: center; -ms-flex-align: center; justify-content: space-between; background: #343A40; height: 50px; z-index: 1000; } .nav_start>.input_navbar, .nav_start>.progress_navbar, .nav_start>.output_navbar { position: relative; width: 100%; z-index: 100; align-items: center; display: flex; flex-direction: row; } .input_navbar { justify-content: flex-start; } .progress_navbar { justify-content: center; } .output_navbar { justify-content: flex-end; } .navbtn { padding-top: 2px; padding-bottom: 2px; padding-left: 25px; padding-right: 20px; margin-right: 20px; color: #E4E4E4; font-size: 16px; font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-weight: 100; align-self: center; width: auto; text-decoration: none; white-space: nowrap; background-color: transparent; cursor: pointer; border: 1px solid transparent; -webkit-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: no; } .navbtn_exp { padding-top: 2px; padding-bottom: 2px; padding-right: 20px; padding-left: 0px; color: #E4E4E4; font-size: 16px; font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-weight: 100; align-self: center; width: auto; text-decoration: none; white-space: nowrap; background-color: transparent; cursor: pointer; border: 1px solid transparent; -webkit-transition: 0.6s; -o-transition: 0.6s; transition: 0.6s; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: no; } .progress_div { width: 220px; padding: 5px 0; display: flex; flex-direction: row; justify-content: center; align-self: center; text-align: center; vertical-align: middle; color: #E4E4E4; font-size: 16px; font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-weight: 100; background: rgba(84, 92, 100, .3); border-radius: 30px; } .navbtn:hover, .navbtn_exp:hover { color: #fff; -webkit-transition: .6s; -o-transition: .6s; transition: .6s; } #body_error_list { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; flex-direction: column; width: 100%; top: 118.2px; height: auto; background: rgba(255, 255, 255, 0.1); } .table_input { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; margin-right: 0; -webkit-transition: .8s; -o-transition: .8s; transition: .8s; text-align: center; } .table_input>.error_list { position: relative; margin: 0 auto; margin-bottom: 20px; background: #fff; overflow: hidden; width: 70%; height: auto; border-radius: 7px 7px 0 0; -webkit-transition: .8s; -o-transition: .8s; transition: .8s; } .wrap-sc { top: 189px; text-align: center; max-height: calc(100vh - 280px); overflow-y: scroll; border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; } .head_panel { position: relative; align-items: center; color: #416875; padding: 2px 40.5px; border: none; text-align: center; outline: none; font-size: 16px; border-radius: 7px; margin: 20px 10px 10px; } .main_table { position: relative; border: none; table-layout: fixed; height: auto !important; font-size: 14px; border-collapse: collapse; } .main_table th { padding: 5px 20px; background: #4F5759; color: #eee; font-size: 16px; font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; font-weight: 100; align-self: center; margin: 0; } .main_table thead { border-bottom: 2px solid #9FCBD9; background: #4F5759; } .main_table tbody { overflow-y: scroll; max-height: calc(100vh - 300px); } .main_table td { padding: 6px 10px; border-bottom: 0.5px solid #eee; text-align: center; max-width: 300px; -webkit-transition: .8s; -o-transition: .8s; transition: .8s; background: transparent; } .none_click { -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: no; } .close_task_btn { position: relative; border: none; outline: none; padding: 0px 20px; font-size: 20px; margin-left: 20px; color: rgba(0, 0, 0, .45); transition: .8s; background: transparent; cursor: pointer; } .close_task_btn:hover { color: #343A40; transition: .8s; } .er-start>#footerstart { position: absolute; position: fixed; display: -ms-flexbox; display: -webkit-box; display: flex; width: 100%; bottom: 0; color: rgba(41, 41, 41, 1); border-top: 1px solid rgba(0, 0, 0, .125); -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: center; -webkit-box-align: center; align-items: center; -ms-flex-pack: justify; -webkit-box-pack: justify; justify-content: space-between; padding: 5px 10px 5px 10px; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; font-size: 14px; background: #aaa; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: no; } .er-start>#footerstart>ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; padding-left: 0; margin-bottom: 0; list-style: none; -webkit-transition: 0.6s ease; -o-transition: 0.6s ease; transition: 0.6s ease; } .er-start>#footerstart>ul>li { padding: 0 10px; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently not supported by any browser */ } .er-start>#footerstart>ul>.des { margin-right: 20px } ::-webkit-scrollbar { width: 10px; height: 11px; } ::-webkit-scrollbar-track { background: #f8f9fa; box-shadow: 0 0 2px rgba(91, 91, 91, .1) inset; } ::-webkit-scrollbar-thumb { background: #ccc; border-radius: 8px; border: 3px solid #f8f9fa; } @media screen and (max-width: 990px) { body { background-color: #fff; color: #5B5B5B; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-size: 16px; } .main-header { display: none; } .mob-header { margin-left: 0px; top: 0; border-bottom: 1px solid #dee2e6; z-index: 1034; position: fixed; display: -ms-flexbox; display: flex; width: 100%; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; transition: 0.6s ease; background: #fff !important; -webkit-box-shadow: 0 0 10px 0 rgb(0 0 0 / 10%); box-shadow: 0 0 10px 0 rgb(0 0 0 / 10%); height: 67.2px; } .mob-nav { display: -ms-flexbox; display: flex; -ms-flex-direction: row; flex-direction: row; padding-left: 0; margin-bottom: 0; list-style: none; transition: 0.6s ease; } .mob-nav>li>a>i { font-size: 35px; color: #444; padding: 0px 25px; position: relative; transition: 0.6s ease; } .topnav-centered { float: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .topnav-right { float: right; } } @media screen and (max-width: 1540px) { td { nowrap: none; } } @media screen and (max-width: 530px) { .sidebar-inner { padding-top: 67px; padding-bottom: 30px; position: relative; overflow-y: scroll; min-height: calc(100vh - 964px); height: 100%; } .navbar-nav { display: -ms-flexbox; display: flex; -ms-flex-direction: column; flex-direction: column; } }