@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,300;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap');

body, html { background-color:#FFFEFF !important; font-weight: 400; color: #4E5F83 !important; }
/* hmmmm */
body, html, input, select, textarea, h1, h2, h3, h4, h5, h6,
.ui.button, .ui.header, .ui.menu, .ui.text.container, .ui.input > input, .ui.list > .item .header,
.ui.steps .step .title, .ui.message .header, .ui.form .field input, .ui.form .fields input,
.ui.form .field textarea, .ui.form .fields textarea, .ui.form .field label, .ui.form .fields label,
.ui.cards > .card > .content > .header, .ui.card > .content > .header, .ui.items > .item > .content > .header,
.ui.statistics .statistic > .value, .ui.statistic > .value, .ui.statistics .statistic > .label, .ui.statistic > .label,
.ui.accordion .title:not(.ui), .ui.modal > .header, .ui.popup > .header, .ui.search > .results .result .title,
.ui.search > .results > .message .header, .ui.category.search > .results .category > .name,
.ui, .ui *, .ui > *, .ui > * > *, .ui > * > * > *, .ui > * > * > * > *, .swal2-modal, input, textarea, select {
    font-family: 'Titillium Web', -apple-system, system-ui, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, 'Segoe UI', Roboto, 'Fira Sans', Ubuntu, Oxygen, 'Oxygen Sans', Cantarell, 'Droid Sans','Lucida Grande', Helvetica, Arial, sans-serif;
}

.ui.attached.segment { margin-bottom: 20px; }
.ui.attached.header, .ui.dividing.header { font-weight: 500; }
.ui.dividing.header { font-weight: 600; }

.num, .number, .count, .rate, .panel, .kokpit { font-family: 'Rajdhani' !important; }
.kokpit { letter-spacing: 1px; }
.elapsedDate { font-family: 'Rajdhani' !important; font-weight: 600; }

input, textarea, select { color: #444 !important; }
h1, h2, h3, h4, h5, h6 { color: #00005D !important; }

body { overflow:hidden; overflow-y: auto; color: #FFF; }
body.login, body.notfound { height: auto; min-height: 100%; background-attachment:fixed; background-repeat:no-repeat; background-size:cover; background-position:center center; }
body.login { 
  background: rgb(106,78,152);
  background: linear-gradient(180deg, rgba(106,78,152,1) 0%, rgba(153,100,162,1) 100%);
}

header, footer { position: fixed; left: 0; width: 100%; padding-left: 270px; clear: both; z-index:995; background-color: rgba(255,255,255,0.95); }
header.mini, footer.mini { padding-left: 72px; }
header.scroll { background-color: rgba(255,255,255,0.95); box-shadow: 0px 1px 25px 0px rgba(0,0,0,0.1); }
header.login, footer.login, header.notfound, footer.notfound { display: none;  }

footer { bottom: 0; height: 52px; padding-top: 8px; border-top: 1px solid #EAEAEA; background-color: rgba(255,255,255,0.95); }

section { z-index: 99; background-color:#FFFFFF; padding: 165px 20px 60px 300px; height: 100%; }
section.login { padding: 0 !important; margin: 0 !important; height: 100%; background-color: transparent; }
section.mini { padding: 170px 20px 60px 100px; }

.privacyTitle, .privacyClose { color:#FFF !important; }
.privacyClose:hover { color:#0096FF !important; }
.privacyDescription { color:#CCC !important; }

.pusher { background: transparent !important; }
.ck-editor__editable[role="textbox"] { min-height: 200px; }

.e360-back { background-color: #AA6BBF !important; }
.e360-text { color: #AA6BBF !important; }

.login-section { 
     position: relative; width: 100%; max-width: 860px; height: auto; padding: 20px 15px; margin: auto; 
     /*background-image: url('/assets/img/login-box.png'); background-repeat:no-repeat; background-size:100%; background-position:top center;*/
}
.login-image { max-height: 220px; margin-bottom: -5px; }
.login-box {
    position: relative; margin: auto; 
    padding: 15px 60px 40px 60px; width: 100%;
    border:1px solid rgba(0,0,0,0.10); 
    background: rgb(192,230,244);
    background: linear-gradient(45deg, rgba(192,230,244,1) 0%, rgba(255,255,255,1) 35%, rgba(255,169,248,1) 100%);
    /*background-color:rgba(255,255,255,0.70); */
    border-radius: 20px; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.login-box input, .login-box .dropdown { 
  border-radius: 0px !important;
  background-color: transparent !important; border:none !important; border-bottom: 1px solid #AA6BBF !important; 
}
.login-box .dropdown > *, .login-box .dropdown .menu .item { color: #58389E !important; }

::-webkit-input-placeholder { color: #58389E !important; }
::-moz-placeholder { color: #58389E !important; }
:-ms-input-placeholder { color: #58389E !important; }
:-moz-placeholder { color: #58389E !important; }

.circles-text { font-size:13px !important; }

.new { position: absolute; right:30px; top:16px; color:#FFF; font-size: 9px; font-weight: 700 !important; text-transform: uppercase; color: lightgreen; }
.new [class^="fad"] { font-size:10px !important; margin: 0 !important; padding: 0 !important; }

#searchForm { display:none; }
.content-form { height: auto; min-height: auto; padding-bottom: 60px; width: 100%; max-width: 1600px; margin: auto; }
.previewImage { position: relative; width: 100%; height: 150px; min-width: 150px; max-height: 150px; background-position: center center; background-size: cover; background-image: url(../assets/img/noimage.png); border: 3px dashed #CCC !important; cursor: pointer; }
.previewImage:hover { border-color: #666 !important; }
.profileImage, .contentImage { position: relative; width: 100%; height: 150px; min-width: 150px; max-width: 150px; max-height: 150px; background-position: center center; background-size: cover; background-image: url(../assets/img/noimage.png); border: 2px solid #CCC !important; cursor: pointer; }
.referrerImage { position: relative; width: 100%; height: 72px; min-width: 72px; max-width: 72px; max-height: 72px; background-position: center center; background-size: cover; background-image: url(../assets/img/noimage.png); border: 2px solid #CCC !important; cursor: pointer; }
.profileImage { border-radius: 100%; }
.avatarImage { position: absolute; bottom: 0; right:0; width: 72px; height: 72px; border-radius: 100%; background-position: center center; background-size: cover; background-color: #000; border: 1px solid #FFF !important; cursor: pointer; }
.transparentBox { position: relative; width: 100%; background: center url(../../assets/img/transparent.png) repeat; margin-bottom: 10px;}
.iconPreview { position: relative; display: block; width: 100%; height: 96px; margin-bottom: 20px; background-position: center center; background-repeat: no-repeat; background-size: contain; border: 1px solid #EAEAEA; background-color: #F9F9F9; box-shadow: inset 1px 0 10px rgba(0,0,0,0.10); background-image: url(../assets/img/noimage.png); }
.imagePreview { position: relative; display: block; width: 100%; height: 125px; margin-bottom: 20px; background-position: center center; background-repeat: no-repeat; background-size: contain; border: 1px solid #EAEAEA; background-color: #F9F9F9; box-shadow: inset 1px 0 10px rgba(0,0,0,0.10); background-image: url(../assets/img/noimage.png); }

.modulProfile .meta {  }
.modulProfile .header { font-size: 18px !important; line-height: 24px; white-space: nowrap !important text-overflow: ellipsis; overflow: hidden; margin: 0px 0px 5px 0px !important; }
.modulProfile .description { margin-top: -5px !important; }

.topBar { border-bottom: 1px solid #FCFCFC; }
.topBar span.divider { margin-left: 10px; margin-right: 10px; height: 100%; border-left: 1px solid #CCC; border-right: 1px solid #FFF; }
.topBar .linkIcon { cursor: pointer; display: inline-block; }
.topBar .ui.icon.input { min-width: 290px; }

.mailtemplate, .editTable { width: 100%; }
.mailtemplate td:first-child, .editTable td:first-child { white-space: nowrap; font-weight: 500; }
.mailtemplate td:last-child, .editTable td:last-child { width: 100%; text-align: right !important; }

.modulTitle { height: 82px; border: none; border-bottom: 1px solid rgba(0,0,0,0.07); border-top: 1px solid rgba(0,0,0,0.07); }
.modulTitle .ui.breadcrumb { padding-left: 7px; margin-bottom: 5px; }
.modulTitle .breadButton { color:#111; }
.modulTitle .caption { text-overflow:ellipsis; white-space: nowrap; overflow: hidden; font-size: 22px; line-height: normal; font-weight: 700; padding-bottom: 5px; color: #031B4E; }
.modulTitle table { width: 100%; table-layout: fixed; height: 100% !important; }
.modulTitle table td { vertical-align: middle; height: 100% !important; }
.modulTitle table td.modulIcon { width: 82px; color: #666; text-align: center; color: #888EA8; font-size: 52px; }
.modulTitle table td.title { width: 100%; }
.modulTitle table td.button { color:#EEE; padding-right: 15px; width: 260px; }
.modulTitle a, .modulTitle a:visited { color: #888EA8; }
.modulTitle a:hover { color: #060818; }

.modulInfo .ui.dividing.header { margin-top:20px; }
table.modulInfo { width: 100%; }
table.modulInfo tr td:first-child { text-align: center; vertical-align: middle; }
table.modulInfo tr td.input { width: 100% !important; }
table.modulInfo tr td,
table.modulInfo tr td span { font-family: 'Rajdhani' !important; font-size:13px; line-height: 16px; font-weight: 500; white-space: nowrap; }
table.modulInfo tr td i.fad { padding-right: 10px; font-size:20px; font-size: 20px; }
table.modulInfo tr td span { display: block; color: #345066; font-weight: 600; }
table.modulInfo tr td span.elapsedDate { font-size:11px; color: #888; }
table.modulInfo tr td span.id { font-family: 'Rajdhani' !important; }
table.modulInfo tr td span.count { font-size: 19px; font-weight: 600;  }
table.modulInfo tr td span.user { font-weight: 500; color: #345066; }
table.modulInfo tr td span.dt { font-size: 13px; font-weight: 600; }

/*
 * LIST FORM
 */
table.listResult th { font-weight: 600 !important; font-size: 13px !important; text-transform: uppercase !important; }
table.listResult td { font-size: 12px; }
table.listResult td span { font-size: 12px; color: #666; }
table.listResult td a.link { font-size: 15px !important; font-weight: 500; white-space: nowrap !important; text-overflow: ellipsis; width: 100%; max-width: 380px; display: block; overflow: hidden; }
table.listResult td a.listlink { font-size: 15px !important; font-weight: 500; width: 100%; max-width: 320px; display: block; text-overflow: ellipsis; overflow: hidden; }
table.listResult td .fad { font-size: 13px; }
table.listResult td h1, table.listResult td h2,
table.listResult td h3, table.listResult td h4,
table.listResult td h5 { margin: 0 !important; }
table.listResult td num { font-family: 'Rajdhani'; font-size: 15px; font-weight: 600; }
table.listResult td count { font-family: 'Rajdhani'; font-size: 18px; font-weight: 600; display: block; }
table.listResult td date { font-size: 11px; display: block; }
table.listResult td .preview,
table.listResult td .profile,
table.listResult td .showcase { width: 72px; height: 72px; border: 1px solid #CCC; background-position: center center; background-size: cover; background-image: url(../assets/img/noimage.png); }
table.listResult td .profile { border-radius: 100% !important; }

.listRecordView { position: relative; width: 100%; height: auto; }

ul.listBox { position: relative; height: 250px; min-height: 250px; overflow: hidden; overflow-y: auto; z-index: 1; width: 100%; max-width: 100%; list-style: none; margin: 0; padding: 10px; border:1px solid #CCC; background-color: #FFF; }
ul.listBox li { position: relative; width: 100%; display: block; cursor: pointer; vertical-align: middle; padding: 5px; }

/*
 * DASH WIDGET
 */
.dashwidget { min-height: 135px; margin-bottom: 0 !important; border-top: 2px solid #4E5F83 !important; }
.dashwidget.small { min-height: 110px; margin-bottom: 0 !important; border-top: 2px solid #4E5F83 !important; }
.dashwidget [class^="fad fa-"] { position: absolute; top: 10px; right: 10px; font-size: 36px; color: #4E5F83; }
.dashwidget .profileImage { position: absolute; top: 10px; right: 10px; width: 72px; height: 72px; min-width: 72px; max-width: 72px; max-height: 72px; }
.dashwidget .title { display: inline-block; font-size: 13px; font-weight: 500; color: #060818; }
.dashwidget .value { font-family: 'Rajdhani'; display: block; font-size: 32px; font-weight: 700; margin: 10px 0; color: #031B4E; }
.dashwidget .text { display: block; font-size: 16px; font-weight: 700; margin: 10px 0; color: #031B4E; }
.dashwidget .ui.divider { font-size: 11px; font-weight: 600; margin-bottom: 5px; margin-top: 15px !important; color: rgb(77, 96, 125); }
.dashwidget .info { font-size: 11px; line-height: 15px; color: rgb(101, 116, 135); }
.dashwidget .ui.grid { max-width: 90% !important; }
.dashwidget .progress { margin-bottom:-5px; margin-top:-5px; }
a .ui.segment, a .ui.inverted.segment { transition: all .3s ease-out; }
a:hover .ui.segment, a:hover .ui.inverted.segment { box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 15px 0px; background-color: #FAFAFA !important; }

.dashtable td:first-child { vertical-align: top; }
.dashtable .title { display: block; font-size: 13px; font-weight: 500; color: #060818; }
.dashtable .value { display: block; font-size: 12px; font-weight: 400; color: #031B4E; }
.dashtable [class^="fad fa-"] { font-size: 24px; color: #4E5F83; }
.dashtable td:last-child { width: 100%; }

.dragMode { border:2px dashed #CCC !important; }
.dragMode:hover { border-color: #666 !important; }

.sideRight { position: fixed; display: none; right: 0; top: 0; width: 270px; height: 100%; z-index: 999; background-color: #060818; }

 /*
  * SIDE BAR
  */
.sideBar { position: fixed; left: 0; top: 0; width: 270px; height: 100%; z-index: 999; background-color: #060818; box-shadow: none; -webkit-transition : box-shadow ease-in-out .5s; transition : box-shadow ease-in-out .5s; }
.sideBar:hover { box-shadow: 25px 0px 25px -15px rgba(0,0,0,0.4); -webkit-transition : box-shadow ease-in-out .5s; transition : box-shadow ease-in-out .5s; }
.sideBar .logo { position: relative; padding: 5px 10px; margin:auto; clear: both; }
.sideBar .logo a.text img,
.sideBar .logo a.icon img { float: left; max-width: 62px;  width: 100%; }
.sideBar .logo a.icon div { display: none; }
.sideBar .logo a.text div { display: block; float: left; padding: 10px 0 0 10px; }
.sideBar .logo a.text h2 { color:#FFF !important; font-weight: 500; margin-bottom: -5px !important; font-size:18px; }
.sideBar .logo a.text h4 { color:#CCC !important; font-weight: 400; }
.sideBar .user { position: relative; padding: 10px 15px; clear: both; margin-top: 5px; margin-bottom: 10px; }
.sideBar .user table td:last-child { width: 100%; color: #23B6D1; }
.sideBar .user:hover, .sideBar .user.active { background-color: #171B2F; cursor: pointer; }
.sideBar .userDiv { position: relative; width: 50px; padding: 3px; text-align: center; margin-right: 10px; }
.sideBar a { color: #888EA8; }
.sideBar a:hover { color: #FFF; }

.sideBar .loginImage {
     position: relative; width: 42px; height: 42px; margin: auto;
     background-position: center center; background-color: #000; background-position: center center; background-size: cover;
     border-radius: 100%; border:2px solid #CCC;
}

.sideBar .userInfo { position: relative; }
.sideBar .userInfo span { font-size: 13px; color: #999; }
.sideBar .userInfo h4 { color: #FFF !important; }
.sideBar .content { position: relative; width: 100%; height: calc(100vh - 160px); overflow-y: auto; z-index: 999; }
.sideBar [class^="pe-7"] { font-size: 21px; width: 36px; vertical-align: middle; color: #999; }
.sideBar [class^="icofont-"] { font-size: 24px; vertical-align: middle; color: #999; padding-right: 10px; }
.sideBar [class^="fad"] { font-size: 24px; vertical-align: middle; color: #999; margin-right: 10px; display: inline-block; }
.sideBar .sideButton { color: #0B6C84; float: right; }
.sideBar .sideButton:hover { color: #23B6D1; cursor: pointer; }

.sideBar ul, .sideMenu ul { padding: 0; margin: 0; list-style: none; }
.sideBar li.divider { padding: 5px 15px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: #FFF; }

.sideBar ul li, .sideMenu ul li {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     position: relative;
}

.sideBar ul li a, .sideMenu ul li a {
     position: relative;
     display: block;
     padding: 13px 15px;
     padding-left: 20px;
     font-size: 14px;
     font-weight: 500;
     color: #888EA8 !important;
     outline-width: 0;
     cursor: pointer;
}

.sideBar ul li a span,
.sideBar ul li a [class^="pe-7f-"],
.sideBar ul li a [class^="icofont-"],
.sideBar ul li a [class^="fad"] { color: #888EA8;  }

.sideBar ul li a:hover, .sideBar ul li a:focus, .sideBar ul li a.active { color: #FFF !important; background: #171B2F; }
.sideBar ul li a:hover > *, .sideBar ul li a:focus > *, .sideBar ul li a.active > * { color: #FFF; }
.sideBar ul li:hover a:hover.has-arrow:after,
.sideBar ul li a.active.has-arrow:after { transform: rotate(135deg); }
.sideBar .sideFoot { position: relative; text-align: center; margin-bottom: 30px; }

.sideBar.mini { width: 72px; }
.sideBar.mini .logo.mini  { width: 52px; }
.sideBar.mini a span.mtitle { display: none; }
.sideBar.mini li.divider { display: none; }
.sideBar.mini .user { padding: 10px 8px; }
.sideBar.mini .userDiv { margin-right: 0; }
.sideBar.mini ul li a i { font-size: 26px; width: 38px; text-align: center; }
.sideBar.mini [class^="pe-7"],
.sideBar.mini [class^="icofont-"],
.sideBar.mini [class^="fad-"] { font-size: 28px; width: 42px; text-align: center; border:1px solid #FFF; }
.sideBar.mini ul li a { padding-left: 15px; }
.sideBar.mini ul li .has-arrow::after { display: none; }
.sideBar.mini .sideButton { float: inherit; margin: auto; text-align: center; }
.sideBar.mini .user table td:first-child { width: 100%; color: #23B6D1; }
.sideBar.mini .user table td.col-userInfo { display: none; }
.sideBar.mini .col-userInfo { display: none; }
.sideBar.mini .sideFoot { display: none; }

 /*
  * SIDE MENU
  */
.sideMenu { position: absolute; left: 100%; top: 0; width: 300px; height: 100%; z-index: 998; background-color: #171B2F; display: none; box-shadow: 25px 0px 25px -15px rgba(0,0,0,0.4); }
.sideMenu .content { position: relative; width: 100%; height: 100%; overflow: auto; overflow-x: hidden; }
.sideMenu .sideList { position: relative; padding: 10px 0; display: none; }
.sideMenu .sideList .title { color: #FFF !important; padding-bottom: 10px; text-transform: uppercase; font-size: 15px; font-weight: 600; letter-spacing: 1px; border-bottom: 1px solid #3A424E; }
.sideMenu .sideList .sideClose { position: absolute; right: 10px; top: 15px; font-size: 14px; line-height: 24px; cursor: pointer; }
.sideMenu .sideList .sideClose:hover { color:#FFF; }
.sideMenu [class^="list-"] { display: none; }
.sideMenu ul li a { font-size: 14px; padding-right: 0px !important; }
.sideMenu ul li a:hover,
.sideMenu ul li a:focus { color: #FFF; background-color: #060818; }
.sideMenu ul li a [class^="pe-7f-"],
.sideMenu ul li a [class^="icofont-"],
.sideMenu ul li a [class^="fad"] { font-size: 24px; }

.sideMenu a:hover,
.sideMenu a:focus,
.sideMenu a:active { color: #FFF !important; background: #060818; transition: all .5s ease-out; }

@media (max-width: 1170px) {

 header, footer { padding-left: 72px; }
 section { padding: 180px 0px 60px 100px; }
 .content-loader { margin-left: 180px !important; }

}

@media (max-width: 980px) {

 .barTimezone { display: none; }
 .modulInfo .ui.dividing.header { margin-top:-20px; }

}

@media (max-width: 870px) {

 .content-loader { margin-left: 150px !important; }
 section.mini { padding: 150px 20px 60px 100px; }
 .barSearch { display: none; }

}