@import url("fonts.css"); /* @import url("button.css"); */ .item-user { list-style-type: none; padding-bottom: 5px; padding-top: 5px; border-bottom: 1px solid #f1f1f1; } a.chatting { height: 130px; width: 130px; border: 1px solid #46b8da } a.chatting:hover { background-color: #46b8da; color: white } /*

URAIAN KEGIATAN Q DAN MU

*/ /****/ .container-aps { min-height: calc(100vh - 94px - 122px); *border: 1px solid red; } @media screen and (max-width:767px) { .container-aps { min-height: auto; } } @media only screen and (max-width: 1024px) { .container { width: calc(100% - 0px); } } .container-aps-header { *border: 4px solid blue; padding-left: 0px !important; padding-right: 0px !important; position: relative; transition: all 0.2s ease-in-out; *border: 1px solid red; *height: 47px; *line-height: 47px; } @media only screen and (max-width: 1024px) { .container-aps-header { *border: 1px solid red; padding-left: 15px !important; padding-right: 15px !important; } } @media screen and (max-width:767px) { .container-aps-header { *border: 2px solid red; padding-left: 0px !important; padding-right: 0px !important; } } /*@media screen and (max-width:767px) { .container-aps-header{ border:1px solid red; } }*/ .container-aps-header.active { background: #FFF; } .container-aps { *border: 4px solid green; } .container-aps-footer { *padding-left: 0px; *padding-right: 0px; *border: 4px solid red; height: 100px; background: url(../images/bg-footer.png) bottom center no-repeat; position: relative; } @media screen and (max-width:767px) { .container-aps-footer { *border: 1px solid red; height: auto; *background: pink; *background: none; background-size: 200% 100%; } } .container-aps-footer .judul-kontak { float: left; width: 160px; height: 100px; background: url(../images/bg-judul-kontak.png) top left no-repeat; color: #029ac1; position: relative; } @media screen and (max-width:767px) { .container-aps-footer .judul-kontak { width: 100%; height: auto; *border: 1px solid cyan; background: none; padding-top: 10px; } } .container-aps-footer .judul-kontak span:nth-child(1) { position: absolute; bottom: 30px; right: 40px; } .container-aps-footer .judul-kontak span:nth-child(2) { position: absolute; bottom: 10px; right: 40px; letter-spacing: 3.4px; } @media screen and (max-width:767px) { .container-aps-footer .judul-kontak span:nth-child(1) { position: relative; bottom: auto; right: auto; } .container-aps-footer .judul-kontak span:nth-child(2) { position: relative; bottom: auto; right: auto; letter-spacing: normal; } } .container-aps-footer .alamat { float: left; padding-top: 14px; } .container-aps-footer .alamat table { font-size: 14px; color: #999999; } .container-aps-footer .alamat table td { padding: 0 5px; } .container.container-aps-footer { *border: 1px solid cyan; position: relative; } .container-aps-footer .copyright { position: absolute; bottom: 6px; right: 15px; float: right; *margin-top: 74px; color: #029ac1; letter-spacing: 3px; text-transform: uppercase; font-size: 14px; *border: 1px solid red; text-align: right; } @media screen and (max-width:767px) { .container-aps-footer .copyright { position: relative; bottom: auto; right: auto; width: 100%; letter-spacing: normal; text-transform: uppercase; font-size: 13px; text-align: center; padding-top: 20px; *padding-bottom: 20px; padding-bottom: 80px; } } @media (min-width: 1200px) { .container-aps-header { *border: 1px solid green; width: 100%; *width: 1300px; min-height: 94px; *background: rgba(0, 0, 0, 0.2); *background: #1aa7cb; } .container-aps { *border: 2px solid red; *width: 1300px; width: calc(100% - 130px); *min-height: 94px; *background: rgba(0, 0, 0, 0.2); } .container-aps-footer { width: calc(100% - 130px); *background: cyan; } } .container-aps .area-logo { padding: 0 0; } .container-aps .col-md-12 { *padding-left: 0px; *padding-right: 0px; *position: inherit; } /*.container-aps > .col-md-9, .container-aps-footer > .col-md-9{ padding-left:0px; padding-right:0px; } .container-aps > .col-md-3, .container-aps-footer > .col-md-3{ padding-left:0px; padding-right:0px; } */ .container-aps>.row>.col-md-9 { padding-right: 0px; } .container-aps>.row>.col-md-3 { padding-left: 0px; *padding-right: 0px; } @media only screen and (max-width: 1024px) { .container-aps { *border: 1px solid red; } .container-aps>.row { *border: 3px solid cyan; } .container-aps>.row>.col-md-9 { *width: calc(75% - 50px); *border: 1px solid green; } .container-aps>.row>.col-md-3 { *width: calc(25% - 50px); *border: 1px solid yellow; } } .container-aps-footer>.row>.col-md-9, .container-aps-footer>.row>.col-md-3 { padding-left: 0px; padding-right: 0px; } @media screen and (max-width:767px) { .container-aps>.row { *border: 5px solid green; clear: both; padding-top: 15px; padding-top: 0px; *margin-left: 0px; *margin-right: 0px; } .container-aps>.row>.col-md-12 { padding-left: 0px; padding-right: 0px; } .container-aps>.row>.col-md-9 { *border: 2px solid cyan; padding-left: 0px !important; clear: both; *padding-top: 15px; *padding-left: 15px !important; float: left; width: 100%; } .container-aps>.row>.col-md-3 { *border: 2px solid red; clear: both; padding-top: 15px; padding-left: 15px !important; } } /****/ .logo-perusahaan-group { float: left; margin-right: 20px; position: relative; } @media screen and (max-width:767px) { .logo-perusahaan-group { margin-right: 0px; } } .logo-perusahaan-group .shadow { *border: 1px solid red; position: absolute; bottom: -11px; left: 0; *width: 164px; *height: 17px; width: 110px; height: 11px; background: url(../images/shadow-logo-perusahaan.png) top center; } .logo-perusahaan-group img { height: 70px; } /****/ .navbar-brand.area-logo { padding: 0 0; margin-left: 0px !important; *margin-right: 0px !important; position: relative; z-index: 9; *border: 1px solid cyan; float: left; } @media screen and (max-width:767px) { .navbar-brand.area-logo { *border: 1px solid yellow; width: calc(100% - 60px); *width: calc(100% - 170px); padding-left: 10px; *padding-right: 10px; } } .area-logo .logo { *background: rgba(14, 115, 185, 0.8); *padding-left: 20px; *padding-right: 20px; *height: 94px; *line-height: 94px; float: left; } @media screen and (max-width:767px) { .area-logo .logo { *border: 2px solid red; *width: calc(100% - 170px); width: 100%; *display: flex; *display: none; margin-top: 5px; width: auto; height: 20px; } } .area-logo .nama { *float: left; *clear: both; *background: url(../images/bg-shadow-nama-aplikasi.png) top left no-repeat; *height: 60px; *line-height: 60px; *font-size: 28px; color: #fff; text-transform: uppercase; padding-left: 20px; padding-right: 20px; background: rgba(255, 255, 255, 0.15); height: 23px; line-height: 23px; -webkit-border-radius: 17px; -moz-border-radius: 17px; border-radius: 17px; margin-top: 18px; margin-left: 20px; position: absolute; left: 98px; bottom: 3px; white-space: nowrap; *border-top: 2px solid rgba(0, 0, 0, 0.15); font-size: 12px; } @media screen and (max-width:767px) { .area-logo .nama { left: 0px; font-size: 8px; margin-left: 10px; *border: 1px solid red; max-width: calc(100% - 20px); height: auto; line-height: normal; white-space: normal; padding-top: 3px; padding-bottom: 3px; padding-left: 5px; padding-right: 5px; -webkit-border-radius: 14px; -moz-border-radius: 4px; border-radius: 4px; } } @media only screen and (max-width: 1024px) { .area-logo { *border: 1px solid cyan !important; } .area-logo .nama { margin-top: 18px; margin-left: 0px; left: 0px; bottom: 0px; font-size: 50%; } } @media screen and (max-width:767px) { .area-logo .nama { margin-top: 5px !important; margin-bottom: 5px !important; float: left; *border: 2px solid cyan; bottom: auto; top: auto; position: relative; width: 100%; } } /*.navbar-brand.area-logo span.nama-perusahaan{ float:left; border:1px solid cyan; } */ /****/ .area-waktu { display: inline-block; *width: 300px; height: 34px; line-height: 34px; *background: #626262; color: #fff; *text-align: center; *border: 1px solid red; } @media screen and (max-width:767px) { .area-waktu { *border: 10px solid red; } } .area-waktu .servertime {} .area-waktu .servertime span i.fa-clock-o { *color: rgba(255, 255, 255, 0.4); color: rgba(14, 115, 185, 0.8); } .area-waktu span#varpukul, .area-waktu span#varmenit, .area-waktu span#vardetik { font-size: 14px; *line-height: 10px; *padding-top: 10px; color: rgba(14, 115, 185, 0.8); } .area-waktu span#varhari, .area-waktu span#varbulan, .area-waktu span#vartahun { font-size: 14px; color: rgba(14, 115, 185, 0.8); } /****/ .area-header-utama { *border: 10px solid pink; *background: #fafafa; float: left; width: 100%; clear: both; height: 70px; } .area-header-utama-inner { *border: 10px solid cyan; } @media (min-width: 1200px) { .area-header-utama-inner { width: calc(100% - 160px); height: 70px; margin: 0 auto; border-bottom: 1px solid rgba(255, 255, 255, 0.2); } } @media screen and (max-width:767px) { .area-header-utama { *border: 2px solid orange; height: auto; height: 105px; } .area-header-utama-inner { *border: 2px solid cyan; } } .area-header-utama>.area-header-utama-inner>.navbar-header { *max-width: 40%; max-width: calc(50% - 100px); *border: 1px solid cyan; } @media screen and (max-width:767px) { .area-header-utama>.area-header-utama-inner>.navbar-header { *border: 2px solid green; width: 100%; max-width: none; } } .area-header-utama>.area-header-utama-inner>.navbar-header>a.navbar-brand.area-logo { max-width: 100%; float: left; *border: 1px solid red; width: calc(100% - 130px); } @media screen and (max-width:767px) { .area-header-utama>.area-header-utama-inner>.navbar-header>a.navbar-brand.area-logo { *border: 1px solid red; width: calc(100% - 60px); height: auto; } } .area-header-utama>.area-header-utama-inner>.navbar-header>a.navbar-brand.area-logo>img.logo { max-width: 100%; *width: 100%; } .area-header-utama>.area-header-utama-inner>.nav.navbar-nav.navbar-right { *max-width: 60%; max-width: calc(50% + 100px); *border: 1px solid cyan; } @media screen and (max-width:767px) { .area-header-utama>.area-header-utama-inner>.nav.navbar-nav.navbar-right { *border: 2px solid yellow; width: 100%; max-width: 100%; margin-top: 0px; margin-bottom: 0px; } } /*@media (min-width: 768px) {*/ /*@media screen and (max-width: 767px) {*/ /*@media screen and (max-width:767px) {*/ /*.area-sub-header > .area-sub-header-inner > .navbar-collapse.collapse > ul.nav.navbar-nav.navbar-right.area-menu-atas > li a{ font-size:10%; } } */ .area-header-utama ul.nav.navbar-nav.navbar-right { margin-right: 0px !important; } @media screen and (max-width:767px) { .area-header-utama ul.nav.navbar-nav.navbar-right { margin-left: 0px !important; } } .area-header-utama ul.nav.navbar-nav.navbar-right>li>a { *border: 1px solid red; height: 60px; line-height: 60px; padding-left: 10px; padding-right: 10px; } .area-header-utama ul.nav.navbar-nav.navbar-right>li.active>a:after { content: " ●"; color: #da1a1a; } .area-header-utama ul.nav.navbar-nav.navbar-right>li.dropdown>a:after { content: ""; } .area-header-utama ul.nav.navbar-nav.navbar-right>li>a:after { *content: " •"; *font-size: 30px; *vertical-align: middle; *content: " ●"; } /****/ .area-sub-header { clear: both; float: left; width: 100%; height: 34px; *line-height: 34px; *background: rgba(255, 255, 255, 0.3) url(../images/bg-shadow-menu.png) top center no-repeat; *background: rgba(0, 0, 0, 0.2) url(../images/bg-shadow-menu.png) top center no-repeat; position: relative; *transition: all 0.2s ease-in-out; } @media screen and (max-width:767px) { .area-sub-header { *border: 1px solid red; *display: none; height: 0px; } } .area-sub-header.active { background: rgba(0, 0, 0, 0.5) url(../images/bg-shadow-menu.png) top center no-repeat; *background: rgba(255, 255, 255, 0.8) url(../images/bg-shadow-menu.png) top center no-repeat; *background: #545454 url(../images/bg-shadow-menu.png) top center no-repeat; *background: #fff url(../images/bg-shadow-menu.png) top center no-repeat; *-webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); *-moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); *box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); } .area-sub-header-inner { *padding-left: 130px; *padding-left: 115px; } @media (min-width: 1200px) { .area-sub-header-inner { width: calc(100% - 160px); margin: 0 auto; } } .area-sub-header-inner .nav.navbar-nav.navbar-right { margin-right: 0px !important; *margin-top: 1px !important; } @media screen and (max-width:767px) { .area-sub-header-inner .nav.navbar-nav { *background: pink; background: rgba(0, 0, 0, 0.9); *margin: 7.5px -15px; *margin: 7.5px -10px !important; margin: 0px -15px; } .area-sub-header-inner .nav.navbar-nav.navbar-right { background: rgba(0, 0, 0, 0.9); margin-right: -15px !important; } } .area-sub-header-inner .nav.navbar-nav.navbar-right>li>ul { *border: 1px solid red; *background: #1692b2; border: none; padding-top: 0px; padding-bottom: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } .area-sub-header-inner .nav.navbar-nav.navbar-right>li>a { *color: #777; /*background: rgba(255,255,255,0.3); color : #fff; margin-left: 1px; height: 34px; line-height: 34px;*/ padding-left: 7px; padding-right: 7px; } @media screen and (max-width:767px) { .area-sub-header-inner .nav.navbar-nav.navbar-right>li { border-bottom: 1px solid rgba(14, 115, 185, 0.8); } .area-sub-header-inner .nav.navbar-nav.navbar-right>li>ul>li { border-bottom: 1px solid rgba(14, 115, 185, 0.8); } } @media only screen and (max-width: 1024px) { .area-sub-header-inner .nav.navbar-nav.navbar-right>li>a { *border: 2px solid red; font-size: 11px; height: 24px; line-height: 24px; } } @media screen and (max-width:767px) { .area-sub-header-inner .nav.navbar-nav.navbar-right>li>a { height: auto; line-height: normal; padding-top: 10px; padding-bottom: 10px; } } .area-sub-header .logo { float: left; height: 34px; line-height: 34px; } /*.area-sub-header .area-login{ float:right; } */ /****/ .area-bahasa { float: left; margin-left: 10px; *border: 1px solid red; *height: 60px; *line-height: 60px; *margin-top: 19px; margin-top: 11px; background: rgba(0, 0, 0, 0.1); *height: 34px; height: 48px; *padding: 2px; padding: 7px; -webkit-border-radius: 17px; -moz-border-radius: 17px; border-radius: 17px; -webkit-border-radius: 24px; -moz-border-radius: 24px; border-radius: 24px; /*-webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: 0 8px 6px -6px black; box-shadow: 0 8px 6px -6px black;*/ -moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1); } @media screen and (max-width:767px) { .area-bahasa { position: fixed; bottom: 0; background: rgba(0, 0, 0, 0.5); width: 100%; margin-left: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; z-index: 98; } } .area-bahasa a { display: inline-block; width: 34px; height: 34px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .area-bahasa a.flag-id { background: url(../images/icn-id.png) center center; } .area-bahasa a.flag-en { background: url(../images/icn-en.png) center center; } /****/ .area-login { float: left !important; *border: 1px solid cyan; } @media screen and (max-width:767px) { .area-login { *border: 1px solid cyan; background: #1692b2; width: 100%; } } .area-login form { float: left; margin-top: 18px; } @media screen and (max-width:767px) { .area-login form { margin-top: 12px; margin-bottom: 5px; padding-left: 5px; padding-left: 10px; padding-right: 5px; } } .area-login form input[type=text], .area-login form input[type=password], .area-login form input.input-captcha { border: none; background: rgba(0, 0, 0, 0.2); color: #fff; height: 34px; *line-height: 34px; padding-left: 20px; padding-right: 20px; float: left; *margin-left: 10px; *width: 180px; *width: 130px; width: 150px; } .area-login form input[type=text] { background: rgba(0, 0, 0, 0.2) url(../images/divider-username.png) right no-repeat; -webkit-border-top-left-radius: 17px; -webkit-border-bottom-left-radius: 17px; -moz-border-radius-topleft: 17px; -moz-border-radius-bottomleft: 17px; border-top-left-radius: 17px; border-bottom-left-radius: 17px; } .area-login form input.input-captcha { *background: rgba(0, 0, 0, 0.4) url(../images/divider-username.png) left no-repeat; background: rgba(0, 0, 0, 0.4); *background: rgba(255, 255, 255, 0.4) url(../images/divider-username.png) left no-repeat; *background: rgba(0, 0, 0, 0.1) url(../images/divider-username.png) left no-repeat; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; width: 100px; } .area-login form .area-captcha { *border: 1px solid red; float: left; position: relative; z-index: 1px; *background: #6a7392; *background: rgba(0, 0, 0, 0.2); background: #FFF; } .area-login form .area-captcha img#captchaImage { *height: 100%; *background: red; } .area-login form .area-captcha img.refresh-captcha { width: 25px; *height: 25px; margin-right: 14px; background: #FFF; *-webkit-border-radius: 50%; *-moz-border-radius: 50%; *border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; *position: absolute; *left: 0; } .area-captcha-2 { *border: 1px solid red; *float: left; *position: relative; height: 34px; float: left; margin-left: 10px; *border: 1px solid red; *height: 60px; *line-height: 60px; *margin-top: 19px; margin-top: 11px; background: rgba(0, 0, 0, 0.1); *height: 34px; height: 48px; *padding: 2px; padding: 7px; -webkit-border-radius: 17px; -moz-border-radius: 17px; border-radius: 17px; -webkit-border-radius: 24px; -moz-border-radius: 24px; border-radius: 24px; -webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1); } .area-captcha-2 img#captchaImage { -webkit-border-radius: 17px; -webkit-border-top-right-radius: 0px; -webkit-border-bottom-right-radius: 0px; -moz-border-radius: 17px; -moz-border-radius-topright: 0px; -moz-border-radius-bottomright: 0px; border-radius: 17px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; float: left; } .area-captcha-2 img.refresh-captcha { width: 34px; *padding: 5px; height: 34px; background: #FFF; -webkit-border-radius: 1px; -webkit-border-top-right-radius: 17px; -webkit-border-bottom-right-radius: 17px; -moz-border-radius: 1px; -moz-border-radius-topright: 17px; -moz-border-radius-bottomright: 17px; border-radius: 1px; border-top-right-radius: 17px; border-bottom-right-radius: 17px; } /****/ .area-captcha-3 { *border: 1px solid red; float: left; background: rgba(0, 0, 0, 0.2); *-webkit-border-radius: 17px; *-moz-border-radius: 17px; *border-radius: 17px; *margin-right: 5px; padding-right: 20px; padding-top: 2px; padding-bottom: 2px; } .area-captcha-3 .inner { *border: 1px solid red; float: left; *background: #17adde; } .area-captcha-3 input, .area-captcha-3 span { float: left; height: 30px !important; line-height: 30px !important; *min-width: 20px; text-align: center; *background: rgba(255, 255, 255, 0.2) !important; *background: #73D4Ff !important; background: #17adde !important; } .area-captcha-3 input { width: 34px !important; padding: 0 0 !important; text-align: center; background-image: none !important; *background-color: transparent !important; } .area-captcha-3 span { color: rgba(14, 115, 185, 0.8); } .area-captcha-3 input:nth-child(1) { *background: rgba(0, 0, 0, 0.2) !important; -webkit-border-radius: 4px !important; -webkit-border-top-right-radius: 0px !important; -webkit-border-bottom-right-radius: 0px !important; -moz-border-radius: 4px !important; -moz-border-radius-topright: 0px !important; -moz-border-radius-bottomright: 0px !important; border-radius: 4px !important; border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important; } .area-captcha-3 input:nth-child(3) { -webkit-border-radius: 0px !important; -moz-border-radius: 0px !important; border-radius: 0px !important; } .area-captcha-3 span:nth-child(4) { padding-right: 10px; } .area-captcha-3 input:nth-child(5) { *background: rgba(0, 0, 0, 0.1) !important; *background: rgba(23, 173, 222, 0.6) !important; background-color: transparent !important; border-top: 1px solid rgba(23, 173, 222, 1) !important; border-right: 1px solid rgba(23, 173, 222, 1) !important; border-bottom: 1px solid rgba(23, 173, 222, 1) !important; -webkit-border-radius: 0px !important; -webkit-border-top-right-radius: 4px !important; -webkit-border-bottom-right-radius: 4px !important; -moz-border-radius: 0px !important; -moz-border-radius-topright: 4px !important; -moz-border-radius-bottomright: 4px !important; border-radius: 0px !important; border-top-right-radius: 4px !important; border-bottom-right-radius: 4px !important; } @media screen and (max-width:767px) { .area-login form input[type=text], .area-login form input[type=password] { width: calc(50% - 48px); } } @media screen and (max-width:767px) { .area-login form input[type=text], .area-login form input[type=password] { width: calc(50% - 34px); } } .area-login form input[type=text]::-webkit-input-placeholder, .area-login form input[type=password]::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: rgba(14, 115, 185, 0.8); opacity: 1 !important; } .area-login form input[type=text]::-moz-placeholder, .area-login form input[type=password]::-moz-placeholder { /* Firefox 19+ */ color: #fff; opacity: 1 !important; } .area-login form input[type=text]:-ms-input-placeholder, .area-login form input[type=password]:-ms-input-placeholder { /* IE 10+ */ color: #fff; opacity: 1 !important; } .area-login form input[type=text]:-moz-placeholder, .area-login form input[type=password]:-moz-placeholder { /* Firefox 18- */ color: #fff; opacity: 1 !important; } .area-login form input[type=submit], .area-login form button[type=submit] { width: 48px; height: 48px; margin-top: -7px; margin-left: -10px; background: #27c2ea /*25b8eb*/ /*02b4e2*/ url(../images/icon-tombol-logout.png) center center no-repeat; -webkit-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.3); box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.3); float: left; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; border: none; position: relative; z-index: 2; } @media screen and (max-width:767px) { .area-login form input[type=submit], .area-login form button[type=submit] { z-index: auto; width: 34px; height: 34px; margin-top: 0px; margin-left: -11px; background-size: 70%; } } .area-login a.lupa-password { border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(39, 194, 234, 1) url(../images/icon-lupa-password.png) center center no-repeat; color: #fff; float: left; width: 48px; height: 48px; line-height: 48px; margin-top: -7px; margin-left: 4px; padding-left: 10px; padding-right: 10px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .area-login a.lupa-password:hover { background: rgba(255, 255, 255, 0.4) url(../images/icon-lupa-password.png) center center no-repeat; } @media screen and (max-width:767px) { .area-login a.lupa-password { width: 34px; height: 34px; line-height: 34px; margin-top: 0px; background-size: 70%; } } .area-login a.ganti-hak-akses { border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.2) url(../images/icon-hak-akses.png) center center no-repeat; color: #fff; float: left; width: 48px; height: 48px; line-height: 48px; margin-top: 6px; margin-left: 4px; padding-left: 10px; padding-right: 10px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .area-login a.ganti-hak-akses:hover { background: rgba(255, 255, 255, 0.4) url(../images/icon-hak-akses.png) center center no-repeat; } .area-login .area-bendera { display: inline-block; width: 110px; height: 34px; text-align: center; background: #626262; } .area-login .area-user-login { *background: #e6e6e6; height: 34px; line-height: 34px; padding-left: 15px; padding-top: 5px; color: #fff; font-size: 14px; display: inline-block; } @media screen and (max-width:767px) { .area-login .area-user-login { height: auto; line-height: normal; padding-top: 0px; } } .area-login .area-user-login .selamat-datang { background: rgba(0, 0, 0, 0.2); float: left; height: 34px; line-height: 34px; margin-top: 13px; margin-right: -10px; padding-left: 20px; padding-right: 20px; -webkit-border-top-left-radius: 17px; -webkit-border-bottom-left-radius: 17px; -moz-border-radius-topleft: 17px; -moz-border-radius-bottomleft: 17px; border-top-left-radius: 17px; border-bottom-left-radius: 17px; } @media screen and (max-width:767px) { .area-login .area-user-login .selamat-datang { font-size: 12px; } } .area-login .area-user-login .logout { background: #c60101 /*9e1919*/ /*da1a1a*/ url(../images/icon-tombol-logout.png) center center no-repeat; width: 48px; height: 48px; line-height: 48px; text-align: center; margin-top: 6px; *margin-left: -10px; -webkit-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.3); box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.3); float: left; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; border: none; } /*.area-login .area-user-login .logout i{ color:#fff; font-size:38px; -moz-box-shadow: inset 0 0 10px rgba(0,0,0,0.3); -webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.3); box-shadow: inset 0 0 10px rgba(0,0,0,0.3); }*/ /****/ .area-banner-home { background: url(../images/kardus-pesawat.png) top left no-repeat; height: 190px; *margin-top: 25px; } .area-banner-home .inner { *border: 1px solid green; padding-top: 60px; } .area-banner-home .inner .judul { text-align: right; font-weight: bold; } .area-banner-home .inner .isi { text-align: right; *padding-left: 50%; } /****/ .judul-halaman { font-family: 'AvenirHeavy'; font-size: 18px; text-transform: uppercase; background: #006cb2; color: #fff; letter-spacing: 1px; padding: 13px 20px 12px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; } @media screen and (max-width:767px) { .judul-halaman { height: auto; line-height: normal; *padding-top: 15px; *padding-bottom: 15px; padding: 15px 20px 15px; float: left; width: 100%; } } /*.judul-halaman:before{ font-family: 'FontAwesome'; *content:"\f0c8"; content:"\f04d"; color:#da1a1a; margin-right:10px; }*/ .judul-halaman .area-cari-lelang { *background: cyan; float: right; line-height: normal; } @media screen and (max-width:767px) { .judul-halaman.paket-lelang { float: left; width: 100%; clear: both; } .judul-halaman .area-cari-lelang { width: 100%; *background: #ddd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 5px 0; border-top: 1px solid rgba(255, 255, 255, 0.2); margin-top: 8px; padding-top: 8px; text-transform: none; font-size: 12px; } } .judul-halaman .area-cari-lelang input { border: none; *background-color: transparent; color: #fff; font-size: 15px; height: 30px; line-height: 30px; *border: 1px solid red; *background: rgba(255, 255, 255, 0.2); background: rgba(0, 0, 0, 0.1); padding: 0px 20px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; } .judul-halaman .area-cari-lelang ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #fff; } .judul-halaman .area-cari-lelang ::-moz-placeholder { /* Firefox 19+ */ color: #fff; } .judul-halaman .area-cari-lelang :-ms-input-placeholder { /* IE 10+ */ color: #fff; } .judul-halaman .area-cari-lelang :-moz-placeholder { /* Firefox 18- */ color: #fff; } /*.judul-halaman .area-cari-lelang:after{ font-family: 'FontAwesome'; content:"\f002"; color:#b3b3b3; } */ .judul-halaman .area-cari-lelang button { background-color: transparent; border: none; } @media screen and (max-width:767px) { .judul-halaman .area-cari-lelang input { width: calc(100% - 50px); *border: 1px solid red; padding-left: 10px; } } /****/ .judul-halaman.merah { *background: #8c1a1f; background: rgba(140, 26, 31, 0.5); color: #fff; } .judul-halaman.merah:before { color: #fff; } .judul-halaman.hitam { background: #333333; color: #fff; } .judul-halaman.hitam a { color: #fff; } .judul-halaman.hitam i { color: #a51e24; } .judul-halaman.hitam:before { color: #292929; content: "\f007"; font-size: 40px; vertical-align: middle; } .judul-halaman .info { *background: #f4f4f4; background: rgba(0, 0, 0, 0.2); border: 1px solid rgba(0, 0, 0, 0.1); font-size: 14px; text-transform: none; float: right; letter-spacing: normal; padding: 2px 5px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } /****/ .area-paket-lelang-wrapper { background: url(../images/bg-paket-lelang-home.png) bottom right no-repeat; *padding-bottom: 20px; *border: 1px solid pink; float: left; width: 100%; clear: both; } .area-paket-lelang { *background: url(../images/bg-waktu-shadow.png) top left no-repeat; *min-height: 752px; padding-right: 20px; *border: 1px solid yellow; float: left; width: 100%; clear: both; } @media screen and (max-width:767px) { .area-paket-lelang { padding-left: 15px; padding-right: 15px; } } .area-paket-lelang .list { margin-bottom: 10px; background: #FFF; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border-width: 0 0 0 6px; border-style: solid; -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(rgba(2, 174, 218, 1)), to(rgba(115, 212, 238, 1))) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; -o-border-image: -o-linear-gradient(bottom, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; border-image: linear-gradient(to top, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; } .area-paket-lelang .list:after { clear: both; display: block; height: 0; overflow: hidden; visibility: hidden; content: "."; font-size: 0; } .area-paket-lelang .list .waktu { *border: 1px solid cyan; float: left; width: 110px; height: 100%; text-align: center; line-height: 46px; display: block; *background: url(../images/bg-spiral-kiri.png) top right no-repeat; } .area-paket-lelang .list .waktu .tanggal { font-size: 30px; line-height: 24px; padding-top: 14px; font-family: 'AvenirBook'; text-align: center; } .area-paket-lelang .list .waktu .bulan-tahun { font-size: 14px; text-align: center; } @media screen and (max-width:767px) { .area-paket-lelang .list .waktu { width: 100%; *background: red; line-height: normal; text-align: left; padding-left: 20px; padding-top: 15px; font-size: 12px; } } .area-paket-lelang .list .keterangan { float: left; width: calc(100% - 110px); *background: url(../images/bg-spiral-kanan.png) top left no-repeat; padding: 0 30px; *border-bottom: 1px solid #da1a1a; } .area-paket-lelang .list .keterangan.keterangan-daftar { width: calc(100% - 110px - 140px); } .area-paket-lelang .list .keterangan .judul { *border: 2px solid red; padding-top: 13px; *width: 85%; text-transform: uppercase; } .area-paket-lelang .list .keterangan .daftar { *border: 2px solid red; margin-top: -65px; float: right; text-transform: uppercase; } @media screen and (max-width:767px) { .area-paket-lelang .list .keterangan { width: 100%; *background: cyan; padding: 0 20px; } .area-paket-lelang .list .keterangan.keterangan-daftar { width: 100%; } .area-paket-lelang .list .keterangan .judul { padding-top: 5px; font-weight: bold; } } .area-paket-lelang .list .keterangan .judul a { color: #333; } .area-paket-lelang .list .keterangan .judul a:hover { color: #000; } .area-paket-lelang .list .keterangan .lokasi { padding-bottom: 15px; *border-bottom: 1px solid #da1a1a; *float: left; *width: calc(100% - 160px); *border: 1px solid cyan; *font-size: 14px; *color: rgba(0, 0, 0, 0.5); } .area-paket-lelang .list .daftar-paket-ini { float: right; width: 120px; margin-top: 18px; margin-right: 20px; text-align: center; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #27c2ea; } @media screen and (max-width:767px) { .area-paket-lelang .list .daftar-paket-ini { margin-top: 0px; margin-bottom: 18px; } } .area-paket-lelang .list .daftar-paket-ini a { display: block; color: #fff; padding-top: 5px; padding-bottom: 5px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border-bottom: 2px solid rgba(0, 0, 0, 0.2); } .area-paket-lelang .list .daftar-paket-ini a:hover { background: rgba(0, 0, 0, 0.2); text-decoration: none; border-bottom: 2px solid rgba(0, 0, 0, 0.5); } .area-paket-lelang .list .daftar-paket-ini a i { color: rgba(14, 115, 185, 0.8); vertical-align: middle; } .area-paket-lelang .list .daftar-paket-ini a:hover i { color: rgba(14, 115, 185, 0.8); } @media screen and (max-width:767px) { .area-paket-lelang .list .keterangan .lokasi { font-size: 12px; } } .area-paket-lelang .list .keterangan .batas-bawah { border-bottom: 1px solid #da1a1a; } .area-paket-lelang .list .keterangan .info-bs-daftar { background: rgba(255, 255, 255, 0.2); border-left: 10px solid rgba(255, 255, 255, 1); } /****/ .area-paket-lelang .list.main { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(rgba(2, 174, 218, 1)), to(rgba(115, 212, 238, 1))) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; -o-border-image: -o-linear-gradient(bottom, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; border-image: linear-gradient(to top, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; } .area-paket-lelang .list.tps { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#142267), to(#3c4c96)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #142267, #3c4c96) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #142267, #3c4c96) 1 100%; -o-border-image: -o-linear-gradient(bottom, #142267, #3c4c96) 1 100%; border-image: linear-gradient(to top, #142267, #3c4c96) 1 100%; } .area-paket-lelang .list.phc { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#ddb41d), to(#fed640)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #ddb41d, #fed640) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #ddb41d, #fed640) 1 100%; -o-border-image: -o-linear-gradient(bottom, #ddb41d, #fed640) 1 100%; border-image: linear-gradient(to top, #ddb41d, #fed640) 1 100%; } .area-paket-lelang .list.bjti { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#bfc139), to(#dee353)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #bfc139, #dee353) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #bfc139, #dee353) 1 100%; -o-border-image: -o-linear-gradient(bottom, #bfc139, #dee353) 1 100%; border-image: linear-gradient(to top, #bfc139, #dee353) 1 100%; } .area-paket-lelang .list.pms { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#d76001), to(#fd7100)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #d76001, #fd7100) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #d76001, #fd7100) 1 100%; -o-border-image: -o-linear-gradient(bottom, #d76001, #fd7100) 1 100%; border-image: linear-gradient(to top, #d76001, #fd7100) 1 100%; } .area-paket-lelang .list.lamong { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#78a348), to(#9dc872)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #78a348, #9dc872) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #78a348, #9dc872) 1 100%; -o-border-image: -o-linear-gradient(bottom, #78a348, #9dc872) 1 100%; border-image: linear-gradient(to top, #78a348, #9dc872) 1 100%; } .area-paket-lelang .list.pds { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#bb1e22), to(#e03336)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #bb1e22, #e03336) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #bb1e22, #e03336) 1 100%; -o-border-image: -o-linear-gradient(bottom, #bb1e22, #e03336) 1 100%; border-image: linear-gradient(to top, #bb1e22, #e03336) 1 100%; } /****/ .area-paket-lelang-kosong { padding-right: 30px; } @media screen and (max-width:767px) { .area-paket-lelang-kosong { padding-right: 15px !important; padding-left: 15px !important; margin-top: 10px; } } .area-paket-lelang-kosong .judul-halaman {} .area-paket-lelang-kosong .inner { background: url(../images/bg-data-kosong.png) top left no-repeat; height: 300px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; border: 1px solid rgba(0, 0, 0, 0.1); border-width: 0 1px 1px 1px; display: flex; justify-content: center; /* align horizontal */ align-items: center; /* align vertical */ } @media screen and (max-width:767px) { .area-paket-lelang-kosong .inner { background: url(../images/bg-data-kosong.png) center center no-repeat; height: 160px; } } .area-paket-lelang-kosong .list { color: red; *height: 200px; padding-top: 40px; padding-bottom: 40px; *display: flex; *justify-content: center; /* align horizontal */ *align-items: center; /* align vertical */ } .area-paket-lelang-kosong .list div {} /****/ .area-kanan { *background: #a51e24 url(../images/bg-shadow-kanan.png) top left no-repeat; } .area-kanan .judul-halaman a { color: rgba(14, 115, 185, 0.8); } .area-kanan .judul-halaman a:hover { color: rgba(14, 115, 185, 0.8); text-decoration: none; } @media screen and (max-width:767px) { .area-kanan>.judul-halaman.text-right { clear: both; } } /****/ .area-berita { background: rgba(255, 255, 255, 0.4) url(../images/bg-info.png) top right no-repeat; padding: 18px 20px 0; } @media screen and (max-width:767px) { .area-berita { background-size: 100%; } } .area-berita .list { *margin: 10px 20px; padding: 10px 0; *border: 1px solid rgba(255, 255, 255, 0.2); border-bottom: 1px solid #02aeda; text-align: right; } .area-berita .list:last-child { border-bottom: none; } .area-berita .list .tanggal { color: #fff; text-transform: uppercase } .area-berita .list .judul, .area-berita .list .judul a { color: #dedddd; text-transform: uppercase } .area-berita .list .selengkapnya { text-align: right; } .area-berita .list .selengkapnya a { color: rgba(14, 115, 185, 0.8); } .area-berita .list .selengkapnya a:hover { color: rgba(14, 115, 185, 0.8); } /****/ .area-berita.semua, .area-berita.detil { background: none; *padding: 18px 20px 0; padding: 0px 0px; } .area-berita.semua .list { border-bottom: 1px solid rgba(0, 0, 0, 0.1); *border-width: 1px 0 1px 0; text-align: left; } @media screen and (max-width:767px) { .area-berita.semua .list { padding: 10px 10px; } } .area-berita.detil .list { border-bottom: none; *border-width: 1px 0 1px 0; text-align: left; padding-bottom: 0px; } @media screen and (max-width:767px) { .area-berita.detil .list { padding: 10px 10px; } } .area-berita.semua .list .tanggal, .area-berita.detil .list .tanggal { color: rgba(0, 0, 0, 0.5); } .area-berita.semua .list .judul a, .area-berita.detil .list .judul a { *color: #fff; font-weight: bold; text-transform: uppercase; } .area-berita.semua .list .isi { margin-top: 5px; padding-left: 15px; border-left: 4px solid rgba(0, 0, 0, 0.1); } .area-berita.detil .list .isi { margin-top: 5px; padding: 15px; *border-left: 4px solid rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.05) url(../images/bg-shadow-data-kosong.png) top left no-repeat; border-top: 4px solid rgba(255, 255, 255, 0.2); } @media screen and (max-width:767px) { .area-berita.detil .list .isi { *border: 2px solid red; overflow: auto; } } .area-berita.detil .kembali { *border: 1px solid red; display: inline-block; } .area-berita.detil .kembali a { display: block; height: 34px; line-height: 34px; background: rgba(0, 0, 0, 0.2); color: #fff; padding-left: 15px; padding-right: 15px; -webkit-border-bottom-right-radius: 17px; -webkit-border-bottom-left-radius: 17px; -moz-border-radius-bottomright: 17px; -moz-border-radius-bottomleft: 17px; border-bottom-right-radius: 17px; border-bottom-left-radius: 17px; } .area-berita.detil .kembali a:before { content: "◄ "; } .area-berita.detil .kembali a:hover { text-decoration: none; background: rgba(0, 0, 0, 0.4); } /****/ .lihat-semua { *border: 1px solid rgba(255, 255, 255, 0.4); *border-width: 1px 0; margin: 10px 0px; *background: rgba(0, 0, 0, 0.8); } .lihat-semua a { height: 34px; line-height: 34px; *background: rgba(255, 255, 255, 0.1); *color: rgba(14, 115, 185, 0.8); display: block; text-align: right; padding-left: 10px; padding-right: 10px; } .lihat-semua a:hover { *background: rgba(255, 255, 255, 0); text-decoration: none; } /****/ .area-footer { width: 100%; background: #FFF; } /****/ .area-info-pengunjung { padding: 0 20px; background: rgba(255, 255, 255, 0.3); *border: 2px solid cyan; float: left; width: 100%; clear: both; } .area-info-pengunjung .inner { float: left; width: 100%; clear: both; *border: 1px solid red; padding-top: 18px; } .area-info-pengunjung .item { background: #73D4Ff; float: left; width: calc(50% - 10px); height: 100px; position: relative; margin-bottom: 20px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .area-info-pengunjung .item:nth-child(odd) { float: right; } .area-info-pengunjung .item .nilai { font-family: 'AvenirLight'; font-size: 48px; color: #fff; text-align: center; line-height: 100px; } .area-info-pengunjung .item.total .nilai { font-size: 28px; } .area-info-pengunjung .item.ip-address .nilai { font-size: 16px; } .area-info-pengunjung .item .keterangan { position: absolute; bottom: 10px; right: 10px; *color: #029ac1; color: rgba(0, 0, 0, 0.4); } .area-info-pengunjung .item .shadow { width: 130px; height: 34px; background: url(../images/shadow-info-pengunjung.png); position: absolute; bottom: -34px; } /*.area-info-pengunjung .ip-address{ height:60px; line-height:60px; text-align:center; letter-spacing:4px; font-size:18px; font-family: 'AvenirBook'; color:#FFF; } .area-info-pengunjung .ip-address img{ vertical-align:middle; } .area-info-pengunjung .data{ padding-left:30px; padding-right:30px; padding-bottom:20px; } .area-info-pengunjung .data table{ border-collapse:collapse; width:100%; color:#FFF; } .area-info-pengunjung .data table td{ padding:1px 4px; } .area-info-pengunjung .data table td:nth-child(1){ *text-align:right; }*/ /****/ .area-footer-kontak { background: #e6e6e6 url(../images/bg-footer-kontak.png) top right no-repeat; min-height: 156px; padding: 8px 30px; } .area-footer-kontak table { border-collapse: collapse; width: 100%; } .area-footer-kontak table td { padding: 2px 0px; vertical-align: top; } .area-footer-kontak table td i { color: #a51e24; } /****/ /*.area-pagination{ padding:0 0; *background:#6a6a6a url(../images/bg-shadow-pagination.png) top center no-repeat; margin-top:15px; padding-bottom:10px; } .area-pagination:after { clear: both; display: block; height: 0; overflow: hidden; visibility: hidden; content: "."; font-size: 0; } .area-pagination .menampilkan{ float:left; color:#333; line-height:40px; font-family: 'AvenirBook'; } .area-pagination .halaman{ float:right; }*/ /****/ .bulog-pagination { width: 100%; float: left; clear: both; *padding-bottom: 5px; *padding-right: 10px; *border: 1px solid red; margin-bottom: 10px; } @media screen and (max-width:767px) { .bulog-pagination { float: none; display: inline-block; margin-bottom: 0px; } } .bulog-pagination .menampilkan { float: left; *color: #fff; height: 30px; line-height: 30px; *padding-left: 15px; padding-right: 15px; *font-size: 16px; font-size: 14px; -webkit-border-bottom-right-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-bottomright: 3px; -moz-border-radius-bottomleft: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .bulog-pagination .halaman { float: right; *background: pink; *background: url(../images/bg-shadow-paging.png); } @media screen and (max-width:767px) { .bulog-pagination .menampilkan { text-align: center; width: 100%; } .bulog-pagination .halaman { text-align: center; width: 100%; } } .bulog-pagination .halaman a { width: 30px; height: 30px; line-height: 30px; text-align: center; display: inline-block; *padding: 6px 12px; background: rgba(0, 0, 0, 0.15); color: #fff; font-family: 'AvenirBook'; font-size: 14px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; margin-left: 7px; } .bulog-pagination .halaman a:hover { background: #FFF; color: #02aeda; width: 30px; height: 30px; line-height: 30px; text-align: center; display: inline-block; font-family: 'AvenirBook'; font-size: 14px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; margin-left: 7px; font-weight: bold; text-decoration: none; -webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: 0 8px 6px -6px black; box-shadow: 0 8px 6px -6px black; } .bulog-pagination .halaman b { background: #FFF; color: #02aeda; width: 30px; height: 30px; line-height: 30px; text-align: center; display: inline-block; font-family: 'AvenirBook'; font-size: 14px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; margin-left: 7px; } /****/ .area-main { *padding-top: 54px; *padding-top: 54px; position: relative; } @media screen and (max-width:767px) { .area-main { *clear: both; *border: 1px solid cyan; } } .area-main.popup { padding-top: 0px !important; } .area-main.popup .judul-halaman select { color: #333; } .area-main .inner {} @media screen and (max-width:767px) { .area-main .inner { margin-bottom: 15px; clear: both; *border: 1px solid red; } } .area-main .inner:after { clear: both; display: block; height: 0; overflow: hidden; visibility: hidden; content: "."; font-size: 0; } /*.area-main .area-sidelook{ float:left; width:50px; min-height:752px; *border:1px solid red; background:#e6e6e6 url(../images/bg-waktu-shadow.png) top left no-repeat; } */ .area-konten { float: left; width: 100%; background: url(../images/bg-konten.png); padding: 20px 30px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } @media screen and (max-width:767px) { .area-konten { padding: 0px 0px 0px; } } .area-konten-inner { background: rgba(255, 255, 255, 0.6) url(../images/bg-mengetik.png) top right no-repeat fixed; border: 1px solid rgba(209, 209, 208, 0.85); padding: 20px 20px; } @media screen and (max-width:767px) { .area-konten-inner { padding: 20px 0px 0px; border: none; } } .area-konten-inner>form>.row { *border: 1px solid red; margin-left: 0px; margin-right: 0px; } .area-konten-inner>form>.row>.col-md-12 { *border: 1px solid cyan; } .area-konten-inner .form-group { *border-bottom: 1px solid cyan; *border-bottom: 1px solid rgba(255, 255, 255, 0.5); border-bottom: 1px solid rgba(0, 0, 0, 0.05); margin-left: 0px; margin-right: 0px; } .area-konten-inner .form-group .form-kolom { float: left; padding-left: 15px; } @media screen and (max-width:767px) { .area-konten-inner .form-group .form-kolom { width: 100% !important; margin-top: 5px; *margin-bottom: 5px; } } .area-konten-inner .form-group textarea { border: 1px solid #ccc; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 6px 12px; } .area-konten-inner .form-group .form-rounded { border: 1px solid #cccccc; height: 34px; padding-left: 4px; padding-right: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } /****/ span.merah { color: #da1a1a; } .area-tahapan-lelang {} .area-tahapan-lelang .keterangan { font-size: 14px; color: #666; } .area-tahapan-lelang table { border-collapse: collapse; width: 100%; } .area-tahapan-lelang table tr td { padding: 4px 8px; } .area-tahapan-lelang table tr:nth-child(odd) td { *background: rgba(0, 0, 0, 0.1) !important; *background: #fef0f0 !important; background: rgba(255, 255, 255, 0.6) !important; } .area-tahapan-lelang table tr:nth-child(even) td { *background: rgba(0, 0, 0, 0.05) !important; background: #FFF !important; } /*.area-tahapan-lelang table tr:nth-child(odd) td:nth-child(2){ background:#fef0f0; } .area-tahapan-lelang table tr:nth-child(even) td:nth-child(2){ background:#FFF; } */ /****/ .area-konten table { border-collapse: separate; border-spacing: 1px; width: 100%; *border: 1px solid red; } .area-konten table td { *border: 1px solid cyan; *background: rgba(255, 255, 255, 0.5); padding: 4px 6px; vertical-align: top; } .area-konten table tr:nth-child(odd) td { *background: rgba(255, 255, 255, 0.3); background: rgba(255, 255, 255, 0.6); } .area-konten table tr:nth-child(even) td { background: rgba(255, 255, 255, 0.6); } .area-konten table tr.judul-kolom th, .area-konten table tr.judul-kolom td { *background: cyan; background: #D9D9D9; *background: #e5e4e4; padding: 4px 6px; } /****/ .judul-grup { background: #006cb2; border-bottom: 3px solid #d7d7d7; color: #fff; padding-left: 10px; padding-right: 10px; height: 34px; line-height: 30px; margin-bottom: 10px; border-top-left-radius: 3px; border-top-right-radius: 3px; *-webkit-border-radius: 4px; *-moz-border-radius: 4px; *border-radius: 4px; } @media screen and (max-width:767px) { .judul-grup { height: auto; line-height: normal; padding-top: 5px; padding-bottom: 5px; } } /****/ .area-konten-inner form label { font-weight: normal !important; } /****/ .harus-diisi:after { content: " *"; color: #da1a1a; } /****/ .area-datatable { *border: 1px solid red; *background: rgba(255, 255, 255, 0.2) url(../images/bg-mengetik.png) top right no-repeat; *position: relative; } .area-datatable .dataTables_scrollHeadInner { /** STYLE INI BERFUNGSI JIKA MENGGUNAKAN scrollY **/ background: #666666; } /****/ .area-datatable table.dataTable { border-collapse: separate; border-spacing: 1px; border-top: 1px solid #111; } .area-datatable table.dataTable thead { *background: #d9d9d9; background: #d4d4d4; } .area-datatable table.dataTable thead th { *color: #fff; font-weight: normal; } .area-datatable .dataTables_scrollHeadInner table thead th { *color: #dcdcdc; color: #fff; font-weight: normal; } .area-datatable table.dataTable tbody tr.odd.row_selected, .area-datatable table.dataTable tbody tr.even.row_selected { background-color: rgba(0, 0, 0, 0.7) !important; } .area-datatable .dataTables_length { position: absolute; z-index: 999; *top: -91px; top: 0px; *top: -50px; right: 0; *right: -51px; *background: #da1a1a; background: rgba(0, 0, 0, 0.4); *height: 50px; *padding: 0 20px; padding: 0px 20px; height: 50px; line-height: 50px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topright: 4px; border-top-right-radius: 4px; } @media screen and (max-width:767px) { .area-datatable .dataTables_length { position: relative; -webkit-border-top-right-radius: 0px; -moz-border-radius-topright: 0px; border-top-right-radius: 0px; } .area-datatable table.dataTable tbody th, .area-datatable table.dataTable tbody td { padding: 4px 4px; } } .area-datatable .dataTables_length label { font-weight: normal; color: #fff; *line-height: 50px; margin-bottom: 0px; } .area-datatable .dataTables_length select { color: #333; } .area-datatable .dataTables_filter { *background: #c9c9c9; *padding-top: 5px; *padding-right: 20px; margin-right: 1px; margin-bottom: 10px; /*-webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px;*/ } @media screen and (max-width:767px) { .area-datatable .dataTables_filter { *background: #c9c9c9; *background: #d6d6d6; *background: #111111; background: #838383; margin-top: 0px !important; margin-bottom: 0px !important; margin-right: 0px; padding-top: 10px; padding-bottom: 10px; } } .area-datatable .dataTables_filter label { background: #c9c9c9; padding-left: 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; font-weight: normal; margin-bottom: 0px; height: 34px; line-height: 34px; } .area-datatable .dataTables_filter input[type=search] { line-height: 32px; background: #FFF; border: none; padding-left: 10px; padding-right: 10px; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .area-datatable .dataTables_info { background: #c9c9c9; *padding-top: 5px; padding-left: 20px; padding-right: 20px; *margin-right: 1px; height: 35px; line-height: 35px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } /****/ .area-datatable .area-menu-aksi { *border: 1px solid red; position: absolute; z-index: 99; float: left; width: calc(100% - 400px); width: 1000px !important; } @media screen and (max-width:767px) { .area-datatable .area-menu-aksi { position: relative; padding: 10px; width: calc(100% - 0px); } } .area-treetable .area-menu-aksi { *border: 1px solid red; position: relative; z-index: 99; float: left; width: calc(100% - 400px); } .area-datatable .area-menu-aksi a, .area-treetable .area-menu-aksi a { *background: #da1a1a; *background: rgba(0, 0, 0, 0.5); background-color: #197d9e; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#197d9e), to(#0c617d)); background: -webkit-linear-gradient(top, #197d9e, #0c617d); background: -moz-linear-gradient(top, #197d9e, #0c617d); background: -ms-linear-gradient(top, #197d9e, #0c617d); background: -o-linear-gradient(top, #197d9e, #0c617d); *border: 1px solid rgba(0, 0, 0, 0.2); color: #fff; font-size: 14px; height: 34px; line-height: 33px; padding-left: 10px; padding-right: 10px; *display: inline-block; float: left; margin-right: 1px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .area-datatable .area-menu-aksi a:hover, .area-treetable .area-menu-aksi a:hover { *background: #da1a1a url(../images/bg-menu-aksi-hover.png) top center no-repeat; background: rgba(0, 0, 0, 0.7); color: #fff; text-decoration: none; } @media screen and (max-width:767px) { .area-datatable #sticker { float: left !important; *display: inline-block; width: 100%; *min-height: 40px; clear: both; *border: 2px solid red; *background: red; background: #d6d6d6; } .area-datatable .area-menu-aksi a { height: auto; line-height: normal; white-space: nowrap; padding-top: 5px; padding-bottom: 5px; padding-left: 7px; padding-right: 7px; margin-bottom: 1px; float: left; } .area-datatable section { *border: 2px solid green; *clear: both; float: left; width: 100%; } } /****/ .area-datatable .dataTables_paginate { *border: 1px solid red; } .area-datatable .dataTables_paginate a.fg-button { background: rgba(0, 0, 0, 0.5) url(../images/bg-menu-aksi-hover.png) top center no-repeat; ; color: #fff; height: 32px; line-height: 32px; padding-left: 14px; padding-right: 14px; margin-left: 1px; float: left; -webkit-border-bottom-right-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-bottomright: 3px; -moz-border-radius-bottomleft: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .area-datatable .dataTables_paginate a.fg-button:hover, .area-datatable .dataTables_paginate a.fg-button.ui-state-disabled { background: #cacaca; color: #333333; text-decoration: none; } .area-datatable .dataTables_paginate span.ellipsis { background: rgba(255, 255, 255, 0.2); height: 32px; line-height: 32px; padding-left: 14px; padding-right: 14px; margin-left: 1px; float: left; -webkit-border-bottom-right-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-bottomright: 3px; -moz-border-radius-bottomleft: 3px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } /****/ .area-konten-inner .form-horizontal .control-label { padding-top: 0px; } /****/ .area-tahapan-lelang { *border: 1px solid red; } .area-tahapan-lelang span.nomor { display: inline-block; background: #a42421; color: #fff; width: 28px; height: 28px; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; margin-right: 15px; position: relative; } .area-tahapan-lelang span.nomor:after { position: absolute; font-family: "FontAwesome"; content: "\f111"; top: -2px; *margin-right: -17px; *color: #999; color: rgba(0, 0, 0, 0.3); } /****/ .area-submenu-paket-lelang {} .area-submenu-paket-lelang .inner { *border: 1px solid #e4e4e4; background: rgba(255, 255, 255, 0.7); padding: 10px 10px 0 10px; } .area-submenu-paket-lelang .inner .sparator { *border-top: 1px solid #bcbcbc; *border-bottom: 1px solid #FFF; *margin-top: 7px; *margin-bottom: 7px; border-bottom: 3px solid #d7d7d7; } .area-submenu-paket-lelang .inner .judul-grup { margin-bottom: 0px; } /****/ .area-submenu-paket-lelang .inner ul#accordion { padding: 0 0; list-style: none; } .area-submenu-paket-lelang .inner ul#accordion>li { *margin-bottom: 10px; } .area-submenu-paket-lelang .inner ul#accordion>li>a { display: block; *background: #da1a1a; color: #fff; } .area-submenu-paket-lelang .inner ul#accordion>li>a span { padding: 5px 10px; display: inline-block; width: 100%; background: #838383; /* fallback */ background-color: #838383; background: url(images/linear_bg_2.png); background-repeat: repeat-x; /* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#838383), to(#6f6f6f)); /* Safari 5.1, Chrome 10+ */ background: -webkit-linear-gradient(top, #838383, #6f6f6f); /* Firefox 3.6+ */ background: -moz-linear-gradient(top, #838383, #6f6f6f); /* IE 10 */ background: -ms-linear-gradient(top, #838383, #6f6f6f); /* Opera 11.10+ */ background: -o-linear-gradient(top, #838383, #6f6f6f); } .area-submenu-paket-lelang .inner ul#accordion a:hover { text-decoration: none; } .area-submenu-paket-lelang .inner ul#accordion>li>a>ul { padding: 0 0; list-style: none; } .area-submenu-paket-lelang .inner ul#accordion>li>a>ul>li { background: #c8c8c8; /* fallback */ background-color: #c8c8c8; background: url(images/linear_bg_2.png); background-repeat: repeat-x; /* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#c8c8c8), to(#e5e5e5)); /* Safari 5.1, Chrome 10+ */ background: -webkit-linear-gradient(top, #c8c8c8, #e5e5e5); /* Firefox 3.6+ */ background: -moz-linear-gradient(top, #c8c8c8, #e5e5e5); /* IE 10 */ background: -ms-linear-gradient(top, #c8c8c8, #e5e5e5); /* Opera 11.10+ */ background: -o-linear-gradient(top, #c8c8c8, #e5e5e5); font-size: 12px; color: #333; padding: 5px 10px; } /****/ .area-submenu-paket-lelang .inner .item { margin-bottom: 3px; } .area-submenu-paket-lelang .inner .item a { display: block; } .area-submenu-paket-lelang .inner .item a:hover { text-decoration: none; } .area-submenu-paket-lelang .inner .item .nama { background: #d6260e; /* fallback */ background-color: #d6260e; background: url(images/linear_bg_2.png); background-repeat: repeat-x; /* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#d6260e), to(#be1f0a)); /* Safari 5.1, Chrome 10+ */ background: -webkit-linear-gradient(top, #d6260e, #be1f0a); /* Firefox 3.6+ */ background: -moz-linear-gradient(top, #d6260e, #be1f0a); /* IE 10 */ background: -ms-linear-gradient(top, #d6260e, #be1f0a); /* Opera 11.10+ */ background: -o-linear-gradient(top, #d6260e, #be1f0a); color: #fff; padding: 5px 10px; font-size: 14px; text-transform: uppercase; } .area-submenu-paket-lelang .inner .item a:hover .nama { background: #be1f0a; } .area-submenu-paket-lelang .inner .item .ket { font-size: 12px; color: #333; background: #c8c8c8; /* fallback */ background-color: #c8c8c8; background: url(images/linear_bg_2.png); background-repeat: repeat-x; /* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#c8c8c8), to(#e5e5e5)); /* Safari 5.1, Chrome 10+ */ background: -webkit-linear-gradient(top, #c8c8c8, #e5e5e5); /* Firefox 3.6+ */ background: -moz-linear-gradient(top, #c8c8c8, #e5e5e5); /* IE 10 */ background: -ms-linear-gradient(top, #c8c8c8, #e5e5e5); /* Opera 11.10+ */ background: -o-linear-gradient(top, #c8c8c8, #e5e5e5); border-bottom: 1px solid #c8c8c8; padding: 3px 10px; } .area-submenu-paket-lelang .inner .item a:hover .ket { background: #ededed; } /****/ .area-tab-external { *border: 1px solid red; } .area-tab-external ul.tab-navigasi { padding: 0 0; display: table; margin-bottom: 0px; } .area-tab-external ul.tab-navigasi li { list-style: none; *display: inline-block; float: left; margin-right: 2px; } .area-tab-external ul.tab-navigasi li a { background: #b8b8b8; color: #333; display: block; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; padding: 5px 10px; } .area-tab-external ul.tab-navigasi li a:hover { text-decoration: none; background: #a9a9a9; } .area-tab-external ul.tab-navigasi li a.current { background: #02aeda; color: #fff; } .area-tab-external .konten { *border: 1px solid green; background: #f1f1f1; clear: both; padding-top: 10px; overflow-x: auto; } .area-tab-external .konten .row { margin-left: 0px; margin-right: 0px; } .area-tab-external .dataTables_filter { margin-right: 10px; } /****/ .tab-navigasi-sub { *padding-left: 10px; padding-left: 8px; padding-top: 10px; margin-left: 7px; margin-right: 7px; margin-top: 0px; } .tab-navigasi-sub a { background: rgba(0, 0, 0, 0.5); color: #fff; padding: 4px 15px; display: inline-block; } .tab-navigasi-sub a:hover { background: rgba(0, 0, 0, 0.7); text-decoration: none; } .tab-navigasi-sub a.current { background: rgba(0, 0, 0, 0.7); color: #fff; } /** COMBOBOX **/ /****/ .area-konten-inner span.combo { border: 1px solid #cccccc; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; height: 34px !important; } @media screen and (max-width:767px) { .area-konten-inner span.combo { *border: 2px solid red; max-width: 100%; } } .area-konten-inner span.combo input.combo-text { *height: 30px !important; height: 32px !important; line-height: 30px !important; padding-left: 13px; font-size: 16px; } @media screen and (max-width:767px) { .area-konten-inner span.combo input.combo-text { *border: 2px solid cyan; max-width: calc(100% - 18px); } } .area-konten-inner span.combo.datebox input.combo-text { padding-left: 2px; } .area-konten-inner span.combo input.combo-text~span.combo-arrow-wadah {} .area-konten-inner span.combo span.combo-arrow-wadah span.combo-arrow { height: 33px !important; } /*input[type=text].easyui-combobox{ border:2px solid magenta !important; *padding-right:200px !important; width: auto !important; float:left !important; }*/ /****/ input.easyui-combobox.combobox-f.combo-f {} input.easyui-combobox { width: 350px; } input.easyui-datebox { width: 115px !important; } @media screen and (max-width:767px) { input.easyui-combobox { *width: 100% !important; *border: 5px solid yellow; } } /****/ .area-konten-inner .form-control { font-size: 16px; } @media screen and (max-width:767px) { .area-konten-inner input[name=reqNamaPerusahaan] { width: 100% !important; } } /****/ .area-breadcrumb { display: inline-block; clear: both; float: left; position: relative; transition: all 0.2s ease-in-out; *border: 1px solid red; *height: 46px; *line-height: 46px; *background: rgba(0, 0, 0, 0.2); *background: green; *border-bottom: 1px solid rgba(255, 255, 255, 0.2); } @media screen and (max-width:767px) { .area-breadcrumb { height: auto; line-height: normal; } } .area-breadcrumb.detil { height: auto; line-height: normal; } .area-breadcrumb.active { *background: rgba(0, 0, 0, 0.5) url(../images/bg-shadow-menu.png) top center no-repeat; background: #444444 url(../images/bg-shadow-menu.png) top center no-repeat; position: fixed; width: 100%; left: 0; right: 0; top: 104px; z-index: 999; padding-left: 80px; } @media screen and (max-width:767px) { .area-breadcrumb.active { *top: 136px; top: 105px; padding-left: 15px; } } .area-breadcrumb ol { padding: 0 0; margin-bottom: 0px !important; } .area-breadcrumb ol li { font-size: 15px; *color: rgba(14, 115, 185, 0.8) !important; color: rgba(14, 115, 185, 0.8) !important; *border: 1px solid red; *font-weight: bold; } .area-breadcrumb ol a { font-size: 15px; *color: rgba(14, 115, 185, 0.8) !important; color: rgba(14, 115, 185, 0.8) !important; *border: 1px solid cyan; *font-weight: bold; height: 34px; line-height: 34px; } @media screen and (max-width:767px) { .area-breadcrumb ol a { height: auto; line-height: normal; } } .area-breadcrumb ol a:hover { color: rgba(14, 115, 185, 0.8) !important; } .area-breadcrumb.detil ol { padding: 0 0; margin-bottom: 12px !important; } .area-breadcrumb.detil ol a { height: auto; line-height: normal; } .area-breadcrumb.detil.active ol { margin-bottom: 0px !important; } .area-breadcrumb.detil.active ol li { height: 34px; line-height: 34px; } /****/ iframe.embed-responsive-item.modal-tmp { *border: 5px solid green; } .body-popup { *border: 10px solid red !important; *float: left; *width: 100%; background: url(../images/bg-konten.png); padding: 0px 0px; margin: 0 0; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .body-popup>.container-fluid>.row>.col-md-12 { padding-left: 0px !important; padding-right: 0px !important; } /* .area-menu-aksi{ background:#e5e5e5; padding:5px; } */ /****/ .panel.datagrid { *border: 1px solid red !important; width: 100% !important; *height: calc(100vh - 90px); height: calc(100vh - 50px); *border: none !important; } .datagrid-header-inner { width: 100% !important; *border: 4px solid green; display: inline-block; } table.datagrid-htable { width: 100%; *border: 1px solid red; } table.datagrid-btable { width: 100%; } table.datagrid-btable .datagrid-cell { *border: 2px solid red !important; *width: auto !important; *display: inline-block; } .panel.datagrid .panel-body { height: 100% !important; } /* table.datagrid-btable{ *border:2px solid green !important; width:100% !important; } td .datagrid-cell{ *border:2px solid green !important; width:100% !important; } table.datagrid-htable{ *border:2px solid red !important; *width:calc(100% - 1000px) !important; *border-collapse:collapse; } table.datagrid-htable td{ border:none !important; }*/ /****/ #tbl_bidang.paket-lelang { *border-collapse: collapse; } #tbl_bidang.paket-lelang tr.judul-kolom th.nama { *width: 350px; *background: cyan !important; } #tbl_bidang.paket-lelang th:nth-child(1) { width: 100px; } #tbl_bidang.paket-lelang th:nth-child(2) { width: 100px; } #tbl_bidang.paket-lelang th:nth-child(3) { width: 350px; } #tbl_bidang.paket-lelang th:nth-child(4) {} #tbl_bidang.paket-lelang th:nth-child(4) { *width: 100px; } #tbl_bidang.paket-lelang td { *border: 5px solid red; *background: rgba(0, 0, 0, 0.5); *color: rgba(14, 115, 185, 0.8); padding: 10px 10px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } @media screen and (max-width:767px) { #tbl_bidang.paket-lelang tr:last-child { border: none; } #tbl_bidang.paket-lelang tr:last-child td { border-bottom: none; padding: 0 0; padding-top: 0px !important; padding-left: 0px !important; background: none; } } #tbl_bidang.paket-lelang tr:nth-child(odd) td { *background: rgba(0, 0, 0, 0.4); } #tbl_bidang.paket-lelang td.tgl {} #tbl_bidang.paket-lelang td.tgl .bln-thn { *border: 1px solid cyan; *background: #a51e24; background: #197d9e; color: #fff; text-align: center; font-size: 14px; padding: 4px 10px; } #tbl_bidang.paket-lelang td.tgl .tgl { background: rgba(0, 0, 0, 0.2); *border: 1px solid #a51e24; text-align: center; font-size: 30px; } #tbl_bidang.paket-lelang td a { color: #333; } /****/ #tbl_bidang.paket-lelang td.nama { position: relative; *padding-bottom: 80px !important; padding-bottom: 100px !important; *border: 1px solid red; *display: table-cell; *vertical-align: bottom; *background-color: rgba(255, 255, 255, 0.3); } @media screen and (max-width:767px) { #tbl_bidang.paket-lelang td.nama { padding-bottom: 150px !important; } } #tbl_bidang.paket-lelang td.nama .nama-paket { *position: relative; *border: 1px solid red; *position: absolute; *top: 0; } #tbl_bidang.paket-lelang #ket-daftar { position: absolute; bottom: 10px; width: calc(100% - 20px); } #tbl_bidang.paket-lelang #ket-daftar .dibatalkan-diulang { background: #FFF; padding: 5px 10px; color: #a51e24; font-family: 'AvenirBook'; font-size: 14px; border: 1px solid rgba(165, 30, 36, 0.4); } #tbl_bidang.paket-lelang #ket-daftar .dapat { background: rgba(0, 0, 0, 0.1); padding: 5px 10px; font-family: 'AvenirBook'; font-size: 14px; } #tbl_bidang.paket-lelang #ket-daftar .dapat:before { font-family: "FontAwesome"; *content: "\f00c"; content: "\f058"; margin-right: 5px; } #tbl_bidang.paket-lelang #ket-daftar .tdk-dapat { background: rgba(165, 30, 36, 0.4); padding: 5px 10px; font-family: 'AvenirBook'; font-size: 14px; } #tbl_bidang.paket-lelang #ket-daftar .tdk-dapat:before { color: #a51e24; font-family: "FontAwesome"; *content: "\f057"; content: "\f06a"; margin-right: 5px; } /****/ #tbl_bidang.paket-lelang .tidak-memenuhi-syarat { background: rgba(218, 26, 26, 0.1); color: #333; padding: 5px 10px; border-top: 2px solid #da1a1a; font-family: 'AvenirBook'; font-size: 14px; } /*#tbl_bidang.paket-lelang .tidak-memenuhi-syarat ~ div a{ display:block; padding-top:3px; padding-bottom:3px; background:#FFF; } */ /****/ /*#tbl_bidang.paket-lelang td .area-aksi{ *display: flex; *justify-content: center; /* align horizontal * *align-items: center; /* align vertical * } #tbl_bidang.paket-lelang td .area-aksi a{ display:block; *background:cyan; background-color: #1e6695; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1e6695), to(#135077)); background: -webkit-linear-gradient(top, #1e6695, #135077); background: -moz-linear-gradient(top, #1e6695, #135077); background: -ms-linear-gradient(top, #1e6695, #135077); background: -o-linear-gradient(top, #1e6695, #135077); color:rgba(255,255,255,0.8); *padding:5px 15px; *padding-left:15px; *padding-right:15px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } #tbl_bidang.paket-lelang td .area-aksi a:hover{ background:#333; color:rgba(255,255,255,1); text-decoration:none; }*/ /*#ket-daftar{ *background:#ecf3ff; *border-left:10px solid #77bff1; background:rgba(0,0,0,0.1); border-left:10px solid rgba(0,0,0,0.5); *background:red; *border:1px solid #77bff1; color:rgba(0,0,0,0.6); *-webkit-border-radius: 3px; *-moz-border-radius: 3px; *border-radius: 3px; padding:3px 10px; } #ket-daftar.tdk-dapat{ background:rgba(218,26,26,0.1); *border:1px solid #da1a1a; border-left:10px solid #da1a1a; } .tidak-memenuhi-syarat{ background:rgba(218,26,26,0.1); color:rgba(0,0,0,0.6); padding:3px 10px; border-top:2px solid #da1a1a; } .tidak-memenuhi-syarat ~ div{ } .tidak-memenuhi-syarat ~ div a{ display:block; padding-top:3px; padding-bottom:3px; background-color: #525252; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#525252), to(#333)); background: -webkit-linear-gradient(top, #525252, #333); background: -moz-linear-gradient(top, #525252, #333); background: -ms-linear-gradient(top, #525252, #333); background: -o-linear-gradient(top, #525252, #333); background-color: #da1a1a; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#da1a1a), to(#a42421)); background: -webkit-linear-gradient(top, #da1a1a, #a42421); background: -moz-linear-gradient(top, #da1a1a, #a42421); background: -ms-linear-gradient(top, #da1a1a, #a42421); background: -o-linear-gradient(top, #da1a1a, #a42421); color:rgba(255,255,255,0.6) !important; } .tidak-memenuhi-syarat ~ div a:hover{ background: #333; color:rgba(255,255,255,0.9) !important; text-decoration:none; }*/ /****/ /*#tbl_bidang.paket-lelang thead th{ *background:#333333; *color:#FFF; font-weight:normal; text-transform:uppercase; } #tbl_bidang.paket-lelang td.tgl{ *background:#c6c6c6; *background:#b8b8b8; *padding:0 0 !important; } #tbl_bidang.paket-lelang td.tgl .bln-thn{ *background:rgba(0,0,0,0.2); *background:#525252; background:#a51e24; color:#FFF; text-align:center; padding:4px; font-size:14px; } #tbl_bidang.paket-lelang td.tgl .tgl{ *background:pink; text-align:center; font-size:24px; *border:1px solid rgba(0,0,0,0.2); *border:1px solid #525252; border:1px solid #a51e24; border-width:0 1px 1px 1px; } #tbl_bidang.paket-lelang tr td{ border-bottom:1px solid rgba(0,0,0,0.1); } #tbl_bidang.paket-lelang tr:nth-child(odd){ *background:rgba(255,255,255,0.9); } #tbl_bidang.paket-lelang tr:nth-child(even){ *background:rgba(230,230,230,0.4); *background:red; *background:rgba(255,255,255,0.5); } #tbl_bidang.paket-lelang a{ color:#333; }*/ /****/ /*#tbl_bidang a{ color:#333; } #tbl_bidang .keterangan{ background:#ecf3ff; border:1px solid #77bff1; color:rgba(0,0,0,0.6); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; padding:3px 10px; } #tbl_bidang .keterangan.warning{ background:rgba(218,26,26,0.1); border:1px solid #da1a1a; } */ /****/ .frameblue { *background: #00487b url(../images/shadow-vr-notifikasi.png) top left no-repeat; /*background:rgba(0,0,0,0.2) url(../images/shadow-vr-notifikasi.png) top left no-repeat; color:#fff; min-height:300px;*/ margin: 0 0 !important; font-family: 'AvenirBook'; font-size: 15px; } .frameblue>ul.verifikasi-keterangan { list-style: none; padding: 0 0; background: url(../images/icon-i.png) top 0px right 100px no-repeat; } .frameblue>ul.verifikasi-keterangan li { *border-bottom: 1px solid rgba(0, 0, 0, 0.1); *padding-top: 10px; *padding-bottom: 10px; padding: 5px 10px; margin-bottom: 10px; } .frameblue>ul.verifikasi-keterangan li:before {} .frameblue>ul.verifikasi-keterangan li.info { background: rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(0, 0, 0, 0.1); } .frameblue>ul.verifikasi-keterangan li.gagal { color: #f00; background: rgba(255, 255, 255, 0.7); border-bottom: 1px solid rgba(255, 255, 255, 0.9); } .frameblue>ul.verifikasi-keterangan li.gagal table.verifikasi-gagal { border-collapse: collapse; *width: calc(100% - 20px); *margin-left: 20px; margin-top: 6px; margin-bottom: 6px; } .frameblue>ul.verifikasi-keterangan li.gagal table.verifikasi-gagal tr.judul-kolom td { background: rgba(0, 0, 0, 0.5); color: #fff; text-transform: uppercase; } .frameblue>ul.verifikasi-keterangan li.gagal table.verifikasi-gagal tr.gelap td { background: rgba(0, 0, 0, 0.2); color: #333; } .frameblue>ul.verifikasi-keterangan li.gagal table.verifikasi-gagal tr.terang td { background: rgba(0, 0, 0, 0.1); color: #333; } .frameblue>ul.verifikasi-keterangan li.gagal table.verifikasi-gagal tr td { border-right: 1px solid rgba(0, 0, 0, 0.2); padding: 5px 10px; } .frameblue>ul.verifikasi-keterangan li.gagal table.verifikasi-gagal tr td:last-child { border-right: none; } /****/ .area-tombol-atas { *padding-bottom: 10px; display: inline-block; width: 100%; } /****/ .area-show-hide-konten { *border: 2px solid red; } .area-show-hide-konten {} @media screen and (max-width:767px) { .area-show-hide-konten { max-width: calc(100vw - 75px); overflow: auto; * border: 2px solid blue; } } .area-show-hide-konten table { border-collapse: separate; width: 100%; border-spacing: 1px; border: 1px solid rgba(0, 0, 0, 0.2); } .area-show-hide-konten table tr.judul-kolom2 td { *background: #5C5C5C; background: #cccccc; *color: #fff; *border: 1px solid rgba(0, 0, 0, 0.2); } .area-show-hide-konten table tr.judul-kolom4 td { background: #f4f4f4; *border: 1px solid rgba(0, 0, 0, 0.2); } /****/ .form-group table .kolom-aksi { text-align: center !important; *background: cyan !important; } .form-group table a {} .form-group table a:hover { text-decoration: none; } /*.form-group table a:hover i{ background:rgba(0,0,0,0.8); }*/ .form-group table a.kolom-buka-show-hide { *border: 1px solid red; display: block; } .form-group table a.kolom-buka-show-hide:hover:after { content: "↓"; float: right; *background: yellow; *color: #a42421; margin-left: -20px; } /****/ table.tambah-baris { *border: 2px solid yellow; *border-collapse: collapse; *width: 100%; } table.tambah-baris thead th { background: #d9d9d9; padding: 4px 8px; } /****/ table.header-keterangan { border-collapse: collapse; width: 100%; *border: 2px solid red; *border-top: 3px solid #a42421; border-bottom: 3px solid rgba(0, 0, 0, 0.2); margin-bottom: 10px; } table.header-keterangan td:nth-child(1) { width: 200px; } table.header-keterangan td:nth-child(2) { width: 20px; } /****/ .informasi {} .informasi>ul { padding: 0 0; list-style: none; } .informasi>ul>li { background: rgba(0, 0, 0, 0.2); *color: #fff; padding: 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid rgba(0, 0, 0, 0.1); margin-bottom: 4px; } .informasi>ul>li i { *color: #fc665f; font-size: 24px; vertical-align: middle; } /****/ .keterangan-list { margin-top: -10px; } .keterangan-list>ul { padding: 0 0; list-style: none; } .keterangan-list>ul>li { border-bottom: 1px solid rgba(0, 0, 0, 0.2); padding: 5px 10px; background: rgba(255, 255, 255, 0.5); } /****/ .info-perusahaan { border: 1px solid rgba(0, 0, 0, 0.2); padding: 10px; margin-bottom: 20px; } .info-perusahaan table {} .info-perusahaan table td { background: rgba(255, 255, 255, 0.7) !important; padding: 5px 10px !important; } .info-perusahaan table td:nth-child(1) { width: 200px; } .info-perusahaan table td:nth-child(2) { width: 20px; } /** FIXED AREA-MENU-AKSI WHEN SCROLLING UP **/ div#sticker { *padding: 20px; *margin: 20px 0; *background: #AAA; *width: 190px; *z-index: 999; *position: relative; } .stick { position: fixed; top: 138px !important; left: 0; z-index: 999; width: 50%; height: 44px; padding-top: 5px; padding-left: 80px; background: #f4f4f4; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } @media screen and (max-width:767px) { .stick { padding-left: 0px; padding-top: 5px; padding-bottom: 5px; padding-left: 5px; height: auto; } .stick .area-menu-aksi { padding: 0px; } } .stick .area-menu-aksi { width: 100%; } .stickfilter { position: fixed; top: 138px !important; right: 0; z-index: 999; width: 50%; height: 44px; padding-top: 5px; padding-right: 80px; background: #f4f4f4; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } @media screen and (max-width:767px) { .stickfilter { top: 178px !important; padding-right: 0px; width: 100%; height: auto; } } /****/ .container-treegrid, .row-treegrid, .col-treegrid { height: 100% !important; } .container-treegrid { *border: 1px solid cyan; } .row-treegrid { *border: 1px solid blue; } .col-treegrid { *border: 1px solid yellow; } /****/ table.syarat-ketentuan { *border: 5px solid green; *border-collapse: collapse; border-collapse: separate; border-spacing: 0 10px; } table.syarat-ketentuan tr.judul-kolom td { *border: 2px solid hotpink !important; border-right: 1px solid rgba(0, 0, 0, 0.1); } table.syarat-ketentuan tr.judul-kolom td:last-child { border-right: none; } table.syarat-ketentuan tr.judul-kolom td:nth-child(1) { width: 300px; } table.syarat-ketentuan tr.judul-kolom td:nth-child(2) { width: 300px; } table.syarat-ketentuan tr.gelap, table.syarat-ketentuan tr.terang { *border-spacing: 10px; *margin-bottom: 100px !important; } table.syarat-ketentuan tr.gelap td, table.syarat-ketentuan tr.terang td { border-top: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(0, 0, 0, 0.1); *padding: 15px 15px; } table.syarat-ketentuan tr.gelap td:nth-child(3), table.syarat-ketentuan tr.terang td:nth-child(3) { *padding: 0px 0px !important; padding: 0px 0px; *background: rgba(255, 255, 255, 0.2); *background: #FFF; *border: 1px solid cyan; border: 1px solid rgba(0, 0, 0, 0.1); position: relative !important; } /****/ /*.area-info-kelengkapan-pendaftaran{ border:2px solid green; *background:rgba(0,0,0,0.4); background:red; padding:2px; }*/ table.syarat-ketentuan input.info-kelengkapan-pendaftaran { *background: #da1a1a; *background: rgba(0, 0, 0, 0.25); background: rgba(0, 0, 0, 0.4); *background: rgba(0, 0, 0, 0.1); color: #fff; height: 34px; padding-left: 10px; width: 100%; border: none; border-bottom: 1px solid rgba(0, 0, 0, 0.2); *border: 1px solid cyan; *background-color: transparent; } table.syarat-ketentuan input.info-kelengkapan-pendaftaran.easyui-validatebox.validatebox-text { *background-color: transparent; } table.syarat-ketentuan input.info-kelengkapan-pendaftaran.easyui-validatebox.validatebox-text.validatebox-invalid { background-image: url('images/validatebox_warning.png'); background-repeat: no-repeat; background-position: right center; border-color: #ffa8a8; background-color: #fff3f3; *color: #000; color: red; *color: #a42421; } table.syarat-ketentuan input.info-kelengkapan-pendaftaran:after { *border: 1px solid red !important; } table.syarat-ketentuan .area-klik.btn-lookup { position: absolute; top: 5px; right: 10px; *margin-top: 5px; *border: 1px solid rgba(0, 0, 0, 0.4) !important; border: 1px solid rgba(255, 255, 255, 0.9) !important; *border: none !important; *padding: 0 0; line-height: normal !important; } table.syarat-ketentuan .area-klik.btn-lookup img { *border: 1px solid red; } table.syarat-ketentuan .area-klik.btn-lookup:before { /*border:10px solid red; content:"fghjk"; position:absolute; z-index:-1;*/ } /*****/ .tabel-pengalaman table { border-collapse: collapse; width: calc(100% - 20px); margin: 10px; } .tabel-pengalaman table thead tr.judul-kolom th { border: 1px solid rgba(0, 0, 0, 0.2) !important; } .tabel-pengalaman table thead tr.judul-kolom th:nth-child(1) { width: 200px; } .tabel-pengalaman table thead tr.judul-kolom th:last-child { width: 200px; } .tabel-pengalaman table tr:nth-child(odd) td { background: rgba(0, 0, 0, 0.02); } .tabel-pengalaman table tr:nth-child(even) td { background: rgba(0, 0, 0, 0.05); } .tabel-pengalaman table tbody tr td { border: 1px solid rgba(0, 0, 0, 0.2) !important; } .tabel-pengalaman table tbody tr td:last-child { padding: 4px 6px !important; } .tabel-pengalaman table tbody tr td:nth-child(3) {} /****/ .tabel-pengalaman-2 table { border-collapse: collapse; width: calc(100% - 20px); margin: 10px; } .tabel-pengalaman-2 table thead tr.judul-kolom th { border: 1px solid rgba(0, 0, 0, 0.2) !important; } .tabel-pengalaman-2 table thead tr.judul-kolom th:nth-child(1) {} .tabel-pengalaman-2 table thead tr.judul-kolom th:last-child { width: 200px; } .tabel-pengalaman-2 table tr:nth-child(odd) td { background: rgba(0, 0, 0, 0.02); } .tabel-pengalaman-2 table tr:nth-child(even) td { background: rgba(0, 0, 0, 0.05); } .tabel-pengalaman-2 table tbody tr td { border: 1px solid rgba(0, 0, 0, 0.2) !important; } .tabel-pengalaman-2 table tbody tr td:last-child { padding: 4px 6px !important; } /****/ .area-pencarian { *border: 1px solid cyan; text-align: right; } /****/ .area-aksi-paket-lelang { *border: 1px solid red; } .area-aksi-paket-lelang a { height: auto !important; line-height: normal !important; color: rgba(255, 255, 255, 0.6) !important; padding-top: 5px; padding-bottom: 6px; } .area-aksi-paket-lelang a:hover { color: rgba(14, 115, 185, 0.8) !important; } /** AANWIJZING **/ .frameBuku { border: 2px solid red; width: 100%; height: 100%; } .klik-buku a { display: block; width: 180px; height: 260px; /*margin-top:-160px; background:#F6F;*/ position: relative; z-index: 999; /*background:#990;*/ *background: url(../images/cover-buku.jpg); /*background:rgba(245,255,34,0.7);*/ } /*.klik-buku a span:nth-child(1){ background:rgba(0,0,0,0.7); color:#FFF; height:20px; line-height:20px; padding:0 5px; bottom:36px; right:0px; position:absolute; } .klik-buku a span:nth-child(2){ background:rgba(255,255,255,0.8); color:#000; height:20px; line-height:20px; padding:0 10px; bottom:15px; right:0px; position:absolute; }*/ .klik-buku a:nth-child(2) { visibility: hidden; } iframe#buku-frame { width: 100%; height: 100%; min-height: 100%; border: none; } figure.close { *float: right; *font-size: 21px; *font-weight: bold; *line-height: 1; *color: #000; text-shadow: none /* 0 1px 0 #fff*/ ; filter: alpha(opacity=100); opacity: 1; *background: red !important; } figure.close:hover { *color: #000; *text-decoration: none; *cursor: pointer; filter: alpha(opacity=100); opacity: 1; } figure.close .buttons.klik-buku a:hover { text-decoration: none; } /****/ #separuh-kiri { width: 50%; float: left; background: #0086a9 !important; *height: 100%; *min-height: 100%; height: calc(100vh - 0px); min-height: calc(100vh - 0px); /*height: -moz-calc(100% + 150px); height: -webkit-calc(100% + 150px); height: -o-calc(100% + 150px); height: calc(100% + 150px); min-height: -moz-calc(100% + 150px); min-height: -webkit-calc(100% + 150px); min-height: -o-calc(100% + 150px); min-height: calc(100% + 150px);*/ *border: 2px solid lime; } #separuh-kiri img { height: 100%; width: 100%; } #separuh-kiri-tombol { position: absolute; right: 50%; padding: 20px 20px 10px; } #separuh-kiri-tombol input[type=button] { background: #4bbad9; color: #fff; border: none; padding: 7px 10px 8px; font-size: 12px; text-transform: uppercase; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } #separuh-kiri-tombol input[type=button].disable { background: #b0b0b0; color: #dddddd; border: none; padding: 7px 10px 8px; font-size: 12px; text-transform: uppercase; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; } #separuh-kanan { width: 50%; float: right; background: #f4f4f4; *height: 100%; *min-height: 100%; height: calc(100vh - 0px); min-height: calc(100vh - 0px); position: relative; *border: 2px solid cyan; } #separuh-kanan img { height: 100%; width: 100%; } #separuh-kanan iframe { width: 100%; height: 100%; min-height: 100%; /* height:50%; min-height:50%;*/ border: none; overflow: hidden; } #separuh-kanan #kanan-bawah { background: #e0f5fb; height: 100%; min-height: 100%; overflow-y: scroll; } #kanan-bawah-inner { padding: 18px 20px; } #tombol2 { float: left; position: fixed; left: 160px; top: 20px; height: 32px; padding: 0 20px; z-index: 999; } /*****/ .area-aanwijzing-shoutbox .tabs { position: relative; clear: both; margin: 0 0; *height: 100%; *min-height: 100%; height: 100vh; min-height: 100vh; position: relative; *background: #73D4Ff; *background: rgba(115, 212, 238, 0.2); *background: #3bbdde; background-color: #02aeda; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#02aeda), to(#3bbdde)); background: -webkit-linear-gradient(top, #02aeda, #3bbdde); background: -moz-linear-gradient(top, #02aeda, #3bbdde); background: -ms-linear-gradient(top, #02aeda, #3bbdde); background: -o-linear-gradient(top, #02aeda, #3bbdde); } #bg-tab-header { height: 35px; *background: #a51e24; background: rgba(0, 0, 0, 0.2); position: fixed; width: 100%; top: 0; right: 0; } .area-aanwijzing-shoutbox .tab { float: left; height: -moz-calc(100% - 10px); height: -webkit-calc(100% - 10px); height: -o-calc(100% - 10px); height: calc(100% - 10px); } .area-aanwijzing-shoutbox .tab [type=radio] { display: none; } .area-aanwijzing-shoutbox .tab .content { position: absolute; top: 28px; left: 0; *background: #da1a1a /*4bbad9*/ ; right: 0; bottom: 0; /*padding: 20px;*/ /*border: 1px solid #ccc;*/ /*overflow: hidden;*/ } .area-aanwijzing-shoutbox .tab .content>* { opacity: 0; /*-webkit-transform: translate3d(0, 0, 0); -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); -ms-transform: translateX(-100%); -o-transform: translateX(-100%); -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease;*/ } .area-aanwijzing-shoutbox .tab label { font-size: 13px; color: #fff; background: rgba(0, 0, 0, 0.3); padding: 0px 10px 1px; width: 190px; height: 28px; line-height: 28px; position: fixed; left: 3px; margin-top: 6px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; z-index: 99; text-align: center; font-weight: normal; } .area-aanwijzing-shoutbox [type=radio]:checked~label { *background: #71cee8; *background: #da1a1a; background: #02aeda; color: #fff; height: 28px; line-height: 28px; text-align: center; /*border-right:1px solid #0289ab; padding:10px;*/ /*border-bottom: 1px solid white;*/ z-index: 99; } .area-aanwijzing-shoutbox [type=radio]:checked~label~.content { z-index: 1; } .area-aanwijzing-shoutbox [type=radio]:checked~label~.content>* { opacity: 1; /*-webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0);*/ } /****/ #content-inner { padding: 18px 20px; font-family: 'AvenirBook'; font-size: 13px; color: #fff; /*background:#71cee8;*/ *height: 92%; *min-height: 90%; height: calc(100% - 5px); min-height: calc(100% - 5px); } #content-inner table { border-collapse: collapse; width: 100%; } #content-inner table tr.judul td { text-align: center; background: #0289ab; } #content-inner table tr.sub-judul1 td { text-align: center; font-weight: bold; background: #3bbdde; } #content-inner table tr.sub-judul td { text-align: left; background: #2db0d1; } #content-inner table td { border: 1px solid #0289ab; background: #81d9f2; color: #fff; padding: 4px 10px; text-align: center; } /****/ .area-auction { *border: 2px solid red; } .area-auction .area-data { *border: 2px solid green; float: left; width: 100%; clear: both; *margin-bottom: 20px; } .area-auction .area-data .waktu-peserta { *border: 2px solid cyan; float: left; width: 50%; padding: 10px 20px; border: 1px solid rgba(0, 0, 0, 0.2); border-width: 1px 0 0px 1px; height: 134px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topleft: 4px; border-top-left-radius: 4px; } .area-auction .area-data .waktu-peserta .list { border-bottom: 1px solid #e6e6e6; padding: 10px 0; } .area-auction .area-data .waktu-peserta .list:nth-child(1) { border-top: 1px solid #e6e6e6; } .area-auction .area-data .waktu-peserta span:nth-child(1) { display: inline-block; width: 200px; } .area-auction .area-data .waktu-peserta span:nth-child(2) input[type=text] { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid #cccccc; height: 34px; line-height: 34px; } .area-auction .area-data .harga-terendah { *border: 2px solid pink; float: left; width: 50%; } .area-auction .area-data .harga-terendah .judul { *background: red; background: #D9D9D9; height: 34px; line-height: 34px; padding: 0 15px; *border-bottom: 4px solid rgba(0, 0, 0, 0.2); border: 1px solid rgba(0, 0, 0, 0.2); border-width: 1px 1px 0px 0px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topright: 4px; border-top-right-radius: 4px; } .area-auction .area-data .harga-terendah .data { float: left; width: 100%; clear: both; *border: 1px solid yellow; } .area-auction .area-data .harga-terendah .data .nilai { float: left; width: calc(100% - 100px); height: 100px; line-height: 100px; text-align: center; background: rgba(0, 0, 0, 0.2) url(../images/bg-shadow-menu.png) top center no-repeat; *color: #fff; font-size: 50px; } .area-auction .area-data .harga-terendah .data .ikon { float: left; width: 100px; height: 100px; line-height: 100px; text-align: center; background: rgba(255, 255, 255, 0.5); font-size: 36px; color: #da1a1a; border-right: 1px solid rgba(0, 0, 0, 0.2); } /****/ .area-auction .area-penawaran-anda { *border: 1px solid rgba(0, 0, 0, 0.2); *border-width: 1px 1px 1px 1px; padding: 15px 20px; clear: both; margin-bottom: 20px; /*background: #da1a1a; background-color: #da1a1a; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#da1a1a), to(#a42421)); background: -webkit-linear-gradient(top, #da1a1a, #a42421); background: -moz-linear-gradient(top, #da1a1a, #a42421); background: -ms-linear-gradient(top, #da1a1a, #a42421); background: -o-linear-gradient(top, #da1a1a, #a42421); color: #fafafa;*/ *background: #cccccc; *border: 1px solid rgba(0, 0, 0, 0.2); *border-width: 0px 1px 1px 1px; background: #e6e6e6 url(../images/bg-penawaran-anda.png) top right no-repeat; *border-top: 1px solid rgba(255, 255, 255, 0.2); border-top: 1px solid rgba(0, 0, 0, 0.2); -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } .area-auction .area-penawaran-anda span:nth-child(1) { display: inline-block; width: 200px; } .area-auction .area-penawaran-anda span:nth-child(2) input[type=text] { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; *border: none; border: 1px solid rgba(0, 0, 0, 0.2); height: 34px; line-height: 34px; color: #333; } .area-auction .area-penawaran-anda span.keterangan { float: right; color: rgba(255, 255, 255, 1); *color: #da1a1a; font-weight: normal; font-size: 14px; padding-top: 15px; } /****/ .area-auction { *border: 2px solid red; float: left; width: 100%; clear: both !important; } /****/ .area-auction .jam-jumlah { float: left; width: calc(33.3% - 20px); height: 170px; margin-right: 20px; *border: 2px solid cyan; *background: #a51e24 url(../images/bg-shadow-kanan.png) top left no-repeat; *background: #a51e24 url(../images/bg-peserta.png) top left no-repeat; background: #02aeda url(../images/bg-peserta.png) top left no-repeat; *padding: 20px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } @media screen and (max-width:767px) { .area-auction .jam-jumlah { width: calc(100% - 30px); margin-left: 15px; margin-top: 10px; margin-bottom: 10px; *-webkit-border-radius: 0px; *-moz-border-radius: 0px; *border-radius: 0px; } } .area-auction .jam-jumlah .jam { color: #fff; text-align: center; *border-bottom: 1px dashed rgba(255, 255, 255, 0.2); background: rgba(0, 0, 0, 0.2); font-family: 'Futura-Condensed'; font-size: 30px; line-height: 40px; padding-top: 10px; padding-bottom: 10px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; } .area-auction .jam-jumlah .area-jumlah { padding-left: 20px; padding-right: 20px; } .area-auction .jam-jumlah .area-jumlah .nilai { font-size: 42px; color: #fff; text-align: center; } .area-auction .jam-jumlah .area-jumlah .keterangan { color: #fff; text-align: center; border-top: 1px dashed rgba(255, 255, 255, 0.2); padding-top: 10px; padding-bottom: 10px; } /****/ .area-auction .penawaran { float: left; width: 33.3%; height: 170px; *border: 2px solid pink; background: rgba(0, 0, 0, 0.15) url(../images/bg-penawaran.png) bottom right no-repeat; *background: url(../images/bg-judul-penawaran.png) bottom right no-repeat; -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; border-top-left-radius: 4px; border-bottom-left-radius: 4px; padding: 20px; } @media screen and (max-width:767px) { .area-auction .penawaran { width: calc(100% - 30px); margin-left: 15px; } } .area-auction .penawaran .judul { text-align: center; height: 40px; line-height: 40px; border-bottom: 1px solid rgba(255, 255, 255, 0.2); text-transform: uppercase; font-size: 20px; } .area-auction .penawaran input[type=text] { width: 100%; height: 60px; *border-bottom: 1px dashed rgba(0, 0, 0, 0.2); border-width: 0 0 0px 0; text-align: center; background-color: transparent; font-size: 24px; *font-size: 30px; } .area-auction .penawaran label.besaran-penurunan { width: 100%; height: 55px; line-height: 55px; margin-top: 5px; *border-bottom: 1px dashed rgba(0, 0, 0, 0.2); border-width: 0 0 0px 0; text-align: center; background-color: transparent; *font-size: 24px; *font-size: 30px; border: 1px solid rgba(2, 174, 218, 0.2); background: rgba(255, 255, 255, 0.4); } .area-auction .penawaran button { /*background: #da1a1a; background-color: #da1a1a; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#da1a1a), to(#a42421)); background: -webkit-linear-gradient(top, #da1a1a, #a42421); background: -moz-linear-gradient(top, #da1a1a, #a42421); background: -ms-linear-gradient(top, #da1a1a, #a42421); background: -o-linear-gradient(top, #da1a1a, #a42421);*/ background: #73D4Ff; background-color: #73D4Ff; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#73D4Ff), to(#02aeda)); background: -webkit-linear-gradient(top, #73D4Ff, #02aeda); background: -moz-linear-gradient(top, #73D4Ff, #02aeda); background: -ms-linear-gradient(top, #73D4Ff, #02aeda); background: -o-linear-gradient(top, #73D4Ff, #02aeda); color: #fafafa; border: none; width: 100%; height: 34px; } /****/ .area-auction .harga { float: left; width: 33.3%; height: 170px; *border: 2px solid purple; background: #FFF; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; padding: 20px; position: relative; } @media screen and (max-width:767px) { .area-auction .harga { width: calc(100% - 30px); margin-left: 15px; margin-top: 10px; } } .area-auction .harga.panitia .jam { position: absolute; width: 100%; left: 0; top: 0; *background: rgba(0, 0, 0, 0.7); background: #02aeda; color: #fff; text-align: center; *border-bottom: 1px dashed rgba(255, 255, 255, 0.2); *background: rgba(0, 0, 0, 0.2); font-family: 'Futura-Condensed'; font-size: 30px; line-height: 40px; padding-top: 10px; padding-bottom: 10px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; /*-webkit-border-top-left-radius: 0px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 0px; -moz-border-radius-topright: 4px; border-top-left-radius: 0px; border-top-right-radius: 4px;*/ } .area-auction .harga.panitia .jam input[type=button] { border: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background-color: #ededed; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ededed), to(#dbdbdb)); background: -webkit-linear-gradient(top, #ededed, #dbdbdb); background: -moz-linear-gradient(top, #ededed, #dbdbdb); background: -ms-linear-gradient(top, #ededed, #dbdbdb); background: -o-linear-gradient(top, #ededed, #dbdbdb); color: rgba(0, 0, 0, 0.5); font-family: 'AvenirBook'; font-size: 18px; text-transform: uppercase; } .area-auction .harga.panitia .jam label.is-countdown, label.is-countdown { font-family: 'BebasNeue'; font-size: 40px; font-weight: normal; } .area-auction .harga.panitia .jam input[type=button]#btnReset { float: right; margin-right: 13px; } .area-auction .harga .judul { text-align: center; height: 40px; line-height: 40px; border-bottom: 1px solid rgba(0, 0, 0, 0.2); text-transform: uppercase; font-size: 20px; } .area-auction .harga .nilai { position: relative; } .area-auction .harga .nilai .mata-uang { position: absolute; border: 1px solid rgba(0, 0, 0, 0.2); border-width: 0 1px 1px 1px; padding: 1px 15px; } .area-auction .harga .nilai .nominal { font-size: 36px; line-height: 60px; text-align: center; } .area-auction .harga .nilai .nominal .ikon { right: 0; bottom: 0; text-align: center; *background: #DA1A1A; background: #02aeda; color: #fff; width: 60px; height: 60px; line-height: 60px; margin-top: 10px; margin-bottom: 10px; margin-left: 140px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; font-size: 30px; } .area-auction .harga .nilai .keterangan {} .area-auction .harga .nilai .keterangan .keterangan { font-style: italic; font-size: 10px; *padding-right: 70px; text-align: right; } .area-auction .harga.panitia .nilai .keterangan .keterangan span { font-size: 18px; font-style: normal; } .area-auction .harga .nilai .keterangan .ikon { position: absolute; right: 0; bottom: 0; background: #DA1A1A; color: #fff; width: 60px; height: 60px; line-height: 60px; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; font-size: 30px; } .area-auction .harga.panitia .nilai .keterangan .ikon { bottom: -20px; } /****/ .area-auction .area-chatting { margin-top: 20px; clear: both; float: left; width: 100%; } .area-auction .area-chatting .col-md-12 { *padding-right: 0px; } .area-auction .area-chatting .panel { background-color: transparent; } .area-auction .area-chatting .panel.panel-primary .panel-heading { background: #D9D9D9 !important; *background: #da1a1a !important; color: #333; *color: #fff; *border-bottom: 1px solid rgba(0, 0, 0, 0.1); *border-bottom: 1px solid rgba(255, 255, 255, 0.2); border-bottom: none; text-transform: uppercase; } .area-auction .area-chatting .panel.panel-primary .panel-heading i { *color: #DA1A1A; color: rgba(0, 0, 0, 0.5); font-size: 24px; } .area-auction .area-chatting .panel.panel-primary .panel-footer { background: #02aeda !important; border: none !important; *border-top: 1px solid rgba(255, 255, 255, 0.2); width: 100% !important; *border: 1px solid cyan !important; float: left; clear: both; } .area-auction .area-chatting .panel.panel-primary .panel-footer .input-group { *border: 1px solid green; width: calc(100% - 0px); float: left; clear: both; } .area-auction .area-chatting .panel.panel-primary .panel-footer .input-group form { *border: 1px solid blue; width: calc(100% - 0px) !important; float: left; clear: both; } .area-auction .area-chatting .panel.panel-primary .panel-footer input[type=text] { *border: 1px solid red !important; width: calc(100% - 80px) !important; height: 34px; border: none; -webkit-border-top-left-radius: 17px; -webkit-border-bottom-left-radius: 17px; -moz-border-radius-topleft: 17px; -moz-border-radius-bottomleft: 17px; border-top-left-radius: 17px; border-bottom-left-radius: 17px; } .area-auction .area-chatting .panel.panel-primary .panel-footer span.input-group-btn { float: left; *border: 1px solid red; width: 80px; } .area-auction .area-chatting .panel.panel-primary .panel-footer .btn:hover { background-color: #ededed; color: rgba(0, 0, 0, 1); } .area-auction .chat { list-style: none; margin: 0; padding: 0; } .area-auction .chat li { margin-bottom: 10px; padding-bottom: 5px; *border-bottom: 1px dotted #B3A9A9; padding-left: 15px; padding-right: 15px; } .area-auction .chat li:nth-child(1) { margin-top: 15px; } .area-auction .chat li.left .chat-body { *margin-left: 60px; *margin-left: 20px; } .area-auction .chat li.right .chat-body { *margin-right: 60px; *margin-right: 20px; } .area-auction .panel-body { overflow-y: scroll; height: 250px; font-family: 'AvenirBook'; font-size: 15px; *background: rgba(255, 255, 255, 0.2) url(../images/bg-shadow-pagination.png) top center no-repeat; *background: rgba(0, 0, 0, 0.4) url(../images/bg-shadow-pagination.png) top center no-repeat; border: none; *background: #fafafa; *background: #cacaca url(../images/bg-mengetik.png) top right no-repeat; background: #f0f0f0 url(../images/bg-chat-body.png) top left no-repeat; } .area-auction .chat li .chat-body { *float: left; *width: 100%; *clear: both; position: relative; } .area-auction .chat li .chat-body .waktu { *float: left; *width: 180px; height: 18px; line-height: 18px; font-size: 10px; position: absolute; top: 7px; left: 6px; *top: -12px; *background: rgba(218, 26, 26); background: rgba(0, 0, 0, 0.5); color: #fff; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding-left: 10px; padding-right: 10px; } .area-auction .chat li .chat-body .waktu i { *color: #da1a1a; } .area-auction .chat li .chat-body .data { *float: left; *width: calc(100% - 180px); background: #FFF; border-bottom: 2px solid rgba(0, 0, 0, 0.1); -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; padding: 5px 10px 5px 120px; } @media screen and (max-width:767px) { .area-auction .chat li .chat-body .data {} } .area-auction .chat li .chat-body .data span.nama { *color: rgba(255, 255, 255, 0.6); text-transform: uppercase; font-weight: bold; } .area-auction .chat li .chat-body .data span.nama:after { content: " : "; } .area-auction .chat li .chat-body .data span.isi { *color: rgba(255, 255, 255, 1); } .area-auction ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); background-color: #F5F5F5; } .area-auction ::-webkit-scrollbar { width: 12px; background-color: #F5F5F5; } .area-auction ::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3); background-color: #555; } /****/ .area-auction .area-peserta { *height: 240px; *border: 1px solid red; float: left; width: calc(66.6% - 20px); margin-right: 20px; } .area-auction .area-peserta .judul { background: #D9D9D9; height: 46px; line-height: 46px; text-transform: uppercase; padding-left: 15px; padding-right: 15px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topleft: 4px; border-top-left-radius: 4px; } .area-auction .area-peserta .judul i { *color: #DA1A1A; color: rgba(0, 0, 0, 0.5); font-size: 24px; } .area-auction .area-peserta .inner { height: 200px; overflow-y: auto; *border: 2px solid magenta; border-bottom: 2px solid #7f7f7f; background: #f0f0f0 url(../images/bg-chat-body.png) top left no-repeat; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-left-radius: 4px; } .area-auction .area-peserta .inner .list { float: left; width: 100%; *border: 1px solid red; background: rgba(0, 0, 0, 0.01); *background: rgba(255, 255, 255, 0.3); } .area-auction .area-peserta .inner .list:nth-child(odd) { background: rgba(0, 0, 0, 0.05); *background: rgba(255, 255, 255, 0.5); } .area-auction .area-peserta .inner .list .nama { float: left; width: calc(100% - 140px); *border: 1px solid green; *border-bottom: 1px solid rgba(0, 0, 0, 0.2); padding: 5px 0; padding-left: 10px; } .area-auction .area-peserta .inner .list .data { float: left; width: 140px; *border: 1px solid cyan; border-bottom: 4px solid #DA1A1A; padding: 5px 0; text-align: right; padding-right: 10px; } .area-auction .area-peserta .inner .list:nth-child(odd) .data { border-bottom: 4px solid #333; } .area-auction .area-peserta .inner table thead th { *border: 1px solid red; padding: 5px 8px; *background: rgba(255, 255, 255, 0.8); background: rgba(0, 0, 0, 0.2); *background: #FFF; *background: rgba(2, 174, 218, 0.1); } /*.area-auction .area-chatting .col-md-12{ *padding-right:0px; } .area-auction .area-chatting .panel{ background-color:transparent; } .area-auction .area-chatting .panel.panel-primary .panel-heading{ background: #D9D9D9 !important; *background:#da1a1a !important; color:#333; *color:#FFF; *border-bottom:1px solid rgba(0,0,0,0.1); border-bottom:1px solid rgba(255,255,255,0.2); } .area-auction .area-chatting .panel.panel-primary .panel-footer{ background: #D9D9D9 !important; border:none !important; *border-top:1px solid rgba(255,255,255,0.2); } .area-auction .area-chatting .panel.panel-primary .panel-footer input[type=text]{ height:34px; } .area-auction .area-chatting .panel.panel-primary .panel-footer .input-group-btn{ } .area-auction .area-chatting .panel.panel-primary .panel-footer .btn{ line-height:normal !important; margin-top:0px; } .area-auction .chat { list-style: none; margin: 0; padding: 0; } .area-auction .chat li { margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px dotted #B3A9A9; padding-left:15px; padding-right:15px; } .area-auction .chat li.left .chat-body { *margin-left: 60px; *margin-left: 20px; } .area-auction .chat li.right .chat-body { *margin-right: 60px; *margin-right: 20px; } .area-auction .panel-body { overflow-y: scroll; height: 250px; font-size: 15px; *background:rgba(255,255,255,0.2) url(../images/bg-shadow-pagination.png) top center no-repeat; *background:rgba(0,0,0,0.4) url(../images/bg-shadow-pagination.png) top center no-repeat; border:none; *background:#fafafa; background: #cacaca url(../images/bg-mengetik.png) top right no-repeat; } .area-auction .chat li .chat-body{ float:left; width:100%; clear:both; } .area-auction .chat li .chat-body .waktu{ float:left; width:180px; } .area-auction .chat li .chat-body .waktu i{ color:#da1a1a; } .area-auction .chat li .chat-body .data{ float:left; width:calc(100% - 180px); } .area-auction .chat li .chat-body .data span.nama{ *color: rgba(255,255,255,0.6); text-transform:uppercase; } .area-auction .chat li .chat-body .data span.nama:after{ content:" : "; } .area-auction .chat li .chat-body .data span.isi{ *color: rgba(255,255,255,1); } .area-auction ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background-color: #F5F5F5; } .area-auction ::-webkit-scrollbar { width: 12px; background-color: #F5F5F5; } .area-auction ::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); background-color: #555; }*/ /****/ .area-pembukaan-penawaran { overflow-x: auto; padding-left: 15px; padding-right: 15px; } .area-pembukaan-penawaran table { *border: 2px solid red !important; border-collapse: collapse !important; } .area-pembukaan-penawaran table td { *border: 1px solid blue !important; } .area-pembukaan-penawaran table td:nth-child(1) { *width: 100px; } .area-pembukaan-penawaran table .nomor { *background: pink; width: 30px; text-align: center; } .area-pembukaan-penawaran table .uraian { *background: magenta; width: 400px; } .area-pembukaan-penawaran table .data-rekanan { *background: cyan; width: 400px; } /****/ /*.area-pembukaan-auction-rekanan{ border:1px solid cyan !important; overflow-x:auto; } .area-pembukaan-auction-rekanan .nomor{ background:cyan; width:30px; } .area-pembukaan-auction-rekanan .uraian{ background:pink; width:400px; } .area-pembukaan-auction-rekanan .rekanan{ background:magenta; width:400px; }*/ /****/ .area-submenu-paket-lelang>.inner { margin-bottom: 5px; } .area-submenu-paket-lelang>.inner>#accordion { margin-bottom: 10px; } .area-submenu-paket-lelang>.inner>#accordion>h3 { font-family: 'AvenirBook'; font-size: 15px; line-height: normal; width: 100%; background: #838383; background-color: #838383; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#838383), to(#6f6f6f)); background: -webkit-linear-gradient(top, #838383, #6f6f6f); background: -moz-linear-gradient(top, #838383, #6f6f6f); background: -ms-linear-gradient(top, #838383, #6f6f6f); background: -o-linear-gradient(top, #838383, #6f6f6f); margin-top: 0px; margin-bottom: 0px; } .area-submenu-paket-lelang>.inner>#accordion>h3 a { color: #fff; display: block; text-decoration: none; padding: 5px 10px; } .area-submenu-paket-lelang>.inner>#accordion>div { *border: 1px solid red; background: #c8c8c8; background-color: #c8c8c8; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#c8c8c8), to(#e5e5e5)); background: -webkit-linear-gradient(top, #c8c8c8, #e5e5e5); background: -moz-linear-gradient(top, #c8c8c8, #e5e5e5); background: -ms-linear-gradient(top, #c8c8c8, #e5e5e5); background: -o-linear-gradient(top, #c8c8c8, #e5e5e5); font-size: 12px; color: #333; padding: 5px 10px; } /****/ table.rincian-pekerjaan { *border: 2px solid blue; border-collapse: collapse; width: 1200px; } table.rincian-pekerjaan td { padding: 0 0 !important; } /*****/ table.sub-rincian-pekerjaan { *border: 2px solid red; border-collapse: collapse; width: 1300px; } table.rincian-pekerjaan tbody td:nth-child(1), table.sub-rincian-pekerjaan tbody td:nth-child(1) { *background: cyan; width: 50px; } table.rincian-pekerjaan tbody td:nth-child(2), table.sub-rincian-pekerjaan tbody td:nth-child(2) { *background: red; width: 300px; } table.rincian-pekerjaan tbody td:nth-child(3), table.sub-rincian-pekerjaan tbody td:nth-child(3) { *background: yellow; width: 80px; } table.rincian-pekerjaan tbody td:nth-child(4), table.sub-rincian-pekerjaan tbody td:nth-child(4) { *background: lime; width: 100px; } table.rincian-pekerjaan tbody td:nth-child(5), table.sub-rincian-pekerjaan tbody td:nth-child(5) { *background: green; width: 150px; } table.rincian-pekerjaan tbody td:nth-child(6), table.sub-rincian-pekerjaan tbody td:nth-child(6) { *background: yellow; width: 150px; } table.rincian-pekerjaan tbody td:nth-child(7), table.sub-rincian-pekerjaan tbody td:nth-child(7) { *background: cyan; width: 250px; } table.rincian-pekerjaan tbody td:nth-child(8), table.sub-rincian-pekerjaan tbody td:nth-child(8) { *background: cyan; width: 100px; } /****/ table.rincian-pekerjaan input, table.sub-rincian-pekerjaan input {} table.rincian-pekerjaan thead td { text-transform: uppercase; border-right: 1px solid rgba(255, 255, 255, 0.2); text-align: center; padding: 4px 1px !important; } table.rincian-pekerjaan tbody td { border: 1px solid #eee; padding: 4px !important; background: #f4f4f4 !important; } table.rincian-pekerjaan tbody td.ada-sub { padding: 0px 0px !important; border: 0px 0px !important; } table.sub-rincian-pekerjaan tbody td { *border: 1px solid red; } table.sub-rincian-pekerjaan tbody td:nth-child(1) { border-left: none !important; } table.sub-rincian-pekerjaan tbody td:nth-child(8) { border-right: none !important; } /****/ .keterangan-list { margin-top: -10px; } .keterangan-list>ul { padding: 0 0; list-style: none; } .keterangan-list>ul>li { border-bottom: 1px solid rgba(0, 0, 0, 0.2); padding: 5px 10px; background: rgba(255, 255, 255, 0.5); } .keterangan-list>ul>li img.simbol { float: right; } /****/ .rincian-harga { margin-top: 20px; *margin-bottom: 20px; clear: both; float: left; width: 100%; border-bottom: 4px solid rgba(0, 0, 0, 0.2); -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } .rincian-harga .judul-halaman { background: rgba(0, 0, 0, 0.2); *background: #a7310e; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; } .rincian-harga table { border-collapse: collapse; width: 100%; } .rincian-harga table td:nth-child(1) { font-size: 20px; *border-right: 1px solid rgba(0, 0, 0, 0.2); } .rincian-harga table td:nth-child(2) { width: 300px; padding: 0 0 !important; *background: rgba(0, 0, 0, 0.1) !important; border: 1px solid rgba(0, 0, 0, 0.2); border-width: 0 0 0 1px; position: relative; } .rincian-harga table tr:nth-child(even) td { *background: rgba(165, 30, 36, 0.1); background: rgba(2, 174, 218, 0.05); } .rincian-harga input[type=text] { *-webkit-border-radius: 3px; *-moz-border-radius: 3px; *border-radius: 3px; *border: 1px solid rgba(0, 0, 0, 0.2); *border-width: 0 0 1px 0; border: none; width: 100%; padding: 5px 7px; box-sizing: border-box; font-size: 20px; background: rgba(165, 30, 36, 0.1); *display: block; position: absolute; width: calc(100% - 0px); height: calc(100% - 0px); -moz-box-shadow: inset 0 0 9px rgba(0, 0, 0, 0.2); -webkit-box-shadow: inset 0 0 9px rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 9px rgba(0, 0, 0, 0.2); } .rincian-harga table tr:nth-child(even) td input[type=text] { *background: rgba(255, 255, 255, 0.4); background-color: transparent; } .rincian-harga table tr:nth-child(odd) td input[type=text] { background: rgba(255, 255, 255, 0.4); } .rincian-harga table td:nth-child(3) { width: 50px; } .rincian-harga table button { width: 100% !important; } .rincian-harga table label.jumlah { background: #02aeda; color: #fff; width: 100%; height: 40px; line-height: 40px; text-align: center; margin-bottom: 0px !important; } .kirim_penawan { /*background: #da1a1a; background-color: #da1a1a; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#da1a1a), to(#a42421)); background: -webkit-linear-gradient(top, #da1a1a, #a42421); background: -moz-linear-gradient(top, #da1a1a, #a42421); background: -ms-linear-gradient(top, #da1a1a, #a42421); background: -o-linear-gradient(top, #da1a1a, #a42421);*/ background: #73D4Ff; background-color: #73D4Ff; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#73D4Ff), to(#02aeda)); background: -webkit-linear-gradient(top, #73D4Ff, #02aeda); background: -moz-linear-gradient(top, #73D4Ff, #02aeda); background: -ms-linear-gradient(top, #73D4Ff, #02aeda); background: -o-linear-gradient(top, #73D4Ff, #02aeda); color: #fafafa; border: none; width: 100%; height: 34px; } /****/ /*.area-header{ border:10px solid green !important; height:200px; }*/ /****/ /*.area-body{ border:10px solid cyan; } */ /****/ .area-group { *border: 1px solid yellow; float: left; width: 100%; *height: 90px; } @media screen and (max-width:767px) { .area-group { *border: 1px solid yellow; float: left; clear: both; } } .area-group .item { float: left; width: calc(14.28% - 13px); /** 7 unit **/ *width: calc(12.5% - 13.3px); /** 8 unit **/ *width: calc(11.11% - 13.4px); /** 9 unit **/ *height: 106px; margin-left: 15px; border-width: 0 0 0 6px; border-style: solid; *height: 140px; } .area-group .item:nth-child(1) { margin-left: 0px; } .area-group .item:nth-child(2n) { /* SETIAP KELIPATAN 2*/ *border: 4px solid red !important; } @media screen and (max-width:767px) { .area-group .item { width: calc(25% - 5px); margin-left: 0px; margin-bottom: 10px; margin-right: 5px; } .area-group .item:nth-child(8) { float: left; } } .area-group .item a { display: block; } .area-group .item a:hover { display: block; -webkit-box-shadow: 0 8px 6px -6px black; -moz-box-shadow: 0 8px 6px -6px black; box-shadow: 0 8px 6px -6px black; } .area-group .item a img { width: 100%; } .area-group .item.main { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(rgba(2, 174, 218, 1)), to(rgba(115, 212, 238, 1))) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; -o-border-image: -o-linear-gradient(bottom, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; border-image: linear-gradient(to top, rgba(2, 174, 218, 1), rgba(115, 212, 238, 1)) 1 100%; } .area-group .item.tps { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#142267), to(#3c4c96)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #142267, #3c4c96) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #142267, #3c4c96) 1 100%; -o-border-image: -o-linear-gradient(bottom, #142267, #3c4c96) 1 100%; border-image: linear-gradient(to top, #142267, #3c4c96) 1 100%; } .area-group .item.phc { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#ddb41d), to(#fed640)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #ddb41d, #fed640) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #ddb41d, #fed640) 1 100%; -o-border-image: -o-linear-gradient(bottom, #ddb41d, #fed640) 1 100%; border-image: linear-gradient(to top, #ddb41d, #fed640) 1 100%; } .area-group .item.bjti { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#bfc139), to(#dee353)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #bfc139, #dee353) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #bfc139, #dee353) 1 100%; -o-border-image: -o-linear-gradient(bottom, #bfc139, #dee353) 1 100%; border-image: linear-gradient(to top, #bfc139, #dee353) 1 100%; } .area-group .item.pms { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#d76001), to(#fd7100)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #d76001, #fd7100) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #d76001, #fd7100) 1 100%; -o-border-image: -o-linear-gradient(bottom, #d76001, #fd7100) 1 100%; border-image: linear-gradient(to top, #d76001, #fd7100) 1 100%; } .area-group .item.lamong { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#78a348), to(#9dc872)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #78a348, #9dc872) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #78a348, #9dc872) 1 100%; -o-border-image: -o-linear-gradient(bottom, #78a348, #9dc872) 1 100%; border-image: linear-gradient(to top, #78a348, #9dc872) 1 100%; } .area-group .item.pds { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#bb1e22), to(#e03336)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #bb1e22, #e03336) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #bb1e22, #e03336) 1 100%; -o-border-image: -o-linear-gradient(bottom, #bb1e22, #e03336) 1 100%; border-image: linear-gradient(to top, #bb1e22, #e03336) 1 100%; } .area-group .item.bmc { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#fbcc00), to(#ffe471)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #fbcc00, #ffe471) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #fbcc00, #ffe471) 1 100%; -o-border-image: -o-linear-gradient(bottom, #fbcc00, #ffe471) 1 100%; border-image: linear-gradient(to top, #fbcc00, #ffe471) 1 100%; } .area-group .item.bms { -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#0151f6), to(#3ce4ff)) 1 100%; -webkit-border-image: -webkit-linear-gradient(bottom, #0151f6, #3ce4ff) 1 100%; -moz-border-image: -moz-linear-gradient(bottom, #0151f6, #3ce4ff) 1 100%; -o-border-image: -o-linear-gradient(bottom, #0151f6, #3ce4ff) 1 100%; border-image: linear-gradient(to top, #0151f6, #3ce4ff) 1 100%; } /****/ .judul-area { border-top: 1px solid #02aeda; border-bottom: 1px solid #02aeda; padding-top: 10px; padding-bottom: 8px; font-family: 'AvenirHeavy'; font-size: 18px; text-transform: uppercase; } /****/ .reg-separuh { /*width: -moz-calc(50% - 10px); width: -webkit-calc(50% - 10px); width: -o-calc(50% - 10px); width: calc(50% - 10px);*/ width: 50%; float: left; padding-right: 10px; } .reg-separuh:nth-child(even) { padding-right: 0px; padding-left: 10px; } @media screen and (max-width:767px) { .reg-separuh { width: 100%; padding-right: 0px; } .reg-separuh:nth-child(even) { padding-right: 0px; padding-left: 0px; padding-top: 10px; } } .reg-separuh-inner { border: 1px solid #18a9d8; padding: 10px; float: left; /*width: -moz-calc(100% - 22px); width: -webkit-calc(100% - 22px); width: -o-calc(100% - 22px); width: calc(100% - 22px);*/ width: 100%; min-height: 500px; } /****/ #tombol-register { padding: 4px; background: #18a9d8 url(../images/bg-shadow-kanan2.png) top right no-repeat; color: #fff; padding-left: 5px; padding-right: 5px; width: calc(100% - 0px); text-align: left; font-size: 14px; float: left; margin-right: 10px; -webkit-border-bottom-right-radius: 50px; -webkit-border-bottom-left-radius: 50px; -moz-border-radius-bottomright: 50px; -moz-border-radius-bottomleft: 50px; border-bottom-right-radius: 50px; border-bottom-left-radius: 50px; } #tombol-register:hover { background: #0086a9 url(../images/bg-shadow-kanan2.png) top right no-repeat; } #tombol-register img { vertical-align: middle; } #tombol-register a { display: block; color: #c5f1ff; text-decoration: none; } #tombol-register a:hover { display: block; color: #fff; text-decoration: none; } @media screen and (max-width:767px) { #tombol-register a { line-height: normal; } } #tombol-register a img { float: left; } #tombol-register a span { float: left; width: calc(100% - 100px); line-height: 100px; padding-left: 10px; } @media screen and (max-width:767px) { #tombol-register a span { height: 100px; line-height: normal; display: flex; justify-content: center; /* align horizontal */ align-items: center; /* align vertical */ font-size: 13px; } } /****/ #parameter-tambahan { position: absolute; *z-index: 99999 !important; z-index: 999 !important; background: cyan; right: 350px; background: rgba(0, 0, 0, 0.2); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding-left: 10px; } #parameter-tambahan.stick-parameter-tambahan { position: fixed !important; top: 138px !important; right: 260px; z-index: 9999 !important; width: 50%; height: 44px; padding-top: 5px; padding-right: 80px; background-color: transparent !important; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } @media screen and (max-width:767px) { #parameter-tambahan.stick-parameter-tambahan { top: 178px !important; padding-right: 0px; width: 100%; height: auto; } } /****/ #parameter-tambahan-valid { position: relative; /* *z-index:99999 !important; z-index:999 !important; */ background: cyan; /* top:25px !important; */ right: 0 !important; padding-top: 50px !important; /* background:rgba(0,0,0,0.2); */ background: transparent !important; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; /* padding-left:10px; */ } #parameter-tambahan-valid.stick-parameter-tambahan-valid { position: fixed !important; top: 181px !important; /* right:260px; */ /* left: 100px; */ z-index: 9999 !important; width: 100%; height: 44px; padding-top: 5px; padding-left: 80px; background-color: #f4f4f4 !important; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } #parameter-tambahan-valid.stick-parameter-tambahan-valid .combo { margin-top: -77px !important; } #parameter-tambahan-valid.stick-parameter-tambahan-valid label { position: relative !important; top: -40px !important; } @media screen and (max-width:767px) { #parameter-tambahan-valid.stick-parameter-tambahan-valid { top: 178px !important; padding-right: 0px; width: 100%; height: auto; } } /****/ .area-shortcut { *border: 1px solid cyan; position: fixed; *top: 140px; *top: 340px; top: 260px; right: 0; z-index: 999; *padding: 20px; } @media screen and (max-width:767px) { .area-shortcut { top: auto; bottom: 3px; right: 10px; *background: rgba(0, 0, 0, 0.5); *width: 100%; z-index: 1031; *border: 1px solid yellow; *background: pink; } } .area-shortcut ul { padding: 0 0 !important; } .area-shortcut a { cursor: pointer; } .area-shortcut:hover { /* fallback */ /*background-color: #73D4Ff; background-image: url(images/linear_bg_1.png); background-repeat: repeat-y; /* Safari 4-5, Chrome 1-9 * background: -webkit-gradient(linear, left top, right top, from(#73D4Ff), to(#89e6ff)); /* Safari 5.1, Chrome 10+ * background: -webkit-linear-gradient(left, #73D4Ff, #89e6ff); /* Firefox 3.6+ * background: -moz-linear-gradient(left, #73D4Ff, #89e6ff); /* IE 10 * background: -ms-linear-gradient(left, #73D4Ff, #89e6ff); /* Opera 11.10+ * background: -o-linear-gradient(left, #73D4Ff, #89e6ff); -webkit-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.4); -moz-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.4); box-shadow: 0 8px 6px -6px rgba(0,0,0,0.4);*/ } .area-shortcut .vpayment { /**background:#73D4Ff; *width:50px; width:0px; *height:60px; *border:1px solid red; margin-left:15px; transition: all 1s ease-in-out;*/ /*-webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; border-top-left-radius: 4px; border-bottom-left-radius: 4px;*/ } .area-shortcut .vpayment a { /**padding-left:10px; *padding-right:50px; display:block;*/ } .area-shortcut .vpayment a img { /**margin-left:10px; *margin-right:10px;*/ } .area-shortcut:hover .vpayment { /*width:50px; margin-right:7px; *background:#73D4Ff url(../images/icon-vpayment.png) center center no-repeat;*/ } .area-shortcut:hover .vpayment a { /**padding-right:5px;*/ } /** DASHBOARD **/ .row.area-dashboard { *margin-top: -10px; } .row.area-dashboard>.col-md-12>.area-main>.inner { margin-left: 0px !important; margin-right: 0px !important; } .row.area-dashboard>.col-md-12>.area-main { padding-bottom: 0px !important; } .area-dashboard-kiri { *background: #d4d4d4; *border: 1px solid red; *padding-left: 20px !important; *padding-right: 20px !important; *height: 570px; *height: 550px; min-height: 570px; *height: 600px; float: left; width: 50%; } .area-dashboard-kanan { *background: #fef7f4; *border: 1px solid cyan; *background: rgba(255, 255, 255, 0.7); padding-left: 0px !important; padding-right: 0px !important; *height: 570px; *height: 550px; min-height: 570px; *height: 600px; float: left; width: 50%; } @media screen and (max-width:767px) { .area-dashboard-kiri, .area-dashboard-kanan { width: 100%; height: auto; } } /****/ .area-data-pribadi { *margin-top: 20px; /* fallback */ *background-color: #bdbdbd; *background-image: url(images/linear_bg_1.png); *background-repeat: repeat-y; /* Safari 4-5, Chrome 1-9 */ *background: -webkit-gradient(linear, left top, right top, from(#bdbdbd), to(#909090)); /* Safari 5.1, Chrome 10+ */ *background: -webkit-linear-gradient(left, #bdbdbd, #909090); /* Firefox 3.6+ */ *background: -moz-linear-gradient(left, #bdbdbd, #909090); /* IE 10 */ *background: -ms-linear-gradient(left, #bdbdbd, #909090); /* Opera 11.10+ */ *background: -o-linear-gradient(left, #bdbdbd, #909090); background: #FFF; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; } .area-data-pribadi>.inner { padding: 18px 20px; margin: 0 0 !important; background: url(../images/bg-data-pribadi.png) center right 20px no-repeat; *border: 1px solid red; *clear: both; *float: left; width: 100%; display: inline-block; } .area-data-pribadi>.inner>.nama { font-weight: bold; } .area-data-pribadi>.inner>.nama>span.sertifikat {} @media screen and (max-width:767px) { .area-data-pribadi>.inner>.nama>span.sertifikat { display: inline-block; width: 100%; } } .area-data-pribadi>.inner>.nrp-posisi { font-size: 13px; border-bottom: 1px solid rgba(0, 0, 0, 0.05); margin-bottom: 10px; padding-bottom: 10px; } .area-data-pribadi>.inner .jenis-paket a { /*background-color: #1561ae; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1561ae), to(#0c4886)); background: -webkit-linear-gradient(top, #1561ae, #0c4886); background: -moz-linear-gradient(top, #1561ae, #0c4886); background: -ms-linear-gradient(top, #1561ae, #0c4886); background: -o-linear-gradient(top, #1561ae, #0c4886);*/ *background: rgba(0, 0, 0, 0.6); background: #FFF; color: #fff; display: inline-block; width: calc(25% - 5px); /** 4 item **/ width: calc(20% - 5px); /** 0 item **/ height: 30px; line-height: 30px; *padding-left: 20px; padding-left: 10px; *padding-right: 20px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-decoration: none; font-size: 12px; } @media screen and (max-width:767px) { .area-data-pribadi>.inner .jenis-paket a { width: calc(100% - 0px); margin-bottom: 10px; } } .area-data-pribadi>.inner .jenis-paket a span { float: right; background: rgba(0, 0, 0, 0.3); font-size: 12px; height: 30px; line-height: 30px; width: 30px; text-align: center; *margin-left: 20px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; border-left: 1px solid rgba(255, 255, 255, 0.6); } /****/ .area-data-pribadi>.inner .persentase { *border: 1px solid red; padding-top: 15px; float: left; width: 100%; border-top: 1px solid rgba(0, 0, 0, 0.05); margin-top: 10px; *padding-bottom: 5px; } .area-data-pribadi>.inner .persentase .persentase-item { float: left; width: calc(100% - 150px); } @media screen and (max-width:767px) { .area-data-pribadi>.inner .persentase .persentase-item { width: calc(100% - 00px); } } .area-data-pribadi>.inner .persentase .persentase-item .skillbar { background: rgba(0, 0, 0, 0.05); margin-bottom: 0px; width: calc(100% - 70px); } .area-data-pribadi>.inner .persentase .persentase-item .skillbar, .area-data-pribadi>.inner .persentase .persentase-item .skillbar .skillbar-bar { height: 18px; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; } .area-data-pribadi>.inner .persentase .persentase-item .skillbar .skill-bar-percent { font-size: 24px; color: #333; *font-size: 18px; height: 18px; line-height: 18px; right: -70px; width: 60px; text-align: center; } .area-data-pribadi>.inner .persentase .poin { float: left; width: calc(150px - 20px); margin-left: 10px; margin-top: -10px; padding-top: 7px; padding-bottom: 7px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; font-size: 12px; *font-size: 24px; font-weight: bold; text-align: center; *height: 18px; *line-height: 18px; background: rgba(0, 0, 0, 0.2); } .area-data-pribadi>.inner .persentase .poin span { display: inline-block; width: 100%; } @media screen and (max-width:767px) { .area-data-pribadi>.inner .persentase .poin { margin-top: 10px; margin-left: 0px; width: calc(100% - 0px); padding-top: 3px; padding-bottom: 0px; height: 24px !important; line-height: 24px !important; } .area-data-pribadi>.inner .persentase .poin span.target {} } /****/ .area-data-pribadi .judul { /**background:#FFF; background:#73D4Ff; padding-left:20px; padding-right:20px; font-size:18px; text-transform:uppercase; min-height:40px; line-height:40px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px;*/ font-family: 'AvenirHeavy'; font-size: 18px; text-transform: uppercase; background: #73D4Ff; color: #fff; letter-spacing: 1px; *padding: 13px 20px 12px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; min-height: 40px; line-height: 40px; padding-left: 20px; padding-right: 20px; } .area-data-pribadi .judul img { margin-right: 10px; } .area-data-pribadi table { border-collapse: collapse; width: 100%; } .area-data-pribadi table td { background-color: transparent !important; *border: 1px solid rgba(255, 255, 255, 0.2); border: 1px solid rgba(0, 0, 0, 0.05); border-width: 1px 0 1px 0; font-size: 18px; text-transform: uppercase; *color: #fff; padding: 8px 10px; } @media screen and (max-width:767px) { .area-data-pribadi table td { font-size: 14px; padding: 5px 5px 5px 0px; } .area-data-pribadi table td:nth-child(1) { *width: 100px !important; *background: yellow !important; } .area-data-pribadi table td:nth-child(2) { width: 10px !important; min-width: 10px !important; *background: cyan !important; } .area-data-pribadi table td:nth-child(3) { width: 220px !important; *background: pink !important; } } /****/ .area-grafik-pengadaan { margin-top: 20px; background: #f7f7f7; } @media screen and (max-width:767px) { .area-grafik-pengadaan { background: #FFF; } } .area-grafik-pengadaan>.inner { *padding: 18px 10px; margin: 0 0 !important; height: 279px; *background: url(../images/bg-grafik-pengadaan.png); *background-size: 100% 100%; } .area-grafik-pengadaan>.inner #container-pie-pengadaan { *border: 1px solid red; width: 60% !important; height: 100%; float: left; } .area-grafik-pengadaan>.inner #container-bar-lock { *border: 1px solid red; width: 60% !important; height: 100%; float: left; } .area-grafik-pengadaan>.inner .data-legend { *border: 1px solid yellow; float: left; width: 40%; height: 100%; background: #6b6b6b; *background: rgba(255, 255, 255, 0.8) } .area-grafik-pengadaan>.inner .data-legend .finish { background: rgba(0, 0, 0, 0.5) url(../images/icon-finish.png) top left no-repeat; height: 33.3%; } .area-grafik-pengadaan>.inner .data-legend .on-progres { background: rgba(0, 0, 0, 0.6) url(../images/icon-on-progres.png) top left no-repeat; height: 33.3%; } .area-grafik-pengadaan>.inner .data-legend .idle { background: rgba(0, 0, 0, 0.7) url(../images/icon-idle.png) top left no-repeat; height: 33.3%; } .target-nilai-vendor { *font-family: 'FuturaCondensed'; font-family: 'BebasNeue'; font-size: 48px; *padding: 5px 10px; text-align: right; padding-right: 40px; } .area-grafik-pengadaan>.inner .data-legend .finish .nilai, .area-grafik-pengadaan>.inner .data-legend .on-progres .nilai, .area-grafik-pengadaan>.inner .data-legend .idle .nilai { *font-family: 'FuturaCondensed'; font-family: 'BebasNeue'; font-size: 48px; *padding: 5px 10px; text-align: right; padding-right: 40px; } @media screen and (max-width:767px) { .area-grafik-pengadaan>.inner .data-legend .finish .nilai, .area-grafik-pengadaan>.inner .data-legend .on-progres .nilai, .area-grafik-pengadaan>.inner .data-legend .idle .nilai { padding-right: 15px; } } .area-grafik-pengadaan>.inner .data-legend .finish .nilai { color: #568839; } .area-grafik-pengadaan>.inner .data-legend .finish .nilai span { border-top: 2px solid #568839; display: inline-block; } .area-grafik-pengadaan>.inner .data-legend .on-progres .nilai { color: #F25824; } .area-grafik-pengadaan>.inner .data-legend .on-progres .nilai span { border-top: 2px solid #F25824; display: inline-block; } .area-grafik-pengadaan>.inner .data-legend .idle .nilai { color: #F2BF24; } .area-grafik-pengadaan>.inner .data-legend .idle .nilai span { border-top: 2px solid #F2BF24; display: inline-block; } .area-grafik-pengadaan>.inner .data-legend .finish .keterangan, .area-grafik-pengadaan>.inner .data-legend .on-progres .keterangan, .area-grafik-pengadaan>.inner .data-legend .idle .keterangan { color: #fff; text-align: right; padding-right: 40px; letter-spacing: 2px; } @media screen and (max-width:767px) { .area-grafik-pengadaan>.inner .data-legend .finish .keterangan, .area-grafik-pengadaan>.inner .data-legend .on-progres .keterangan, .area-grafik-pengadaan>.inner .data-legend .idle .keterangan { padding-right: 15px; } } .area-grafik-pengadaan .judul { /**background:#7e7e7e; background:#FFF; *color:#FFF; padding-left:20px; padding-right:20px; font-size:18px; text-transform:uppercase; min-height:40px; line-height:40px;*/ font-family: 'AvenirHeavy'; font-size: 18px; text-transform: uppercase; background: #73D4Ff; color: #fff; letter-spacing: 1px; *padding: 13px 20px 12px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; min-height: 40px; line-height: 40px; padding-left: 20px; padding-right: 20px; } .area-grafik-pengadaan .judul img { margin-right: 10px; } /****/ .area-kalender-dashboard { margin: 0 0 20px 20px; *border: 2px solid green; } @media screen and (max-width:767px) { .area-kalender-dashboard { margin: 20px 0 20px 0px; } } .area-kalender-dashboard>.inner { *border: 2px solid pink; *border-left: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(0, 0, 0, 0.1); margin: 0 0 !important; position: relative; } .area-kalender-dashboard .judul { /*background:#02aeda; color:#FFF; padding-left:20px; padding-right:20px; font-size:18px; text-transform:uppercase; min-height:40px; line-height:40px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px;*/ font-family: 'AvenirHeavy'; font-size: 18px; text-transform: uppercase; background: #73D4Ff; color: #fff; letter-spacing: 1px; *padding: 13px 20px 12px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; min-height: 40px; line-height: 40px; padding-left: 20px; padding-right: 20px; } .area-kalender-dashboard .judul img { margin-right: 10px; } @media screen and (max-width:767px) { .area-kalender-dashboard .judul span { display: none; } } /****/ .area-bawah { *border: 2px solid red; clear: both; float: left; width: 100%; margin-top: 20px; } /****/ .area-tabel-paket { float: left; *width: 65%; width: 100%; *border: 2px solid cyan; } .area-tabel-paket>.inner { *padding: 18px 20px; *border: 2px solid cyan; margin: 0 0 !important; } .area-tabel-paket>.halaman, .area-tabel-paket .tab-content div.halaman { background: red; background: #FFF; padding: 5px 20px 8px; text-align: right; } .area-tabel-paket .tab-content div.halaman { *display: inline-block; float: left; width: 100%; padding-bottom: 0px !important; padding-top: 10px !important; } .area-tabel-paket .judul { *background: #73D4Ff /*f25824*/ ; /*color:#FFF; padding-left:20px; padding-right:20px; font-size:18px; text-transform:uppercase; min-height:40px; line-height:40px;*/ font-family: 'AvenirHeavy'; font-size: 18px; text-transform: uppercase; background: #73D4Ff; color: #fff; letter-spacing: 1px; padding: 13px 20px 12px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; float: left; width: calc(100% - 10px); } .area-tabel-paket .judul>span { float: left; *border: 1px solid red; margin-right: 20px; } .area-tabel-paket .judul img { margin-right: 10px; } .area-tabel-paket .judul>form { float: left; } .area-tabel-paket .judul>.select { /*position:absolute; z-index:999; right:20px; bottom:10px; width:120px;*/ } /* Reset Select */ .area-tabel-paket .judul>form>.select select { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; outline: 0; box-shadow: none; border: 0 !important; background: #2c3e50; background: rgba(0, 0, 0, 0.6); background-image: none; } /* Custom Select */ .area-tabel-paket .judul>form>.select { position: relative; *display: block; *width: 20em; *height: 3em; *line-height: 3; background: #2c3e50; overflow: hidden; border-radius: .25em; float: left; *position: absolute; *margin-top: -40px; *margin-right: 20px; margin-top: -3px; width: 160px; *width: auto; height: 30px; line-height: 30px; } .area-tabel-paket .judul>form>.select.tahun { margin-left: 10px; } .area-tabel-paket .judul>form>.select select { width: 100%; height: 100%; margin: 0; padding: 0 0 0 .5em; color: #fff; cursor: pointer; float: left; } .area-tabel-paket .judul>form>.select select::-ms-expand { display: none; } /* Arrow */ .area-tabel-paket .judul>form>.select::after { content: '\25BC'; position: absolute; top: 0; right: 0; bottom: 0; padding: 0 1em; *background: #34495e; background: #FFF; pointer-events: none; } /* Transition */ .area-tabel-paket .judul>form>.select:hover::after { color: #f39c12; } .area-tabel-paket .judul>form>.select::after { -webkit-transition: .25s all ease; -o-transition: .25s all ease; transition: .25s all ease; } /****/ .area-tabel-paket table { border-collapse: collapse; width: 100%; } .area-tabel-paket table thead th { *background: #f25824; *background: #c3c3c3; color: #fff; padding: 8px 10px; text-transform: uppercase; font-weight: normal; text-align: center; *border: none; *border: 1px solid rgba(0, 0, 0, 0.1); white-space: nowrap; *background: #02aeda; background: #777; } .area-tabel-paket table tbody tr td { *background: rgba(242, 88, 36, 0.25) !important; *background: #f4f2f2; padding: 8px 10px !important; min-height: 34px !important; *border-bottom: 1px solid #FFF; border-bottom: 1px solid rgba(0, 0, 0, 0.1); background: rgba(115, 212, 238, 0.4) !important; color: #333 !important; text-align: left !important; } .area-tabel-paket table tbody tr:nth-child(even) td { *background: rgba(242, 88, 36, 0.10) !important; *background: #FFF; background: rgba(115, 212, 238, 0.2) !important; } .area-tabel-paket table tbody tr td .tgl-awal { *background: rgba(0, 0, 0, 0.1); background: rgb(242, 88, 36); color: #fff; white-space: nowrap; padding-left: 5px; padding-right: 5px; float: left; *font-size: 12px; *border: 1px solid red; } .area-tabel-paket table tbody tr td .tgl-antara { *background: rgba(0, 0, 0, 0.1); text-align: center; padding-left: 5px; padding-right: 5px; float: left; *border: 1px solid red; } .area-tabel-paket table tbody tr td .tgl-akhir { *background: rgba(255, 255, 255, 0.4); background: rgb(111, 161, 82); color: #fff; white-space: nowrap; padding-left: 5px; padding-right: 5px; float: left; *font-size: 12px; *border: 1px solid red; } /****/ .area-tabel-paket table#paket-lelang-aktif td:nth-child(3) { text-align: center; } /****/ .area-tabel-paket table#paket-lelang-selesai th:nth-child(4) { text-align: left; } .area-tabel-paket table#paket-lelang-selesai td:nth-child(3) { text-align: center; } /****/ table.tabel-buku-aanwijzing { border-collapse: collapse; width: 100%; border: 1px solid red; } table.tabel-buku-aanwijzing td { border: 1px solid green; box-sizing: border-box; padding: 0 0; } /****/ .nowrap { white-space: nowrap !important; } /** TABEL EVALUASI **/ .scrollingTable>table { border-collapse: separate !important; border-spacing: 0px !important; } .scrollingTable>table thead th { *border: 1px solid red !important; } .scrollingTable>table td { *border: 1px solid red !important; } .scrollingTable>table tbody td:nth-child(2) { *white-space: nowrap; } .scrollingTable>table tbody td:nth-child(3) { *white-space: nowrap; *width: 300px !important; } .scrollingTable>table thead th { *border: 1px solid red; border-bottom: 1px solid rgba(0, 0, 0, 0.1); border-right: 1px solid rgba(0, 0, 0, 0.1); white-space: nowrap; text-align: center; text-transform: uppercase; } .scrollingTable>table tbody td { *border: 1px solid red; border-bottom: 1px solid rgba(0, 0, 0, 0.1); border-right: 1px solid rgba(0, 0, 0, 0.1); background: #f9f9f9 !important; } .scrollingTable>table tbody tr:nth-child(odd) td { background: #ebebeb; } .scrollingTable>table tbody td .nomor { width: 40px !important; } .scrollingTable>table tbody td .uraian { width: 240px !important; } .scrollingTable>table tbody td .data-rekanan { width: 400px !important; } .scrollingTable>table .password { text-transform: none !important; } .scrollingTable>table .headerHor, .scrollingTable>table .headerVer { *border: 1px solid yellow !important; } .scrollingTable>table .headerHor.headerVer { z-index: 3; background: #666666 !important; color: #FFF !important; } .scrollingTable>table .headerHor { z-index: 2; background: #777777 !important; color: #FFF !important; } .scrollingTable>table .headerVer { z-index: 1; } .scrollingTable>table td.headerHor { background: #777777 !important; text-transform: uppercase; text-align: center; } .scrollingTable>table thead th .sat-qty, .scrollingTable>table tbody td .sat-qty { float: left; clear: both; width: 100%; border: 1px solid rgba(0, 0, 0, 0.2); padding: 3px 5px; margin-top: 7px; } .scrollingTable>table thead th .sat-qty .item { float: left; width: 50%; background: rgba(0, 0, 0, 0.1); text-align: center; *padding: 0 2px; height: 30px; line-height: 30px; } .scrollingTable>table thead th .sat-qty .item:nth-child(even) { background: rgba(0, 0, 0, 0.2); } .scrollingTable>table tbody td .sat-qty .item { float: left; width: 50%; background: rgba(0, 0, 0, 0.2); text-align: center; *padding: 0 2px; height: 30px; line-height: 30px; } .scrollingTable>table tbody td .sat-qty .item:nth-child(even) { border: 1px solid rgba(0, 0, 0, 0.2); background-color: transparent; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .scrollingTable>table tbody td .sat-qty .item:nth-child(odd) { -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; border-top-left-radius: 4px; border-bottom-left-radius: 4px; } /****/ .informasi-tabel { float: left; width: 100%; clear: both; background: #d9d9d9; } .informasi-tabel .list { float: left; width: 50%; *background: rgba(0, 0, 0, 0.1); background: #d9d9d9; border-bottom: 1px solid rgba(0, 0, 0, 0.2); border-right: 1px solid rgba(0, 0, 0, 0.2); } .informasi-tabel .list:nth-child(even) { border-right: none; } .informasi-tabel .list-full { float: left; width: 100%; height: 34px; line-height: 34px; padding: 0px 5px; box-sizing: border-box; font-weight: bold; } .informasi-tabel .list-button { float: left; width: 100%; *height: 34px; *line-height: 34px; padding: 0px 5px; box-sizing: border-box; font-weight: bold; } .informasi-tabel .list .judul { *border: 1px solid yellow; float: left; width: 230px; height: 34px; line-height: 34px; padding: 0px 5px; box-sizing: border-box; font-weight: bold; } .informasi-tabel .list .titik-dua { *border: 1px solid pink; float: left; width: 20px; height: 34px; line-height: 34px; padding: 0px 5px; box-sizing: border-box; } .informasi-tabel .list .keterangan { *border: 1px solid green; float: left; width: calc(100% - 250px); height: 34px; line-height: 34px; padding: 0px 5px; box-sizing: border-box; } /****/ .informasi-tabel.tiga-kolom { *border-bottom: 1px solid #197d9e; margin-bottom: 10px; } .informasi-tabel.tiga-kolom [type=text] { line-height: 24px; background: #FFF; border: none; padding-left: 10px; padding-right: 10px; /*-webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px;*/ -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .informasi-tabel .list .keterangan { *float: left; *width: calc(100% - 250px); height: auto; line-height: normal; *padding: 0px 5px; *box-sizing: border-box; } /****/ .nopadding-atas { padding-top: 0px !important; } .nopadding-bawah { padding-bottom: 0px !important; } .nopadding-kiri { padding-left: 0px !important; } .nopadding-kanan { padding-right: 0px !important; } /****/ .nowrap { white-space: nowrap !important; } /****/ a.chat-negosiasi { position: relative; } a.chat-negosiasi span { position: absolute; top: -4px; left: 7px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; display: inline-block; background: #f25824; color: #fff; width: 14px; height: 14px; *line-height: 14px !important; font-size: 16px; text-align: center; } /****/ @media screen and (max-width:767px) { .area-deskripsi-perusahaan { *background: rgba(255, 255, 255, 0.2); *height: 106px; height: auto !important; float: right; *max-width: 70%; max-width: 100% !important; *border: 1px solid red; } .area-deskripsi-perusahaan .nama { *font-size: 24px; *letter-spacing: 2px; height: auto !important; line-height: normal !important; *padding-left: 20px; *padding-right: 20px; *margin-bottom: 10px; margin-bottom: 0px !important; padding-top: 7px; padding-bottom: 7px; min-width: 100%; } .area-deskripsi-perusahaan .keterangan { *clear: both; text-align: left !important; *color: #fff; *font-style: italic; background: rgba(0, 0, 0, 0.5); padding: 10px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } } /****/ .area-kontak {} .area-kontak input.form-control.easyui-validatebox, .area-kontak textarea.form-control.easyui-validatebox, .area-ganti-password input.form-control.easyui-validatebox { width: 300px; } @media screen and (max-width:767px) { .area-kontak input.form-control.easyui-validatebox, .area-kontak textarea.form-control.easyui-validatebox, .area-ganti-password input.form-control.easyui-validatebox { width: 100%; } } /****/ .area-paket-lelang-tambah {} .area-paket-lelang-tambah input[name=reqNamaPaket] { width: 700px; } .area-paket-lelang-tambah input[name=reqNilaiPekerjaan], .area-paket-lelang-tambah input[name=reqLokasiPekerjaan], .area-paket-lelang-tambah input[name=reqEmailPanitia] { width: 400px; } @media screen and (max-width:767px) { .area-paket-lelang-tambah input[name=reqNamaPaket] { width: 100%; } .area-paket-lelang-tambah input[name=reqNilaiPekerjaan], .area-paket-lelang-tambah input[name=reqLokasiPekerjaan], .area-paket-lelang-tambah input[name=reqEmailPanitia] { width: 100%; } } @media only screen and (max-width: 1280px) { .area-paket-lelang-tambah input[name=reqNamaPaket] { *border: 4px solid green; width: 100%; } } /****/ .area-pengadaan-tambah {} .area-pengadaan-tambah input[name=reqNamaPaket] { width: 700px; } .area-pengadaan-tambah input[name=reqNilaiPekerjaan], .area-pengadaan-tambah input[name=reqLokasiPekerjaan], .area-pengadaan-tambah input[name=reqEmailPanitia] { width: 400px; } @media screen and (max-width:767px) { .area-pengadaan-tambah input[name=reqNamaPaket] { width: 100%; } .area-pengadaan-tambah input[name=reqNilaiPekerjaan], .area-pengadaan-tambah input[name=reqLokasiPekerjaan], .area-pengadaan-tambah input[name=reqEmailPanitia] { width: 100%; } } /****/ .area-dokumen-paket-lelang {} .area-dokumen-paket-lelang textarea[name=reqKeterangan] { width: 400px; } @media screen and (max-width:767px) { .area-dokumen-paket-lelang textarea[name=reqKeterangan] { width: 100%; } } /****/ .area-kriteria-penawaran {} .area-kriteria-penawaran input[type=text] { *border: 1px solid red !important; width: 100%; } /****/ .area-attachment-chat { *border: 1px solid #cccccc; margin-bottom: 5px; width: 100%; *border: 1px solid red; *padding-top: 7px; *padding-bottom: 7px; height: 34px; line-height: 34px; -webkit-border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius-topright: 3px; -moz-border-radius-bottomright: 3px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .area-attachment-chat .form-kolom { float: left; width: calc(100% - 100px); height: 34px; padding-left: 15px; background: #FFF; border: 1px solid #cccccc; border-width: 1px 1px 1px 1px; } .area-attachment-chat input[type=file] { max-width: 300px; } .area-attachment-chat .form-kolom:last-child { padding-left: 0px; text-align: right; } .area-attachment-chat input[type=submit], .area-attachment-chat a, .area-attachment-chat button { float: right; background-color: #1e6695; background: url(images/linear_bg_2.png); background-repeat: repeat-x; background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1e6695), to(#135077)); background: -moz-linear-gradient(top, #1e6695, #135077); background: -ms-linear-gradient(top, #1e6695, #135077); background: -o-linear-gradient(top, #1e6695, #135077); color: rgba(255, 255, 255, 0.7); width: 100px; height: 34px !important; line-height: 34px !important; padding-left: 15px; padding-right: 15px; border: none; display: inline-block; font-size: 16px; color: rgba(255, 255, 255, 0.6); text-transform: uppercase; -webkit-border-top-right-radius: 3px !important; -webkit-border-bottom-right-radius: 3px !important; -moz-border-radius-topright: 3px !important; -moz-border-radius-bottomright: 3px !important; border-top-right-radius: 3px !important; border-bottom-right-radius: 3px !important; } .area-attachment-chat a:hover { text-decoration: none; } /****/ #area-sticky { *border: 2px solid pink; visibility: hidden; } .stick-datatable { position: fixed !important; top: 182px !important; /* top: 232px !important; */ z-index: 999 !important; width: 100% !important; height: auto !important; *background: #f4f4f4; left: 0px !important; right: 0px !important; padding-left: 131px !important; padding-right: 131px !important; visibility: visible !important; } .stick-datatable table { border-collapse: separate; border-spacing: 1px; width: 100%; } .stick-datatable table thead { overflow: auto; } .stick-datatable table td { background: #d4d4d4; text-align: left; font-weight: normal; padding: 10px 18px !important; } /****/ .stick-tabel-pengadaan { position: fixed !important; top: 138px !important; z-index: 999 !important; width: calc(100% - 294px) !important; *width: calc(100% - 0px) !important; height: auto !important; *background: #f4f4f4; background: #d9d9d9; left: 0px !important; right: 0px !important; *padding-left: 131px !important; *padding-right: 131px !important; visibility: visible !important; margin-left: 147px !important; margin-right: 147px !important; *border: 1px solid red; } .stick-tabel-pengadaan table th { padding: 8px 8px !important; *background: cyan !important; } /****/ section table#example.display { *table-layout: fixed; border-collapse: collapse !important; width: 100% !important; border-spacing: 0px !important; } section table#example.display th { padding: 4px 8px !important; box-sizing: border-box !important; } section table#example.display th.tipe-user { *background: red !important; width: 150px !important; } section table#example.display th.nama { *background: pink; width: 150px !important; } section table#example.display th.username { *background: lime !important; width: 150px !important; } section table#example.display th.nomor { *background: cyan; width: 150px !important; } section table#example.display th.alamat { *background: red; width: 120px !important; } section table#example.display th.kota { *background: red; *width: 160px !important; } section table#example.display th.tanggal { *background: green; width: 150px !important; } section table#example.display th.status { *background: green !important; width: 50px !important; } section table#example.display th.unit-kerja { *background: green; width: 150px !important; } section table#example.display th.email { *background: green; width: 300px !important; } section table#example.display th.kode { *background: green; width: 90px !important; } section table#example.display th.perusahaan { *background: green; width: 200px !important; } section table#example.display th.nomor-pr-grup { *background: green; width: 200px !important; } section table#example.display th.nomor-pr { *background: green; width: 200px !important; } section table#example.display th.nomor-po { *background: green; width: 200px !important; } /****/ section table#example.display th.rekanan-registrasi { *background: green; width: 140px !important; } section table#example.display th.rekanan-nama { *background: green; width: 360px !important; } section table#example.display th.rekanan-tanggal { *background: green; width: 180px !important; } /****/ section table#example.display th.log-rekanan { *background: green; width: 240px !important; } section table#example.display th.log-ip { *background: green; width: 200px !important; } section table#example.display th.log-tanggal { *background: green; width: 180px !important; } /****/ .stick-datatable table { *table-layout: fixed; border-collapse: collapse !important; width: 100% !important; border-spacing: 0px !important; } .stick-datatable table th { padding: 4px 8px !important; box-sizing: border-box !important; background: #dfdfdf !important; } .stick-datatable th.tipe-user { *background: green !important; width: 203px !important; } .stick-datatable th.nama { *background: pink; width: 204px !important; } .stick-datatable th.username { *background: lime !important; width: 203px !important; } .stick-datatable th.nomor { *background: cyan; width: 150px !important; } .stick-datatable th.alamat { *background: red; width: 160px !important; } .stick-datatable th.kota { *background: red; *width: 160px !important; } .stick-datatable th.tanggal { *background: green; width: 150px !important; } .stick-datatable th.status { *background: green !important; width: 70px !important; } .stick-datatable th.unit-kerja { *background: green; width: 150px !important; } .stick-datatable th.email { *background: green; width: 300px !important; } .stick-datatable th.kode { *background: green; width: 90px !important; } .stick-datatable th.perusahaan { *background: green; width: 250px !important; } .stick-datatable th.nomor-pr-grup { *background: green; width: 290px !important; } .stick-datatable th.nomor-pr { *background: green; width: 260px !important; } .stick-datatable th.nomor-po { *background: green; width: 200px !important; } /****/ .stick-datatable th.rekanan-registrasi { *background: green; width: 170px !important; } .stick-datatable th.rekanan-nama { *background: green; width: 420px !important; } .stick-datatable th.rekanan-tanggal { *background: green; width: 200px !important; } /****/ .stick-datatable th.log-rekanan { *background: green; width: 370px !important; } .stick-datatable th.log-ip { *background: green; width: 290px !important; } .stick-datatable th.log-tanggal { *background: green; width: 180px !important; } /****/ .area-cabang-new { *border: 2px solid red; float: left; width: 100%; clear: both; } .area-cabang-new ul { padding: 0 20px; float: left; width: 100%; clear: both; margin-top: 20px; *border: 1px solid orange; } .area-cabang-new ul li { list-style: none; float: left; width: 50%; *border: 1px solid cyan; padding: 7px 10px; position: relative; } .area-cabang-new ul li a { *background: rgba(255, 255, 255, 0.2); background: rgba(0, 0, 0, 0.2); color: #fff; display: block; border-bottom: 2px solid rgba(0, 0, 0, 0.3); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 8px 10px 8px 30px; text-decoration: none; } .area-cabang-new ul li a:hover { background: rgba(0, 0, 0, 0.5); } .area-cabang-new ul li a:before { /*background: url(../images/logo-pelindo.png); width:30px; height:30px; border:1px solid red; position:absolute;*/ width: 30px; height: 30px; content: " "; background: #FFF url(../images/logo-pelindo.png); background-size: 30px; background-repeat: no-repeat; background-position: center center; position: absolute; left: 0px; top: 0px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; *border: 1px solid cyan !important; } /****/ .area-browser-kompatibel { padding: 0 20px; background: rgba(255, 255, 255, 0.3); *border: 2px solid cyan; float: left; width: 100%; clear: both; } .area-browser-kompatibel .inner { float: left; width: 100%; clear: both; *border: 1px solid red; *padding-top: 18px; *background: cyan; padding: 5px 0 10px; } .area-browser-kompatibel .inner ul { padding: 0 0; *background: orange; } .area-browser-kompatibel .inner ul li { list-style: none; border-bottom: 1px solid rgba(0, 0, 0, 0.1); padding-top: 5px; padding-bottom: 5px; } .area-browser-kompatibel .inner ul li:first-child { *border-top: 1px solid rgba(0, 0, 0, 0.1); } .area-browser-kompatibel .inner ul li:last-child { *border-bottom: none; } .area-browser-kompatibel i { *color: #73D4Ff; color: #fff; font-size: 18px; } /****/ .item-tooltip { color: #900; text-decoration: none; } .item-tooltip:hover { color: red; position: relative; *border: 1px solid red !important; } .item-tooltip[data-title]:hover:before { content: attr(data-title) !important; padding: 4px 8px !important; color: #333 !important; position: absolute !important; left: 0; top: 100% !important; white-space: nowrap !important; *z-index: 20px !important; *z-index: 99999 !important; z-index: 20; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; -moz-box-shadow: 0px 0px 4px #222; -webkit-box-shadow: 0px 0px 4px #222; box-shadow: 0px 0px 4px #222; /*background-image: -moz-linear-gradient(top, #eeeeee, #cccccc); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #eeeeee),color-stop(1, #cccccc)); background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc); background-image: -moz-linear-gradient(top, #eeeeee, #cccccc); background-image: -ms-linear-gradient(top, #eeeeee, #cccccc); background-image: -o-linear-gradient(top, #eeeeee, #cccccc);*/ background: rgba(255, 255, 255, 0.8); line-height: normal; } /****/ /*.datagrid-filter-c{ border:2px solid red !important; display:inherit !important; width:auto !important; *position:absolute !important; display:none !important; } */ tr.datagrid-header-row.datagrid-filter-row { *display: none !important; } /****/ .area-info.dokumen-penawaran-rekanan { *border: 2px solid red; float: left; width: 100%; clear: both; *background: rgba(0, 0, 0, 0.05); background: rgba(115, 212, 238, 0.1); border: 1px solid rgba(115, 212, 238, 0.2); margin-bottom: 2px; padding: 5px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .area-info.dokumen-penawaran-rekanan span.ikon { float: left; width: 20px; } .area-info.dokumen-penawaran-rekanan span:nth-child(2) { *border: 1px solid cyan; float: left; width: calc(100% - 20px); } /****/ ul.area-menu-atas { *border: 1px solid pink; background-color: #0e73b9; } ul.area-menu-atas li a { *font-size: 84%; *font-size: 14px; } /****/ /*.container-aps > .col-md-12{ position:inherit !important; border:1px solid cyan !important; } .container-aps > .col-md-12 > .area-main{ position:inherit !important; border:1px solid pink !important; } */ /****/ #info-login-salah { width: 400px; display: none; *border: 2px solid red; background: rgba(255, 255, 255, 0.8); *padding: 0px 0px 18px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } @media screen and (max-width:767px) { #info-login-salah { width: 100%; } } #info-login-salah>h3 { background: #fff3f3; border: 1px solid #ffa8a8; text-align: center; padding-top: 6px; padding-bottom: 6px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; margin-bottom: 0px; } #info-login-salah>div { padding-left: 20px; padding-right: 20px; padding-top: 18px; padding-bottom: 18px; border: 1px solid rgba(0, 0, 0, 0.1); border-width: 0 1px 1px 1px; margin-top: 0px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } #info-login-salah>div>table span { display: inline-block; width: 100%; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } #info-login-salah>div>table input { width: 100%; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid rgba(0, 0, 0, 0.1); padding: 4px; } #info-login-salah>div>table button { width: 100%; border: none; background: #27c2ea; color: #fff; border-bottom: 2px solid rgba(0, 0, 0, 0.2); padding-top: 5px; padding-bottom: 5px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } /****/ /*#error-login{ background:rgba(255,255,255,1); color:red; position:absolute; left:10px; width:calc(100% - 200px); font-size:12px; padding-left:10px; padding-right:10px; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; }*/ #error-login { *background: rgba(255, 255, 255, 1); *background: rgba(255, 168, 168, 1); *color: #fff; position: absolute; top: 55px; left: 15px; z-index: 99; width: calc(100% - 165px); font-size: 14px; /*-webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;*/ } @media screen and (max-width:767px) { #error-login { width: calc(100% - 75px); *right: 0px; } } .triangle-isosceles { position: relative; padding: 10px 10px; margin: 1em 0 3em; color: #000; background: #ffffcc; /* default background for browsers without gradient support */ -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid #cc9933; } .triangle-isosceles.top { background: #ffffcc; } /* creates triangle */ .triangle-isosceles:after { content: ""; position: absolute; bottom: -15px; /* value = - border-top-width - border-bottom-width */ left: 50px; /* controls horizontal position */ border-width: 15px 15px 0; /* vary these values to change the angle of the vertex */ border-style: solid; border-color: #ffffcc transparent; /* reduce the damage in FF3.0 */ display: block; width: 0; } /* Variant : top ------------------------------------------ */ .triangle-isosceles.top:after { top: -10px; /* value = - border-top-width - border-bottom-width */ right: 10px; /* controls horizontal position */ bottom: auto; left: auto; border-width: 0 10px 10px; /* vary these values to change the angle of the vertex */ border-color: #ffffcc transparent; } /****/ .area-ticket-view { *border: 1px solid red; } .area-ticket-view>.judul { *border: 1px solid cyan; font-weight: bold; border-top: 1px solid rgba(0, 0, 0, 0.2); border-bottom: 1px solid rgba(0, 0, 0, 0.1); padding-top: 7px; padding-bottom: 7px; text-transform: uppercase; } .area-ticket-view>.area-ticket-chat { *border: 3px solid red; padding: 15px; background: rgba(0, 0, 0, 0.05); } .area-ticket-view>.area-ticket-chat>.judul { *border: 1px solid pink; background: rgba(255, 255, 255, 0.2); padding: 8px 10px; *text-transform: uppercase; font-weight: bold; } .area-ticket-view>.area-ticket-chat>.area-info { *border: 1px solid red; } .area-ticket-view>.area-ticket-chat>.area-info .item { display: inline-block; *border: 1px solid yellow; width: calc(25% - 4px); background: #73D4Ff; } .area-ticket-view>.area-ticket-chat>.area-info .item:nth-child(1) { *margin-left: 2px; } .area-ticket-view>.area-ticket-chat>.area-info .item:nth-child(4) { width: calc(25% - 1px); } .area-ticket-view>.area-ticket-chat>.area-info .item .judul { padding: 7px 10px; } .area-ticket-view>.area-ticket-chat>.area-info .item .data { background: rgba(255, 255, 255, 0.2); padding: 7px 10px; font-weight: bold; } .area-ticket-view>.area-ticket-chat>.area-tombol { border: 1px solid rgba(0, 0, 0, 0.05); padding: 10px; margin-top: 10px; margin-bottom: 10px; clear: both; float: left; width: 100%; } .area-ticket-view>.area-ticket-chat>.area-tombol a { color: #fff; padding: 7px 10px; cursor: pointer; } .area-ticket-view>.area-ticket-chat>.area-tombol a:hover { text-decoration: none; } .area-ticket-view>.area-ticket-chat>.area-tombol a.btn-back { background: #abbac3; float: left; } .area-ticket-view>.area-ticket-chat>.area-tombol a.btn-reply { background: #82af6f; float: left; } .area-ticket-view>.area-ticket-chat>.area-tombol a.btn-close-ticket { background: #d15b47; float: right; } .area-ticket-view>.area-ticket-chat>.ticketreplybox { *background: #e2e2e2; background: rgba(255, 255, 255, 0.2); margin-top: 0px; } .area-ticket-view>.area-ticket-chat>.ticketreplybox input {} .area-ticket-view>.area-ticket-chat>.area-chat { *border: 5px solid yellow; clear: both; display: inline-block; width: 100%; } .area-ticket-view>.area-ticket-chat>.area-chat .item { *clear: both; display: inline-block; width: 100%; *border: 2px solid green; margin-bottom: 20px; } .area-ticket-view>.area-ticket-chat>.area-chat .item .nama { background: rgba(255, 255, 255, 0.9); padding: 8px 10px; *border-bottom: 1px solid rgba(0, 0, 0, 0.2); } .area-ticket-view>.area-ticket-chat>.area-chat .item .nama i { margin-right: 10px; } .area-ticket-view>.area-ticket-chat>.area-chat .item.admin .nama i { color: #73D4Ff; } .area-ticket-view>.area-ticket-chat>.area-chat .item .pesan { background: rgba(255, 255, 255, 0.5) url(../images/bg-shadow-menu.png) top center no-repeat; padding: 8px 10px; margin-left: 10px; margin-right: 10px; position: relative; } .area-ticket-view>.area-ticket-chat>.area-chat .item.admin .pesan { *background: rgba(115, 212, 238, 0.1); *background: rgba(255, 255, 255, 0.7) url(../images/bg-shadow-menu.png) top center no-repeat; } .area-ticket-view>.area-ticket-chat>.area-chat .item .pesan:before { position: absolute; left: -10px; top: -5px; content: url(../images/pesan-corner-kiri.png); } .area-ticket-view>.area-ticket-chat>.area-chat .item .pesan:after { position: absolute; right: -10px; top: -5px; content: url(../images/pesan-corner-kanan.png); } .area-ticket-view>.area-ticket-chat>.area-chat .item .pesan .attachment { border-top: 1px solid rgba(0, 0, 0, 0.1); padding-top: 8px; padding-bottom: 0px; margin-top: 8px; *background: cyan; } .area-ticket-view>.area-ticket-chat>.area-chat .item .pesan .attachment .item { margin-bottom: 0px; } .area-ticket-view>.area-ticket-chat>.area-chat .item .pesan .attachment .item i { *background: yellow; } .area-ticket-view>.area-ticket-chat>.area-chat .item .pesan .attachment .item a { *background: pink; } .area-ticket-view>.area-ticket-chat>.area-chat .item .info { background: rgba(0, 0, 0, 0.5); color: #fff; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; *border: 2px solid green; clear: both; float: left; width: calc(100% - 20px); padding: 8px 10px; margin-left: 10px; margin-right: 10px; } .area-ticket-view>.area-ticket-chat>.area-chat .item .info .waktu { float: left; line-height: 31px; } .area-ticket-view>.area-ticket-chat>.area-chat .item .info .rating { float: right; } .area-ticket-view>.area-ticket-chat>.area-chat .item .info>.rating>div { *display: inline-block; line-height: 31px; } .area-ticket-view>.area-ticket-chat>.area-chat .item .info>.rating>div.poor { float: left; margin-right: 10px; } .area-ticket-view>.area-ticket-chat>.area-chat .item .info>.rating>div.excellent { float: right; margin-left: 10px; } .area-ticket-view>.area-ticket-chat>.area-chat .item .info>.rating>fieldset { float: left; } /****/ .area-banner { margin-bottom: 20px; } .area-banner .item-mobile { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; overflow: hidden; } .area-banner .item-mobile img { width: 100%; } /****/ .area-kanan-bawah-dashboard { margin: 0 0 20px 20px; *border: 2px solid green; } @media screen and (max-width:767px) { .area-kanan-bawah-dashboard { margin: 20px 0 20px 0px; } } .area-kanan-bawah-dashboard>.inner { *border: 2px solid pink; *border-left: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(0, 0, 0, 0.1); margin: 0 0 !important; position: relative; } .area-kanan-bawah-dashboard .judul { /*background:#02aeda; color:#FFF; padding-left:20px; padding-right:20px; font-size:18px; text-transform:uppercase; min-height:40px; line-height:40px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px;*/ font-family: 'AvenirHeavy'; font-size: 18px; text-transform: uppercase; background: #73D4Ff; color: #fff; letter-spacing: 1px; *padding: 13px 20px 12px; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; min-height: 40px; line-height: 40px; padding-left: 20px; padding-right: 20px; } .area-kanan-bawah-dashboard .judul img { margin-right: 10px; } @media screen and (max-width:767px) { .area-kanan-bawah-dashboard .judul span { display: none; } }