Asked by:
Auto Responsive GridViewScroll & Whole Page based on Window Resolution or Zoom Level using Browser

Question
-
User-893002196 posted
Hi All,
I have this a.html page as below, I having issue:-
I have set the Body { overflow: hidden }. So no scrolling x & y for the main.
- How to hide 2nd last of GridViewScroll Footer repeated twice, refer to the button submission [ Save as Draft ] [ Preview Summary ]
- If my window resolution change, device resolution change, how to do auto fit for everything including GridViewScroll table ?
- If Browser Zoom Level change, how to do auto fit for everything including GridViewScroll table ?
<!DOCTYPE html> <html lang="en-us"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" /> <title> Schedule Management :: Login as MICHEALE </title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> <link href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <style> body{padding-top:50px;padding-bottom:20px}.body-content{padding-left:15px;padding-right:15px}.carousel-caption p{font-size:20px;line-height:1.4}.carousel-inner .item img[src$=".svg"]{width:100%}#qrCode{margin:15px}@media screen and (max-width:767px){.carousel-caption{display:none}} /* assetUrl: /static/less/cnqr-global/manifest-bootstrap.less cachekilla on server: 3DBB90073B2E34B275515980D17F2FD2E867D962E4 created: 12/13/2019 9:13:03 PM utc: 12/14/2019 2:13:03 AM */ h1, h2, h3, h4, h5, h6, .h1,FSection .h2, .h3, .h4, .h5, .h6 { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; font-weight: normal; line-height: 1.1; color: #333333; } h1 small, h2 small, h3 small, h4 small, h5 small, h6 small, .h1 small, .h2 small, .h3 small, .h4 small, .h5 small, .h6 small, h1 .small, h2 .small, h3 .small, h4 .small, h5 .small, h6 .small, .h1 .small, .h2 .small, .h3 .small, .h4 .small, .h5 .small, .h6 .small { font-weight: normal; line-height: 1; color: #c0c2c4; } h1, .h1, h2, .h2, h3, .h3 { margin-top: 18px; margin-bottom: 9px; } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h1 .small, .h1 .small, h2 .small, .h2 .small, h3 .small, .h3 .small { font-size: 65%; } h4, .h4, h5, .h5, h6, .h6 { margin-top: 9px; margin-bottom: 9px; } h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small, h4 .small, .h4 .small, h5 .small, .h5 .small, h6 .small, .h6 .small { font-size: 75%; } h1, .h1 { font-size: 30px; } h2, .h2 { font-size: 20px; } h3, .h3 { font-size: 18px; } h4, .h4 { font-size: 16px; } h5, .h5 { font-size: 14px; } h6, .h6 { font-size: 13px; } p { margin: 0 0 9px; } .lead { margin-bottom: 18px; font-size: 14px; font-weight: 300; line-height: 1.4; } @media (min-width: 768px) { .lead { font-size: 19.5px; } } small, .small { font-size: 84%; } mark, .mark { background-color: #fcf8e3; padding: .2em; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } .text-justify { text-align: justify; } .text-nowrap { white-space: nowrap; } .text-lowercase { text-transform: lowercase; } .text-uppercase { text-transform: uppercase; } .text-capitalize { text-transform: capitalize; } .text-muted { color: #c0c2c4; } .text-primary { color: #c84f2e; } a.text-primary:hover, a.text-primary:focus { color: #9f3f24; } .text-success { color: #3a7827; } a.text-success:hover, a.text-success:focus { color: #27521a; } .text-info { color: #1e69a6; } a.text-info:hover, a.text-info:focus { color: #164e7b; } .text-warning { color: #9e6600; } a.text-warning:hover, a.text-warning:focus { color: #6b4500; } .text-danger { color: #ca202c; } a.text-danger:hover, a.text-danger:focus { color: #9e1922; } .bg-primary { color: #fff; background-color: #c84f2e; } a.bg-primary:hover, a.bg-primary:focus { background-color: #9f3f24; } .bg-success { background-color: #e4f5dc; } a.bg-success:hover, a.bg-success:focus { background-color: #c5eab4; } .bg-info { background-color: #d9edf7; } a.bg-info:hover, a.bg-info:focus { background-color: #afd9ee; } .bg-warning { background-color: #fcf8e3; } a.bg-warning:hover, a.bg-warning:focus { background-color: #f7ecb5; } .bg-danger { background-color: #f6e2e2; } a.bg-danger:hover, a.bg-danger:focus { background-color: #eabbbb; } .page-header { padding-bottom: 8px; margin: 36px 0 18px; border-bottom: 1px solid #e2e3e3; } ul, ol { margin-top: 0; margin-bottom: 9px; } ul ul, ol ul, ul ol, ol ol { margin-bottom: 0; } .list-unstyled { padding-left: 0; list-style: none; } .list-inline { padding-left: 0; list-style: none; margin-left: -5px; } .list-inline > li { display: inline-block; padding-left: 5px; padding-right: 5px; } dl { margin-top: 0; margin-bottom: 18px; } dt, dd { line-height: 1.42857143; } dt { font-weight: bold; } dd { margin-left: 0; } @media (min-width: 991px) { .dl-horizontal dt { float: left; width: 160px; clear: left; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .dl-horizontal dd { margin-left: 180px; } } abbr[title], abbr[data-original-title] { cursor: help; border-bottom: 1px dotted #c0c2c4; } .initialism { font-size: 90%; text-transform: uppercase; } blockquote { padding: 9px 18px; margin: 0 0 18px; font-size: 16.25px; border-left: 5px solid #e2e3e3; } blockquote p:last-child, blockquote ul:last-child, blockquote ol:last-child { margin-bottom: 0; } blockquote footer, blockquote small, blockquote .small { display: block; font-size: 80%; line-height: 1.42857143; color: #c0c2c4; } blockquote footer:before, blockquote small:before, blockquote .small:before { content: '\2014 \00A0'; } .blockquote-reverse, blockquote.pull-right { padding-right: 15px; padding-left: 0; border-right: 5px solid #e2e3e3; border-left: 0; text-align: right; } .blockquote-reverse footer:before, blockquote.pull-right footer:before, .blockquote-reverse small:before, blockquote.pull-right small:before, .blockquote-reverse .small:before, blockquote.pull-right .small:before { content: ''; } .blockquote-reverse footer:after, blockquote.pull-right footer:after, .blockquote-reverse small:after, blockquote.pull-right small:after, .blockquote-reverse .small:after, blockquote.pull-right .small:after { content: '\00A0 \2014'; } address { margin-bottom: 18px; font-style: normal; line-height: 1.42857143; } .container { margin-right: auto; margin-left: auto; padding-left: 16px; padding-right: 16px; } @media (min-width: 768px) { .container { width: 768px; } } @media (min-width: 992px) { .container { width: 980px; } } @media (min-width: 1200px) { .container { width: 1200px; } } .container-fluid { margin-right: auto; margin-left: auto; padding-left: 16px; padding-right: 16px; } .row { margin-left: -16px; margin-right: -16px; } .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { ; min-height: 1px; padding-left: 16px; padding-right: 16px; } .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 { float: left; } .col-xs-12 { width: 100%; } .col-xs-11 { width: 91.66666667%; } .col-xs-10 { width: 83.33333333%; } .col-xs-9 { width: 75%; } .col-xs-8 { width: 66.66666667%; } .col-xs-7 { width: 58.33333333%; } .col-xs-6 { width: 50%; } .col-xs-5 { width: 41.66666667%; } .col-xs-4 { width: 33.33333333%; } .col-xs-3 { width: 25%; } .col-xs-2 { width: 16.66666667%; } .col-xs-1 { width: 8.33333333%; } .col-xs-pull-12 { right: 100%; } .col-xs-pull-11 { right: 91.66666667%; } .col-xs-pull-10 { right: 83.33333333%; } .col-xs-pull-9 { right: 75%; } .col-xs-pull-8 { right: 66.66666667%; } .col-xs-pull-7 { right: 58.33333333%; } .col-xs-pull-6 { right: 50%; } .col-xs-pull-5 { right: 41.66666667%; } .col-xs-pull-4 { right: 33.33333333%; } .col-xs-pull-3 { right: 25%; } .col-xs-pull-2 { right: 16.66666667%; } .col-xs-pull-1 { right: 8.33333333%; } .col-xs-pull-0 { right: auto; } .col-xs-push-12 { left: 100%; } .col-xs-push-11 { left: 91.66666667%; } .col-xs-push-10 { left: 83.33333333%; } .col-xs-push-9 { left: 75%; } .col-xs-push-8 { left: 66.66666667%; } .col-xs-push-7 { left: 58.33333333%; } .col-xs-push-6 { left: 50%; } .col-xs-push-5 { left: 41.66666667%; } .col-xs-push-4 { left: 33.33333333%; } .col-xs-push-3 { left: 25%; } .col-xs-push-2 { left: 16.66666667%; } .col-xs-push-1 { left: 8.33333333%; } .col-xs-push-0 { left: auto; } .col-xs-offset-12 { margin-left: 100%; } .col-xs-offset-11 { margin-left: 91.66666667%; } .col-xs-offset-10 { margin-left: 83.33333333%; } .col-xs-offset-9 { margin-left: 75%; } .col-xs-offset-8 { margin-left: 66.66666667%; } .col-xs-offset-7 { margin-left: 58.33333333%; } .col-xs-offset-6 { margin-left: 50%; } .col-xs-offset-5 { margin-left: 41.66666667%; } .col-xs-offset-4 { margin-left: 33.33333333%; } .col-xs-offset-3 { margin-left: 25%; } .col-xs-offset-2 { margin-left: 16.66666667%; } .col-xs-offset-1 { margin-left: 8.33333333%; } .col-xs-offset-0 { margin-left: 0%; } @media (min-width: 768px) { .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 { float: left; } .col-sm-12 { width: 100%; } .col-sm-11 { width: 91.66666667%; } .col-sm-10 { width: 83.33333333%; } .col-sm-9 { width: 75%; } .col-sm-8 { width: 66.66666667%; } .col-sm-7 { width: 58.33333333%; } .col-sm-6 { width: 50%; } .col-sm-5 { width: 41.66666667%; } .col-sm-4 { width: 33.33333333%; } .col-sm-3 { width: 25%; } .col-sm-2 { width: 16.66666667%; } .col-sm-1 { width: 8.33333333%; } .col-sm-pull-12 { right: 100%; } .col-sm-pull-11 { right: 91.66666667%; } .col-sm-pull-10 { right: 83.33333333%; } .col-sm-pull-9 { right: 75%; } .col-sm-pull-8 { right: 66.66666667%; } .col-sm-pull-7 { right: 58.33333333%; } .col-sm-pull-6 { right: 50%; } .col-sm-pull-5 { right: 41.66666667%; } .col-sm-pull-4 { right: 33.33333333%; } .col-sm-pull-3 { right: 25%; } .col-sm-pull-2 { right: 16.66666667%; } .col-sm-pull-1 { right: 8.33333333%; } .col-sm-pull-0 { right: auto; } .col-sm-push-12 { left: 100%; } .col-sm-push-11 { left: 91.66666667%; } .col-sm-push-10 { left: 83.33333333%; } .col-sm-push-9 { left: 75%; } .col-sm-push-8 { left: 66.66666667%; } .col-sm-push-7 { left: 58.33333333%; } .col-sm-push-6 { left: 50%; } .col-sm-push-5 { left: 41.66666667%; } .col-sm-push-4 { left: 33.33333333%; } .col-sm-push-3 { left: 25%; } .col-sm-push-2 { left: 16.66666667%; } .col-sm-push-1 { left: 8.33333333%; } .col-sm-push-0 { left: auto; } .col-sm-offset-12 { margin-left: 100%; } .col-sm-offset-11 { margin-left: 91.66666667%; } .col-sm-offset-10 { margin-left: 83.33333333%; } .col-sm-offset-9 { margin-left: 75%; } .col-sm-offset-8 { margin-left: 66.66666667%; } .col-sm-offset-7 { margin-left: 58.33333333%; } .col-sm-offset-6 { margin-left: 50%; } .col-sm-offset-5 { margin-left: 41.66666667%; } .col-sm-offset-4 { margin-left: 33.33333333%; } .col-sm-offset-3 { margin-left: 25%; } .col-sm-offset-2 { margin-left: 16.66666667%; } .col-sm-offset-1 { margin-left: 8.33333333%; } .col-sm-offset-0 { margin-left: 0%; } } @media (min-width: 992px) { .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { float: left; } .col-md-12 { width: 100%; } .col-md-11 { width: 91.66666667%; } .col-md-10 { width: 83.33333333%; } .col-md-9 { width: 75%; } .col-md-8 { width: 66.66666667%; } .col-md-7 { width: 58.33333333%; } .col-md-6 { width: 50%; } .col-md-5 { width: 41.66666667%; } .col-md-4 { width: 33.33333333%; } .col-md-3 { width: 25%; } .col-md-2 { width: 16.66666667%; } .col-md-1 { width: 8.33333333%; } .col-md-pull-12 { right: 100%; } .col-md-pull-11 { right: 91.66666667%; } .col-md-pull-10 { right: 83.33333333%; } .col-md-pull-9 { right: 75%; } .col-md-pull-8 { right: 66.66666667%; } .col-md-pull-7 { right: 58.33333333%; } .col-md-pull-6 { right: 50%; } .col-md-pull-5 { right: 41.66666667%; } .col-md-pull-4 { right: 33.33333333%; } .col-md-pull-3 { right: 25%; } .col-md-pull-2 { right: 16.66666667%; } .col-md-pull-1 { right: 8.33333333%; } .col-md-pull-0 { right: auto; } .col-md-push-12 { left: 100%; } .col-md-push-11 { left: 91.66666667%; } .col-md-push-10 { left: 83.33333333%; } .col-md-push-9 { left: 75%; } .col-md-push-8 { left: 66.66666667%; } .col-md-push-7 { left: 58.33333333%; } .col-md-push-6 { left: 50%; } .col-md-push-5 { left: 41.66666667%; } .col-md-push-4 { left: 33.33333333%; } .col-md-push-3 { left: 25%; } .col-md-push-2 { left: 16.66666667%; } .col-md-push-1 { left: 8.33333333%; } .col-md-push-0 { left: auto; } .col-md-offset-12 { margin-left: 100%; } .col-md-offset-11 { margin-left: 91.66666667%; } .col-md-offset-10 { margin-left: 83.33333333%; } .col-md-offset-9 { margin-left: 75%; } .col-md-offset-8 { margin-left: 66.66666667%; } .col-md-offset-7 { margin-left: 58.33333333%; } .col-md-offset-6 { margin-left: 50%; } .col-md-offset-5 { margin-left: 41.66666667%; } .col-md-offset-4 { margin-left: 33.33333333%; } .col-md-offset-3 { margin-left: 25%; } .col-md-offset-2 { margin-left: 16.66666667%; } .col-md-offset-1 { margin-left: 8.33333333%; } .col-md-offset-0 { margin-left: 0%; } } @media (min-width: 1200px) { .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { float: left; } .col-lg-12 { width: 100%; } .col-lg-11 { width: 91.66666667%; } .col-lg-10 { width: 83.33333333%; } .col-lg-9 { width: 75%; } .col-lg-8 { width: 66.66666667%; } .col-lg-7 { width: 58.33333333%; } .col-lg-6 { width: 50%; } .col-lg-5 { width: 41.66666667%; } .col-lg-4 { width: 33.33333333%; } .col-lg-3 { width: 25%; } .col-lg-2 { width: 16.66666667%; } .col-lg-1 { width: 8.33333333%; } .col-lg-pull-12 { right: 100%; } .col-lg-pull-11 { right: 91.66666667%; } .col-lg-pull-10 { right: 83.33333333%; } .col-lg-pull-9 { right: 75%; } .col-lg-pull-8 { right: 66.66666667%; } .col-lg-pull-7 { right: 58.33333333%; } .col-lg-pull-6 { right: 50%; } .col-lg-pull-5 { right: 41.66666667%; } .col-lg-pull-4 { right: 33.33333333%; } .col-lg-pull-3 { right: 25%; } .col-lg-pull-2 { right: 16.66666667%; } .col-lg-pull-1 { right: 8.33333333%; } .col-lg-pull-0 { right: auto; } .col-lg-push-12 { left: 100%; } .col-lg-push-11 { left: 91.66666667%; } .col-lg-push-10 { left: 83.33333333%; } .col-lg-push-9 { left: 75%; } .col-lg-push-8 { left: 66.66666667%; } .col-lg-push-7 { left: 58.33333333%; } .col-lg-push-6 { left: 50%; } .col-lg-push-5 { left: 41.66666667%; } .col-lg-push-4 { left: 33.33333333%; } .col-lg-push-3 { left: 25%; } .col-lg-push-2 { left: 16.66666667%; } .col-lg-push-1 { left: 8.33333333%; } .col-lg-push-0 { left: auto; } .col-lg-offset-12 { margin-left: 100%; } .col-lg-offset-11 { margin-left: 91.66666667%; } .col-lg-offset-10 { margin-left: 83.33333333%; } .col-lg-offset-9 { margin-left: 75%; } .col-lg-offset-8 { margin-left: 66.66666667%; } .col-lg-offset-7 { margin-left: 58.33333333%; } .col-lg-offset-6 { margin-left: 50%; } .col-lg-offset-5 { margin-left: 41.66666667%; } .col-lg-offset-4 { margin-left: 33.33333333%; } .col-lg-offset-3 { margin-left: 25%; } .col-lg-offset-2 { margin-left: 16.66666667%; } .col-lg-offset-1 { margin-left: 8.33333333%; } .col-lg-offset-0 { margin-left: 0%; } } .fade { opacity: 0; -webkit-transition: opacity 0.15s linear; -o-transition: opacity 0.15s linear; transition: opacity 0.15s linear; } .fade.in { opacity: 1; } .collapse { display: none; } .collapse.in { display: block; } tr.collapse.in { display: table-row; } tbody.collapse.in { display: table-row-group; } .collapsing { ; height: 0; overflow: hidden; -webkit-transition-property: height, visibility; transition-property: height, visibility; -webkit-transition-duration: 0.35s; transition-duration: 0.35s; -webkit-transition-timing-function: ease; transition-timing-function: ease; } .breadcrumb { padding: 8px 15px; margin-bottom: 18px; list-style: none; background-color: transparent; border-radius: 4px; } .breadcrumb > li { display: inline-block; } .breadcrumb > li + li:before { content: "\00a0"; padding: 0 5px; color: #333333; } .breadcrumb > .active { color: #333333; } .btn-group, .btn-group-vertical { ; display: inline-block; vertical-align: middle; } .btn-group > .btn, .btn-group-vertical > .btn { ; float: left; } .btn-group > .btn:hover, .btn-group-vertical > .btn:hover, .btn-group > .btn:focus, .btn-group-vertical > .btn:focus, .btn-group > .btn:active, .btn-group-vertical > .btn:active, .btn-group > .btn.active, .btn-group-vertical > .btn.active { z-index: 2; } .btn-group .btn + .btn, .btn-group .btn + .btn-group, .btn-group .btn-group + .btn, .btn-group .btn-group + .btn-group { margin-left: -1px; } .btn-toolbar { margin-left: -5px; } .btn-toolbar .btn, .btn-toolbar .btn-group, .btn-toolbar .input-group { float: left; } .btn-toolbar > .btn, .btn-toolbar > .btn-group, .btn-toolbar > .input-group { margin-left: 5px; } .btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { border-radius: 0; } .btn-group > .btn:first-child { margin-left: 0; } .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) { border-bottom-right-radius: 0; border-top-right-radius: 0; } .btn-group > .btn:last-child:not(:first-child), .btn-group > .dropdown-toggle:not(:first-child) { border-bottom-left-radius: 0; border-top-left-radius: 0; } .btn-group > .btn-group { float: left; } .btn-group > .btn-group:not(:first-child):not(:last-child) > .btn { border-radius: 0; } .btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child, .btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle { border-bottom-right-radius: 0; border-top-right-radius: 0; } .btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child { border-bottom-left-radius: 0; border-top-left-radius: 0; } .btn-group .dropdown-toggle:active, .btn-group.open .dropdown-toggle { outline: 0; } .btn-group > .btn + .dropdown-toggle { padding-left: 8px; padding-right: 8px; } .btn-group > .btn-lg + .dropdown-toggle { padding-left: 12px; padding-right: 12px; } .btn-group.open .dropdown-toggle { -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); } .btn-group.open .dropdown-toggle.btn-link { -webkit-box-shadow: none; box-shadow: none; } .btn .caret { margin-left: 0; } .btn-lg .caret { border-width: 5px 5px 0; border-bottom-width: 0; } .dropup .btn-lg .caret { border-width: 0 5px 5px; } .btn-group-vertical > .btn, .btn-group-vertical > .btn-group, .btn-group-vertical > .btn-group > .btn { display: block; float: none; width: 100%; max-width: 100%; } .btn-group-vertical > .btn-group > .btn { float: none; } .btn-group-vertical > .btn + .btn, .btn-group-vertical > .btn + .btn-group, .btn-group-vertical > .btn-group + .btn, .btn-group-vertical > .btn-group + .btn-group { margin-top: -1px; margin-left: 0; } .btn-group-vertical > .btn:not(:first-child):not(:last-child) { border-radius: 0; } .btn-group-vertical > .btn:first-child:not(:last-child) { border-top-right-radius: 4px; border-top-left-radius: 4px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .btn-group-vertical > .btn:last-child:not(:first-child) { border-top-right-radius: 0; border-top-left-radius: 0; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } .btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn { border-radius: 0; } .btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child, .btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child { border-top-right-radius: 0; border-top-left-radius: 0; } .btn-group-justified { display: table; width: 100%; table-layout: fixed; border-collapse: separate; } .btn-group-justified > .btn, .btn-group-justified > .btn-group { float: none; display: table-cell; width: 1%; } .btn-group-justified > .btn-group .btn { width: 100%; } .btn-group-justified > .btn-group .dropdown-menu { left: auto; } [data-toggle="buttons"] > .btn input[type="radio"], [data-toggle="buttons"] > .btn-group > .btn input[type="radio"], [data-toggle="buttons"] > .btn input[type="checkbox"], [data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] { ; clip: rect(0, 0, 0, 0); pointer-events: none; } .nav { margin-bottom: 0; padding-left: 0; list-style: none; } .nav > li { ; display: block; } .nav > li > a { ; display: block; padding: 10px 15px; } .nav > li > a:hover, .nav > li > a:focus { text-decoration: none; background-color: #ebf7ff; } .nav > li.disabled > a { color: #999ca0; } .nav > li.disabled > a:hover, .nav > li.disabled > a:focus { color: #999ca0; text-decoration: none; background-color: transparent; cursor: not-allowed; } .nav .open > a, .nav .open > a:hover, .nav .open > a:focus { background-color: #ebf7ff; border-color: #1e69a6; } .nav .nav-divider { height: 1px; margin: 8px 0; overflow: hidden; background-color: #e5e5e5; } .nav > li > a > img { max-width: none; } .nav-tabs { border-bottom: 1px solid #c0c2c4; } .nav-tabs > li { float: left; margin-bottom: -1px; } .nav-tabs > li > a { margin-right: 2px; line-height: 1.42857143; border: 1px solid transparent; border-radius: 4px 4px 0 0; } .nav-tabs > li > a:hover { border-color: #c0c2c4 #c0c2c4 #c0c2c4; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { color: #333333; background-color: #ffffff; border: 1px solid #c0c2c4; border-bottom-color: transparent; cursor: default; } .nav-tabs.nav-justified { width: 100%; border-bottom: 0; } .nav-tabs.nav-justified > li { float: none; } .nav-tabs.nav-justified > li > a { text-align: center; margin-bottom: 5px; } .nav-tabs.nav-justified > .dropdown .dropdown-menu { top: auto; left: auto; } @media (min-width: 768px) { .nav-tabs.nav-justified > li { display: table-cell; width: 1%; } .nav-tabs.nav-justified > li > a { margin-bottom: 0; } } .nav-tabs.nav-justified > li > a { margin-right: 0; border-radius: 4px; } .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus { border: 1px solid #c0c2c4; } @media (min-width: 768px) { .nav-tabs.nav-justified > li > a { border-bottom: 1px solid #c0c2c4; border-radius: 4px 4px 0 0; } .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus { border-bottom-color: #c0c2c4; } } .nav-pills > li { float: left; } .nav-pills > li > a { border-radius: 4px; } .nav-pills > li + li { margin-left: 2px; } .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { color: #ffffff; background-color: #c84f2e; } .nav-stacked > li { float: none; } .nav-stacked > li + li { margin-top: 2px; margin-left: 0; } .nav-justified { width: 100%; } .nav-justified > li { float: none; } .nav-justified > li > a { text-align: center; margin-bottom: 5px; } .nav-justified > .dropdown .dropdown-menu { top: auto; left: auto; } @media (min-width: 768px) { .nav-justified > li { display: table-cell; width: 1%; } .nav-justified > li > a { margin-bottom: 0; } } .nav-tabs-justified { border-bottom: 0; } .nav-tabs-justified > li > a { margin-right: 0; border-radius: 4px; } .nav-tabs-justified > .active > a, .nav-tabs-justified > .active > a:hover, .nav-tabs-justified > .active > a:focus { border: 1px solid #c0c2c4; } @media (min-width: 768px) { .nav-tabs-justified > li > a { border-bottom: 1px solid #c0c2c4; border-radius: 4px 4px 0 0; } .nav-tabs-justified > .active > a, .nav-tabs-justified > .active > a:hover, .nav-tabs-justified > .active > a:focus { border-bottom-color: #c0c2c4; } } .tab-content > .tab-pane { display: none; } .tab-content > .active { display: block; } .nav-tabs .dropdown-menu { margin-top: -1px; border-top-right-radius: 0; border-top-left-radius: 0; } .navbar { ; min-height: 50px; margin-bottom: 18px; border: 1px solid transparent; } @media (min-width: 991px) { .navbar { border-radius: 4px; } } @media (min-width: 991px) { .navbar-header { float: left; } } .navbar-collapse { overflow-x: visible; padding-right: 16px; padding-left: 16px; border-top: 1px solid transparent; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1); -webkit-overflow-scrolling: touch; } .navbar-collapse.in { overflow-y: auto; } @media (min-width: 991px) { .navbar-collapse { width: auto; border-top: 0; box-shadow: none; } .navbar-collapse.collapse { display: block !important; height: auto !important; padding-bottom: 0; overflow: visible !important; } .navbar-collapse.in { overflow-y: visible; } .navbar-fixed-top .navbar-collapse, .navbar-static-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse { padding-left: 0; padding-right: 0; } } .navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse { max-height: 340px; } @media (max-device-width: 480px) and (orientation: landscape) { .navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse { max-height: 200px; } } .container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse { margin-right: -16px; margin-left: -16px; } @media (min-width: 991px) { .container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse { margin-right: 0; margin-left: 0; } } .navbar-static-top { z-index: 1000; border-width: 0 0 1px; } @media (min-width: 991px) { .navbar-static-top { border-radius: 0; } } .navbar-fixed-top, .navbar-fixed-bottom { ; right: 0; left: 0; z-index: 1030; } @media (min-width: 991px) { .navbar-fixed-top, .navbar-fixed-bottom { border-radius: 0; } } .navbar-fixed-top { top: 0; border-width: 0 0 1px; } .navbar-fixed-bottom { bottom: 0; margin-bottom: 0; border-width: 1px 0 0; } .navbar-brand { float: left; padding: 16px 16px; font-size: 18px; line-height: 18px; height: 50px; } .navbar-brand:hover, .navbar-brand:focus { text-decoration: none; } .navbar-brand > img { display: block; } @media (min-width: 991px) { .navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand { margin-left: -16px; } } .navbar-toggle { ; float: right; margin-right: 16px; padding: 9px 10px; margin-top: 8px; margin-bottom: 8px; background-color: transparent; background-image: none; border: 1px solid transparent; border-radius: 4px; } .navbar-toggle:focus { outline: 0; } .navbar-toggle .icon-bar { display: block; width: 22px; height: 2px; border-radius: 1px; } .navbar-toggle .icon-bar + .icon-bar { margin-top: 4px; } @media (min-width: 991px) { .navbar-toggle { display: none; } } .navbar-nav { margin: 8px -16px; } .navbar-nav > li > a { padding-top: 10px; padding-bottom: 10px; line-height: 18px; } @media (max-width: 990px) { .navbar-nav .open .dropdown-menu { ; float: none; width: auto; margin-top: 0; background-color: transparent; border: 0; box-shadow: none; } .navbar-nav .open .dropdown-menu > li > a, .navbar-nav .open .dropdown-menu .dropdown-header { padding: 5px 15px 5px 25px; } .navbar-nav .open .dropdown-menu > li > a { line-height: 18px; } .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-nav .open .dropdown-menu > li > a:focus { background-image: none; } } @media (min-width: 991px) { .navbar-nav { float: left; margin: 0; } .navbar-nav > li { float: left; } .navbar-nav > li > a { padding-top: 16px; padding-bottom: 16px; } } .navbar-form { margin-left: -16px; margin-right: -16px; padding: 10px 16px; border-top: 1px solid transparent; border-bottom: 1px solid transparent; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); margin: 0; margin-top: 13px; margin-bottom: 13px; } @media (min-width: 768px) { .navbar-form .form-group { display: inline-block; margin-bottom: 0; vertical-align: middle; } .navbar-form .form-control { display: inline-block; width: auto; vertical-align: middle; } .navbar-form .form-control-static { display: inline-block; } .navbar-form .input-group { display: inline-table; vertical-align: middle; } .navbar-form .input-group .input-group-addon, .navbar-form .input-group .input-group-btn, .navbar-form .input-group .form-control { width: auto; } .navbar-form .input-group > .form-control { width: 100%; } .navbar-form .control-label { margin-bottom: 0; vertical-align: middle; } .navbar-form .radio, .navbar-form .checkbox { display: inline-block; margin-top: 0; margin-bottom: 0; vertical-align: middle; } .navbar-form .radio label, .navbar-form .checkbox label { padding-left: 0; } .navbar-form .radio input[type="radio"], .navbar-form .checkbox input[type="checkbox"] { ; margin-left: 0; } } @media (max-width: 990px) { .navbar-form .form-group { margin-bottom: 5px; } .navbar-form .form-group:last-child { margin-bottom: 0; } } @media (min-width: 991px) { .navbar-form { width: auto; border: 0; margin-left: 0; margin-right: 0; padding-top: 0; padding-bottom: 0; -webkit-box-shadow: none; box-shadow: none; } } .navbar-nav > li > .dropdown-menu { margin-top: 0; border-top-right-radius: 0; border-top-left-radius: 0; } .navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { margin-bottom: 0; border-top-right-radius: 4px; border-top-left-radius: 4px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .navbar-btn { margin-top: 13px; margin-bottom: 13px; } .navbar-btn.btn-sm { margin-top: 16px; margin-bottom: 16px; } .navbar-btn.btn-xs { margin-top: 14px; margin-bottom: 14px; } .navbar-text { margin-top: 16px; margin-bottom: 16px; } @media (min-width: 991px) { .navbar-text { float: left; margin-left: 16px; margin-right: 16px; } } @media (min-width: 991px) { .navbar-left { float: left !important; } .navbar-right { float: right !important; margin-right: -16px; } .navbar-right ~ .navbar-right { margin-right: 0; } } .navbar-default { background-color: #f8f8f8; border-color: #e7e7e7; } .navbar-default .navbar-brand { color: #333333; } .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus { color: #1a1a1a; background-color: transparent; } .navbar-default .navbar-text { color: #50565c; } .navbar-default .navbar-nav > li > a { color: #333333; } .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus { color: #333333; background-color: transparent; } .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { color: #333333; background-color: #383f46; } .navbar-default .navbar-nav > .disabled > a, .navbar-default .navbar-nav > .disabled > a:hover, .navbar-default .navbar-nav > .disabled > a:focus { color: #999ca0; background-color: transparent; } .navbar-default .navbar-toggle { border-color: #c0c2c4; } .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus { background-color: #c0c2c4; } .navbar-default .navbar-toggle .icon-bar { background-color: #999ca0; } .navbar-default .navbar-collapse, .navbar-default .navbar-form { border-color: #e7e7e7; } .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus { background-color: #383f46; color: #333333; } @media (max-width: 990px) { .navbar-default .navbar-nav .open .dropdown-menu > li > a { color: #333333; } .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { color: #333333; background-color: transparent; } .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { color: #333333; background-color: #383f46; } .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { color: #999ca0; background-color: transparent; } } .navbar-default .navbar-link { color: #333333; } .navbar-default .navbar-link:hover { color: #333333; } .navbar-default .btn-link { color: #333333; } .navbar-default .btn-link:hover, .navbar-default .btn-link:focus { color: #333333; } .navbar-default .btn-link[disabled]:hover, fieldset[disabled] .navbar-default .btn-link:hover, .navbar-default .btn-link[disabled]:focus, fieldset[disabled] .navbar-default .btn-link:focus { color: #999ca0; } .navbar-inverse { background-color: #383f46; border-color: #21252a; } .navbar-inverse .navbar-brand { color: #c0c2c4; } .navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand:focus { color: #ffffff; background-color: transparent; } .navbar-inverse .navbar-text { color: #ffffff; } .navbar-inverse .navbar-nav > li > a { color: #c0c2c4; } .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus { color: #ffffff; background-color: #c84f2e; } .navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus { color: #ffffff; background-color: #c84f2e; } .navbar-inverse .navbar-nav > .disabled > a, .navbar-inverse .navbar-nav > .disabled > a:hover, .navbar-inverse .navbar-nav > .disabled > a:focus { color: #444444; background-color: transparent; } .navbar-inverse .navbar-toggle { border-color: #383f46; } .navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus { background-color: #383f46; } .navbar-inverse .navbar-toggle .icon-bar { background-color: #ffffff; } .navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form { border-color: #282d32; } .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus { background-color: #c84f2e; color: #ffffff; } @media (max-width: 990px) { .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header { border-color: #21252a; } .navbar-inverse .navbar-nav .open .dropdown-menu .divider { background-color: #21252a; } .navbar-inverse .navbar-nav .open .dropdown-menu > li > a { color: #c0c2c4; } .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus { color: #ffffff; background-color: #c84f2e; } .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a, .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus { color: #ffffff; background-color: #c84f2e; } .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus { color: #444444; background-color: transparent; } } .navbar-inverse .navbar-link { color: #c0c2c4; } .navbar-inverse .navbar-link:hover { color: #ffffff; } .navbar-inverse .btn-link { color: #c0c2c4; } .navbar-inverse .btn-link:hover, .navbar-inverse .btn-link:focus { color: #ffffff; } .navbar-inverse .btn-link[disabled]:hover, fieldset[disabled] .navbar-inverse .btn-link:hover, .navbar-inverse .btn-link[disabled]:focus, fieldset[disabled] .navbar-inverse .btn-link:focus { color: #444444; } .pagination { display: inline-block; padding-left: 0; margin: 18px 0; border-radius: 4px; } .pagination > li { display: inline; } .pagination > li > a, .pagination > li > span { ; float: left; padding: 3px 3px; line-height: 1.42857143; text-decoration: none; color: #1e69a6; background-color: #ffffff; border: 1px solid #c0c2c4; margin-left: -1px; } .pagination > li:first-child > a, .pagination > li:first-child > span { margin-left: 0; border-bottom-left-radius: 4px; border-top-left-radius: 4px; } .pagination > li:last-child > a, .pagination > li:last-child > span { border-bottom-right-radius: 4px; border-top-right-radius: 4px; } .pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus { z-index: 2; color: #2379bf; background-color: #ebf7ff; border-color: #c0c2c4; } .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { z-index: 3; color: #ffffff; background-color: #1e69a6; border-color: #1e69a6; cursor: default; } .pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus { color: #c0c2c4; background-color: #ffffff; border-color: #dddddd; cursor: not-allowed; } .pagination-lg > li > a, .pagination-lg > li > span { padding: 8px 15px; font-size: 18px; line-height: 1.42857143; } .pagination-lg > li:first-child > a, .pagination-lg > li:first-child > span { border-bottom-left-radius: 6px; border-top-left-radius: 6px; } .pagination-lg > li:last-child > a, .pagination-lg > li:last-child > span { border-bottom-right-radius: 6px; border-top-right-radius: 6px; } .pagination-sm > li > a, .pagination-sm > li > span { padding: 0 3px; font-size: 11px; line-height: 1.5; } .pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span { border-bottom-left-radius: 3px; border-top-left-radius: 3px; } .pagination-sm > li:last-child > a, .pagination-sm > li:last-child > span { border-bottom-right-radius: 3px; border-top-right-radius: 3px; } .pager { padding-left: 0; margin: 18px 0; list-style: none; text-align: center; } .pager li { display: inline; } .pager li > a, .pager li > span { display: inline-block; padding: 5px 14px; background-color: #ffffff; border: 1px solid #c0c2c4; border-radius: 15px; } .pager li > a:hover, .pager li > a:focus { text-decoration: none; background-color: #ebf7ff; } .pager .next > a, .pager .next > span { float: right; } .pager .previous > a, .pager .previous > span { float: left; } .pager .disabled > a, .pager .disabled > a:hover, .pager .disabled > a:focus, .pager .disabled > span { color: #c0c2c4; background-color: #ffffff; cursor: not-allowed; } .cnqr-tiles { display: block; padding: 4px; margin-bottom: 18px; line-height: 1.42857143; background-color: #c0c2c4; border: 1px solid #c0c2c4; border-radius: 4px; -webkit-transition: border 0.2s ease-in-out; -o-transition: border 0.2s ease-in-out; transition: border 0.2s ease-in-out; } @-webkit-keyframes progress-bar-stripes { from { background- 0; } to { background- 0; } } @keyframes progress-bar-stripes { from { background- 0; } to { background- 0; } } .progress { overflow: hidden; height: 18px; margin-bottom: 18px; background-color: #ffffff; border-radius: 4px; -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); } .progress-bar { float: left; width: 0%; height: 100%; font-size: 11px; line-height: 18px; color: #ffffff; text-align: center; background-color: #c84f2e; -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15); -webkit-transition: width 0.6s ease; -o-transition: width 0.6s ease; transition: width 0.6s ease; } .progress-striped .progress-bar, .progress-bar-striped { background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-size: 40px 40px; } .progress.active .progress-bar, .progress-bar.active { -webkit-animation: progress-bar-stripes 2s linear infinite; -o-animation: progress-bar-stripes 2s linear infinite; animation: progress-bar-stripes 2s linear infinite; } .progress-bar-success { background-color: #3a7827; } .progress-striped .progress-bar-success { background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); } .progress-bar-info { background-color: #1e69a6; } .progress-striped .progress-bar-info { background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); } .progress-bar-warning { background-color: #c08600; } .progress-striped .progress-bar-warning { background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); } .progress-bar-danger { background-color: #ca202c; } .progress-striped .progress-bar-danger { background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); } .tooltip { ; z-index: 1070; display: block; font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; font-style: normal; font-weight: normal; letter-spacing: normal; line-break: auto; line-height: 1.42857143; text-align: left; text-align: start; text-decoration: none; text-shadow: none; text-transform: none; white-space: normal; word-break: normal; word-spacing: normal; word-wrap: normal; font-size: 11px; opacity: 0; filter: alpha(opacity=0); } .tooltip.in { opacity: 1; filter: alpha(opacity=100); } .tooltip.top { margin-top: -3px; padding: 8px 0; } .tooltip.right { margin-left: 3px; padding: 0 8px; } .tooltip.bottom { margin-top: 3px; padding: 8px 0; } .tooltip.left { margin-left: -3px; padding: 0 8px; } .tooltip-inner { max-width: 260px; padding: 3px 8px; color: #ffffff; text-align: center; background-color: #383f46; border-radius: 4px; } .tooltip-arrow { ; width: 0; height: 0; border-color: transparent; border-style: solid; } .tooltip.top .tooltip-arrow { bottom: 0; left: 50%; margin-left: -8px; border-width: 8px 8px 0; border-top-color: #383f46; } .tooltip.top-left .tooltip-arrow { bottom: 0; right: 8px; margin-bottom: -8px; border-width: 8px 8px 0; border-top-color: #383f46; } .tooltip.top-right .tooltip-arrow { bottom: 0; left: 8px; margin-bottom: -8px; border-width: 8px 8px 0; border-top-color: #383f46; } .tooltip.right .tooltip-arrow { top: 50%; left: 0; margin-top: -8px; border-width: 8px 8px 8px 0; border-right-color: #383f46; } .tooltip.left .tooltip-arrow { top: 50%; right: 0; margin-top: -8px; border-width: 8px 0 8px 8px; border-left-color: #383f46; } .tooltip.bottom .tooltip-arrow { top: 0; left: 50%; margin-left: -8px; border-width: 0 8px 8px; border-bottom-color: #383f46; } .tooltip.bottom-left .tooltip-arrow { top: 0; right: 8px; margin-top: -8px; border-width: 0 8px 8px; border-bottom-color: #383f46; } .tooltip.bottom-right .tooltip-arrow { top: 0; left: 8px; margin-top: -8px; border-width: 0 8px 8px; border-bottom-color: #383f46; } .modal-open { overflow: hidden; } .modal { display: none; overflow: hidden; ; top: 0; right: 0; bottom: 0; left: 0; z-index: 1050; -webkit-overflow-scrolling: touch; outline: 0; } .modal.fade .modal-dialog { -webkit-transform: translate(0, -25%); -ms-transform: translate(0, -25%); -o-transform: translate(0, -25%); transform: translate(0, -25%); -webkit-transition: -webkit-transform 0.3s ease-out; -moz-transition: -moz-transform 0.3s ease-out; -o-transition: -o-transform 0.3s ease-out; transition: transform 0.3s ease-out; } .modal.in .modal-dialog { -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); } .modal-open .modal { overflow-x: hidden; overflow-y: auto; } .modal-dialog { ; width: auto; margin: 10px; } .modal-content { ; background-color: #ffffff; border: 1px solid #999999; border: 1px solid rgba(0, 0, 0, 0.2); border-radius: 6px; -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5); box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5); background-clip: padding-box; outline: 0; } .modal-backdrop { ; top: 0; right: 0; bottom: 0; left: 0; z-index: 1040; background-color: #000000; } .modal-backdrop.fade { opacity: 0; filter: alpha(opacity=0); } .modal-backdrop.in { opacity: 0.5; filter: alpha(opacity=50); } .modal-header { padding: 16px; border-bottom: 1px solid #72777b; } .modal-header .close { margin-top: -2px; } .modal-title { margin: 0; line-height: 1.42857143; } .modal-body { ; padding: 16px; } .modal-footer { padding: 16px; text-align: right; border-top: 1px solid #72777b; } .modal-footer .btn + .btn { margin-left: 5px; margin-bottom: 0; } .modal-footer .btn-group .btn + .btn { margin-left: -1px; } .modal-footer .btn-block + .btn-block { margin-left: 0; } .modal-scrollbar-measure { ; top: -9999px; width: 50px; height: 50px; overflow: scroll; } @media (min-width: 768px) { .modal-dialog { width: 600px; margin: 30px auto; } .modal-content { -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); } .modal-sm { width: 450px; } } @media (min-width: 992px) { .modal-lg { width: 740px; } } .carousel { ; } .carousel-inner { ; overflow: hidden; width: 100%; } .carousel-inner > .item { display: none; ; -webkit-transition: 0.6s ease-in-out left; -o-transition: 0.6s ease-in-out left; transition: 0.6s ease-in-out left; } .carousel-inner > .item > img, .carousel-inner > .item > a > img { line-height: 1; } @media all and (transform-3d), (-webkit-transform-3d) { .carousel-inner > .item { -webkit-transition: -webkit-transform 0.6s ease-in-out; -moz-transition: -moz-transform 0.6s ease-in-out; -o-transition: -o-transform 0.6s ease-in-out; transition: transform 0.6s ease-in-out; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; -webkit-perspective: 1000px; -moz-perspective: 1000px; perspective: 1000px; } .carousel-inner > .item.next, .carousel-inner > .item.active.right { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); left: 0; } .carousel-inner > .item.prev, .carousel-inner > .item.active.left { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); left: 0; } .carousel-inner > .item.next.left, .carousel-inner > .item.prev.right, .carousel-inner > .item.active { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); left: 0; } } .carousel-inner > .active, .carousel-inner > .next, .carousel-inner > .prev { display: block; } .carousel-inner > .active { left: 0; } .carousel-inner > .next, .carousel-inner > .prev { ; top: 0; width: 100%; } .carousel-inner > .next { left: 100%; } .carousel-inner > .prev { left: -100%; } .carousel-inner > .next.left, .carousel-inner > .prev.right { left: 0; } .carousel-inner > .active.left { left: -100%; } .carousel-inner > .active.right { left: 100%; } .carousel-control { ; top: 0; left: 0; bottom: 0; width: 15%; opacity: 0.5; filter: alpha(opacity=50); font-size: 20px; color: #ffffff; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); background-color: rgba(0, 0, 0, 0); } .carousel-control.left { background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%); background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%); background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1); } .carousel-control.right { left: auto; right: 0; background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%); background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%); background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1); } .carousel-control:hover, .carousel-control:focus { outline: 0; color: #ffffff; text-decoration: none; opacity: 0.9; filter: alpha(opacity=90); } .carousel-control .icon-prev, .carousel-control .icon-next, .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right { ; top: 50%; margin-top: -10px; z-index: 5; display: inline-block; } .carousel-control .icon-prev, .carousel-control .glyphicon-chevron-left { left: 50%; margin-left: -10px; } .carousel-control .icon-next, .carousel-control .glyphicon-chevron-right { right: 50%; margin-right: -10px; } .carousel-control .icon-prev, .carousel-control .icon-next { width: 20px; height: 20px; line-height: 1; font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; } .carousel-control .icon-prev:before { content: '\2039'; } .carousel-control .icon-next:before { content: '\203a'; } .carousel-indicators { ; bottom: 10px; left: 50%; z-index: 15; width: 60%; margin-left: -30%; padding-left: 0; list-style: none; text-align: center; } .carousel-indicators li { display: inline-block; width: 10px; height: 10px; margin: 1px; text-indent: -999px; border: 1px solid #ffffff; border-radius: 10px; cursor: pointer; background-color: #000 \9; background-color: rgba(0, 0, 0, 0); } .carousel-indicators .active { margin: 0; width: 12px; height: 12px; background-color: #ffffff; } .carousel-caption { ; left: 15%; right: 15%; bottom: 20px; z-index: 10; padding-top: 20px; padding-bottom: 20px; color: #ffffff; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); } .carousel-caption .btn { text-shadow: none; } @media screen and (min-width: 768px) { .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-prev, .carousel-control .icon-next { width: 30px; height: 30px; margin-top: -10px; font-size: 30px; } .carousel-control .glyphicon-chevron-left, .carousel-control .icon-prev { margin-left: -10px; } .carousel-control .glyphicon-chevron-right, .carousel-control .icon-next { margin-right: -10px; } .carousel-caption { left: 20%; right: 20%; padding-bottom: 30px; } .carousel-indicators { bottom: 20px; } } .cnqr-autocomplete-button { padding-top: 0; max-width: 250px; } .cnqr-autocomplete-button.cnqr-dropdown-filter-right { left: auto; right: 0; } .cnqr-autocomplete-button ul { ; display: block; border: none; box-shadow: none; max-height: 300px; overflow: auto; width: 100%; } .cnqr-autocomplete-button .cnqr-dropdown-filter-search { background-color: #e2e3e3; padding: 5px 5px; display: block; border-top-left-radius: 4px; border-top-right-radius: 4px; } .btn-labeled .btn-text-label { display: inline-block; float: left; vertical-align: middle; font-size: 11px; line-height: 1.45454537; padding: 3px 0; border: 1px solid transparent; margin-right: 10px; } .btn-labeled.btn-labeled-lg .btn-text-label { font-size: 13px; line-height: 1.4; font-weight: bold; padding: 8px 0; margin-right: 8px; } .btn-labeled.btn-labeled-lg.btn-labeled-link .btn-text-label { font-weight: normal; } .btn-labeled.btn-labeled-sm .btn-text-label { font-size: 11px; line-height: 1.45454537; padding: 0 0; margin-right: 3px; } .btn-labeled.btn-labeled-link .btn-text-label { margin-right: 0; } .btn-toolbar .btn-labeled { display: inline-block; float: left; margin-left: 6px; } .btn-toolbar .btn-labeled .btn-text-label { padding-left: 10px; } .btn-toolbar .btn-labeled.btn-labeled-lg .btn-text-label { padding-left: 8px; } .btn-toolbar .btn-labeled.btn-labeled-sm .btn-text-label { padding-left: 3px; } .btn-toolbar .btn-labeled:first-child { margin-left: 0; } .btn-toolbar .btn-labeled .btn-group { margin-left: 0; } .cnqr-dropdown-filter { display: block; padding-top: 0; } .cnqr-dropdown-filter.cnqr-dropdown-filter-right { left: auto; right: 0; } .cnqr-dropdown-filter ul { ; display: block; border: none; box-shadow: none; max-height: 300px; overflow: auto; } .cnqr-dropdown-filter .cnqr-dropdown-filter-search { background-color: #e2e3e3; padding: 5px 5px; display: block; width: 100%; } body { overflow-x: hidden ; } .cnqr-error { color: #ca202c; } .cnqr-warning { color: #c08600; } .cnqr-success { color: #3a7827; } .cnqr-success-bg { background-color: #3a7827; } .cnqr-currency.cnqr-fancy .cnqr-currency-symbol { ; top: -0.25em; font-size: 75%; } .cnqr-currency.cnqr-fancy .cnqr-currency-code { font-size: 75%; bottom: 0; } .cnqr-follow-me { font-size: 13px; color: #333333; } .cnqr-follow-me i[class*='icon-arrow'] { color: #1e69a6; } .cnqr-follow-me:hover { color: #2379bf; text-decoration: none; } .cnqr-follow-me:hover i[class*='icon-arrow'] { color: #2379bf; } .cnqr-hr-darker { color: #50565c; border-color: #50565c; } ::-ms-clear { width: 0; height: 0; } html, body { height: 100%; overflow: hidden; } #frmMain.nomargins { /* In order to support pushing footers to the bottom, everything in the stack needs to have height set to 100%. Many of our classic asp pages have a hardcoded <form element that is right under <body>, so it needs height: 100%; */ height: 100%; } .cnqr-app-header.container { overflow-x: visible; } .cnqr-app-content.container { min-height: 67%; overflow: visible; background-color: #ffffff; padding: 16px; } .cnqr-condensed.cnqr-app-content { padding: 0; } .cnqr-app-footer .row { margin-top: 16px; } .cnqr-app-footer .row.cnqr-first { margin-top: 0; } .cnqr-grid-centered .cnqr-app-content.container { margin-left: auto; margin-right: auto; } .cnqr-position-middle .cnqr-app-content > .row { height: 67vh; display: table; margin: 0 auto; } .cnqr-position-middle .cnqr-app-content > .row > .col-xs-8, .cnqr-position-middle .cnqr-app-content > .row > .col-sm-8, .cnqr-position-middle .cnqr-app-content > .row > .col-md-8, .cnqr-position-middle .cnqr-app-content > .row > .col-lg-9, .cnqr-position-middle .cnqr-app-content > .row > .col-xs-9, .cnqr-position-middle .cnqr-app-content > .row > .col-sm-9, .cnqr-position-middle .cnqr-app-content > .row > .col-md-9, .cnqr-position-middle .cnqr-app-content > .row > .col-lg-10, .cnqr-position-middle .cnqr-app-content > .row > .col-xs-12, .cnqr-position-middle .cnqr-app-content > .row > .col-sm-12, .cnqr-position-middle .cnqr-app-content > .row > .col-md-12, .cnqr-position-middle .cnqr-app-content > .row > .col-lg-12 { display: table-cell; vertical-align: middle; float: none; } @media (min-width: 768px) { .cnqr-grid-wide .container { width: 100%; } } @media (min-width: 992px) { .cnqr-grid-wide .container { width: 100%; } } @media (min-width: 1200px) { .cnqr-grid-wide .container { width: 100%; } } .cnqr-grid-sidebar-fixed-wide .cnqr-app-content #sidebar1 { width: 330px; } .cnqr-grid-sidebar-fixed-wide .cnqr-app-content #featured { width: 650px; } @media (min-width: 992px) { .cnqr-grid-sidebar-fixed-wide .cnqr-app-content #featured { width: 650px; } } @media (min-width: 1200px) { .cnqr-grid-sidebar-fixed-wide .cnqr-app-content #featured { width: 870px; } } .cnqr-grid-sidebar-fixed-wide .cnqr-app-content .row > #sidebar1 { width: 346px; } .cnqr-grid-sidebar-fixed-wide .cnqr-app-content .row > #featured { width: 634px; } @media (min-width: 992px) { .cnqr-grid-sidebar-fixed-wide .cnqr-app-content .row > #featured { width: 634px; } } @media (min-width: 1200px) { .cnqr-grid-sidebar-fixed-wide .cnqr-app-content .row > #featured { width: 854px; } } .cnqr-grid-sidebar-fixed-narrow .cnqr-app-content #sidebar1 { width: 170px; } .cnqr-grid-sidebar-fixed-narrow .cnqr-app-content #featured { width: 810px; } @media (min-width: 992px) { .cnqr-grid-sidebar-fixed-narrow .cnqr-app-content #featured { width: 810px; } } @media (min-width: 1200px) { .cnqr-grid-sidebar-fixed-narrow .cnqr-app-content #featured { width: 1030px; } } .cnqr-grid-sidebar-fixed-narrow .cnqr-app-content .row > #sidebar1 { width: 186px; } .cnqr-grid-sidebar-fixed-narrow .cnqr-app-content .row > #featured { width: 794px; } @media (min-width: 992px) { .cnqr-grid-sidebar-fixed-narrow .cnqr-app-content .row > #featured { width: 794px; } } @media (min-width: 1200px) { .cnqr-grid-sidebar-fixed-narrow .cnqr-app-content .row > #featured { width: 1014px; } } @media (min-width: 991px) { .cnqr-col-no-gutter { padding-left: 0; padding-right: 0; } .cnqr-col-no-gutter-left { padding-left: 0; } .cnqr-col-no-gutter-right { padding-right: 0 !important; } } /******************************************************************************** The block below used to contain multiple "cnqr-theme-*" class names. It has been replaced with the body id ('cnqrBody') in case any of these styles needed the added specificity to be applied. The styles below "should" be able to be integrated back into the class definitions and should be investigated when working in those areas. ********************************************************************************/ #cnqrBody.cnqr-grid-wide { overflow-x: visible; min-width: 980px; } #cnqrBody.cnqr-grid-wide .container { overflow-x: visible; min-width: 980px; } #cnqrBody.cnqr-grid-wide tr.hidden-sm, #cnqrBody.cnqr-grid-wide th.hidden-sm, #cnqrBody.cnqr-grid-wide td.hidden-sm { display: block !important; } #cnqrBody.cnqr-grid-wide .cnqr-app-footer .row { clear: both; margin-left: auto; margin-right: auto; } @media (min-width: 768px) { #cnqrBody.cnqr-grid-wide .cnqr-app-footer .row { width: 980px; } } @media (min-width: 992px) { #cnqrBody.cnqr-grid-wide .cnqr-app-footer .row { width: 980px; } } @media (min-width: 1200px) { #cnqrBody.cnqr-grid-wide .cnqr-app-footer .row { width: 1200px; } } #cnqrBody.cnqr-grid-sidebar-fixed-narrow .cnqr-app-content #sidebar1 { width: 184px; } #cnqrBody.cnqr-grid-sidebar-fixed-narrow .cnqr-app-content #featured { width: 796px; } @media (min-width: 992px) { #cnqrBody.cnqr-grid-sidebar-fixed-narrow .cnqr-app-content #featured { width: 796px; } } @media (min-width: 1200px) { #cnqrBody.cnqr-grid-sidebar-fixed-narrow .cnqr-app-content #featured { width: 1016px; } } #cnqrBody.cnqr-grid-sidebar-fixed-narrow .cnqr-app-content .row > #sidebar1 { width: 200px; } #cnqrBody.cnqr-grid-sidebar-fixed-narrow .cnqr-app-content .row > #featured { width: 780px; } @media (min-width: 992px) { #cnqrBody.cnqr-grid-sidebar-fixed-narrow .cnqr-app-content .row > #featured { width: 780px; } } @media (min-width: 1200px) { #cnqrBody.cnqr-grid-sidebar-fixed-narrow .cnqr-app-content .row > #featured { width: 1000px; } } .cnqr-app-header { background-color: #383f46; } .cnqr-app-header #cnqr-navbar-primary, .cnqr-app-header #cnqr-navbar-secondary, .cnqr-app-header #cnqr-navbar-tertiary { margin-bottom: 0; border-top-right-radius: 0; border-top-left-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .cnqr-app-header #cnqr-navbar-primary .open .dropdown-menu, .cnqr-app-header #cnqr-navbar-secondary .open .dropdown-menu, .cnqr-app-header #cnqr-navbar-tertiary .open .dropdown-menu { ; } .cnqr-app-header #cnqr-navbar-primary .dropdown:hover > .dropdown-menu, .cnqr-app-header #cnqr-navbar-secondary .dropdown:hover > .dropdown-menu, .cnqr-app-header #cnqr-navbar-tertiary .dropdown:hover > .dropdown-menu, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover > .dropdown-menu, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover > .dropdown-menu, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover > .dropdown-menu, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover-tour > .dropdown-menu, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover-tour > .dropdown-menu, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover-tour > .dropdown-menu { z-index: 1000; display: block; border-top-right-radius: 0; border-top-left-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .cnqr-app-header #cnqr-navbar-primary .dropdown:hover > .dropdown-menu > li:hover > a, .cnqr-app-header #cnqr-navbar-secondary .dropdown:hover > .dropdown-menu > li:hover > a, .cnqr-app-header #cnqr-navbar-tertiary .dropdown:hover > .dropdown-menu > li:hover > a, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover > .dropdown-menu > li:hover > a, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover > .dropdown-menu > li:hover > a, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover > .dropdown-menu > li:hover > a, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover-tour > .dropdown-menu > li:hover > a, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover-tour > .dropdown-menu > li:hover > a, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover-tour > .dropdown-menu > li:hover > a, .cnqr-app-header #cnqr-navbar-primary .dropdown:hover > .dropdown-menu > li:focus > a, .cnqr-app-header #cnqr-navbar-secondary .dropdown:hover > .dropdown-menu > li:focus > a, .cnqr-app-header #cnqr-navbar-tertiary .dropdown:hover > .dropdown-menu > li:focus > a, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover > .dropdown-menu > li:focus > a, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover > .dropdown-menu > li:focus > a, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover > .dropdown-menu > li:focus > a, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover-tour > .dropdown-menu > li:focus > a, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover-tour > .dropdown-menu > li:focus > a, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover-tour > .dropdown-menu > li:focus > a { background-color: #ebf7ff; } .cnqr-app-header #cnqr-navbar-primary .dropdown:hover > .dropdown-menu > li a, .cnqr-app-header #cnqr-navbar-secondary .dropdown:hover > .dropdown-menu > li a, .cnqr-app-header #cnqr-navbar-tertiary .dropdown:hover > .dropdown-menu > li a, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover > .dropdown-menu > li a, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover > .dropdown-menu > li a, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover > .dropdown-menu > li a, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover-tour > .dropdown-menu > li a, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover-tour > .dropdown-menu > li a, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover-tour > .dropdown-menu > li a { padding-right: 20px; } .cnqr-app-header #cnqr-navbar-primary .dropdown:hover > .dropdown-menu > li a .icon-arrow-1-e, .cnqr-app-header #cnqr-navbar-secondary .dropdown:hover > .dropdown-menu > li a .icon-arrow-1-e, .cnqr-app-header #cnqr-navbar-tertiary .dropdown:hover > .dropdown-menu > li a .icon-arrow-1-e, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover > .dropdown-menu > li a .icon-arrow-1-e, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover > .dropdown-menu > li a .icon-arrow-1-e, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover > .dropdown-menu > li a .icon-arrow-1-e, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover-tour > .dropdown-menu > li a .icon-arrow-1-e, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover-tour > .dropdown-menu > li a .icon-arrow-1-e, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover-tour > .dropdown-menu > li a .icon-arrow-1-e, .cnqr-app-header #cnqr-navbar-primary .dropdown:hover > .dropdown-menu > li a .icon-arrow-1-s, .cnqr-app-header #cnqr-navbar-secondary .dropdown:hover > .dropdown-menu > li a .icon-arrow-1-s, .cnqr-app-header #cnqr-navbar-tertiary .dropdown:hover > .dropdown-menu > li a .icon-arrow-1-s, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover > .dropdown-menu > li a .icon-arrow-1-s, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover > .dropdown-menu > li a .icon-arrow-1-s, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover > .dropdown-menu > li a .icon-arrow-1-s, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover-tour > .dropdown-menu > li a .icon-arrow-1-s, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover-tour > .dropdown-menu > li a .icon-arrow-1-s, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover-tour > .dropdown-menu > li a .icon-arrow-1-s { margin-right: -18px; margin-top: 2px; } .cnqr-app-header #cnqr-navbar-primary .dropdown:hover > .dropdown-menu > li .dropdown-menu, .cnqr-app-header #cnqr-navbar-secondary .dropdown:hover > .dropdown-menu > li .dropdown-menu, .cnqr-app-header #cnqr-navbar-tertiary .dropdown:hover > .dropdown-menu > li .dropdown-menu, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover > .dropdown-menu > li .dropdown-menu, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover > .dropdown-menu > li .dropdown-menu, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover > .dropdown-menu > li .dropdown-menu, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover-tour > .dropdown-menu > li .dropdown-menu, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover-tour > .dropdown-menu > li .dropdown-menu, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover-tour > .dropdown-menu > li .dropdown-menu { margin-left: 150px; margin-top: -20px; } .cnqr-app-header #cnqr-navbar-primary .dropdown:hover > .dropdown-menu > li .dropdown-menu.pull-right, .cnqr-app-header #cnqr-navbar-secondary .dropdown:hover > .dropdown-menu > li .dropdown-menu.pull-right, .cnqr-app-header #cnqr-navbar-tertiary .dropdown:hover > .dropdown-menu > li .dropdown-menu.pull-right, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover > .dropdown-menu > li .dropdown-menu.pull-right, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover > .dropdown-menu > li .dropdown-menu.pull-right, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover > .dropdown-menu > li .dropdown-menu.pull-right, .cnqr-app-header #cnqr-navbar-primary .dropdown.hover-tour > .dropdown-menu > li .dropdown-menu.pull-right, .cnqr-app-header #cnqr-navbar-secondary .dropdown.hover-tour > .dropdown-menu > li .dropdown-menu.pull-right, .cnqr-app-header #cnqr-navbar-tertiary .dropdown.hover-tour > .dropdown-menu > li .dropdown-menu.pull-right { margin-left: -150px; right: auto; } .cnqr-app-header #cnqr-navbar-primary .screen-reader-only-focusable, .cnqr-app-header #cnqr-navbar-secondary .screen-reader-only-focusable, .cnqr-app-header #cnqr-navbar-tertiary .screen-reader-only-focusable { background-color: transparent; color: #ffffff; } .cnqr-app-header #cnqr-navbar-primary .icon-menu, .cnqr-app-header #cnqr-navbar-secondary .icon-menu, .cnqr-app-header #cnqr-navbar-tertiary .icon-menu { font-size: 21px; float: left; } .cnqr-app-header #cnqr-navbar-primary { border: 0; background-color: #383f46; width: 100%; height: 70px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer { height: 70px; padding: 2px 16px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-left { width: 100%; } @media (max-width: 480px) { .cnqr-app-header #cnqr-navbar-primary .navbar-outer { padding: 2px 0; } } .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul { margin: 0; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li { color: #ffffff; display: inline-block; float: left; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li .cnqr-pipe:after { padding: 1px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li:hover > a, .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li.hover > a, .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li.hover-tour > a, .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li:focus > a { background-color: #1e69a6; background-image: -webkit-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: -moz-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: -ms-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: -o-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: linear-gradient(to bottom, #209cff 0, #1e69a6 100%); } .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li > a { color: #ffffff; padding: 24px 17.6px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li > a:hover, .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li > a:focus { background-color: #1e69a6; background-image: -webkit-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: -moz-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: -ms-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: -o-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: linear-gradient(to bottom, #209cff 0, #1e69a6 100%); } .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li.cnqr-nav-dashboard a { padding: 20.8px 16px; border-right: 1px solid #72777b; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li.cnqr-nav-logo { padding: 20.8px 16px; border-right: 1px solid #72777b; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li i.icon-logotype { font-size: 21.6px; line-height: 24px; display: block; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer > ul > li.active > a { background-color: #1e69a6; background-image: -webkit-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: -moz-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: -ms-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: -o-linear-gradient(top, #209cff 0, #1e69a6 100%); background-image: linear-gradient(to bottom, #209cff 0, #1e69a6 100%); } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right { margin-top: -70px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul:first-child { background-image: -webkit-linear-gradient(left, #383f46 0%, #333333 100%); background-image: -o-linear-gradient(left, #383f46 0%, #333333 100%); background-image: linear-gradient(to right, #383f46 0%, #333333 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff383f46', endColorstr='#ff333333', GradientType=1); padding-left: 40px; margin-right: -16px; padding-right: 16px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul > li { float: left; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul > li > a, .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul > li > span { padding: 1px 8px 2px; margin-bottom: 1px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul > li.cnqr-nav-askaquestion > a, .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul > li.cnqr-nav-breezesubscribe > a { background-color: #3a7827; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul > li.cnqr-nav-askaquestion > a:hover, .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul > li.cnqr-nav-breezesubscribe > a:hover, .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul > li.cnqr-nav-askaquestion > a:focus, .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul > li.cnqr-nav-breezesubscribe > a:focus { background-color: #46912f; background-image: none; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul > li.cnqr-nav-help > a { padding-right: 2px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link { margin-top: 2px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link:before, .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link:after { content: " "; display: table; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link:after { clear: both; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link:before, .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link:after { content: " "; display: table; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link:after { clear: both; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link li a { display: table; padding-right: 0; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link li a:hover i.cnqr-avatar-icon, .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link li a:focus i.cnqr-avatar-icon { background-color: transparent; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link li a > span:first-child { display: table-cell; line-height: 14px; vertical-align: middle; padding-right: 8px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link li a i.caret { ; margin-top: 0; margin-right: 8px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link li a img.cnqr-profile-img-avatar { background-color: transparent; height: 40px; padding-right: 2px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link.cnqr-admin-for li.active a { background-color: #46912f; background-image: -webkit-linear-gradient(top, #3a7827 0, #46912f 100%); background-image: -moz-linear-gradient(top, #3a7827 0, #46912f 100%); background-image: -ms-linear-gradient(top, #3a7827 0, #46912f 100%); background-image: -o-linear-gradient(top, #3a7827 0, #46912f 100%); background-image: linear-gradient(to bottom, #3a7827 0, #46912f 100%); } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link.cnqr-admin-for li:hover > a { background-color: #46912f; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link.cnqr-admin-for li a { background-color: #3a7827; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link.cnqr-admin-for li a > i.icon-user-admin { color: #c84f2e; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link.cnqr-admin-for li a span:first-child { font-size: 11.7px; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link.cnqr-admin-for li a > i.icon-unpause { font-size: 34px; line-height: 40px; padding: 2px 4px 4px 10px; display: inline-block; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link.cnqr-admin-for li a .icon-unpause:before { content: "\e051"; } .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link.cnqr-admin-for li a:hover .icon-unpause:before, .cnqr-app-header #cnqr-navbar-primary .navbar-outer.pull-right > ul.cnqr-profile-link.cnqr-admin-for li a:focus .icon-unpause:before { content: "\e04e"; } .cnqr-app-header #cnqr-navbar-secondary { height: 42px; min-height: 0; padding: 0; border: 0; background-color: #ffffff; border-bottom: 1px solid #c0c2c4; } .cnqr-app-header #cnqr-navbar-secondary.cnqr-toolbar-more { overflow-x: hidden; } .cnqr-app-header #cnqr-navbar-secondary.cnqr-toolbar-more > ul { white-space: nowrap; margin: 0; } .cnqr-app-header #cnqr-navbar-secondary.cnqr-toolbar-more > ul > li { display: inline-block; float: none; } .cnqr-app-header #cnqr-navbar-secondary > ul { padding: 0 16px; } @media (max-width: 480px) { .cnqr-app-header #cnqr-navbar-secondary > ul { padding: 0 0; } } .cnqr-app-header #cnqr-navbar-secondary > ul > li.active > a { background-color: transparent; } .cnqr-app-header #cnqr-navbar-secondary > ul > li.active > a:before { content: ""; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #ffffff; display: inline-block; height: 0; margin-left: -10px; vertical-align: middle; width: 0; ; bottom: 0; left: 50%; z-index: 101; } .cnqr-app-header #cnqr-navbar-secondary > ul > li.active > a:after { content: ""; border-left: 12px solid transparent; border-right: 12px solid transparent; border-bottom: 12px solid #c0c2c4; display: inline-block; height: 0; margin-right: -12px; vertical-align: middle; width: 0; ; bottom: 0; right: 50%; z-index: 100; } .cnqr-app-header #cnqr-navbar-secondary > ul > li:hover > a, .cnqr-app-header #cnqr-navbar-secondary > ul > li:focus > a, .cnqr-app-header #cnqr-navbar-secondary > ul > li.hover > a { color: #333333; background-color: #999ca0; } .cnqr-app-header #cnqr-navbar-secondary > ul > li.active:hover > a { color: #333333; background-color: transparent; } .cnqr-app-header #cnqr-navbar-secondary > ul > li > a { padding-top: 12px; padding-bottom: 12px; } .cnqr-app-header #cnqr-navbar-secondary > ul > li > a:hover, .cnqr-app-header #cnqr-navbar-secondary > ul > li > a:focus { color: #ffffff; background-color: #999ca0; } .cnqr-app-header #cnqr-navbar-secondary > ul > li > ul.dropdown-menu { margin-top: -2px; } .cnqr-app-header #cnqr-navbar-tertiary { min-height: 0; padding: 0 14px; border-width: 0 0 1px 0; border-bottom: 1px solid #c0c2c4; } .cnqr-app-header #cnqr-navbar-tertiary li a { background-color: transparent; cursor: pointer; } .cnqr-app-header .logotype-sapconcur { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .cnqr-app-header .logotype-sapconcur:before { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; font-style: normal; content: "\e002"; font-size: 21.6px; line-height: 24px; display: block; } .ui-dialog .ui-dialog-content.cnqr-profile-popup, .otpopupdiv .cnqr-profile-popup { padding: 16px 0 16px 0; margin: 0; display: block; } .cnqr-profile-popup { width: 400px; display: none; padding: 16px 0 16px 0; background-color: #ffffff; } .cnqr-profile-popup .cnqr-static { background: white url('/static/images/sprite-profile-20150720.png') no-repeat 266px -28px; } .cnqr-profile-popup .cnqr-dynamic, .cnqr-profile-popup .autocomplete.cnqr-dynamic { background: white url('/static/images/sprite-profile-20150720.png') no-repeat 242px -6px; } .cnqr-profile-popup .cnqr-nonvisible { visibility: hidden; } .cnqr-profile-popup .icon-messaging-help { color: #1e69a6; font-size: 16px; } .cnqr-profile-popup .cnqr-avatarred-div { width: 100%; display: inline-block; padding-left: 16px; } .cnqr-profile-popup .cnqr-avatarred-div.cnqr-profile-popup-choose .cnqr-inner { padding-top: 16px; } .cnqr-profile-popup .cnqr-avatarred-div .lead { margin-bottom: 8px; } .cnqr-profile-popup .cnqr-avatarred-div .cnqr-avatar-icon { font-size: 24px; padding-top: 4px; padding-right: 8px; color: #c0c2c4; background-color: #ffffff; } .cnqr-profile-popup .cnqr-avatarred-div .cnqr-avatar-icon.icon-acting { color: #1e69a6; background-color: transparent; } .cnqr-profile-popup .cnqr-avatarred-div .cnqr-avatar-icon.icon-admin-for { color: #c84f2e; } .cnqr-profile-popup .cnqr-avatarred-div .cnqr-inner { width: 300px; } .cnqr-profile-popup .cnqr-avatarred-div input.form-control { margin-top: 16px; width: 100%; height: 28px; } .cnqr-profile-popup .cnqr-avatarred-div input.form-control.autocomplete_processing { background: transparent url("/static/images/legacy/processing_small.gif") no-repeat right 4px; } .cnqr-profile-popup .cnqr-avatarred-div input.form-control.ui-autocomplete-loading { background: transparent url("/static/images/legacy/processing_small.gif") no-repeat right 4px; } .cnqr-profile-popup .cnqr-avatarred-div-outer { min-height: 60px; background-color: #ffffff; border-top: 1px solid #e2e3e3; border-bottom: 1px solid #e2e3e3; margin-top: 16px; padding-bottom: 8px; padding-top: 5.33333333px; } .cnqr-profile-popup .cnqr-avatarred-div-outer.cnqr-loading-placeholder { background: transparent url("/static/images/legacy/processing_small.gif") no-repeat center center !important; border: 0; } .cnqr-profile-popup .cnqr-avatarred-div-outer .cnqr-inner { padding-top: 8px; padding-bottom: 8px; } .cnqr-profile-popup .cnqr-pipe:after { padding-right: 3px; } .cnqr-profile-popup .cnqr-end-session-tb { margin-top: 16px; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-toggle, .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-secondary .navbar-toggle, .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-tertiary .navbar-toggle { display: none; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary { margin-left: auto; margin-right: auto; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-header { display: none; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .pull-right > ul:first-child { margin-right: 0; padding-right: 0; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-ex1-collapse.collapse { display: block; padding: 0 16px; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-ex1-collapse.collapse .nav { float: left; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-ex1-collapse.collapse .nav > li { float: left; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-ex1-collapse.collapse .nav > li a { font-weight: normal; margin: 0; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-ex1-collapse.collapse .nav > li a.dropdown-toggle i { display: none; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-ex1-collapse.collapse .nav.navbar-right { float: right; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-ex1-collapse.collapse .nav.navbar-right > li { float: right; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-ex1-collapse.collapse .nav.navbar-right > li .dropdown-menu > li > a { padding: 3px 11px; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-ex1-collapse.collapse .nav.navbar-right .cnqr-profile a.avatar { margin: 0 5px 0 0; border: 0; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary .navbar-ex1-collapse.collapse .nav.navbar-right .cnqr-profile .cnqr-logout { margin: 0; border: 0; } @media (min-width: 768px) { .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary { width: 980px; } } @media (min-width: 992px) { .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary { width: 980px; } } @media (min-width: 1200px) { .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-primary { width: 1200px; } } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-secondary .nav { margin: 0; float: none; margin-left: auto; margin-right: auto; } .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-secondary .nav > li { float: left; } @media (min-width: 768px) { .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-secondary .nav { width: 980px; } } @media (min-width: 992px) { .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-secondary .nav { width: 980px; } } @media (min-width: 1200px) { .cnqr-grid-wide .cnqr-app-header #cnqr-navbar-secondary .nav { width: 1200px; } } .cnqr-profilepopup-retrieving-lbl { margin: 4px; } .cnqr-theme-12 .cnqr-app-header .logotype-sapconcur:before { content: "\e000"; } .cnqr-app-footer { background-color: #383f46; color: #ffffff; padding: 16px; } .cnqr-app-footer A { color: #e2e3e3; text-decoration: underline; } .cnqr-app-footer A:hover, .cnqr-app-footer A:focus { color: #ffffff; text-decoration: underline; } .cnqr-app-footer P { color: #e2e3e3; } .cnqr-app-footer .IPMBanner { display: none; } .cnqr-app-footer .icon-logotype { font-size: 42px; color: #ffffff; } .cnqr-app-footer .logotype-sapconcur { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .cnqr-app-footer .logotype-sapconcur:before { content: "\e002"; font-size: 42px; font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; font-style: normal; display: block; } .cnqr-grid-wide { background-color: #ffffff; } @media (min-width: 768px) { .cnqr-grid-wide .cnqr-app-footer .row { width: 980px; } } @media (min-width: 992px) { .cnqr-grid-wide .cnqr-app-footer .row { width: 980px; } } @media (min-width: 1200px) { .cnqr-grid-wide .cnqr-app-footer .row { width: 1200px; } } @media (min-width: 992px) { .cnqr-theme-12 .cnqr-app-footer .container-sapconcur { left: 50%; } } @media (max-width: 992px) { .cnqr-theme-12 .cnqr-app-footer .container-sapconcur { float: right; width: auto; } } .cnqr-theme-12 .cnqr-app-footer .container-sapconcur img { float: right; } .cnqr-theme-12 .cnqr-app-footer .container-sapconcur .logotype-sapconcur { float: right; background: transparent url("/static/images/brand/logo-SAPConcur-white-20171204.svg") no-repeat; display: inline-block; height: 42px; width: 235px; } .cnqr-theme-12 .cnqr-app-footer .container-sapconcur .logotype-sapconcur:before { display: none; } @media (min-width: 992px) { .cnqr-theme-12 .cnqr-app-footer .container-sap { right: 50%; } } @media (max-width: 992px) { .cnqr-theme-12 .cnqr-app-footer .container-sap { float: left; width: auto; } } .cnqr-theme-12 .cnqr-app-footer .container-sap .logomark-sap { background: transparent url("/static/images/brand/logo-SAP-20171204.svg") no-repeat; display: inline-block; height: 60px; width: 121px; } .nav-tabs.nav-tabs-icon > li > a, .nav-tabs.nav-tabs-icon > li button { font-size: 14px; padding-top: 16px; padding-bottom: 16px; } .nav-tabs.nav-tabs-icon > li > a i, .nav-tabs.nav-tabs-icon > li button i { display: block; font-size: 24px; margin-bottom: 4px; } .tab-content > .tab-pane { flex-direction: column; } .tab-content > .tab-pane > .tab-pane-body { flex: 1 1 auto; padding-bottom: 16px; } .tab-content > .tab-pane > .tab-pane-footer { flex: 0 1 auto; text-align: right; padding-top: 16px; } .tab-content > .tab-pane > .tab-pane-footer .btn + .btn { margin-left: 5px; margin-bottom: 0; } .tab-content > .tab-pane > .tab-pane-footer .btn-group .btn + .btn { margin-left: -1px; } .tab-content > .tab-pane > .tab-pane-footer .btn-block + .btn-block { margin-left: 0; } .tab-content > .tab-pane > .tab-pane-body-overflowed + .tab-pane-footer { border-top: 1px solid #c0c2c4; } .cnqr-tiles { width: 100%; margin: 0; list-style-type: none; padding: 0; overflow: auto; border: 0; background-color: transparent; } .cnqr-tiles > li { float: left; } .cnqr-tiles > li a { color: #333333; text-decoration: none; } .cnqr-tiles > li a:hover, .cnqr-tiles > li a:active { color: #2379bf; } .cnqr-tiles > li .cnqr-inner { padding: 15px; } .cnqr-tiles.data-input { overflow: visible; } .cnqr-tiles.data-input:before, .cnqr-tiles.data-input:after { content: " "; display: table; } .cnqr-tiles.data-input:after { clear: both; } .cnqr-tiles.data-input:before, .cnqr-tiles.data-input:after { content: " "; display: table; } .cnqr-tiles.data-input:after { clear: both; } .cnqr-tiles.data-input > li { width: 100%; overflow: visible; min-height: 56px; padding-right: 8px; padding-left: 8px; padding-bottom: 16px; margin: 0; } .cnqr-tiles.data-input > li.cnqr-nonfieldgroup { opacity: 0.95; filter: alpha(opacity=95); } .cnqr-tiles.data-input > li > .cnqr-label-container { padding-top: 3px; margin-bottom: -1px; overflow: hidden; height: 25px; } .cnqr-tiles.data-input > li > .cnqr-label-container > label { line-height: 1.5; white-space: nowrap; padding-right: 10px; margin-right: -10px; width: 100%; overflow: hidden; height: 20px; float: left; } .cnqr-tiles.data-input > li > .cnqr-label-container > label.cnqr-label-truncated { width: 100%; } .cnqr-tiles.data-input > li > .cnqr-label-container > label.cnqr-label-fit { width: auto; } .cnqr-tiles.data-input > li .input-group { clear: left; } .cnqr-tiles.data-input > li.first-column { padding-left: 0; clear: left; } .cnqr-tiles.data-input > li.last-column { padding-right: 0; } .cnqr-tiles.data-input > li.cnqr-amtfield { width: 50%; } .cnqr-tiles.data-input > li.check .cnqr-inner { padding-left: 0; padding-bottom: 0; } .cnqr-tiles.data-input > li.check .cnqr-inner label { display: inline; } .cnqr-tiles.data-input > li.check .cnqr-inner input[type="checkbox"] { margin-top: 0; } .cnqr-tiles.data-input > li input, .cnqr-tiles.data-input > li select { width: 100%; } .cnqr-tiles.data-input > li.textarea { width: 100%; } .cnqr-tiles.data-input > li.textarea textarea { width: 100%; resize: vertical; } .cnqr-tiles.data-input > li.divider { border-top: 1px solid #999ca0; margin-top: 8px; width: 100% !important; min-height: 10px; } .cnqr-tiles.data-input.cnqr-col2 > li { width: 50%; } .cnqr-tiles.data-input.cnqr-col2 > li.cnqr-amtfield { width: 25%; } .cnqr-tiles.data-input.cnqr-col2 > li.textarea { padding-left: 0; width: 100%; } .cnqr-tiles.data-input.cnqr-col2 > li.check { padding-top: 0; height: 56px; } .cnqr-tiles.data-input.cnqr-col4 > li { width: 25%; } .cnqr-tiles.data-input.cnqr-col4 > li.cnqr-amtfield { width: 25%; } .cnqr-tiles.data-input.cnqr-col4 > li.textarea { width: 50%; } .cnqr-tiles.data-input.cnqr-col4 > li.check { padding-top: 4px; } @media screen and (max-width: 767px) { .cnqr-tiles.data-input > li { margin-right: 0; width: 100%; } .cnqr-tiles.data-input > li:before, .cnqr-tiles.data-input > li:after { content: " "; display: table; } .cnqr-tiles.data-input > li:after { clear: both; } .cnqr-tiles.data-input > li:before, .cnqr-tiles.data-input > li:after { content: " "; display: table; } .cnqr-tiles.data-input > li:after { clear: both; } .cnqr-tiles.data-input > li input, .cnqr-tiles.data-input > li .input-group input { width: 100%; } .cnqr-tiles.data-input > li.textarea { width: 100%; } .cnqr-tiles.data-input > li.textarea textarea { width: 100%; } .cnqr-tiles.data-input > li.divider { width: 100%; } } .list-inline { padding-left: 0; list-style: none; margin-left: -5px; } .list-inline > li { display: inline-block; padding-left: 5px; padding-right: 5px; } ul.list-flush-left { display: table; margin-left: 0; padding-left: 0; list-style: none; } ul.list-flush-left > li { display: table-row; } ul.list-flush-left > li:before { content: "\2022"; display: table-cell; padding-right: 0.6em; } .cnqr-separated { letter-spacing: -1em; } .list-inline.cnqr-separated > li { letter-spacing: normal; padding-right: 1em; } .list-inline.cnqr-separated > li:nth-child( n+2 ) { padding-left: 0; } .list-inline.cnqr-separated > li:after { content: '|'; padding-left: 1em; color: #e2e3e3; margin: 0 8px; } .list-inline.cnqr-separated > li:last-child:after { content: ''; padding-left: 0; } .list-inline.cnqr-separated.cnqr-condensed > li { padding-right: 0.5em; } .list-inline.cnqr-separated.cnqr-condensed > li:after { padding-left: 0.5em; } input[type="checkbox"].form-control { ; left: -999em; } input[type="checkbox"].form-control ~ label { margin: 0 -4px 0 0; } input[type="checkbox"].form-control ~ label:before { content: "\2001"; height: 16px; width: 16px; padding: 0; line-height: 16px; font-size: 11px; text-align: center; border: 1px solid #999ca0; background-color: #ffffff; border-radius: 3px; display: inline-block; margin: 0 4px 0 0; } input[type="checkbox"].form-control:checked ~ label:before { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; content: "\e008"; color: #72777b; } input[type="checkbox"].form-control:checked ~ label:hover:before, input[type="checkbox"].form-control ~ label:hover:before { background-color: #c0c2c4; } input[type="checkbox"].form-control:focus ~ label:before { border-color: #66afe9; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); } input[type="checkbox"].form-control.cnqr-checked ~ label:before { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; content: "\e008"; color: #72777b; } input[type="checkbox"].form-control.cnqr-checked ~ label:hover:before { background-color: #c0c2c4; } input[type="radio"].form-control { ; left: -999em; } input[type="radio"].form-control + label { margin: 0 -4px 0 0; } input[type="radio"].form-control + label:before { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; content: "\e006"; height: 13px; width: 13px; padding: 0; line-height: 13px; text-align: center; font-size: 13px; display: inline-block; margin: 0 4px 0 0; } input[type="radio"].form-control:checked + label:before { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; content: "\e007"; color: #72777b; } input[type="radio"].form-control:checked + label:hover:before, input[type="radio"].form-control + label:hover:before { color: #000000; } input[type="radio"].form-control:checked + label:active:before, input[type="radio"].form-control + label:active:before { color: #e2e3e3; } input[type="radio"].form-control.cnqr-checked + label:before { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; content: "\e007"; color: #72777b; } input[type="radio"].form-control.cnqr-checked + label:hover:before { color: #000000; } input[type="radio"].form-control.cnqr-checked + label:active:before { color: #e2e3e3; } textarea.cnqr-resize-both { resize: both; } textarea.cnqr-resize-horizontal { resize: horizontal; } textarea.cnqr-resize-none { resize: none; } textarea.cnqr-resize-vertical { resize: vertical; } .btn-file { ; overflow: hidden; vertical-align: bottom; } .btn-file input[type=file] { ; top: 0; right: 0; min-width: 100%; min-height: 100%; text-align: right; filter: alpha(opacity=0); opacity: 0; outline: 0; background: #ffffff; cursor: inherit; display: block; } .cnqr-validation-label-error:before { content: "\e031"; color: #ffffff; background-color: #ca202c; border-radius: 50%; font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; margin-right: 5px; } .cnqr-validation-label-warning:before { content: url("/static/images/state-warning-11-20170227.png"); margin-right: 5px; vertical-align: middle; } .checkbox-inline.cnqr-required, .checkbox.cnqr-required label { display: inline-block; padding-right: 16px; } .checkbox-inline.cnqr-required:after, .checkbox.cnqr-required label:after { content: '*'; overflow: hidden; display: inline-block; color: #ca202c; margin: 0 -19px 0 3px; font-size: 16.5px; line-height: 1; width: 16px; height: 11px; } .form-group label, .form-group .control-label, .control-label { font-size: 11px; line-height: 14px; margin-bottom: 5px; ; } .form-group label.cnqr-required, .form-group .control-label.cnqr-required, .control-label.cnqr-required { display: inline-block; padding-right: 16px; } .form-group label.cnqr-required:after, .form-group .control-label.cnqr-required:after, .control-label.cnqr-required:after { content: '*'; overflow: hidden; display: inline-block; color: #ca202c; margin: 0 -19px 0 3px; font-size: 16.5px; line-height: 1; width: 16px; height: 11px; } .form-group-lg label, .form-group-lg .control-label, .control-label-lg { font-size: 13px; line-height: 18px; margin-bottom: 4px; } .form-group-lg label.cnqr-required:after, .form-group-lg .control-label.cnqr-required:after, .control-label-lg.cnqr-required:after { font-size: 19.5px; height: 13px; } .form-group-lg label.cnqr-validation-label-warning:before, .form-group-lg .control-label.cnqr-validation-label-warning:before, .control-label-lg.cnqr-validation-label-warning:before { content: url("/static/images/state-warning-13-20170227.png"); } .form-group-sm label, .form-group-sm .control-label, .control-label-sm { font-size: 10px; line-height: 12px; margin-bottom: 5px; } .form-group-sm label.cnqr-required:after, .form-group-sm .control-label.cnqr-required:after, .control-label-sm.cnqr-required:after { font-size: 15px; height: 10px; } .form-group-sm label.cnqr-validation-label-warning:before, .form-group-sm .control-label.cnqr-validation-label-warning:before, .control-label-sm.cnqr-validation-label-warning:before { content: url("/static/images/state-warning-10-20170227.png"); } .form-group-lg select.form-control.form-control-multi-select, .form-group-sm select.form-control.form-control-multi-select { height: auto; } .form-group i.control-label, .checkbox i.control-label, .checkbox-inline i.control-label { margin-right: 5px; } .radio .cnqr-tooltip-validation-wrapper + input[type="radio"], .radio-inline .cnqr-tooltip-validation-wrapper + input[type="radio"], .checkbox .cnqr-tooltip-validation-wrapper + input[type="checkbox"], .checkbox-inline .cnqr-tooltip-validation-wrapper + input[type="checkbox"] { margin-left: -38px; } .cnqr-nui-radio-group .control-label { display: block; margin-bottom: 10px; } .cnqr-nui-radio-group .control-label.cnqr-required { display: block; } /* Bootstrap Modal Overrides for TAVS pages */ .tavs.modal-full-screen .modal-backdrop { z-index: -1; } .tavs.modal.modal-full-screen { z-index: 1035; } .tooltip.cnqr-tooltip .tooltip-arrow { width: 0; height: 0; border: 8px solid transparent; ; margin: 8px; } .tooltip.cnqr-tooltip[data-placement^="top"] { margin-bottom: 8px; } .tooltip.cnqr-tooltip[data-placement^="top"] .tooltip-arrow { border-bottom-width: 0; border-top-color: #383f46; bottom: -8px; margin-top: 0; margin-bottom: 0; } .tooltip.cnqr-tooltip[data-placement^="bottom"] { margin-top: 8px; } .tooltip.cnqr-tooltip[data-placement^="bottom"] .tooltip-arrow { border-top-width: 0; border-bottom-color: #383f46; top: -8px; margin-top: 0; margin-bottom: 0; } .tooltip.cnqr-tooltip[data-placement^="right"] { margin-left: 8px; } .tooltip.cnqr-tooltip[data-placement^="right"] .tooltip-arrow { border-left-width: 0; border-right-color: #383f46; left: -8px; margin-left: 0; margin-right: 0; } .tooltip.cnqr-tooltip[data-placement^="left"] { margin-right: 8px; } .tooltip.cnqr-tooltip[data-placement^="left"] .tooltip-arrow { border-right-width: 0; border-left-color: #383f46; right: -8px; margin-left: 0; margin-right: 0; } .tooltip.cnqr-tooltip-validation { padding: 8px 0; white-space: pre; /* CSS 2.0 */ white-space: pre-wrap; /* CSS 2.1 */ white-space: pre-line; /* CSS 3.0 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ white-space: -moz-pre-wrap; /* Mozilla */ white-space: -hp-pre-wrap; /* HP Printers */ word-wrap: break-word; /* IE 5+ */ } .tooltip.cnqr-tooltip-validation .tooltip-arrow { bottom: 1px; left: -2.5px; border-width: 8px 8px 0; } .tooltip.cnqr-tooltip-validation .tooltip-arrow:after { ; display: block; width: 0; height: 0; border-color: transparent; border-style: solid; border-width: 10px; content: ' '; bottom: 1px; border-bottom-width: 0; left: -10px; } .tooltip.cnqr-tooltip-validation .tooltip-inner { margin-left: -10.5px; border-radius: 4px; box-shadow: 0 5px 18px rgba(0, 0, 0, 0.2); } .tooltip.cnqr-tooltip-validation.cnqr-tooltip-validation-icon-lg .tooltip-arrow { left: -1.5px; } .tooltip.cnqr-tooltip-validation.cnqr-tooltip-validation-icon-lg .tooltip-inner { margin-left: -9.5px; } .tooltip.cnqr-tooltip-validation.cnqr-tooltip-validation-icon-sm .tooltip-arrow { left: -3px; } .tooltip.cnqr-tooltip-validation.cnqr-tooltip-validation-icon-sm .tooltip-inner { margin-left: -11px; } .tooltip.cnqr-tooltip-validation.cnqr-tooltip-validation-error .tooltip-arrow { border-top-color: #e48f95; } .tooltip.cnqr-tooltip-validation.cnqr-tooltip-validation-error .tooltip-arrow:after { border-top-color: #f6e2e2; } .tooltip.cnqr-tooltip-validation.cnqr-tooltip-validation-error .tooltip-inner { background-color: #f6e2e2; color: #ca202c; border: 1px solid #e48f95; } .tooltip.cnqr-tooltip-validation.cnqr-tooltip-validation-warning .tooltip-arrow { border-top-color: #ceb27f; } .tooltip.cnqr-tooltip-validation.cnqr-tooltip-validation-warning .tooltip-arrow:after { border-top-color: #fcf8e3; } .tooltip.cnqr-tooltip-validation.cnqr-tooltip-validation-warning .tooltip-inner { background-color: #fcf8e3; color: #9e6600; border: 1px solid #ceb27f; } .cnqr-tooltip-validation-wrapper { float: left; ; display: inline-block; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html { font-size: 10px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } body { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; font-size: 13px; line-height: 1.42857143; color: #333333; background-color: #ffffff; } input, button, select, textarea { font-family: inherit; font-size: inherit; line-height: inherit; } a { color: #1e69a6; text-decoration: none; } a:hover, a:focus { color: #2379bf; text-decoration: underline; } a:focus { outline: 1px dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } a[role=button], a[role=link] { cursor: pointer; } figure { margin: 0; } img { vertical-align: middle; } .img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img { display: block; max-width: 100%; height: auto; } .img-rounded { border-radius: 6px; } .img-thumbnail { padding: 4px; line-height: 1.42857143; background-color: #c0c2c4; border: 1px solid #c0c2c4; border-radius: 4px; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; display: inline-block; max-width: 100%; height: auto; } .img-circle { border-radius: 50%; } hr { margin-top: 18px; margin-bottom: 18px; border: 0; border-top: 1px solid #e2e3e3; } @media (min-width: 480px) { .container { overflow-x: hidden; } } @media (max-width: 992px) { .cnqr-grid-responsive-partial .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { float: left; } .cnqr-grid-responsive-partial .col-md-12 { width: 100%; } .cnqr-grid-responsive-partial .col-md-11 { width: 91.66666667%; } .cnqr-grid-responsive-partial .col-md-10 { width: 83.33333333%; } .cnqr-grid-responsive-partial .col-md-9 { width: 75%; } .cnqr-grid-responsive-partial .col-md-8 { width: 66.66666667%; } .cnqr-grid-responsive-partial .col-md-7 { width: 58.33333333%; } .cnqr-grid-responsive-partial .col-md-6 { width: 50%; } .cnqr-grid-responsive-partial .col-md-5 { width: 41.66666667%; } .cnqr-grid-responsive-partial .col-md-4 { width: 33.33333333%; } .cnqr-grid-responsive-partial .col-md-3 { width: 25%; } .cnqr-grid-responsive-partial .col-md-2 { width: 16.66666667%; } .cnqr-grid-responsive-partial .col-md-1 { width: 8.33333333%; } .cnqr-grid-responsive-partial .col-md-pull-12 { right: 100%; } .cnqr-grid-responsive-partial .col-md-pull-11 { right: 91.66666667%; } .cnqr-grid-responsive-partial .col-md-pull-10 { right: 83.33333333%; } .cnqr-grid-responsive-partial .col-md-pull-9 { right: 75%; } .cnqr-grid-responsive-partial .col-md-pull-8 { right: 66.66666667%; } .cnqr-grid-responsive-partial .col-md-pull-7 { right: 58.33333333%; } .cnqr-grid-responsive-partial .col-md-pull-6 { right: 50%; } .cnqr-grid-responsive-partial .col-md-pull-5 { right: 41.66666667%; } .cnqr-grid-responsive-partial .col-md-pull-4 { right: 33.33333333%; } .cnqr-grid-responsive-partial .col-md-pull-3 { right: 25%; } .cnqr-grid-responsive-partial .col-md-pull-2 { right: 16.66666667%; } .cnqr-grid-responsive-partial .col-md-pull-1 { right: 8.33333333%; } .cnqr-grid-responsive-partial .col-md-pull-0 { right: auto; } .cnqr-grid-responsive-partial .col-md-push-12 { left: 100%; } .cnqr-grid-responsive-partial .col-md-push-11 { left: 91.66666667%; } .cnqr-grid-responsive-partial .col-md-push-10 { left: 83.33333333%; } .cnqr-grid-responsive-partial .col-md-push-9 { left: 75%; } .cnqr-grid-responsive-partial .col-md-push-8 { left: 66.66666667%; } .cnqr-grid-responsive-partial .col-md-push-7 { left: 58.33333333%; } .cnqr-grid-responsive-partial .col-md-push-6 { left: 50%; } .cnqr-grid-responsive-partial .col-md-push-5 { left: 41.66666667%; } .cnqr-grid-responsive-partial .col-md-push-4 { left: 33.33333333%; } .cnqr-grid-responsive-partial .col-md-push-3 { left: 25%; } .cnqr-grid-responsive-partial .col-md-push-2 { left: 16.66666667%; } .cnqr-grid-responsive-partial .col-md-push-1 { left: 8.33333333%; } .cnqr-grid-responsive-partial .col-md-push-0 { left: auto; } .cnqr-grid-responsive-partial .col-md-offset-12 { margin-left: 100%; } .cnqr-grid-responsive-partial .col-md-offset-11 { margin-left: 91.66666667%; } .cnqr-grid-responsive-partial .col-md-offset-10 { margin-left: 83.33333333%; } .cnqr-grid-responsive-partial .col-md-offset-9 { margin-left: 75%; } .cnqr-grid-responsive-partial .col-md-offset-8 { margin-left: 66.66666667%; } .cnqr-grid-responsive-partial .col-md-offset-7 { margin-left: 58.33333333%; } .cnqr-grid-responsive-partial .col-md-offset-6 { margin-left: 50%; } .cnqr-grid-responsive-partial .col-md-offset-5 { margin-left: 41.66666667%; } .cnqr-grid-responsive-partial .col-md-offset-4 { margin-left: 33.33333333%; } .cnqr-grid-responsive-partial .col-md-offset-3 { margin-left: 25%; } .cnqr-grid-responsive-partial .col-md-offset-2 { margin-left: 16.66666667%; } .cnqr-grid-responsive-partial .col-md-offset-1 { margin-left: 8.33333333%; } .cnqr-grid-responsive-partial .col-md-offset-0 { margin-left: 0%; } } @media (max-width: 992px) { .cnqr-grid-responsive-partial { overflow-x: visible; } .cnqr-grid-responsive-partial .container { width: 980px; } .cnqr-grid-responsive-partial .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { float: left; } .cnqr-grid-responsive-partial .col-12-1, .col-12-2, .col-12-3, .col-12-4, .col-12-5, .col-12-6, .col-12-7, .col-12-8, .col-12-9, .col-12-10, .col-12-11, .col-12-12 { float: left; } .cnqr-grid-responsive-partial .col-12-12 { width: 100%; } .cnqr-grid-responsive-partial .col-12-11 { width: 91.66666667%; } .cnqr-grid-responsive-partial .col-12-10 { width: 83.33333333%; } .cnqr-grid-responsive-partial .col-12-9 { width: 75%; } .cnqr-grid-responsive-partial .col-12-8 { width: 66.66666667%; } .cnqr-grid-responsive-partial .col-12-7 { width: 58.33333333%; } .cnqr-grid-responsive-partial .col-12-6 { width: 50%; } .cnqr-grid-responsive-partial .col-12-5 { width: 41.66666667%; } .cnqr-grid-responsive-partial .col-12-4 { width: 33.33333333%; } .cnqr-grid-responsive-partial .col-12-3 { width: 25%; } .cnqr-grid-responsive-partial .col-12-2 { width: 16.66666667%; } .cnqr-grid-responsive-partial .col-12-1 { width: 8.33333333%; } .cnqr-grid-responsive-partial .col-12-pull-12 { right: 100%; } .cnqr-grid-responsive-partial .col-12-pull-11 { right: 91.66666667%; } .cnqr-grid-responsive-partial .col-12-pull-10 { right: 83.33333333%; } .cnqr-grid-responsive-partial .col-12-pull-9 { right: 75%; } .cnqr-grid-responsive-partial .col-12-pull-8 { right: 66.66666667%; } .cnqr-grid-responsive-partial .col-12-pull-7 { right: 58.33333333%; } .cnqr-grid-responsive-partial .col-12-pull-6 { right: 50%; } .cnqr-grid-responsive-partial .col-12-pull-5 { right: 41.66666667%; } .cnqr-grid-responsive-partial .col-12-pull-4 { right: 33.33333333%; } .cnqr-grid-responsive-partial .col-12-pull-3 { right: 25%; } .cnqr-grid-responsive-partial .col-12-pull-2 { right: 16.66666667%; } .cnqr-grid-responsive-partial .col-12-pull-1 { right: 8.33333333%; } .cnqr-grid-responsive-partial .col-12-pull-0 { right: auto; } .cnqr-grid-responsive-partial .col-12-push-12 { left: 100%; } .cnqr-grid-responsive-partial .col-12-push-11 { left: 91.66666667%; } .cnqr-grid-responsive-partial .col-12-push-10 { left: 83.33333333%; } .cnqr-grid-responsive-partial .col-12-push-9 { left: 75%; } .cnqr-grid-responsive-partial .col-12-push-8 { left: 66.66666667%; } .cnqr-grid-responsive-partial .col-12-push-7 { left: 58.33333333%; } .cnqr-grid-responsive-partial .col-12-push-6 { left: 50%; } .cnqr-grid-responsive-partial .col-12-push-5 { left: 41.66666667%; } .cnqr-grid-responsive-partial .col-12-push-4 { left: 33.33333333%; } .cnqr-grid-responsive-partial .col-12-push-3 { left: 25%; } .cnqr-grid-responsive-partial .col-12-push-2 { left: 16.66666667%; } .cnqr-grid-responsive-partial .col-12-push-1 { left: 8.33333333%; } .cnqr-grid-responsive-partial .col-12-push-0 { left: auto; } .cnqr-grid-responsive-partial .col-12-offset-12 { margin-left: 100%; } .cnqr-grid-responsive-partial .col-12-offset-11 { margin-left: 91.66666667%; } .cnqr-grid-responsive-partial .col-12-offset-10 { margin-left: 83.33333333%; } .cnqr-grid-responsive-partial .col-12-offset-9 { margin-left: 75%; } .cnqr-grid-responsive-partial .col-12-offset-8 { margin-left: 66.66666667%; } .cnqr-grid-responsive-partial .col-12-offset-7 { margin-left: 58.33333333%; } .cnqr-grid-responsive-partial .col-12-offset-6 { margin-left: 50%; } .cnqr-grid-responsive-partial .col-12-offset-5 { margin-left: 41.66666667%; } .cnqr-grid-responsive-partial .col-12-offset-4 { margin-left: 33.33333333%; } .cnqr-grid-responsive-partial .col-12-offset-3 { margin-left: 25%; } .cnqr-grid-responsive-partial .col-12-offset-2 { margin-left: 16.66666667%; } .cnqr-grid-responsive-partial .col-12-offset-1 { margin-left: 8.33333333%; } .cnqr-grid-responsive-partial .col-12-offset-0 { margin-left: 0%; } } @font-face { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; src: url('/static/fonts/OpenSans-Light-20150604.eot') format('eot'); src: url('/static/fonts/OpenSans-Light-20150604.eot?#iefix') format('embedded-opentype'), url('/static/fonts/OpenSans-Light-20150604.woff') format('woff'), url('/static/fonts/OpenSans-Light-20150604.ttf') format('truetype'), url('/static/fonts/OpenSans-Light-20150604.svg#OpenSans-Light') format('svg'); } @font-face { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; src: url('/static/fonts/oswald-regular-20150825.eot') format('eot'); src: url('/static/fonts/oswald-regular-20150825.eot?#iefix') format('embedded-opentype'), url('/static/fonts/oswald-regular-20150825.woff') format('woff'), url('/static/fonts/oswald-regular-20150825.ttf') format('truetype'), url('/static/fonts/oswald-regular-20150825.svg#oswald-regular') format('svg'); } h1 small, .h1 small, h2 small, .h2 small, h3 small, .h3 small, h4 small, .h4 small, h5 small, .h5 small, h6 small, .h6 small, h1 .small, .h1 .small, h2 .small, .h2 .small, h3 .small, .h3 .small, h4 .small, .h4 .small, h5 .small, .h5 .small, h6 .small, .h6 .small { font-weight: normal; color: #333333; text-transform: none; } h1.cnqr-first, .h1.cnqr-first, h2.cnqr-first, .h2.cnqr-first, h3.cnqr-first, .h3.cnqr-first, h4.cnqr-first, .h4.cnqr-first, h5.cnqr-first, .h5.cnqr-first, h6.cnqr-first, .h6.cnqr-first { margin-top: 0; } h1.cnqr-last, .h1.cnqr-last, h2.cnqr-last, .h2.cnqr-last, h3.cnqr-last, .h3.cnqr-last, h4.cnqr-last, .h4.cnqr-last, h5.cnqr-last, .h5.cnqr-last, h6.cnqr-last, .h6.cnqr-last { margin-bottom: 0; } h1, .h1 { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; margin: 0 0 16px 0; } h1 small, .h1 small, h1 .small, .h1 .small { display: block; font-size: 15px; margin-top: -10px; line-height: 39px; } h1 .btn, .h1 .btn { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; font-style: normal; } h1 .cnqr-create, .h1 .cnqr-create { font-style: italic; color: #999ca0; } h2, .h2 { margin: 4px 0; text-transform: uppercase; } h2 small, .h2 small, h2 .small, .h2 .small { font-size: 13px; font-weight: normal; } h3, .h3 { line-height: normal; margin: 4px 0; } h3.cnqr-totals, .h3.cnqr-totals { font-size: 18px; text-align: right; padding-right: 20px; } h3.cnqr-totals :not(:last-child), .h3.cnqr-totals :not(:last-child) { padding-right: 10px; } h4, .h4 { font-weight: normal; margin: 3px 0; } h5, .h5 { margin: 2px 0; font-weight: bold; } h6, .h6 { font-weight: bold; margin: 2px 0; } .lead { font-size: 18px; } ul { margin-bottom: 0; } address { margin: auto; } input[type="submit"], input[type="button"], input[type="reset"], button { display: inline-block; margin-bottom: 0; text-align: center; text-decoration: none; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding: 3px 10px; font-size: 11px; line-height: 1.45454537; border-radius: 4px; color: #ffffff; background-color: #1e69a6; border-color: #2379bf; background-image: -webkit-linear-gradient(top, #2379bf 1px, #1e69a6 100%); background-image: -moz-linear-gradient(top, #2379bf 1px, #1e69a6 100%); background-image: -ms-linear-gradient(top, #2379bf 1px, #1e69a6 100%); background-image: -o-linear-gradient(top, #2379bf 1px, #1e69a6 100%); background-image: linear-gradient(to bottom, #2379bf 1px, #1e69a6 100%); } input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover, button:hover, input[type="submit"]:focus, input[type="button"]:focus, input[type="reset"]:focus, button:focus, input[type="submit"].focus, input[type="button"].focus, input[type="reset"].focus, button.focus { color: #ffffff; text-decoration: none; } input[type="submit"]:active, input[type="button"]:active, input[type="reset"]:active, button:active, input[type="submit"].active, input[type="button"].active, input[type="reset"].active, button.active { outline: 0; background-image: none; -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); } input[type="submit"].disabled, input[type="button"].disabled, input[type="reset"].disabled, button.disabled, input[type="submit"][disabled], input[type="button"][disabled], input[type="reset"][disabled], button[disabled], fieldset[disabled] input[type="submit"], fieldset[disabled] input[type="button"], fieldset[disabled] input[type="reset"], fieldset[disabled] button { cursor: not-allowed; pointer-events: none; opacity: 0.65; filter: alpha(opacity=65); -webkit-box-shadow: none; box-shadow: none; } input[type="submit"] img, input[type="button"] img, input[type="reset"] img, button img { display: none; } input[type="submit"]:link, input[type="button"]:link, input[type="reset"]:link, button:link, input[type="submit"]:visited, input[type="button"]:visited, input[type="reset"]:visited, button:visited { color: #ffffff; } input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover, button:hover, input[type="submit"]:focus, input[type="button"]:focus, input[type="reset"]:focus, button:focus { color: #ffffff; background-color: #247fc9; border-color: #4397dc; background-image: -webkit-linear-gradient(top, #318ed9 1px, #247fc9 100%); background-image: -moz-linear-gradient(top, #318ed9 1px, #247fc9 100%); background-image: -ms-linear-gradient(top, #318ed9 1px, #247fc9 100%); background-image: -o-linear-gradient(top, #318ed9 1px, #247fc9 100%); background-image: linear-gradient(to bottom, #318ed9 1px, #247fc9 100%); text-shadow: 1px 1px #1e69a6; } input[type="submit"]:active, input[type="button"]:active, input[type="reset"]:active, button:active, input[type="submit"].active, input[type="button"].active, input[type="reset"].active, button.active { box-shadow: 0 0 0 rgba(0, 0, 0, 0) inset; background-color: #185383; border-color: #1a588b; background-image: -webkit-linear-gradient(top, #1d639d 1px, #185383 100%); background-image: -moz-linear-gradient(top, #1d639d 1px, #185383 100%); background-image: -ms-linear-gradient(top, #1d639d 1px, #185383 100%); background-image: -o-linear-gradient(top, #1d639d 1px, #185383 100%); background-image: linear-gradient(to bottom, #1d639d 1px, #185383 100%); color: #cccccc; } input[type="submit"].disabled, input[type="button"].disabled, input[type="reset"].disabled, button.disabled, input[type="submit"][disabled], input[type="button"][disabled], input[type="reset"][disabled], button[disabled], fieldset[disabled] input[type="submit"], fieldset[disabled] input[type="button"], fieldset[disabled] input[type="reset"], fieldset[disabled] button { color: #f9fbfd; background-color: #c0d5e6; border-color: #a7c9e5; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } input[type="submit"].cnqr-muted, input[type="button"].cnqr-muted, input[type="reset"].cnqr-muted, button.cnqr-muted { color: #383f46; background-color: #fefefe; border-color: #2379bf; background-image: -webkit-linear-gradient(top, transparent 1px, transparent 100%); background-image: -moz-linear-gradient(top, transparent 1px, transparent 100%); background-image: -ms-linear-gradient(top, transparent 1px, transparent 100%); background-image: -o-linear-gradient(top, transparent 1px, transparent 100%); background-image: linear-gradient(to bottom, transparent 1px, transparent 100%); text-shadow: 0 0 transparent; } input[type="submit"].cnqr-muted:hover, input[type="button"].cnqr-muted:hover, input[type="reset"].cnqr-muted:hover, button.cnqr-muted:hover, input[type="submit"].cnqr-muted:focus, input[type="button"].cnqr-muted:focus, input[type="reset"].cnqr-muted:focus, button.cnqr-muted:focus { color: #333333; background-color: #f7f7f7; border-color: #4397dc; background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: linear-gradient(to bottom, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); text-shadow: 1px 1px transparent; } input[type="submit"].cnqr-muted.disabled, input[type="button"].cnqr-muted.disabled, input[type="reset"].cnqr-muted.disabled, button.cnqr-muted.disabled, input[type="submit"].cnqr-muted[disabled], input[type="button"].cnqr-muted[disabled], input[type="reset"].cnqr-muted[disabled], button.cnqr-muted[disabled], input[type="submit"].cnqr-muted fieldset[disabled] input[type="submit"], input[type="submit"].cnqr-muted fieldset[disabled] input[type="button"], input[type="submit"].cnqr-muted fieldset[disabled] input[type="reset"], input[type="submit"].cnqr-muted fieldset[disabled] button, input[type="button"].cnqr-muted fieldset[disabled] input[type="submit"], input[type="button"].cnqr-muted fieldset[disabled] input[type="button"], input[type="button"].cnqr-muted fieldset[disabled] input[type="reset"], input[type="button"].cnqr-muted fieldset[disabled] button, input[type="reset"].cnqr-muted fieldset[disabled] input[type="submit"], input[type="reset"].cnqr-muted fieldset[disabled] input[type="button"], input[type="reset"].cnqr-muted fieldset[disabled] input[type="reset"], input[type="reset"].cnqr-muted fieldset[disabled] button, button.cnqr-muted fieldset[disabled] input[type="submit"], button.cnqr-muted fieldset[disabled] input[type="button"], button.cnqr-muted fieldset[disabled] input[type="reset"], button.cnqr-muted fieldset[disabled] button { color: #d1d1d1; background-color: #ffffff; border-color: #a7c9e5; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } input[type="submit"] .badge, input[type="button"] .badge, input[type="reset"] .badge, button .badge { color: #ffffff; background-color: #1e69a6; } span.btn, a.btn { display: inline-block; margin-bottom: 0; text-align: center; text-decoration: none; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding: 3px 10px; font-size: 11px; line-height: 1.45454537; border-radius: 4px; } span.btn:hover, a.btn:hover, span.btn:focus, a.btn:focus, span.btn.focus, a.btn.focus { color: #ffffff; text-decoration: none; } span.btn:active, a.btn:active, span.btn.active, a.btn.active { outline: 0; background-image: none; -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); } span.btn.disabled, a.btn.disabled, span.btn[disabled], a.btn[disabled], fieldset[disabled] span.btn, fieldset[disabled] a.btn { cursor: not-allowed; pointer-events: none; opacity: 0.65; filter: alpha(opacity=65); -webkit-box-shadow: none; box-shadow: none; } span.btn img, a.btn img { display: none; } .btn { min-width: 80px; display: inline-block; margin-bottom: 0; text-align: center; text-decoration: none; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid transparent; white-space: nowrap; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding: 3px 10px; font-size: 11px; line-height: 1.45454537; border-radius: 4px; color: #ffffff; background-color: #1e69a6; border-color: #2379bf; background-image: -webkit-linear-gradient(top, #2379bf 1px, #1e69a6 100%); background-image: -moz-linear-gradient(top, #2379bf 1px, #1e69a6 100%); background-image: -ms-linear-gradient(top, #2379bf 1px, #1e69a6 100%); background-image: -o-linear-gradient(top, #2379bf 1px, #1e69a6 100%); background-image: linear-gradient(to bottom, #2379bf 1px, #1e69a6 100%); } .btn:hover, .btn:focus, .btn.focus { color: #ffffff; text-decoration: none; } .btn:active, .btn.active { outline: 0; background-image: none; -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); } .btn.disabled, .btn[disabled], fieldset[disabled] .btn { cursor: not-allowed; pointer-events: none; opacity: 0.65; filter: alpha(opacity=65); -webkit-box-shadow: none; box-shadow: none; } .btn img { display: none; } .btn:link, .btn:visited { color: #ffffff; } .btn:hover, .btn:focus { color: #ffffff; background-color: #247fc9; border-color: #4397dc; background-image: -webkit-linear-gradient(top, #318ed9 1px, #247fc9 100%); background-image: -moz-linear-gradient(top, #318ed9 1px, #247fc9 100%); background-image: -ms-linear-gradient(top, #318ed9 1px, #247fc9 100%); background-image: -o-linear-gradient(top, #318ed9 1px, #247fc9 100%); background-image: linear-gradient(to bottom, #318ed9 1px, #247fc9 100%); text-shadow: 1px 1px #1e69a6; } .btn:active, .btn.active { box-shadow: 0 0 0 rgba(0, 0, 0, 0) inset; background-color: #185383; border-color: #1a588b; background-image: -webkit-linear-gradient(top, #1d639d 1px, #185383 100%); background-image: -moz-linear-gradient(top, #1d639d 1px, #185383 100%); background-image: -ms-linear-gradient(top, #1d639d 1px, #185383 100%); background-image: -o-linear-gradient(top, #1d639d 1px, #185383 100%); background-image: linear-gradient(to bottom, #1d639d 1px, #185383 100%); color: #cccccc; } .btn.disabled, .btn[disabled], fieldset[disabled] .btn { color: #f9fbfd; background-color: #c0d5e6; border-color: #a7c9e5; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.cnqr-muted { color: #383f46; background-color: #fefefe; border-color: #2379bf; background-image: -webkit-linear-gradient(top, transparent 1px, transparent 100%); background-image: -moz-linear-gradient(top, transparent 1px, transparent 100%); background-image: -ms-linear-gradient(top, transparent 1px, transparent 100%); background-image: -o-linear-gradient(top, transparent 1px, transparent 100%); background-image: linear-gradient(to bottom, transparent 1px, transparent 100%); text-shadow: 0 0 transparent; } .btn.cnqr-muted:hover, .btn.cnqr-muted:focus { color: #333333; background-color: #f7f7f7; border-color: #4397dc; background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: linear-gradient(to bottom, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); text-shadow: 1px 1px transparent; } .btn.cnqr-muted.disabled, .btn.cnqr-muted[disabled], .btn.cnqr-muted fieldset[disabled] .btn { color: #d1d1d1; background-color: #ffffff; border-color: #a7c9e5; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn .badge { color: #ffffff; background-color: #1e69a6; } .btn.btn-primary { color: #ffffff; background-color: #c84f2e; border-color: #e05932; background-image: -webkit-linear-gradient(top, #e05932 1px, #c84f2e 100%); background-image: -moz-linear-gradient(top, #e05932 1px, #c84f2e 100%); background-image: -ms-linear-gradient(top, #e05932 1px, #c84f2e 100%); background-image: -o-linear-gradient(top, #e05932 1px, #c84f2e 100%); background-image: linear-gradient(to bottom, #e05932 1px, #c84f2e 100%); } .btn.btn-primary:link, .btn.btn-primary:visited { color: #ffffff; } .btn.btn-primary:hover, .btn.btn-primary:focus { color: #ffffff; background-color: #d5674a; border-color: #e88467; background-image: -webkit-linear-gradient(top, #e57655 1px, #d5674a 100%); background-image: -moz-linear-gradient(top, #e57655 1px, #d5674a 100%); background-image: -ms-linear-gradient(top, #e57655 1px, #d5674a 100%); background-image: -o-linear-gradient(top, #e57655 1px, #d5674a 100%); background-image: linear-gradient(to bottom, #e57655 1px, #d5674a 100%); text-shadow: 1px 1px #c84f2e; } .btn.btn-primary:active, .btn.btn-primary.active { box-shadow: 0 0 0 rgba(0, 0, 0, 0) inset; background-color: #a74226; border-color: #b93f1c; background-image: -webkit-linear-gradient(top, #cb451f 1px, #a74226 100%); background-image: -moz-linear-gradient(top, #cb451f 1px, #a74226 100%); background-image: -ms-linear-gradient(top, #cb451f 1px, #a74226 100%); background-image: -o-linear-gradient(top, #cb451f 1px, #a74226 100%); background-image: linear-gradient(to bottom, #cb451f 1px, #a74226 100%); color: #cccccc; } .btn.btn-primary.disabled, .btn.btn-primary[disabled], fieldset[disabled] .btn.btn-primary { color: #fdfaf9; background-color: #f0cec4; border-color: #f3bdad; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-primary.cnqr-muted { color: #383f46; background-color: #fefefe; border-color: #e05932; background-image: -webkit-linear-gradient(top, transparent 1px, transparent 100%); background-image: -moz-linear-gradient(top, transparent 1px, transparent 100%); background-image: -ms-linear-gradient(top, transparent 1px, transparent 100%); background-image: -o-linear-gradient(top, transparent 1px, transparent 100%); background-image: linear-gradient(to bottom, transparent 1px, transparent 100%); text-shadow: 0 0 transparent; } .btn.btn-primary.cnqr-muted:hover, .btn.btn-primary.cnqr-muted:focus { color: #333333; background-color: #f7f7f7; border-color: #e88467; background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: linear-gradient(to bottom, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); text-shadow: 1px 1px transparent; } .btn.btn-primary.cnqr-muted.disabled, .btn.btn-primary.cnqr-muted[disabled], .btn.btn-primary.cnqr-muted fieldset[disabled] .btn.btn-primary { color: #d1d1d1; background-color: #ffffff; border-color: #f3bdad; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-primary .badge { color: #ffffff; background-color: #c84f2e; } .btn.cnqr-create { color: #c84f2e; background-color: #fefefe; border-color: #e05932; background-image: -webkit-linear-gradient(top, #fefefe 1px, #fefefe 100%); background-image: -moz-linear-gradient(top, #fefefe 1px, #fefefe 100%); background-image: -ms-linear-gradient(top, #fefefe 1px, #fefefe 100%); background-image: -o-linear-gradient(top, #fefefe 1px, #fefefe 100%); background-image: linear-gradient(to bottom, #fefefe 1px, #fefefe 100%); padding-left: 6px; } .btn.cnqr-create:link, .btn.cnqr-create:visited { color: #c84f2e; } .btn.cnqr-create:hover, .btn.cnqr-create:focus { color: #c84f2e; background-color: #ffffff; border-color: #e88467; background-image: -webkit-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: -moz-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: -ms-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: -o-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: linear-gradient(to bottom, #ffffff 1px, #ffffff 100%); text-shadow: 1px 1px #fefefe; } .btn.cnqr-create:active, .btn.cnqr-create.active { box-shadow: 0 0 0 rgba(0, 0, 0, 0) inset; background-color: #eaeaea; border-color: #b93f1c; background-image: -webkit-linear-gradient(top, #eaeaea 1px, #eaeaea 100%); background-image: -moz-linear-gradient(top, #eaeaea 1px, #eaeaea 100%); background-image: -ms-linear-gradient(top, #eaeaea 1px, #eaeaea 100%); background-image: -o-linear-gradient(top, #eaeaea 1px, #eaeaea 100%); background-image: linear-gradient(to bottom, #eaeaea 1px, #eaeaea 100%); color: #752e1b; } .btn.cnqr-create.disabled, .btn.cnqr-create[disabled], fieldset[disabled] .btn.cnqr-create { color: #f3d7d0; background-color: #ffffff; border-color: #f3bdad; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.cnqr-create.cnqr-muted { color: #383f46; background-color: #fefefe; border-color: #e05932; background-image: -webkit-linear-gradient(top, transparent 1px, transparent 100%); background-image: -moz-linear-gradient(top, transparent 1px, transparent 100%); background-image: -ms-linear-gradient(top, transparent 1px, transparent 100%); background-image: -o-linear-gradient(top, transparent 1px, transparent 100%); background-image: linear-gradient(to bottom, transparent 1px, transparent 100%); text-shadow: 0 0 transparent; } .btn.cnqr-create.cnqr-muted:hover, .btn.cnqr-create.cnqr-muted:focus { color: #333333; background-color: #f7f7f7; border-color: #e88467; background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: linear-gradient(to bottom, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); text-shadow: 1px 1px transparent; } .btn.cnqr-create.cnqr-muted.disabled, .btn.cnqr-create.cnqr-muted[disabled], .btn.cnqr-create.cnqr-muted fieldset[disabled] .btn.cnqr-create { color: #d1d1d1; background-color: #ffffff; border-color: #f3bdad; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.cnqr-create .badge { color: #c84f2e; background-color: #fefefe; } .btn.cnqr-create:hover, .btn.cnqr-create:focus { background-color: #ebf7ff; background-image: none; color: #e05932; } .btn.cnqr-create:before { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; content: "\e074"; display: inline-block; text-decoration: none; font-size: 16px; font-style: normal; font-weight: normal; padding-right: 2px; vertical-align: middle; line-height: 1; margin-top: -2px; } .btn.btn-secondary { color: #333333; background-color: #ffffff; border-color: #999ca0; background-image: -webkit-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: -moz-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: -ms-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: -o-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: linear-gradient(to bottom, #ffffff 1px, #ffffff 100%); } .btn.btn-secondary:link, .btn.btn-secondary:visited { color: #333333; } .btn.btn-secondary:hover, .btn.btn-secondary:focus { color: #333333; background-color: #ffffff; border-color: #b9bbbe; background-image: -webkit-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: -moz-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: -ms-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: -o-linear-gradient(top, #ffffff 1px, #ffffff 100%); background-image: linear-gradient(to bottom, #ffffff 1px, #ffffff 100%); text-shadow: 1px 1px #ffffff; } .btn.btn-secondary:active, .btn.btn-secondary.active { box-shadow: 0 0 0 rgba(0, 0, 0, 0) inset; background-color: #ebebeb; border-color: #797d82; background-image: -webkit-linear-gradient(top, #ebebeb 1px, #ebebeb 100%); background-image: -moz-linear-gradient(top, #ebebeb 1px, #ebebeb 100%); background-image: -ms-linear-gradient(top, #ebebeb 1px, #ebebeb 100%); background-image: -o-linear-gradient(top, #ebebeb 1px, #ebebeb 100%); background-image: linear-gradient(to bottom, #ebebeb 1px, #ebebeb 100%); color: #000000; } .btn.btn-secondary.disabled, .btn.btn-secondary[disabled], fieldset[disabled] .btn.btn-secondary { color: #d1d1d1; background-color: #ffffff; border-color: #d6d7d9; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-secondary.cnqr-muted { color: #383f46; background-color: #fefefe; border-color: #999ca0; background-image: -webkit-linear-gradient(top, transparent 1px, transparent 100%); background-image: -moz-linear-gradient(top, transparent 1px, transparent 100%); background-image: -ms-linear-gradient(top, transparent 1px, transparent 100%); background-image: -o-linear-gradient(top, transparent 1px, transparent 100%); background-image: linear-gradient(to bottom, transparent 1px, transparent 100%); text-shadow: 0 0 transparent; } .btn.btn-secondary.cnqr-muted:hover, .btn.btn-secondary.cnqr-muted:focus { color: #333333; background-color: #f7f7f7; border-color: #b9bbbe; background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: linear-gradient(to bottom, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); text-shadow: 1px 1px transparent; } .btn.btn-secondary.cnqr-muted.disabled, .btn.btn-secondary.cnqr-muted[disabled], .btn.btn-secondary.cnqr-muted fieldset[disabled] .btn.btn-secondary { color: #d1d1d1; background-color: #ffffff; border-color: #d6d7d9; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-secondary .badge { color: #333333; background-color: #ffffff; } .btn.btn-secondary:hover, .btn.btn-secondary:focus { background-color: #ebf7ff; background-image: none; } .btn.btn-secondary:focus { outline: 1px dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } .btn.btn-success { color: #ffffff; background-color: #3a7827; border-color: #46912f; background-image: -webkit-linear-gradient(top, #46912f 1px, #3a7827 100%); background-image: -moz-linear-gradient(top, #46912f 1px, #3a7827 100%); background-image: -ms-linear-gradient(top, #46912f 1px, #3a7827 100%); background-image: -o-linear-gradient(top, #46912f 1px, #3a7827 100%); background-image: linear-gradient(to bottom, #46912f 1px, #3a7827 100%); } .btn.btn-success:link, .btn.btn-success:visited { color: #ffffff; } .btn.btn-success:hover, .btn.btn-success:focus { color: #ffffff; background-color: #499731; border-color: #5cbf3e; background-image: -webkit-linear-gradient(top, #55b039 1px, #499731 100%); background-image: -moz-linear-gradient(top, #55b039 1px, #499731 100%); background-image: -ms-linear-gradient(top, #55b039 1px, #499731 100%); background-image: -o-linear-gradient(top, #55b039 1px, #499731 100%); background-image: linear-gradient(to bottom, #55b039 1px, #499731 100%); text-shadow: 1px 1px #3a7827; } .btn.btn-success:active, .btn.btn-success.active { box-shadow: 0 0 0 rgba(0, 0, 0, 0) inset; background-color: #2b591d; border-color: #306320; background-image: -webkit-linear-gradient(top, #377225 1px, #2b591d 100%); background-image: -moz-linear-gradient(top, #377225 1px, #2b591d 100%); background-image: -ms-linear-gradient(top, #377225 1px, #2b591d 100%); background-image: -o-linear-gradient(top, #377225 1px, #2b591d 100%); background-image: linear-gradient(to bottom, #377225 1px, #2b591d 100%); color: #cccccc; } .btn.btn-success.disabled, .btn.btn-success[disabled], fieldset[disabled] .btn.btn-success { color: #f9fbf9; background-color: #c8d9c3; border-color: #b5d3ac; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-success.cnqr-muted { color: #383f46; background-color: #fefefe; border-color: #46912f; background-image: -webkit-linear-gradient(top, transparent 1px, transparent 100%); background-image: -moz-linear-gradient(top, transparent 1px, transparent 100%); background-image: -ms-linear-gradient(top, transparent 1px, transparent 100%); background-image: -o-linear-gradient(top, transparent 1px, transparent 100%); background-image: linear-gradient(to bottom, transparent 1px, transparent 100%); text-shadow: 0 0 transparent; } .btn.btn-success.cnqr-muted:hover, .btn.btn-success.cnqr-muted:focus { color: #333333; background-color: #f7f7f7; border-color: #5cbf3e; background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: linear-gradient(to bottom, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); text-shadow: 1px 1px transparent; } .btn.btn-success.cnqr-muted.disabled, .btn.btn-success.cnqr-muted[disabled], .btn.btn-success.cnqr-muted fieldset[disabled] .btn.btn-success { color: #d1d1d1; background-color: #ffffff; border-color: #b5d3ac; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-success .badge { color: #ffffff; background-color: #3a7827; } .btn.btn-info { color: #ffffff; background-color: #1e69a6; border-color: #2379bf; background-image: -webkit-linear-gradient(top, #1e69a6 1px, #2379bf 100%); background-image: -moz-linear-gradient(top, #1e69a6 1px, #2379bf 100%); background-image: -ms-linear-gradient(top, #1e69a6 1px, #2379bf 100%); background-image: -o-linear-gradient(top, #1e69a6 1px, #2379bf 100%); background-image: linear-gradient(to bottom, #1e69a6 1px, #2379bf 100%); } .btn.btn-info:link, .btn.btn-info:visited { color: #ffffff; } .btn.btn-info:hover, .btn.btn-info:focus { color: #ffffff; background-color: #247fc9; border-color: #4397dc; background-image: -webkit-linear-gradient(top, #247fc9 1px, #318ed9 100%); background-image: -moz-linear-gradient(top, #247fc9 1px, #318ed9 100%); background-image: -ms-linear-gradient(top, #247fc9 1px, #318ed9 100%); background-image: -o-linear-gradient(top, #247fc9 1px, #318ed9 100%); background-image: linear-gradient(to bottom, #247fc9 1px, #318ed9 100%); text-shadow: 1px 1px #2379bf; } .btn.btn-info:active, .btn.btn-info.active { box-shadow: 0 0 0 rgba(0, 0, 0, 0) inset; background-color: #185383; border-color: #1a588b; background-image: -webkit-linear-gradient(top, #185383 1px, #1d639d 100%); background-image: -moz-linear-gradient(top, #185383 1px, #1d639d 100%); background-image: -ms-linear-gradient(top, #185383 1px, #1d639d 100%); background-image: -o-linear-gradient(top, #185383 1px, #1d639d 100%); background-image: linear-gradient(to bottom, #185383 1px, #1d639d 100%); color: #cccccc; } .btn.btn-info.disabled, .btn.btn-info[disabled], fieldset[disabled] .btn.btn-info { color: #f9fbfd; background-color: #c0d5e6; border-color: #a7c9e5; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-info.cnqr-muted { color: #383f46; background-color: #fefefe; border-color: #2379bf; background-image: -webkit-linear-gradient(top, transparent 1px, transparent 100%); background-image: -moz-linear-gradient(top, transparent 1px, transparent 100%); background-image: -ms-linear-gradient(top, transparent 1px, transparent 100%); background-image: -o-linear-gradient(top, transparent 1px, transparent 100%); background-image: linear-gradient(to bottom, transparent 1px, transparent 100%); text-shadow: 0 0 transparent; } .btn.btn-info.cnqr-muted:hover, .btn.btn-info.cnqr-muted:focus { color: #333333; background-color: #f7f7f7; border-color: #4397dc; background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: linear-gradient(to bottom, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); text-shadow: 1px 1px transparent; } .btn.btn-info.cnqr-muted.disabled, .btn.btn-info.cnqr-muted[disabled], .btn.btn-info.cnqr-muted fieldset[disabled] .btn.btn-info { color: #d1d1d1; background-color: #ffffff; border-color: #a7c9e5; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-info .badge { color: #ffffff; background-color: #1e69a6; } .btn.btn-warning { color: #333333; background-color: #ffde43; border-color: #f2ce34; background-image: -webkit-linear-gradient(top, #ffde43 1px, #f2ce34 100%); background-image: -moz-linear-gradient(top, #ffde43 1px, #f2ce34 100%); background-image: -ms-linear-gradient(top, #ffde43 1px, #f2ce34 100%); background-image: -o-linear-gradient(top, #ffde43 1px, #f2ce34 100%); background-image: linear-gradient(to bottom, #ffde43 1px, #f2ce34 100%); } .btn.btn-warning:link, .btn.btn-warning:visited { color: #333333; } .btn.btn-warning:hover, .btn.btn-warning:focus { color: #333333; background-color: #ffe56c; border-color: #f6dc6e; background-image: -webkit-linear-gradient(top, #ffe56c 1px, #f4d75a 100%); background-image: -moz-linear-gradient(top, #ffe56c 1px, #f4d75a 100%); background-image: -ms-linear-gradient(top, #ffe56c 1px, #f4d75a 100%); background-image: -o-linear-gradient(top, #ffe56c 1px, #f4d75a 100%); background-image: linear-gradient(to bottom, #ffe56c 1px, #f4d75a 100%); text-shadow: 1px 1px #f2ce34; } .btn.btn-warning:active, .btn.btn-warning.active { box-shadow: 0 0 0 rgba(0, 0, 0, 0) inset; background-color: #ffd71a; border-color: #dbb40e; background-image: -webkit-linear-gradient(top, #ffd71a 1px, #eec40f 100%); background-image: -moz-linear-gradient(top, #ffd71a 1px, #eec40f 100%); background-image: -ms-linear-gradient(top, #ffd71a 1px, #eec40f 100%); background-image: -o-linear-gradient(top, #ffd71a 1px, #eec40f 100%); background-image: linear-gradient(to bottom, #ffd71a 1px, #eec40f 100%); color: #000000; } .btn.btn-warning.disabled, .btn.btn-warning[disabled], fieldset[disabled] .btn.btn-warning { color: #d1d0cc; background-color: #fff6ca; border-color: #faebae; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-warning.cnqr-muted { color: #383f46; background-color: #fefefe; border-color: #f2ce34; background-image: -webkit-linear-gradient(top, transparent 1px, transparent 100%); background-image: -moz-linear-gradient(top, transparent 1px, transparent 100%); background-image: -ms-linear-gradient(top, transparent 1px, transparent 100%); background-image: -o-linear-gradient(top, transparent 1px, transparent 100%); background-image: linear-gradient(to bottom, transparent 1px, transparent 100%); text-shadow: 0 0 transparent; } .btn.btn-warning.cnqr-muted:hover, .btn.btn-warning.cnqr-muted:focus { color: #333333; background-color: #f7f7f7; border-color: #f6dc6e; background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: linear-gradient(to bottom, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); text-shadow: 1px 1px transparent; } .btn.btn-warning.cnqr-muted.disabled, .btn.btn-warning.cnqr-muted[disabled], .btn.btn-warning.cnqr-muted fieldset[disabled] .btn.btn-warning { color: #d1d1d1; background-color: #ffffff; border-color: #faebae; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-warning .badge { color: #333333; background-color: #ffde43; } .btn.btn-danger { color: #ffffff; background-color: #ca202c; border-color: #df3339; background-image: -webkit-linear-gradient(top, #ca202c 1px, #df3339 100%); background-image: -moz-linear-gradient(top, #ca202c 1px, #df3339 100%); background-image: -ms-linear-gradient(top, #ca202c 1px, #df3339 100%); background-image: -o-linear-gradient(top, #ca202c 1px, #df3339 100%); background-image: linear-gradient(to bottom, #ca202c 1px, #df3339 100%); } .btn.btn-danger:link, .btn.btn-danger:visited { color: #ffffff; } .btn.btn-danger:hover, .btn.btn-danger:focus { color: #ffffff; background-color: #df3440; border-color: #e7686c; background-image: -webkit-linear-gradient(top, #df3440 1px, #e5565b 100%); background-image: -moz-linear-gradient(top, #df3440 1px, #e5565b 100%); background-image: -ms-linear-gradient(top, #df3440 1px, #e5565b 100%); background-image: -o-linear-gradient(top, #df3440 1px, #e5565b 100%); background-image: linear-gradient(to bottom, #df3440 1px, #e5565b 100%); text-shadow: 1px 1px #df3339; } .btn.btn-danger:active, .btn.btn-danger.active { box-shadow: 0 0 0 rgba(0, 0, 0, 0) inset; background-color: #a71a24; border-color: #b81d22; background-image: -webkit-linear-gradient(top, #a71a24 1px, #ca2026 100%); background-image: -moz-linear-gradient(top, #a71a24 1px, #ca2026 100%); background-image: -ms-linear-gradient(top, #a71a24 1px, #ca2026 100%); background-image: -o-linear-gradient(top, #a71a24 1px, #ca2026 100%); background-image: linear-gradient(to bottom, #a71a24 1px, #ca2026 100%); color: #cccccc; } .btn.btn-danger.disabled, .btn.btn-danger[disabled], fieldset[disabled] .btn.btn-danger { color: #fef9f9; background-color: #f0c1c4; border-color: #f2adb0; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-danger.cnqr-muted { color: #383f46; background-color: #fefefe; border-color: #df3339; background-image: -webkit-linear-gradient(top, transparent 1px, transparent 100%); background-image: -moz-linear-gradient(top, transparent 1px, transparent 100%); background-image: -ms-linear-gradient(top, transparent 1px, transparent 100%); background-image: -o-linear-gradient(top, transparent 1px, transparent 100%); background-image: linear-gradient(to bottom, transparent 1px, transparent 100%); text-shadow: 0 0 transparent; } .btn.btn-danger.cnqr-muted:hover, .btn.btn-danger.cnqr-muted:focus { color: #333333; background-color: #f7f7f7; border-color: #e7686c; background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: linear-gradient(to bottom, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); text-shadow: 1px 1px transparent; } .btn.btn-danger.cnqr-muted.disabled, .btn.btn-danger.cnqr-muted[disabled], .btn.btn-danger.cnqr-muted fieldset[disabled] .btn.btn-danger { color: #d1d1d1; background-color: #ffffff; border-color: #f2adb0; background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); } .btn.btn-danger .badge { color: #ffffff; background-color: #ca202c; } .btn.btn-link { color: #1e69a6; background-color: transparent; border-color: transparent; background-image: -webkit-linear-gradient(top, transparent 1px, transparent 100%); background-image: -moz-linear-gradient(top, transparent 1px, transparent 100%); background-image: -ms-linear-gradient(top, transparent 1px, transparent 100%); background-image: -o-linear-gradient(top, transparent 1px, transparent 100%); background-image: linear-gradient(to bottom, transparent 1px, transparent 100%); font-weight: normal; padding-left: 6px; padding-right: 6px; } .btn.btn-link:hover, .btn.btn-link:focus { color: #1e69a6; background-color: rgba(20, 20, 20, 0); border-color: rgba(31, 31, 31, 0); background-image: -webkit-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -moz-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -ms-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: -o-linear-gradient(top, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); background-image: linear-gradient(to bottom, rgba(20, 20, 20, 0) 1px, rgba(20, 20, 20, 0) 100%); text-shadow: 1px 1px transparent; text-decoration: underline; -webkit-box-shadow: none; box-shadow: none; } .btn.btn-link:active, .btn.btn-link.active { box-shadow: 0 0 0 rgba(0, 0, 0, 0) inset; background-color: rgba(0, 0, 0, 0); border-color: rgba(0, 0, 0, 0); background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%); background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%); background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%); background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 1px, rgba(0, 0, 0, 0) 100%); color: #0e3250; text-decoration: underline; -webkit-box-shadow: none; box-shadow: none; } .btn.btn-link.disabled, .btn.btn-link[disabled], .btn.btn-link:disabled, fieldset[disabled] .btn.btn-link { color: rgba(196, 198, 199, 0.972); background-color: rgba(255, 255, 255, 0.72); border-color: rgba(255, 255, 255, 0.6); background-image: none; text-shadow: 0 0 transparent; cursor: default; opacity: 1; filter: alpha(opacity=100); color: #c0c2c4; background-color: transparent; text-decoration: none; } .btn.btn-link.cnqr-muted { color: #383f46; background-color: transparent; border-color: transparent; } .btn.btn-link.cnqr-condensed { padding: 0 !important; min-width: 0 !important; } .btn.btn-link.cnqr-muted:disabled, .btn.btn-link.cnqr-muted[disabled], .btn.btn-link.disabled { color: #c0c2c4; background-color: transparent; border-color: transparent; } .btn.btn-link.btn-lg { font-weight: normal; padding-left: 8px; padding-right: 8px; } .btn.btn-link.btn-icon { padding: 0; min-width: 0; border: 0; line-height: 1; } .btn.btn-lg { min-width: 95px; padding: 8px 15px; font-size: 13px; line-height: 1.4; border-radius: 6px; font-weight: bold; } .btn.btn-lg.cnqr-muted { box-shadow: 0 0 0 transparent; } .btn.btn-lg.cnqr-create:before { content: "\e070"; margin-top: -3px; padding-right: 4px; } .btn.btn-lg.cnqr-create:hover:before, .btn.btn-lg.cnqr-create:focus:before { color: #e05932; } .btn.btn-sm, .smallbutton { min-width: 65px; padding: 0 3px; font-size: 11px; line-height: 1.45454537; border-radius: 3px; } .btn.btn-sm.cnqr-create, .smallbutton.cnqr-create { padding-left: 0; } .btn.btn-sm.cnqr-create:before, .smallbutton.cnqr-create:before { font-size: 14px; padding-right: 1px; } .breadcrumb > li + li:before { content: "\e03e"; font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; font-size: 9px; padding: 0 4px; } nav .breadcrumb li:last-child > a { color: #333333; } .btn.cnqr-muted.dropdown-toggle .caret { border-top-color: #333333; } .btn.cnqr-muted.dropdown-toggle.disabled .caret, .btn.cnqr-muted.dropdown-toggle[disabled] .caret, fieldset[disabled] .btn.cnqr-muted.dropdown-toggle .caret { border-top-color: #cccccc; } .btn-group .btn { min-width: 0; } .btn-group .btn.dropdown-toggle.dropdown-micro { min-width: 0; } .btn-group .btn.dropdown-toggle.dropdown-micro .caret { margin-left: 0; } .btn-group .btn-link .caret { margin-left: 2px; } .btn-group .btn-link.btn-lg .caret { margin-left: 2px; } .btn-group.btn-group-sm .caret { margin-bottom: 1px; margin-left: 2px; border-right: 4px solid transparent; border-left: 4px solid transparent; } .btn-group.btn-group-sm.dropdown .caret { border-top: 5px solid; } .btn-group.btn-group-sm.dropup .caret { border-bottom: 5px solid; } .btn-group .caret { margin-left: 4px; border-right: 5px solid transparent; border-left: 5px solid transparent; } .btn-group.dropdown .caret { border-top: 6px solid; } .btn-group.dropup .caret { border-bottom: 6px solid; } .btn-group.btn-group-lg .caret { margin-left: 4px; border-right: 6px solid transparent; border-left: 6px solid transparent; } .btn-group.btn-group-lg.dropdown .caret { border-top: 7px solid; } .btn-group.btn-group-lg.dropup .caret { border-bottom: 7px solid; } .btn-group.btn-group-horizontal { display: inherit; } .btn-group .dropdown-toggle:active.cnqr-muted, .btn-group.open .dropdown-toggle.cnqr-muted { background-color: transparent; color: #333333; } .btn-group .dropdown-menu > li > a [class^="icon-"], .btn-group .dropdown-menu > li > a [class*=" icon-"] { min-width: 20px; display: inline-block; } .btn-group.btn-lg .btn { padding: 8px 15px; font-size: 13px; line-height: 1.4; font-weight: bold; } .btn-group.btn-sm .btn { padding: 0 3px; font-size: 11px; line-height: 1.45454537; } .btn-toolbar { margin-left: 0; margin-top: 0; padding: 6px; background-color: #e2e3e3; background: linear-gradient(top, #ffffff, #e2e3e3); } .btn-toolbar:before, .btn-toolbar:after { content: " "; display: table; } .btn-toolbar:after { clear: both; } .btn-toolbar:before, .btn-toolbar:after { content: " "; display: table; } .btn-toolbar:after { clear: both; } .btn-toolbar.text-center .btn, .btn-toolbar.text-center .btn-group, .btn-toolbar.text-center .input-group { float: none; } .btn-toolbar > .btn, .btn-toolbar > .btn-group, .btn-toolbar > .input-group, .btn-toolbar > .cnqr-popper-target { margin-left: 6px; float: left; } .btn-toolbar > .btn:first-child:not(.pull-right), .btn-toolbar > .btn-group:first-child:not(.pull-right), .btn-toolbar > .input-group:first-child:not(.pull-right), .btn-toolbar > .cnqr-popper-target:first-child:not(.pull-right) { margin-left: 0; } .btn-toolbar .btn-link { min-width: 0; } .btn-toolbar.cnqr-muted { background-color: transparent; padding: 0; } .btn-toolbar.cnqr-muted > .btn-link:first-child:not(.pull-right) { padding-left: 0; } .btn-toolbar.cnqr-muted > .btn-link:first-child.pull-right { padding-right: 0; } .btn-toolbar.cnqr-muted > .btn-group:first-child .btn-link { padding-left: 0; } .btn-toolbar.cnqr-muted > .btn-labeled:first-child .btn-text-label { padding-left: 0; } .btn-toolbar.cnqr-strong .btn-link { background: none; color: #ffffff; } .btn-toolbar.cnqr-strong .btn-link:visited, .btn-toolbar.cnqr-strong .btn-link:link { color: #ffffff; } .btn-toolbar.cnqr-strong .btn-link.active, .btn-toolbar.cnqr-strong .btn-link:hover { text-decoration: none; color: #999ca0; } .btn-toolbar.overlay { width: 100%; margin: 0; z-index: 1000; background-color: #50565c; opacity: 0.8; filter: alpha(opacity=80); border-top-right-radius: 0; border-top-left-radius: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0; ; bottom: 0; height: 25px; padding: 0; color: #ffffff; } .btn-toolbar.overlay .btn { font-size: 16px; line-height: 25px; margin: 0 12px; } .btn-toolbar.overlay .text { font-size: 16px; line-height: 25px; } .modal-footer .btn-toolbar.overlay { width: 100%; ; top: 0; height: 65px; text-align: center; padding: 10px 0; } .modal-footer .btn-toolbar.overlay .btn { font-size: 22px; line-height: 22px; margin: 0 8px; } .modal-footer .btn-toolbar.overlay .btn-link { font-size: 15px; line-height: 22px; margin: 0 8px; } .modal-footer .btn-toolbar.overlay .text { font-size: 15px; line-height: 22px; margin: 0 4px; vertical-align: middle; } .nav > li.disabled { cursor: not-allowed; } .nav > li.disabled > a, .nav > li.disabled button { background-color: #e2e3e3; color: #999ca0; } .nav > li.disabled > a:hover, .nav > li.disabled button:hover, .nav > li.disabled > a:focus, .nav > li.disabled button:focus { background-color: #e2e3e3; } .nav-tabs > li { font-weight: normal; text-align: center; } .nav-tabs > li > a, .nav-tabs > li button { border-radius: 0; margin-right: 0; min-width: 160px; border: 1px solid #c0c2c4; border-right: 0; cursor: pointer; font-size: 16px; background-color: #ffffff; background-image: none; color: #1e69a6; ; display: block; padding: 10px 15px; } .nav-tabs > li > a:hover, .nav-tabs > li button:hover, .nav-tabs > li > a:focus, .nav-tabs > li button:focus { text-shadow: none; background-color: #ebf7ff; } .nav-tabs > li.active > a, .nav-tabs > li.active button, .nav-tabs > li.active > a:hover, .nav-tabs > li.active button:hover, .nav-tabs > li.active > a:focus, .nav-tabs > li.active button:focus { -webkit-box-shadow: inset 0 1px 0 0 #1e69a6; box-shadow: inset 0 1px 0 0 #1e69a6; border-top-color: #1e69a6; border-right: 0; color: #333333; background-color: #ffffff; border-bottom-color: transparent; cursor: default; text-shadow: none; } .nav-tabs > li:last-child > a, .nav-tabs > li:last-child button, .nav-tabs > li:last-child > a:hover, .nav-tabs > li:last-child button:hover, .nav-tabs > li:last-child > a:focus, .nav-tabs > li:last-child button:focus { border-right: 1px solid #c0c2c4; } @media (max-width: 768px) { .nav-tabs > li { min-width: 0; } } .tab-content { border: 1px solid #c0c2c4; border-top: 0; padding: 16px; background-color: #ffffff; } .tab-content.cnqr-muted { background: transparent; border: 0; padding: 0; } .tab-content.cnqr-muted .tab-pane-body { padding-top: 16px; } .tab-content > .active { display: flex; } .caret { display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-top: 4px solid \9; border-right: 4px solid transparent; border-left: 4px solid transparent; } .dropdown, .dropup { ; } .dropdown-menu, .cnqr-autocomplete-button, .cnqr-dropdown-filter { ; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 160px; padding: 5px 0; margin: 2px 0 0; list-style: none; font-size: 13px; text-align: left; background-color: #ffffff; border: 1px solid #999ca0; border-radius: 4px; -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); background-clip: padding-box; } .dropdown-menu.pull-right { right: 0; left: auto; } .dropdown-menu .divider { height: 1px; margin: 8px 0; overflow: hidden; background-color: #c0c2c4; } .dropdown-menu > li > a, .dropdown-menu .dropdown-infinite > li > a { display: block; padding: 3px 20px; clear: both; font-weight: normal; line-height: 1.42857143; color: #333333; white-space: nowrap; } .dropdown-menu > li > a:hover, .dropdown-menu .dropdown-infinite > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-menu .dropdown-infinite > li > a:focus { text-decoration: none; color: #333333; background-color: #ebf7ff; } .dropdown-menu > .active > a, .dropdown-menu > .dropdown-infinite > .active > a, .dropdown-menu > .active > a:focus, .dropdown-menu > .dropdown-infinite > .active > a:focus, .dropdown-menu > .active > a:hover, .dropdown-menu > .dropdown-infinite > .active > a:hover { color: #333333; text-decoration: none; outline: 0; background-color: #ebf7ff; } .dropdown-menu .dropdown-menu > .dropdown-infinite > .disabled > a, .dropdown-menu .dropdown-menu > .dropdown-infinite > .disabled > a:focus, .dropdown-menu .dropdown-menu > .dropdown-infinite > .disabled > a:hover { color: #c0c2c4; } .dropdown-menu .dropdown-menu > .dropdown-infinite > .disabled > a:focus, .dropdown-menu .dropdown-menu > .dropdown-infinite > .disabled > a:hover { text-decoration: none; background-color: transparent; background-image: none; filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); cursor: not-allowed; } .open > .dropdown-menu { display: block; } .open > a { outline: 0; } .dropdown-menu-right { left: auto; right: 0; } .dropdown-menu-left { left: 0; right: auto; } .dropdown-header { display: block; padding: 3px 20px; font-size: 11px; line-height: 1.42857143; color: #c0c2c4; white-space: nowrap; } .dropdown-backdrop { ; left: 0; right: 0; bottom: 0; top: 0; z-index: 990; } .pull-right > .dropdown-menu { right: 0; left: auto; } .dropup .caret, .navbar-fixed-bottom .dropdown .caret { border-top: 0; border-bottom: 4px dashed; border-bottom: 4px solid \9; content: ""; } .dropup .dropdown-menu, .navbar-fixed-bottom .dropdown .dropdown-menu { top: auto; bottom: 100%; margin-bottom: 2px; } @media (min-width: 991px) { .navbar-right .dropdown-menu { left: auto; right: 0; } .navbar-right .dropdown-menu-left { left: 0; right: auto; } } .dropdown-menu, .cnqr-autocomplete-button, .cnqr-dropdown-filter { margin-top: 4px; float: none; } .dropdown-menu > li.active a, .dropdown-menu .dropdown-infinite > li.active a { -webkit-box-shadow: inset 2px 0px 0px 0px #1e69a6; box-shadow: inset 2px 0px 0px 0px #1e69a6; } .dropdown-menu > li.dropdown-header, .dropdown-menu .dropdown-infinite > li.dropdown-header, .dropdown-menu > li > a, .dropdown-menu .dropdown-infinite > li > a { padding: 3px 11px; } .dropdown-menu.dropdown-menu-rich { min-width: 552px; padding: 16px; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles { list-style-type: none; padding: 0; margin: 0; display: table; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li { width: 106px; min-width: 106px; display: table-cell; ; border-right: 1px solid #c0c2c4; padding: 0 2px; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li:first-child { padding-left: 0; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li:last-child { border-right: none; padding-right: 0; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li.active a.cnqr-outer { background-color: #ebf7ff; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li.active:before, .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li.active:after { bottom: -1px; left: 50%; border: solid transparent; content: " "; height: 0; width: 0; ; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li.active:after { border-bottom-color: #ffffff; border-width: 10px; margin-left: -10px; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li.active:before { border-bottom-color: #c0c2c4; border-width: 11px; margin-left: -11px; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li a { cursor: pointer; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li a:hover, .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li a:focus { background-color: #ebf7ff; color: #333333; text-decoration: none; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li a.cnqr-outer { height: 105px; width: 100%; font: normal normal 300 14px/17px "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; display: block; color: #333333; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li a.cnqr-outer .cnqr-inner { display: block; text-align: center; padding: 16px 10px 0; vertical-align: top; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-tiles > li a.cnqr-outer .cnqr-inner .title { font: normal normal normal 25px/35px 'oswald-regular', sans-serif; height: 35px; vertical-align: middle; padding: 0; } .dropdown-menu.dropdown-menu-rich .dropdown-menu-content { border-top: 1px solid #c0c2c4; min-height: 200px; max-height: 395px; padding-top: 16px; overflow: auto; } .dropdown-menu.dropdown-menu-autocomplete { max-height: 200px; overflow: auto; } .dropdown-menu.dropdown-menu-autocomplete-shiftdown { margin-top: 36px; max-height: 384px; overflow: auto; } .dropdown-menu.dropdown-menu-headers > li > a { padding-left: 32px; } .dropdown-menu.dropdown-menu-headers > li.dropdown-header { padding-left: 16px; } .dropdown-menu.dropdown-menu-headers > li.dropdown-orphan > a { padding-left: 16px; } .dropdown-header, .dropdown-no-items-found { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; font-size: 13px; color: #333333; font-weight: bold; } .dropdown-no-items-found { text-align: center; padding: 3px 0; } .dropdown-menu > .active > a:focus { outline: 1px dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } .cnqr-popper-autocomplete, .cnqr-popper-dropdown-menu { z-index: 1075; } .cnqr-popper-autocomplete[data-placement^="top"] > .dropdown-menu, .cnqr-popper-dropdown-menu[data-placement^="top"] > .dropdown-menu { margin-top: 0; margin-bottom: 4px; } .cnqr-popper-autocomplete .dropdown-menu, .cnqr-popper-dropdown-menu .dropdown-menu { ; display: block; } .dropdown-infinite { list-style: none; padding-left: 0; padding-right: 0; } label { display: inline-block; max-width: 100%; margin-bottom: 5px; font-weight: bold; font: normal normal normal 11px/14px "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; color: #333333; ; } input[type="search"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: none; } input[type="radio"], input[type="checkbox"] { margin: 2px 0 0; line-height: normal; vertical-align: -2px; } input[type="radio"][disabled], input[type="checkbox"][disabled], input[type="radio"].disabled, input[type="checkbox"].disabled, fieldset[disabled] input[type="radio"], fieldset[disabled] input[type="checkbox"] { cursor: not-allowed; } input[type="file"] { display: block; } input[type="range"] { display: block; width: 100%; } input[type="file"]:focus, input[type="radio"]:focus, input[type="checkbox"]:focus { outline: 1px dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input { height: 24px; padding: 3px 3px; font-size: 11px; line-height: 1.5; border-radius: 3px; font-weight: normal; margin-bottom: 0; color: #333333; background-color: #ffffff; background-image: none; border: 1px solid #999ca0; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; } selectselect, selecttextarea, selectinput[type="text"], selectinput[type="password"], selectinput[type="datetime"], selectinput[type="datetime-local"], selectinput[type="date"], selectinput[type="month"], selectinput[type="time"], selectinput[type="week"], selectinput[type="number"], selectinput[type="email"], selectinput[type="url"], selectinput[type="search"], selectinput[type="tel"], selectinput[type="color"], select.uneditable-input { height: 24px; line-height: 24px; } select:focus, textarea:focus, input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, .uneditable-input:focus { border-color: #66afe9; outline: 0; z-index: 1; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); } select::-moz-placeholder, textarea::-moz-placeholder, input[type="text"]::-moz-placeholder, input[type="password"]::-moz-placeholder, input[type="datetime"]::-moz-placeholder, input[type="datetime-local"]::-moz-placeholder, input[type="date"]::-moz-placeholder, input[type="month"]::-moz-placeholder, input[type="time"]::-moz-placeholder, input[type="week"]::-moz-placeholder, input[type="number"]::-moz-placeholder, input[type="email"]::-moz-placeholder, input[type="url"]::-moz-placeholder, input[type="search"]::-moz-placeholder, input[type="tel"]::-moz-placeholder, input[type="color"]::-moz-placeholder, .uneditable-input::-moz-placeholder { color: #999ca0; opacity: 1; } select:-ms-input-placeholder, textarea:-ms-input-placeholder, input[type="text"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder, input[type="datetime"]:-ms-input-placeholder, input[type="datetime-local"]:-ms-input-placeholder, input[type="date"]:-ms-input-placeholder, input[type="month"]:-ms-input-placeholder, input[type="time"]:-ms-input-placeholder, input[type="week"]:-ms-input-placeholder, input[type="number"]:-ms-input-placeholder, input[type="email"]:-ms-input-placeholder, input[type="url"]:-ms-input-placeholder, input[type="search"]:-ms-input-placeholder, input[type="tel"]:-ms-input-placeholder, input[type="color"]:-ms-input-placeholder, .uneditable-input:-ms-input-placeholder { color: #999ca0; } select::-webkit-input-placeholder, textarea::-webkit-input-placeholder, input[type="text"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder, input[type="datetime"]::-webkit-input-placeholder, input[type="datetime-local"]::-webkit-input-placeholder, input[type="date"]::-webkit-input-placeholder, input[type="month"]::-webkit-input-placeholder, input[type="time"]::-webkit-input-placeholder, input[type="week"]::-webkit-input-placeholder, input[type="number"]::-webkit-input-placeholder, input[type="email"]::-webkit-input-placeholder, input[type="url"]::-webkit-input-placeholder, input[type="search"]::-webkit-input-placeholder, input[type="tel"]::-webkit-input-placeholder, input[type="color"]::-webkit-input-placeholder, .uneditable-input::-webkit-input-placeholder { color: #999ca0; } select[disabled], textarea[disabled], input[type="text"][disabled], input[type="password"][disabled], input[type="datetime"][disabled], input[type="datetime-local"][disabled], input[type="date"][disabled], input[type="month"][disabled], input[type="time"][disabled], input[type="week"][disabled], input[type="number"][disabled], input[type="email"][disabled], input[type="url"][disabled], input[type="search"][disabled], input[type="tel"][disabled], input[type="color"][disabled], .uneditable-input[disabled], select[readonly], textarea[readonly], input[type="text"][readonly], input[type="password"][readonly], input[type="datetime"][readonly], input[type="datetime-local"][readonly], input[type="date"][readonly], input[type="month"][readonly], input[type="time"][readonly], input[type="week"][readonly], input[type="number"][readonly], input[type="email"][readonly], input[type="url"][readonly], input[type="search"][readonly], input[type="tel"][readonly], input[type="color"][readonly], .uneditable-input[readonly], fieldset[disabled] select, fieldset[disabled] textarea, fieldset[disabled] input[type="text"], fieldset[disabled] input[type="password"], fieldset[disabled] input[type="datetime"], fieldset[disabled] input[type="datetime-local"], fieldset[disabled] input[type="date"], fieldset[disabled] input[type="month"], fieldset[disabled] input[type="time"], fieldset[disabled] input[type="week"], fieldset[disabled] input[type="number"], fieldset[disabled] input[type="email"], fieldset[disabled] input[type="url"], fieldset[disabled] input[type="search"], fieldset[disabled] input[type="tel"], fieldset[disabled] input[type="color"], fieldset[disabled] .uneditable-input { cursor: not-allowed; background-color: #ffffff; opacity: 1; } select[disabled], textarea[disabled], input[type="text"][disabled], input[type="password"][disabled], input[type="datetime"][disabled], input[type="datetime-local"][disabled], input[type="date"][disabled], input[type="month"][disabled], input[type="time"][disabled], input[type="week"][disabled], input[type="number"][disabled], input[type="email"][disabled], input[type="url"][disabled], input[type="search"][disabled], input[type="tel"][disabled], input[type="color"][disabled], .uneditable-input[disabled] { border: 1px solid #ccced0; color: #999999; } select.form-control.input-sm, textarea.form-control.input-sm, input[type="text"].form-control.input-sm, input[type="password"].form-control.input-sm, input[type="datetime"].form-control.input-sm, input[type="datetime-local"].form-control.input-sm, input[type="date"].form-control.input-sm, input[type="month"].form-control.input-sm, input[type="time"].form-control.input-sm, input[type="week"].form-control.input-sm, input[type="number"].form-control.input-sm, input[type="email"].form-control.input-sm, input[type="url"].form-control.input-sm, input[type="search"].form-control.input-sm, input[type="tel"].form-control.input-sm, input[type="color"].form-control.input-sm, .uneditable-input.form-control.input-sm, select.form-control.form-group-sm .form-control, textarea.form-control.form-group-sm .form-control, input[type="text"].form-control.form-group-sm .form-control, input[type="password"].form-control.form-group-sm .form-control, input[type="datetime"].form-control.form-group-sm .form-control, input[type="datetime-local"].form-control.form-group-sm .form-control, input[type="date"].form-control.form-group-sm .form-control, input[type="month"].form-control.form-group-sm .form-control, input[type="time"].form-control.form-group-sm .form-control, input[type="week"].form-control.form-group-sm .form-control, input[type="number"].form-control.form-group-sm .form-control, input[type="email"].form-control.form-group-sm .form-control, input[type="url"].form-control.form-group-sm .form-control, input[type="search"].form-control.form-group-sm .form-control, input[type="tel"].form-control.form-group-sm .form-control, input[type="color"].form-control.form-group-sm .form-control, .uneditable-input.form-control.form-group-sm .form-control { height: 18px; padding: 0 3px; font-size: 11px; line-height: 1.5; border-radius: 3px; } selectselect.form-control.input-sm, selecttextarea.form-control.input-sm, selectinput[type="text"].form-control.input-sm, selectinput[type="password"].form-control.input-sm, selectinput[type="datetime"].form-control.input-sm, selectinput[type="datetime-local"].form-control.input-sm, selectinput[type="date"].form-control.input-sm, selectinput[type="month"].form-control.input-sm, selectinput[type="time"].form-control.input-sm, selectinput[type="week"].form-control.input-sm, selectinput[type="number"].form-control.input-sm, selectinput[type="email"].form-control.input-sm, selectinput[type="url"].form-control.input-sm, selectinput[type="search"].form-control.input-sm, selectinput[type="tel"].form-control.input-sm, selectinput[type="color"].form-control.input-sm, select.uneditable-input.form-control.input-sm, selectselect.form-control.form-group-sm .form-control, selecttextarea.form-control.form-group-sm .form-control, selectinput[type="text"].form-control.form-group-sm .form-control, selectinput[type="password"].form-control.form-group-sm .form-control, selectinput[type="datetime"].form-control.form-group-sm .form-control, selectinput[type="datetime-local"].form-control.form-group-sm .form-control, selectinput[type="date"].form-control.form-group-sm .form-control, selectinput[type="month"].form-control.form-group-sm .form-control, selectinput[type="time"].form-control.form-group-sm .form-control, selectinput[type="week"].form-control.form-group-sm .form-control, selectinput[type="number"].form-control.form-group-sm .form-control, selectinput[type="email"].form-control.form-group-sm .form-control, selectinput[type="url"].form-control.form-group-sm .form-control, selectinput[type="search"].form-control.form-group-sm .form-control, selectinput[type="tel"].form-control.form-group-sm .form-control, selectinput[type="color"].form-control.form-group-sm .form-control, select.uneditable-input.form-control.form-group-sm .form-control { height: 18px; line-height: 18px; } select.form-control.input-lg, textarea.form-control.input-lg, input[type="text"].form-control.input-lg, input[type="password"].form-control.input-lg, input[type="datetime"].form-control.input-lg, input[type="datetime-local"].form-control.input-lg, input[type="date"].form-control.input-lg, input[type="month"].form-control.input-lg, input[type="time"].form-control.input-lg, input[type="week"].form-control.input-lg, input[type="number"].form-control.input-lg, input[type="email"].form-control.input-lg, input[type="url"].form-control.input-lg, input[type="search"].form-control.input-lg, input[type="tel"].form-control.input-lg, input[type="color"].form-control.input-lg, .uneditable-input.form-control.input-lg, select.form-control.form-group-lg .form-control, textarea.form-control.form-group-lg .form-control, input[type="text"].form-control.form-group-lg .form-control, input[type="password"].form-control.form-group-lg .form-control, input[type="datetime"].form-control.form-group-lg .form-control, input[type="datetime-local"].form-control.form-group-lg .form-control, input[type="date"].form-control.form-group-lg .form-control, input[type="month"].form-control.form-group-lg .form-control, input[type="time"].form-control.form-group-lg .form-control, input[type="week"].form-control.form-group-lg .form-control, input[type="number"].form-control.form-group-lg .form-control, input[type="email"].form-control.form-group-lg .form-control, input[type="url"].form-control.form-group-lg .form-control, input[type="search"].form-control.form-group-lg .form-control, input[type="tel"].form-control.form-group-lg .form-control, input[type="color"].form-control.form-group-lg .form-control, .uneditable-input.form-control.form-group-lg .form-control { height: 36px; padding: 4px 8px; font-size: 16px; line-height: 21px; border-radius: 6px; } selectselect.form-control.input-lg, selecttextarea.form-control.input-lg, selectinput[type="text"].form-control.input-lg, selectinput[type="password"].form-control.input-lg, selectinput[type="datetime"].form-control.input-lg, selectinput[type="datetime-local"].form-control.input-lg, selectinput[type="date"].form-control.input-lg, selectinput[type="month"].form-control.input-lg, selectinput[type="time"].form-control.input-lg, selectinput[type="week"].form-control.input-lg, selectinput[type="number"].form-control.input-lg, selectinput[type="email"].form-control.input-lg, selectinput[type="url"].form-control.input-lg, selectinput[type="search"].form-control.input-lg, selectinput[type="tel"].form-control.input-lg, selectinput[type="color"].form-control.input-lg, select.uneditable-input.form-control.input-lg, selectselect.form-control.form-group-lg .form-control, selecttextarea.form-control.form-group-lg .form-control, selectinput[type="text"].form-control.form-group-lg .form-control, selectinput[type="password"].form-control.form-group-lg .form-control, selectinput[type="datetime"].form-control.form-group-lg .form-control, selectinput[type="datetime-local"].form-control.form-group-lg .form-control, selectinput[type="date"].form-control.form-group-lg .form-control, selectinput[type="month"].form-control.form-group-lg .form-control, selectinput[type="time"].form-control.form-group-lg .form-control, selectinput[type="week"].form-control.form-group-lg .form-control, selectinput[type="number"].form-control.form-group-lg .form-control, selectinput[type="email"].form-control.form-group-lg .form-control, selectinput[type="url"].form-control.form-group-lg .form-control, selectinput[type="search"].form-control.form-group-lg .form-control, selectinput[type="tel"].form-control.form-group-lg .form-control, selectinput[type="color"].form-control.form-group-lg .form-control, select.uneditable-input.form-control.form-group-lg .form-control { height: 36px; line-height: 36px; } select.input-validation-error, textarea.input-validation-error, input[type="text"].input-validation-error, input[type="password"].input-validation-error, input[type="datetime"].input-validation-error, input[type="datetime-local"].input-validation-error, input[type="date"].input-validation-error, input[type="month"].input-validation-error, input[type="time"].input-validation-error, input[type="week"].input-validation-error, input[type="number"].input-validation-error, input[type="email"].input-validation-error, input[type="url"].input-validation-error, input[type="search"].input-validation-error, input[type="tel"].input-validation-error, input[type="color"].input-validation-error, .uneditable-input.input-validation-error { z-index: 1; border: 1px solid #ca202c; } select.input-validation-error:focus, textarea.input-validation-error:focus, input[type="text"].input-validation-error:focus, input[type="password"].input-validation-error:focus, input[type="datetime"].input-validation-error:focus, input[type="datetime-local"].input-validation-error:focus, input[type="date"].input-validation-error:focus, input[type="month"].input-validation-error:focus, input[type="time"].input-validation-error:focus, input[type="week"].input-validation-error:focus, input[type="number"].input-validation-error:focus, input[type="email"].input-validation-error:focus, input[type="url"].input-validation-error:focus, input[type="search"].input-validation-error:focus, input[type="tel"].input-validation-error:focus, input[type="color"].input-validation-error:focus, .uneditable-input.input-validation-error:focus { outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(202, 32, 44, 0.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(202, 32, 44, 0.6); } select.input-validation-warning, textarea.input-validation-warning, input[type="text"].input-validation-warning, input[type="password"].input-validation-warning, input[type="datetime"].input-validation-warning, input[type="datetime-local"].input-validation-warning, input[type="date"].input-validation-warning, input[type="month"].input-validation-warning, input[type="time"].input-validation-warning, input[type="week"].input-validation-warning, input[type="number"].input-validation-warning, input[type="email"].input-validation-warning, input[type="url"].input-validation-warning, input[type="search"].input-validation-warning, input[type="tel"].input-validation-warning, input[type="color"].input-validation-warning, .uneditable-input.input-validation-warning { z-index: 1; border: 1px solid #c08600; } select.input-validation-warning:focus, textarea.input-validation-warning:focus, input[type="text"].input-validation-warning:focus, input[type="password"].input-validation-warning:focus, input[type="datetime"].input-validation-warning:focus, input[type="datetime-local"].input-validation-warning:focus, input[type="date"].input-validation-warning:focus, input[type="month"].input-validation-warning:focus, input[type="time"].input-validation-warning:focus, input[type="week"].input-validation-warning:focus, input[type="number"].input-validation-warning:focus, input[type="email"].input-validation-warning:focus, input[type="url"].input-validation-warning:focus, input[type="search"].input-validation-warning:focus, input[type="tel"].input-validation-warning:focus, input[type="color"].input-validation-warning:focus, .uneditable-input.input-validation-warning:focus { outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(192, 134, 0, 0.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(192, 134, 0, 0.6); } select { padding: 3px 3px 3px 1px; } select.form-control.input-lg { padding-left: 4px; } select.form-control.input-sm { padding: 0; } select.form-control.input-lg[multiple], select.form-control.input-sm[multiple], select.form-control.input-lg[size], select.form-control.input-sm[size] { padding: 0; height: auto; } select[multiple], select[size] { padding: 0; height: auto; } textarea { height: auto; } textarea.form-control.input-lg, textarea.form-control.input-sm { height: auto; } @media screen and (-webkit-min-device-pixel-ratio: 0) { input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"] { line-height: 24px; } input[type="date"].input-sm, input[type="time"].input-sm, input[type="datetime-local"].input-sm, input[type="month"].input-sm { line-height: 18px; } input[type="date"].input-lg, input[type="time"].input-lg, input[type="datetime-local"].input-lg, input[type="month"].input-lg { line-height: 36px; } } .form-group { margin-bottom: 15px; } .form-group:before, .form-group:after { content: " "; display: table; } .form-group:after { clear: both; } .form-group:before, .form-group:after { content: " "; display: table; } .form-group:after { clear: both; } .form-group.form-group-full .form-control { width: 100%; } .form-group.form-group-full .input-group-flex > .form-control { width: 0; } .form-group label { display: inline-block; } .form-group .form-control, .form-group .cnqr-popper-target { display: block; } .form-group .cnqr-popper-target.cnqr-popper-target-quick-help { display: inline-flex; } .form-group .input-group > .cnqr-popper-target { display: flex; } .form-group textarea.form-control { height: auto; } .form-group.form-group-sm .form-control { height: 18px; padding: 0 3px; font-size: 11px; line-height: 1.5; border-radius: 3px; } select.form-group.form-group-sm .form-control { height: 18px; line-height: 18px; } .form-group.form-group-sm textarea.form-control { height: auto; } .form-group.form-group-lg .form-control { height: 36px; padding: 4px 8px; font-size: 16px; line-height: 21px; border-radius: 6px; } select.form-group.form-group-lg .form-control { height: 36px; line-height: 36px; } .form-group.form-group-lg textarea.form-control { height: auto; } .radio, .checkbox { ; display: block; margin-top: 10px; margin-bottom: 10px; } .radio label, .checkbox label { min-height: 18px; padding-left: 20px; margin-bottom: 0; font-weight: normal; cursor: pointer; } .radio.disabled label, .checkbox.disabled label, fieldset[disabled] .radio label, fieldset[disabled] .checkbox label { cursor: not-allowed; } .radio input[type="radio"], .radio-inline input[type="radio"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] { ; margin-left: -20px; } .radio + .radio, .checkbox + .checkbox { margin-top: -5px; } .radio-inline, .checkbox-inline { display: inline-block; padding-left: 20px; margin-bottom: 0; vertical-align: middle; font-weight: normal; cursor: pointer; } .radio-inline.disabled, .checkbox-inline.disabled, fieldset[disabled] .radio-inline, fieldset[disabled] .checkbox-inline { cursor: not-allowed; } .radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline { margin-top: 0; margin-left: 10px; } .help-block { display: block; margin-top: 5px; margin-bottom: 10px; color: #737373; } .form-inline { margin: 0; } @media (min-width: 768px) { .form-inline .form-group { display: inline-block; margin-bottom: 0; vertical-align: middle; } .form-inline .form-control { display: inline-block; width: auto; vertical-align: middle; } .form-inline .form-control-static { display: inline-block; } .form-inline .input-group { display: inline-table; vertical-align: middle; } .form-inline .input-group .input-group-addon, .form-inline .input-group .input-group-btn, .form-inline .input-group .form-control { width: auto; } .form-inline .input-group > .form-control { width: 100%; } .form-inline .control-label { margin-bottom: 0; vertical-align: middle; } .form-inline .radio, .form-inline .checkbox { display: inline-block; margin-top: 0; margin-bottom: 0; vertical-align: middle; } .form-inline .radio label, .form-inline .checkbox label { padding-left: 0; } .form-inline .radio input[type="radio"], .form-inline .checkbox input[type="checkbox"] { ; margin-left: 0; } } .form-horizontal .radio, .form-horizontal .checkbox, .form-horizontal .radio-inline, .form-horizontal .checkbox-inline { margin-top: 0; margin-bottom: 0; padding-top: 4px; } .form-horizontal .radio, .form-horizontal .checkbox { min-height: 22px; } .form-horizontal .form-group { margin-left: -16px; margin-right: -16px; } @media (min-width: 768px) { .form-horizontal .control-label { text-align: right; margin-bottom: 0; padding-top: 4px; } } .form-horizontal .has-feedback .form-control-feedback { right: 16px; } @media (min-width: 768px) { .form-horizontal .form-group-lg .control-label { padding-top: 12.42857143px; } } @media (min-width: 768px) { .form-horizontal .form-group-sm .control-label { padding-top: 1; } } input, button, select, textarea { font-family: "Helvetica Neue", Helvetica, 'Segoe UI', Arial, sans-serif; } .form-control.uneditable-input, .form-control:disabled { color: #72777b; } input[type="checkbox"] + label, input[type="radio"] + label { margin-left: 2px; } /* basic.css defines all links to have an underline, so we need to knock out the ones that should not be underlined */ .navbar-nav > li > a { text-decoration: none; } .modal-dialog { border: 0; } .modal-dialog .modal-content { border-radius: 0; } .modal-dialog .modal-header { padding: 16px 16px 0 16px; border-bottom: 0; } .modal-dialog .modal-header h3, .modal-dialog .modal-header .h3 { font: normal normal normal 18px/18px "Helvetica Neue", Helvetica, "Segoe UI Semibold", sans-serif; border-bottom: 1px solid #72777b; margin: 0; padding: 0 0 10px 0; } .modal-dialog .modal-body { max-height: 550px; overflow-y: auto; margin: 0 16px 0 16px; } .modal-dialog .modal-body:before, .modal-dialog .modal-body:after { content: " "; display: table; } .modal-dialog .modal-body:after { clear: both; } .modal-dialog .modal-body:before, .modal-dialog .modal-body:after { content: " "; display: table; } .modal-dialog .modal-body:after { clear: both; } .modal-dialog .modal-footer { border-top: 1px solid #72777b; clear: both; padding: 16px 0 0 0; margin: 0 16px 16px 16px; } .modal-dialog .modal-footer .pull-right.btn + .btn { margin: 0 5px 0 0; } .modal-dialog.cnqr-fill-content .ui-dialog-content { padding: 0; } .modal-dialog.cnqr-fullscreen .ui-dialog-titlebar { display: none; } .modal-dialog.cnqr-fullscreen .ui-dialog-content { margin: 0; } .modal-dialog.cnqr-fullscreen.ui-dialog { border-radius: 0; } @media (max-width: 768px) { .modal-dialog { margin: 0; } } @media (max-height: 768px) { .modal-dialog { margin-top: 0; margin-bottom: 0; } } .tooltip-inner { text-align: left; font-size: 13px; border-radius: 0; background-image: none; padding: 11px 16px; border-radius: 3px; } .pagination-lg > li > a, .pagination-lg > li > span { padding: 10px 16px; font-size: 18px; line-height: 1.42857143; } .pagination-lg > li:first-child > a, .pagination-lg > li:first-child > span { border-bottom-left-radius: 6px; border-top-left-radius: 6px; } .pagination-lg > li:last-child > a, .pagination-lg > li:last-child > span { border-bottom-right-radius: 6px; border-top-right-radius: 6px; } .pagination > li > a, .pagination > li > span { padding: 6px 12px; } .pagination-sm > li > a, .pagination-sm > li > span { padding: 5px 10px; font-size: 11px; line-height: 1.5; } .pagination-sm > li:first-child > a, .pagination-sm > li:first-child > span { border-bottom-left-radius: 3px; border-top-left-radius: 3px; } .pagination-sm > li:last-child > a, .pagination-sm > li:last-child > span { border-bottom-right-radius: 3px; border-top-right-radius: 3px; } .clearfix:before, .clearfix:after, .dl-horizontal dd:before, .dl-horizontal dd:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .btn-toolbar:before, .btn-toolbar:after, .btn-group-vertical > .btn-group:before, .btn-group-vertical > .btn-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after, .pager:before, .pager:after, .modal-header:before, .modal-header:after, .modal-footer:before, .modal-footer:after, .tab-content > .tab-pane > .tab-pane-footer:before, .tab-content > .tab-pane > .tab-pane-footer:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after { content: " "; display: table; } .clearfix:after, .dl-horizontal dd:after, .container:after, .container-fluid:after, .row:after, .btn-toolbar:after, .btn-group-vertical > .btn-group:after, .nav:after, .navbar:after, .navbar-header:after, .navbar-collapse:after, .pager:after, .modal-header:after, .modal-footer:after, .tab-content > .tab-pane > .tab-pane-footer:after, .form-horizontal .form-group:after { clear: both; } .center-block { display: block; margin-left: auto; margin-right: auto; } .pull-right { float: right !important; } .pull-left { float: left !important; } .hide { display: none !important; } .show { display: block !important; } .invisible { visibility: hidden; } .text-hide { font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0; } .hidden { display: none !important; } .affix { ; } @-ms-viewport { width: device-width; } .visible-xs, .visible-sm, .visible-md, .visible-lg { display: none !important; } .visible-xs-block, .visible-xs-inline, .visible-xs-inline-block, .visible-sm-block, .visible-sm-inline, .visible-sm-inline-block, .visible-md-block, .visible-md-inline, .visible-md-inline-block, .visible-lg-block, .visible-lg-inline, .visible-lg-inline-block { display: none !important; } @media (max-width: 767px) { .visible-xs { display: block !important; } table.visible-xs { display: table !important; } tr.visible-xs { display: table-row !important; } th.visible-xs, td.visible-xs { display: table-cell !important; } } @media (max-width: 767px) { .visible-xs-block { display: block !important; } } @media (max-width: 767px) { .visible-xs-inline { display: inline !important; } } @media (max-width: 767px) { .visible-xs-inline-block { display: inline-block !important; } } @media (min-width: 768px) and (max-width: 991px) { .visible-sm { display: block !important; } table.visible-sm { display: table !important; } tr.visible-sm { display: table-row !important; } th.visible-sm, td.visible-sm { display: table-cell !important; } } @media (min-width: 768px) and (max-width: 991px) { .visible-sm-block { display: block !important; } } @media (min-width: 768px) and (max-width: 991px) { .visible-sm-inline { display: inline !important; } } @media (min-width: 768px) and (max-width: 991px) { .visible-sm-inline-block { display: inline-block !important; } } @media (min-width: 992px) and (max-width: 1199px) { .visible-md { display: block !important; } table.visible-md { display: table !important; } tr.visible-md { display: table-row !important; } th.visible-md, td.visible-md { display: table-cell !important; } } @media (min-width: 992px) and (max-width: 1199px) { .visible-md-block { display: block !important; } } @media (min-width: 992px) and (max-width: 1199px) { .visible-md-inline { display: inline !important; } } @media (min-width: 992px) and (max-width: 1199px) { .visible-md-inline-block { display: inline-block !important; } } @media (min-width: 1200px) { .visible-lg { display: block !important; } table.visible-lg { display: table !important; } tr.visible-lg { display: table-row !important; } th.visible-lg, td.visible-lg { display: table-cell !important; } } @media (min-width: 1200px) { .visible-lg-block { display: block !important; } } @media (min-width: 1200px) { .visible-lg-inline { display: inline !important; } } @media (min-width: 1200px) { .visible-lg-inline-block { display: inline-block !important; } } @media (max-width: 767px) { .hidden-xs { display: none !important; } } @media (min-width: 768px) and (max-width: 991px) { .hidden-sm { display: none !important; } } @media (min-width: 992px) and (max-width: 1199px) { .hidden-md { display: none !important; } } @media (min-width: 1200px) { .hidden-lg { display: none !important; } } .visible-print { display: none !important; } @media print { .visible-print { display: block !important; } table.visible-print { display: table !important; } tr.visible-print { display: table-row !important; } th.visible-print, td.visible-print { display: table-cell !important; } } .visible-print-block { display: none !important; } @media print { .visible-print-block { display: block !important; } } .visible-print-inline { display: none !important; } @media print { .visible-print-inline { display: inline !important; } } .visible-print-inline-block { display: none !important; } @media print { .visible-print-inline-block { display: inline-block !important; } } @media print { .hidden-print { display: none !important; } } @media (max-width: 767px) { .cnqr-col-no-gutter-xs { padding: 0; } } @media (min-width: 768px) and (max-width: 991px) { .cnqr-col-no-gutter-sm { padding: 0; } } input.readfield { width: 50px; background-color: #ddd; } input.readfield2 { width: 40px; background-color: #ddd; } input.readfield3 { width: 70px; background-color: #ddd; } input.timeformat2 { width: 50px; } .outside { overflow: hidden; } .GridViewScrollHeader TH, .GridViewScrollHeader TD { padding: 10px; font-weight: normal; white-space: nowrap; border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; background-color: #3e1152; color: #999999; text-align: left; vertical-align: bottom; } .GridViewScrollItem TD { padding: 10px; height: 80px; white-space: nowrap; border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; background-color: #FFFFFF; color: #444444; } .GridViewScrollItemFreeze TD { padding: 10px; height: 80px; white-space: nowrap; border-right: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; background-color: #eeeded; color: #444444; } .GridViewScrollFooterFreeze TD { white-space: nowrap; border-right: 1px solid #e6e6e6; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; background-color: #ffffff; color: #444444; } </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.js"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" crossorigin="anonymous"></script> <script type="text/javascript"> /* * GridViewScroll with jQuery v1.0.0.3 * http://gridviewscroll.aspcity.idv.tw/ * Copyright (c) 2017 Likol Lee * Released under the MIT license * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN * THE SOFTWARE. */ var GridViewScrollOptions = /** @class */ (function () { function GridViewScrollOptions() { } return GridViewScrollOptions; }()); var GridViewScrollScrollPosition = /** @class */ (function () { function GridViewScrollScrollPosition() { } return GridViewScrollScrollPosition; }()); var GridViewScroll = /** @class */ (function () { function GridViewScroll(options) { this._initialized = false; if (options.elementID == null) options.elementID = ""; if (options.width == null) options.width = "700"; if (options.height == null) options.height = "350"; if (options.freezeColumnCssClass == null) options.freezeColumnCssClass = ""; if (options.freezeFooterCssClass == null) options.freezeFooterCssClass = ""; if (options.freezeHeaderRowCount == null) options.freezeHeaderRowCount = 1; if (options.freezeColumnCount == null) options.freezeColumnCount = 1; this.initializeOptions(options); } GridViewScroll.prototype.initializeOptions = function (options) { this.GridID = options.elementID; this.GridWidth = options.width; this.GridHeight = options.height; this.FreezeColumn = options.freezeColumn; this.FreezeFooter = options.freezeFooter; this.FreezeColumnCssClass = options.freezeColumnCssClass; this.FreezeFooterCssClass = options.freezeFooterCssClass; this.FreezeHeaderRowCount = options.freezeHeaderRowCount; this.FreezeColumnCount = options.freezeColumnCount; this.OnScroll = options.onscroll; }; GridViewScroll.prototype.enhance = function () { this.FreezeCellWidths = []; this.IsVerticalScrollbarEnabled = false; this.IsHorizontalScrollbarEnabled = false; if (this.GridID == null || this.GridID == "") { return; } this.ContentGrid = document.getElementById(this.GridID); if (this.ContentGrid == null) { return; } if (this.ContentGrid.rows.length < 2) { return; } if (this._initialized) { this.undo(); } this._initialized = true; this.Parent = this.ContentGrid.parentNode; this.ContentGrid.style.display = "none"; if (typeof this.GridWidth == 'string' && this.GridWidth.indexOf("%") > -1) { var percentage = parseInt(this.GridWidth); this.Width = this.Parent.offsetWidth * percentage / 100; } else { this.Width = parseInt(this.GridWidth); } if (typeof this.GridHeight == 'string' && this.GridHeight.indexOf("%") > -1) { var percentage = parseInt(this.GridHeight); this.Height = this.Parent.offsetHeight * percentage / 100; } else { this.Height = parseInt(this.GridHeight); } this.ContentGrid.style.display = ""; this.ContentGridHeaderRows = this.getGridHeaderRows(); this.ContentGridItemRow = this.ContentGrid.rows.item(this.FreezeHeaderRowCount); var footerIndex = this.ContentGrid.rows.length - 1; this.ContentGridFooterRow = this.ContentGrid.rows.item(footerIndex); this.Content = document.createElement('div'); this.Content.id = this.GridID + "_Content"; this.Content.style.position = "relative"; this.Content = this.Parent.insertBefore(this.Content, this.ContentGrid); this.ContentFixed = document.createElement('div'); this.ContentFixed.id = this.GridID + "_Content_Fixed"; this.ContentFixed.style.overflow = "auto"; this.ContentFixed = this.Content.appendChild(this.ContentFixed); this.ContentGrid = this.ContentFixed.appendChild(this.ContentGrid); this.ContentFixed.style.width = String(this.Width) + "px"; if (this.ContentGrid.offsetWidth > this.Width) { this.IsHorizontalScrollbarEnabled = true; } if (this.ContentGrid.offsetHeight > this.Height) { this.IsVerticalScrollbarEnabled = true; } this.Header = document.createElement('div'); this.Header.id = this.GridID + "_Header"; this.Header.style.position = "relative"; this.HeaderFixed = document.createElement('div'); this.HeaderFixed.id = this.GridID + "_Header_Fixed"; this.HeaderFixed.style.overflow = "hidden"; this.Header = this.Parent.insertBefore(this.Header, this.Content); this.HeaderFixed = this.Header.appendChild(this.HeaderFixed); this.ScrollbarWidth = this.getScrollbarWidth(); this.prepareHeader(); this.calculateHeader(); this.Header.style.width = String(this.Width) + "px"; if (this.IsVerticalScrollbarEnabled) { this.HeaderFixed.style.width = String(this.Width - this.ScrollbarWidth) + "px"; if (this.IsHorizontalScrollbarEnabled) { this.ContentFixed.style.width = this.HeaderFixed.style.width; if (this.isRTL()) { this.ContentFixed.style.paddingLeft = String(this.ScrollbarWidth) + "px"; } else { this.ContentFixed.style.paddingRight = String(this.ScrollbarWidth) + "px"; } } this.ContentFixed.style.height = String(this.Height - this.Header.offsetHeight) + "px"; } else { this.HeaderFixed.style.width = this.Header.style.width; this.ContentFixed.style.width = this.Header.style.width; } if (this.FreezeColumn && this.IsHorizontalScrollbarEnabled) { this.appendFreezeHeader(); this.appendFreezeContent(); } if (this.FreezeFooter && this.IsVerticalScrollbarEnabled) { this.appendFreezeFooter(); if (this.FreezeColumn && this.IsHorizontalScrollbarEnabled) { this.appendFreezeFooterColumn(); } } var self = this; this.ContentFixed.onscroll = function (event) { var scrollTop = self.ContentFixed.scrollTop; var scrollLeft = self.ContentFixed.scrollLeft; self.HeaderFixed.scrollLeft = scrollLeft; if (self.ContentFreeze != null) self.ContentFreeze.scrollTop = scrollTop; if (self.FooterFreeze != null) self.FooterFreeze.scrollLeft = scrollLeft; if (self.OnScroll != null) { self.OnScroll(scrollTop, scrollLeft); } }; }; Object.defineProperty(GridViewScroll.prototype, "scrollPosition", { get: function () { var position = new GridViewScrollScrollPosition(); position.scrollTop = this.ContentFixed.scrollTop; position.scrollLeft = this.ContentFixed.scrollLeft; return position; }, set: function (gridViewScrollScrollPosition) { var scrollTop = gridViewScrollScrollPosition.scrollTop; var scrollLeft = gridViewScrollScrollPosition.scrollLeft; this.ContentFixed.scrollTop = scrollTop; this.ContentFixed.scrollLeft = scrollLeft; if (this.ContentFreeze != null) this.ContentFreeze.scrollTop = scrollTop; if (this.FooterFreeze != null) this.FooterFreeze.scrollLeft = scrollLeft; }, enumerable: true, configurable: true }); GridViewScroll.prototype.getGridHeaderRows = function () { var gridHeaderRows = new Array(); for (var i = 0; i < this.FreezeHeaderRowCount; i++) { gridHeaderRows.push(this.ContentGrid.rows.item(i)); } return gridHeaderRows; }; GridViewScroll.prototype.prepareHeader = function () { this.HeaderGrid = this.ContentGrid.cloneNode(false); this.HeaderGrid.id = this.GridID + "_Header_Fixed_Grid"; this.HeaderGrid = this.HeaderFixed.appendChild(this.HeaderGrid); this.prepareHeaderGridRows(); for (var i = 0; i < this.ContentGridItemRow.cells.length; i++) { this.appendHelperElement(this.ContentGridItemRow.cells.item(i)); this.appendHelperElement(this.HeaderGridHeaderCells[i]); } }; GridViewScroll.prototype.prepareHeaderGridRows = function () { this.HeaderGridHeaderRows = new Array(); for (var i = 0; i < this.FreezeHeaderRowCount; i++) { var gridHeaderRow = this.ContentGridHeaderRows[i]; var headerGridHeaderRow = gridHeaderRow.cloneNode(true); this.HeaderGridHeaderRows.push(headerGridHeaderRow); this.HeaderGrid.appendChild(headerGridHeaderRow); } this.prepareHeaderGridCells(); }; GridViewScroll.prototype.prepareHeaderGridCells = function () { this.HeaderGridHeaderCells = new Array(); for (var i = 0; i < this.ContentGridItemRow.cells.length; i++) { for (var rowIndex in this.HeaderGridHeaderRows) { var cgridHeaderRow = this.HeaderGridHeaderRows[rowIndex]; var fixedCellIndex = 0; for (var cellIndex = 0; cellIndex < cgridHeaderRow.cells.length; cellIndex++) { var cgridHeaderCell = cgridHeaderRow.cells.item(cellIndex); if (cgridHeaderCell.colSpan == 1 && i == fixedCellIndex) { this.HeaderGridHeaderCells.push(cgridHeaderCell); } else { fixedCellIndex += cgridHeaderCell.colSpan - 1; } fixedCellIndex++; } } } }; GridViewScroll.prototype.calculateHeader = function () { for (var i = 0; i < this.ContentGridItemRow.cells.length; i++) { var gridItemCell = this.ContentGridItemRow.cells.item(i); var helperElement = gridItemCell.firstChild; var helperWidth = parseInt(String(helperElement.offsetWidth)); this.FreezeCellWidths.push(helperWidth); helperElement.style.width = helperWidth + "px"; helperElement = this.HeaderGridHeaderCells[i].firstChild; helperElement.style.width = helperWidth + "px"; } for (var i = 0; i < this.FreezeHeaderRowCount; i++) { this.ContentGridHeaderRows[i].style.display = "none"; } }; GridViewScroll.prototype.appendFreezeHeader = function () { this.HeaderFreeze = document.createElement('div'); this.HeaderFreeze.id = this.GridID + "_Header_Freeze"; this.HeaderFreeze.style.position = "absolute"; this.HeaderFreeze.style.overflow = "hidden"; this.HeaderFreeze.style.top = "0px"; this.HeaderFreeze.style.left = "0px"; this.HeaderFreeze.style.width = ""; this.HeaderFreezeGrid = this.HeaderGrid.cloneNode(false); this.HeaderFreezeGrid.id = this.GridID + "_Header_Freeze_Grid"; this.HeaderFreezeGrid = this.HeaderFreeze.appendChild(this.HeaderFreezeGrid); this.HeaderFreezeGridHeaderRows = new Array(); for (var i = 0; i < this.HeaderGridHeaderRows.length; i++) { var headerFreezeGridHeaderRow = this.HeaderGridHeaderRows[i].cloneNode(false); this.HeaderFreezeGridHeaderRows.push(headerFreezeGridHeaderRow); var columnIndex = 0; var columnCount = 0; while (columnCount < this.FreezeColumnCount) { var freezeColumn = this.HeaderGridHeaderRows[i].cells.item(columnIndex).cloneNode(true); headerFreezeGridHeaderRow.appendChild(freezeColumn); columnCount += freezeColumn.colSpan; columnIndex++; } this.HeaderFreezeGrid.appendChild(headerFreezeGridHeaderRow); } this.HeaderFreeze = this.Header.appendChild(this.HeaderFreeze); }; GridViewScroll.prototype.appendFreezeContent = function () { this.ContentFreeze = document.createElement('div'); this.ContentFreeze.id = this.GridID + "_Content_Freeze"; this.ContentFreeze.style.position = "absolute"; this.ContentFreeze.style.overflow = "hidden"; this.ContentFreeze.style.top = "0px"; this.ContentFreeze.style.left = "0px"; this.ContentFreeze.style.width = ""; this.ContentFreezeGrid = this.HeaderGrid.cloneNode(false); this.ContentFreezeGrid.id = this.GridID + "_Content_Freeze_Grid"; this.ContentFreezeGrid = this.ContentFreeze.appendChild(this.ContentFreezeGrid); var freezeCellHeights = []; var paddingTop = this.getPaddingTop(this.ContentGridItemRow.cells.item(0)); var paddingBottom = this.getPaddingBottom(this.ContentGridItemRow.cells.item(0)); for (var i = 0; i < this.ContentGrid.rows.length; i++) { var gridItemRow = this.ContentGrid.rows.item(i); var gridItemCell = gridItemRow.cells.item(0); var helperElement = void 0; if (gridItemCell.firstChild.className == "gridViewScrollHelper") { helperElement = gridItemCell.firstChild; } else { helperElement = this.appendHelperElement(gridItemCell); } var helperHeight = parseInt(String(gridItemCell.offsetHeight - paddingTop - paddingBottom)); freezeCellHeights.push(helperHeight); var cgridItemRow = gridItemRow.cloneNode(false); var cgridItemCell = gridItemCell.cloneNode(true); if (this.FreezeColumnCssClass != null || this.FreezeColumnCssClass != "") cgridItemRow.className = this.FreezeColumnCssClass; var columnIndex = 0; var columnCount = 0; while (columnCount < this.FreezeColumnCount) { var freezeColumn = gridItemRow.cells.item(columnIndex).cloneNode(true); cgridItemRow.appendChild(freezeColumn); columnCount += freezeColumn.colSpan; columnIndex++; } this.ContentFreezeGrid.appendChild(cgridItemRow); } for (var i = 0; i < this.ContentGrid.rows.length; i++) { var gridItemRow = this.ContentGrid.rows.item(i); var gridItemCell = gridItemRow.cells.item(0); var cgridItemRow = this.ContentFreezeGrid.rows.item(i); var cgridItemCell = cgridItemRow.cells.item(0); var helperElement = gridItemCell.firstChild; helperElement.style.height = String(freezeCellHeights[i]) + "px"; helperElement = cgridItemCell.firstChild; helperElement.style.height = String(freezeCellHeights[i]) + "px"; } if (this.IsVerticalScrollbarEnabled) { this.ContentFreeze.style.height = String(this.Height - this.Header.offsetHeight - this.ScrollbarWidth) + "px"; } else { this.ContentFreeze.style.height = String(this.ContentFixed.offsetHeight - this.ScrollbarWidth) + "px"; } this.ContentFreeze = this.Content.appendChild(this.ContentFreeze); }; GridViewScroll.prototype.appendFreezeFooter = function () { this.FooterFreeze = document.createElement('div'); this.FooterFreeze.id = this.GridID + "_Footer_Freeze"; this.FooterFreeze.style.position = "absolute"; this.FooterFreeze.style.overflow = "hidden"; this.FooterFreeze.style.left = "0px"; this.FooterFreeze.style.width = String(this.ContentFixed.offsetWidth - this.ScrollbarWidth) + "px"; this.FooterFreeze.style.height= "30px"; this.FooterFreezeGrid = this.HeaderGrid.cloneNode(false); this.FooterFreezeGrid.id = this.GridID + "_Footer_Freeze_Grid"; this.FooterFreezeGrid = this.FooterFreeze.appendChild(this.FooterFreezeGrid); this.FooterFreezeGridHeaderRow = this.ContentGridFooterRow.cloneNode(true); if (this.FreezeFooterCssClass != null || this.FreezeFooterCssClass != "") this.FooterFreezeGridHeaderRow.className = this.FreezeFooterCssClass; for (var i = 0; i < this.FooterFreezeGridHeaderRow.cells.length; i++) { var cgridHeaderCell = this.FooterFreezeGridHeaderRow.cells.item(i); var helperElement = this.appendHelperElement(cgridHeaderCell); helperElement.style.width = String(this.FreezeCellWidths[i]) + "px"; } this.FooterFreezeGridHeaderRow = this.FooterFreezeGrid.appendChild(this.FooterFreezeGridHeaderRow); this.FooterFreeze = this.Content.appendChild(this.FooterFreeze); var footerFreezeTop = this.ContentFixed.offsetHeight - this.FooterFreeze.offsetHeight; if (this.IsHorizontalScrollbarEnabled) { footerFreezeTop -= this.ScrollbarWidth; } this.FooterFreeze.style.top = String(footerFreezeTop) + "px"; }; GridViewScroll.prototype.appendFreezeFooterColumn = function () { this.FooterFreezeColumn = document.createElement('div'); this.FooterFreezeColumn.id = this.GridID + "_Footer_FreezeColumn"; this.FooterFreezeColumn.style.position = "absolute"; this.FooterFreezeColumn.style.overflow = "hidden"; this.FooterFreezeColumn.style.left = "0px"; this.FooterFreezeColumn.style.width = ""; this.FooterFreezeColumnGrid = this.HeaderGrid.cloneNode(false); this.FooterFreezeColumnGrid.id = this.GridID + "_Footer_FreezeColumn_Grid"; this.FooterFreezeColumnGrid = this.FooterFreezeColumn.appendChild(this.FooterFreezeColumnGrid); this.FooterFreezeColumnGridHeaderRow = this.FooterFreezeGridHeaderRow.cloneNode(false); this.FooterFreezeColumnGridHeaderRow = this.FooterFreezeColumnGrid.appendChild(this.FooterFreezeColumnGridHeaderRow); if (this.FreezeFooterCssClass != null) this.FooterFreezeColumnGridHeaderRow.className = this.FreezeFooterCssClass; var columnIndex = 0; var columnCount = 0; while (columnCount < this.FreezeColumnCount) { var freezeColumn = this.FooterFreezeGridHeaderRow.cells.item(columnIndex).cloneNode(true); this.FooterFreezeColumnGridHeaderRow.appendChild(freezeColumn); columnCount += freezeColumn.colSpan; columnIndex++; } var footerFreezeTop = this.ContentFixed.offsetHeight - this.FooterFreeze.offsetHeight; if (this.IsHorizontalScrollbarEnabled) { footerFreezeTop -= this.ScrollbarWidth; } this.FooterFreezeColumn.style.top = String(footerFreezeTop) + "px"; this.FooterFreezeColumn = this.Content.appendChild(this.FooterFreezeColumn); }; GridViewScroll.prototype.appendHelperElement = function (gridItemCell) { var helperElement = document.createElement('div'); helperElement.className = "gridViewScrollHelper"; while (gridItemCell.hasChildNodes()) { helperElement.appendChild(gridItemCell.firstChild); } return gridItemCell.appendChild(helperElement); }; GridViewScroll.prototype.getScrollbarWidth = function () { var innerElement = document.createElement('p'); innerElement.style.width = "100%"; innerElement.style.height = "200px"; var outerElement = document.createElement('div'); outerElement.style.position = "absolute"; outerElement.style.top = "0px"; outerElement.style.left = "0px"; outerElement.style.visibility = "hidden"; outerElement.style.width = "200px"; outerElement.style.height = "150px"; outerElement.style.overflow = "hidden"; outerElement.appendChild(innerElement); document.body.appendChild(outerElement); var innerElementWidth = innerElement.offsetWidth; outerElement.style.overflow = 'scroll'; var outerElementWidth = innerElement.offsetWidth; if (innerElementWidth === outerElementWidth) outerElementWidth = outerElement.clientWidth; document.body.removeChild(outerElement); return innerElementWidth - outerElementWidth; }; GridViewScroll.prototype.isRTL = function () { var direction = ""; if (window.getComputedStyle) { direction = window.getComputedStyle(this.ContentGrid, null).getPropertyValue('direction'); } else { direction = this.ContentGrid.currentStyle.direction; } return direction === "rtl"; }; GridViewScroll.prototype.getPaddingTop = function (element) { var value = ""; if (window.getComputedStyle) { value = window.getComputedStyle(element, null).getPropertyValue('padding-Top'); } else { value = element.currentStyle.paddingTop; } return parseInt(value); }; GridViewScroll.prototype.getPaddingBottom = function (element) { var value = ""; if (window.getComputedStyle) { value = window.getComputedStyle(element, null).getPropertyValue('padding-Bottom'); } else { value = element.currentStyle.paddingBottom; } return parseInt(value); }; GridViewScroll.prototype.undo = function () { this.undoHelperElement(); for (var _i = 0, _a = this.ContentGridHeaderRows; _i < _a.length; _i++) { var contentGridHeaderRow = _a[_i]; contentGridHeaderRow.style.display = ""; } this.Parent.insertBefore(this.ContentGrid, this.Header); this.Parent.removeChild(this.Header); this.Parent.removeChild(this.Content); this._initialized = false; }; GridViewScroll.prototype.undoHelperElement = function () { for (var i = 0; i < this.ContentGridItemRow.cells.length; i++) { var gridItemCell = this.ContentGridItemRow.cells.item(i); var helperElement = gridItemCell.firstChild; while (helperElement.hasChildNodes()) { gridItemCell.appendChild(helperElement.firstChild); } gridItemCell.removeChild(helperElement); } if (this.FreezeColumn) { for (var i = 2; i < this.ContentGrid.rows.length; i++) { var gridItemRow = this.ContentGrid.rows.item(i); var gridItemCell = gridItemRow.cells.item(0); var helperElement = gridItemCell.firstChild; while (helperElement.hasChildNodes()) { gridItemCell.appendChild(helperElement.firstChild); } gridItemCell.removeChild(helperElement); } } }; return GridViewScroll; }()); var gridViewScroll = null; window.onload = function () { gridViewScroll = new GridViewScroll({ elementID: "gvMain", width: "100%", height: 350, freezeColumn: true, freezeFooter: true, freezeColumnCssClass: "GridViewScrollItemFreeze", freezeFooterCssClass: "GridViewScrollFooterFreeze", freezeHeaderRowCount: 1, freezeColumnCount: 10, onscroll: function (scrollTop, scrollLeft) { console.log(scrollTop + " - " + scrollLeft); } }); gridViewScroll.enhance(); } function getScrollPosition() { var position = gridViewScroll.scrollPosition; alert("scrollTop: " + position.scrollTop + ", scrollLeft: " + position.scrollLeft); } function setScrollPosition() { var scrollPosition = { scrollTop: 50, scrollLeft: 50}; gridViewScroll.scrollPosition = scrollPosition; } $('td:nth-child(20),th:nth-child(20)').hide(); $('td:nth-child(21),th:nth-child(21)').hide(); $('td:nth-child(22),th:nth-child(22)').hide(); $('td:nth-child(23),th:nth-child(23)').hide(); </script> </head> <body class="cnqr-grid-responsive-partial cnqr-ext-viewport oldIE cnqr-theme-12 ext-gecko ext-gecko3 cnqr-grid-wide"> <nav class="navbar navbar-inverse navbar-fixed-top"> <div class="container"> <div class="navbar-header"> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> </div> <div class="navbar-collapse collapse"> <ul class="nav navbar-nav"> <h4><font color="white"><img src="images/japan.png"> Monthly Schedule</font></h4> </ul> <ul class="nav navbar-nav"> <li><a class="fa fa-plus-circle" href="/"> CREATE</a></li> <li><a class="fa fa-file-o" href="/Replacement"> EDIT</a></li> <li><a class="fa fa-plus-circle" href="/StaffOT"> PENDING</a></li> <li><a class="fa fa-file-o" href="/Report"> REPORT</a></li> <li><a class="fa fa-cog" href="/Home/Search"> SEARCH</a></li> <li><a class="fa fa-cog" href="/Admin"> SETTING</a></li> <li><a class="fa fa-cog" href="xxx.pdf" target="_blank"> USER GUIDE</a></li> <li><a href="/AzureAD/Account/SignOut">Logout</a></li> </ul> </div> </div> </nav> <form action="/" method="post"> <div id="expenseTypeDiv" class="outside"> <div style="padding:10px"> <div id="expendedExpenseTypesOver" > <div id="expendedExpenseTypesListTop"> <img src="images/bullet.png"> <b>Section I</b> <br> <table id="topInfo"> <tbody><tr> <td width="5%"><b>User: </b></td> <td width="10%">micheale</td> <td width="5%"> </td> <td width="5%"><b>Title: </b></td> <td width="10%">System Testing</td> <td width="5%"> </td> <td width="5%"><b>Company: </b></td> <td width="10%">XXX</td> <td width="5%"> </td> <td width="5%"><b>Department: </b></td> <td width="10%">Testing</td> </tr> <tr> <td width="5%"><b>Manager:</b></td> <td width="20%"> PersonA <input name="managerEmail" id="managerEmail" type="hidden" value="PersonA"> <input name="ActualManager" id="ActualManager" type="hidden" value="PersonA"> <input id="OtId" type="hidden" value=" <input id="EmployeeId" type="hidden" value="123149"><input id="UserDomain" type="hidden" value="micheale"> <input id="JobTitle" type="hidden" value="System Testing"><input id="JobTitle" type="hidden" value="System Testing"> <input id="Department" type="hidden" value="Testing"><input id="JobTitle" type="hidden" value="System Testing"> <input id="Company" type="hidden" value="XXX"><input id="Manager" type="hidden" value="PersonA"> <input id="Eligibility" type="hidden" value="false"> </td> <td> </td> <td width="5%"><b>Approver:</b></td> <td width="10%">PersonA</td> <td> </td> <td width="5%"><b>Status:</b></td> <td width="10%"> <input name="statusDesc" id="statusDesc" type="text" readonly=""></td> <td width="5%"> </td> <td><b>Eligibility</b></td> <td>false</td> <td> </td> </tr> <tr> <td><b>Month:</b></td> <td> <select id="Mth"> <option value="">--Select Month--</option> <option value="01" selected="">Jan</option> <option value="02">Feb</option> <option value="03">Mar</option> <option value="04">Apr</option> <option value="05">May</option> <option value="06">Jun</option> <option value="07">Jul</option> <option value="08">Aug</option> <option value="09">Sep</option> <option value="10">Oct</option> <option value="11">Nov</option> <option value="12">Dec</option> </select> </td> <td> </td> <td><b>Year:</b></td> <td><input name="Yr" id="Yr" type="text" value="2020"></td> <td> </td> <td colspan="5"> <input name="butCal" id="butCal" onclick="javascript:showCal()" type="button" value="Proceed"></td> </tr> </tbody> </table> </fieldset> </div> <div id="expenseTypesListContainer" style="overflow: hidden; background-color:white;"> <p> </p> <img src="images/bullet.png"> <b>Section II</b> <table cellspacing="0" id="gvMain" style="width: 100%; border-collapse: collapse;"> <tr class="GridViewScrollHeader"> <th scope="col" id="appflagth" style="display: none;">Approve?</th> <th scope="col" id="isholth" style="display: none;">Is Holiday</th> <th scope="col" id="otdetidth" style="display: none;">Detail ID</th> <th scope="col">Reason of Absence<br>Working on Holiday</th> <th scope="col">Holiday</th> <th scope="col">Date</th> <th scope="col">Day</th> <th scope="col">Time In</th> <th scope="col">Time Out</th> <th scope="col">Break Time<br>Start</th> <th scope="col">Break Time<br>End</th> <th scope="col">Working Time</th> <th scope="col">Over-Time</th> <th scope="col">Late Night</th> <th scope="col">Holiday Work</th> <th scope="col">Late Night HD</th> <th scope="col">Legal Holiday<br>Work</th> <th scope="col">Late Night LH</th> <th scope="col">Working on Holiday</th> <th scope="col">Remark</th> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_0" id="FlagApp_0" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_0" id="IsHol_0" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_0" id="OTDetID2_0" type="text"></td> <td> <select name="CategoryID_0" id="CategoryID_0" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_0" class="readfield2" id="Calendar_0" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_0" class="readfield3" id="ReferDate_0" type="text" readonly="readonly" value="2020-01-01"></td> <td>Wed</td> <td><input name="Start_0" class="timeformat2" id="Start_0" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_0" class="timeformat2" id="End_0" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_0" class="timeformat2" id="StartBreakHr_0" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_0" class="timeformat2" id="EndBreakHr_0" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_0" class="readfield" id="WorkingHr_0" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_0" class="readfield" id="OTHr_0" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_0" class="readfield" id="LateOTHr_0" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_0" class="readfield" id="OTHrPH_0" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_0" class="readfield" id="LateOTHrPH_0" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_0" class="readfield" id="OTHrLH_0" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_0" class="readfield" id="LateOTHrLH_0" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_0" class="readfield" id="Replacement_0" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_0" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_1" id="FlagApp_1" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_1" id="IsHol_1" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_1" id="OTDetID2_1" type="text"></td> <td> <select name="CategoryID_1" id="CategoryID_1" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_1" class="readfield2" id="Calendar_1" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_1" class="readfield3" id="ReferDate_1" type="text" readonly="readonly" value="2020-01-02"></td> <td>Wed</td> <td><input name="Start_1" class="timeformat2" id="Start_1" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_1" class="timeformat2" id="End_1" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_1" class="timeformat2" id="StartBreakHr_1" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_1" class="timeformat2" id="EndBreakHr_1" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_1" class="readfield" id="WorkingHr_1" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_1" class="readfield" id="OTHr_1" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_1" class="readfield" id="LateOTHr_1" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_1" class="readfield" id="OTHrPH_1" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_1" class="readfield" id="LateOTHrPH_1" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_1" class="readfield" id="OTHrLH_1" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_1" class="readfield" id="LateOTHrLH_1" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_1" class="readfield" id="Replacement_1" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_1" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_2" id="FlagApp_2" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_2" id="IsHol_2" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_2" id="OTDetID2_2" type="text"></td> <td> <select name="CategoryID_2" id="CategoryID_2" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_2" class="readfield2" id="Calendar_2" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_2" class="readfield3" id="ReferDate_2" type="text" readonly="readonly" value="2020-01-03"></td> <td>Wed</td> <td><input name="Start_2" class="timeformat2" id="Start_2" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_2" class="timeformat2" id="End_2" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_2" class="timeformat2" id="StartBreakHr_2" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_2" class="timeformat2" id="EndBreakHr_2" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_2" class="readfield" id="WorkingHr_2" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_2" class="readfield" id="OTHr_2" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_2" class="readfield" id="LateOTHr_2" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_2" class="readfield" id="OTHrPH_2" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_2" class="readfield" id="LateOTHrPH_2" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_2" class="readfield" id="OTHrLH_2" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_2" class="readfield" id="LateOTHrLH_2" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_2" class="readfield" id="Replacement_2" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_2" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_3" id="FlagApp_3" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_3" id="IsHol_3" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_3" id="OTDetID2_3" type="text"></td> <td> <select name="CategoryID_3" id="CategoryID_3" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_3" class="readfield2" id="Calendar_3" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_3" class="readfield3" id="ReferDate_3" type="text" readonly="readonly" value="2020-01-04"></td> <td>Wed</td> <td><input name="Start_3" class="timeformat2" id="Start_3" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_3" class="timeformat2" id="End_3" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_3" class="timeformat2" id="StartBreakHr_3" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_3" class="timeformat2" id="EndBreakHr_3" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_3" class="readfield" id="WorkingHr_3" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_3" class="readfield" id="OTHr_3" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_3" class="readfield" id="LateOTHr_3" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_3" class="readfield" id="OTHrPH_3" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_3" class="readfield" id="LateOTHrPH_3" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_3" class="readfield" id="OTHrLH_3" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_3" class="readfield" id="LateOTHrLH_3" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_3" class="readfield" id="Replacement_3" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_3" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_4" id="FlagApp_4" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_4" id="IsHol_4" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_4" id="OTDetID2_4" type="text"></td> <td> <select name="CategoryID_4" id="CategoryID_4" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_4" class="readfield2" id="Calendar_4" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_4" class="readfield3" id="ReferDate_4" type="text" readonly="readonly" value="2020-01-05"></td> <td>Wed</td> <td><input name="Start_4" class="timeformat2" id="Start_4" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_4" class="timeformat2" id="End_4" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_4" class="timeformat2" id="StartBreakHr_4" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_4" class="timeformat2" id="EndBreakHr_4" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_4" class="readfield" id="WorkingHr_4" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_4" class="readfield" id="OTHr_4" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_4" class="readfield" id="LateOTHr_4" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_4" class="readfield" id="OTHrPH_4" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_4" class="readfield" id="LateOTHrPH_4" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_4" class="readfield" id="OTHrLH_4" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_4" class="readfield" id="LateOTHrLH_4" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_4" class="readfield" id="Replacement_4" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_4" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_5" id="FlagApp_5" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_5" id="IsHol_5" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_5" id="OTDetID2_5" type="text"></td> <td> <select name="CategoryID_5" id="CategoryID_5" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_5" class="readfield2" id="Calendar_5" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_5" class="readfield3" id="ReferDate_5" type="text" readonly="readonly" value="2020-01-06"></td> <td>Wed</td> <td><input name="Start_5" class="timeformat2" id="Start_5" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_5" class="timeformat2" id="End_5" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_5" class="timeformat2" id="StartBreakHr_5" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_5" class="timeformat2" id="EndBreakHr_5" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_5" class="readfield" id="WorkingHr_5" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_5" class="readfield" id="OTHr_5" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_5" class="readfield" id="LateOTHr_5" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_5" class="readfield" id="OTHrPH_5" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_5" class="readfield" id="LateOTHrPH_5" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_5" class="readfield" id="OTHrLH_5" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_5" class="readfield" id="LateOTHrLH_5" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_5" class="readfield" id="Replacement_5" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_5" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_6" id="FlagApp_6" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_6" id="IsHol_6" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_6" id="OTDetID2_6" type="text"></td> <td> <select name="CategoryID_6" id="CategoryID_6" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_6" class="readfield2" id="Calendar_6" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_6" class="readfield3" id="ReferDate_6" type="text" readonly="readonly" value="2020-01-07"></td> <td>Wed</td> <td><input name="Start_6" class="timeformat2" id="Start_6" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_6" class="timeformat2" id="End_6" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_6" class="timeformat2" id="StartBreakHr_6" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_6" class="timeformat2" id="EndBreakHr_6" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_6" class="readfield" id="WorkingHr_6" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_6" class="readfield" id="OTHr_6" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_6" class="readfield" id="LateOTHr_6" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_6" class="readfield" id="OTHrPH_6" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_6" class="readfield" id="LateOTHrPH_6" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_6" class="readfield" id="OTHrLH_6" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_6" class="readfield" id="LateOTHrLH_6" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_6" class="readfield" id="Replacement_6" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_6" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_7" id="FlagApp_7" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_7" id="IsHol_7" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_7" id="OTDetID2_7" type="text"></td> <td> <select name="CategoryID_7" id="CategoryID_7" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_7" class="readfield2" id="Calendar_7" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_7" class="readfield3" id="ReferDate_7" type="text" readonly="readonly" value="2020-01-08"></td> <td>Wed</td> <td><input name="Start_7" class="timeformat2" id="Start_7" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_7" class="timeformat2" id="End_7" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_7" class="timeformat2" id="StartBreakHr_7" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_7" class="timeformat2" id="EndBreakHr_7" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_7" class="readfield" id="WorkingHr_7" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_7" class="readfield" id="OTHr_7" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_7" class="readfield" id="LateOTHr_7" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_7" class="readfield" id="OTHrPH_7" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_7" class="readfield" id="LateOTHrPH_7" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_7" class="readfield" id="OTHrLH_7" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_7" class="readfield" id="LateOTHrLH_7" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_7" class="readfield" id="Replacement_7" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_7" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_8" id="FlagApp_8" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_8" id="IsHol_8" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_8" id="OTDetID2_8" type="text"></td> <td> <select name="CategoryID_8" id="CategoryID_8" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_8" class="readfield2" id="Calendar_8" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_8" class="readfield3" id="ReferDate_8" type="text" readonly="readonly" value="2020-01-09"></td> <td>Wed</td> <td><input name="Start_8" class="timeformat2" id="Start_8" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_8" class="timeformat2" id="End_8" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_8" class="timeformat2" id="StartBreakHr_8" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_8" class="timeformat2" id="EndBreakHr_8" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_8" class="readfield" id="WorkingHr_8" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_8" class="readfield" id="OTHr_8" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_8" class="readfield" id="LateOTHr_8" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_8" class="readfield" id="OTHrPH_8" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_8" class="readfield" id="LateOTHrPH_8" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_8" class="readfield" id="OTHrLH_8" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_8" class="readfield" id="LateOTHrLH_8" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_8" class="readfield" id="Replacement_8" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_8" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_9" id="FlagApp_9" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_9" id="IsHol_9" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_9" id="OTDetID2_9" type="text"></td> <td> <select name="CategoryID_9" id="CategoryID_9" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_9" class="readfield2" id="Calendar_9" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_9" class="readfield3" id="ReferDate_9" type="text" readonly="readonly" value="2020-01-10"></td> <td>Wed</td> <td><input name="Start_9" class="timeformat2" id="Start_9" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_9" class="timeformat2" id="End_9" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_9" class="timeformat2" id="StartBreakHr_9" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_9" class="timeformat2" id="EndBreakHr_9" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_9" class="readfield" id="WorkingHr_9" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_9" class="readfield" id="OTHr_9" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_9" class="readfield" id="LateOTHr_9" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_9" class="readfield" id="OTHrPH_9" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_9" class="readfield" id="LateOTHrPH_9" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_9" class="readfield" id="OTHrLH_9" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_9" class="readfield" id="LateOTHrLH_9" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_9" class="readfield" id="Replacement_9" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_9" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_10" id="FlagApp_10" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_10" id="IsHol_10" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_10" id="OTDetID2_10" type="text"></td> <td> <select name="CategoryID_10" id="CategoryID_10" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_10" class="readfield2" id="Calendar_10" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_10" class="readfield3" id="ReferDate_10" type="text" readonly="readonly" value="2020-01-11"></td> <td>Wed</td> <td><input name="Start_10" class="timeformat2" id="Start_10" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_10" class="timeformat2" id="End_10" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_10" class="timeformat2" id="StartBreakHr_10" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_10" class="timeformat2" id="EndBreakHr_10" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_10" class="readfield" id="WorkingHr_10" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_10" class="readfield" id="OTHr_10" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_10" class="readfield" id="LateOTHr_10" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_10" class="readfield" id="OTHrPH_10" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_10" class="readfield" id="LateOTHrPH_10" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_10" class="readfield" id="OTHrLH_10" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_10" class="readfield" id="LateOTHrLH_10" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_10" class="readfield" id="Replacement_10" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_10" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_11" id="FlagApp_11" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_11" id="IsHol_11" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_11" id="OTDetID2_11" type="text"></td> <td> <select name="CategoryID_11" id="CategoryID_11" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_11" class="readfield2" id="Calendar_11" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_11" class="readfield3" id="ReferDate_11" type="text" readonly="readonly" value="2020-01-12"></td> <td>Wed</td> <td><input name="Start_11" class="timeformat2" id="Start_11" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_11" class="timeformat2" id="End_11" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_11" class="timeformat2" id="StartBreakHr_11" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_11" class="timeformat2" id="EndBreakHr_11" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_11" class="readfield" id="WorkingHr_11" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_11" class="readfield" id="OTHr_11" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_11" class="readfield" id="LateOTHr_11" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_11" class="readfield" id="OTHrPH_11" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_11" class="readfield" id="LateOTHrPH_11" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_11" class="readfield" id="OTHrLH_11" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_11" class="readfield" id="LateOTHrLH_11" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_11" class="readfield" id="Replacement_11" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_11" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_12" id="FlagApp_12" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_12" id="IsHol_12" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_12" id="OTDetID2_12" type="text"></td> <td> <select name="CategoryID_12" id="CategoryID_12" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_12" class="readfield2" id="Calendar_12" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_12" class="readfield3" id="ReferDate_12" type="text" readonly="readonly" value="2020-01-13"></td> <td>Wed</td> <td><input name="Start_12" class="timeformat2" id="Start_12" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_12" class="timeformat2" id="End_12" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_12" class="timeformat2" id="StartBreakHr_12" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_12" class="timeformat2" id="EndBreakHr_12" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_12" class="readfield" id="WorkingHr_12" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_12" class="readfield" id="OTHr_12" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_12" class="readfield" id="LateOTHr_12" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_12" class="readfield" id="OTHrPH_12" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_12" class="readfield" id="LateOTHrPH_12" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_12" class="readfield" id="OTHrLH_12" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_12" class="readfield" id="LateOTHrLH_12" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_12" class="readfield" id="Replacement_12" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_12" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_13" id="FlagApp_13" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_13" id="IsHol_13" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_13" id="OTDetID2_13" type="text"></td> <td> <select name="CategoryID_13" id="CategoryID_13" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_13" class="readfield2" id="Calendar_13" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_13" class="readfield3" id="ReferDate_13" type="text" readonly="readonly" value="2020-01-14"></td> <td>Wed</td> <td><input name="Start_13" class="timeformat2" id="Start_13" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_13" class="timeformat2" id="End_13" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_13" class="timeformat2" id="StartBreakHr_13" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_13" class="timeformat2" id="EndBreakHr_13" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_13" class="readfield" id="WorkingHr_13" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_13" class="readfield" id="OTHr_13" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_13" class="readfield" id="LateOTHr_13" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_13" class="readfield" id="OTHrPH_13" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_13" class="readfield" id="LateOTHrPH_13" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_13" class="readfield" id="OTHrLH_13" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_13" class="readfield" id="LateOTHrLH_13" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_13" class="readfield" id="Replacement_13" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_13" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_14" id="FlagApp_14" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_14" id="IsHol_14" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_14" id="OTDetID2_14" type="text"></td> <td> <select name="CategoryID_14" id="CategoryID_14" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_14" class="readfield2" id="Calendar_14" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_14" class="readfield3" id="ReferDate_14" type="text" readonly="readonly" value="2020-01-15"></td> <td>Wed</td> <td><input name="Start_14" class="timeformat2" id="Start_14" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_14" class="timeformat2" id="End_14" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_14" class="timeformat2" id="StartBreakHr_14" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_14" class="timeformat2" id="EndBreakHr_14" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_14" class="readfield" id="WorkingHr_14" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_14" class="readfield" id="OTHr_14" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_14" class="readfield" id="LateOTHr_14" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_14" class="readfield" id="OTHrPH_14" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_14" class="readfield" id="LateOTHrPH_14" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_14" class="readfield" id="OTHrLH_14" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_14" class="readfield" id="LateOTHrLH_14" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_14" class="readfield" id="Replacement_14" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_14" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_15" id="FlagApp_15" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_15" id="IsHol_15" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_15" id="OTDetID2_15" type="text"></td> <td> <select name="CategoryID_15" id="CategoryID_15" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_15" class="readfield2" id="Calendar_15" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_15" class="readfield3" id="ReferDate_15" type="text" readonly="readonly" value="2020-01-16"></td> <td>Wed</td> <td><input name="Start_15" class="timeformat2" id="Start_15" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_15" class="timeformat2" id="End_15" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_15" class="timeformat2" id="StartBreakHr_15" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_15" class="timeformat2" id="EndBreakHr_15" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_15" class="readfield" id="WorkingHr_15" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_15" class="readfield" id="OTHr_15" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_15" class="readfield" id="LateOTHr_15" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_15" class="readfield" id="OTHrPH_15" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_15" class="readfield" id="LateOTHrPH_15" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_15" class="readfield" id="OTHrLH_15" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_15" class="readfield" id="LateOTHrLH_15" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_15" class="readfield" id="Replacement_15" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_15" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_16" id="FlagApp_16" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_16" id="IsHol_16" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_16" id="OTDetID2_16" type="text"></td> <td> <select name="CategoryID_16" id="CategoryID_16" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_16" class="readfield2" id="Calendar_16" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_16" class="readfield3" id="ReferDate_16" type="text" readonly="readonly" value="2020-01-17"></td> <td>Wed</td> <td><input name="Start_16" class="timeformat2" id="Start_16" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_16" class="timeformat2" id="End_16" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_16" class="timeformat2" id="StartBreakHr_16" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_16" class="timeformat2" id="EndBreakHr_16" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_16" class="readfield" id="WorkingHr_16" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_16" class="readfield" id="OTHr_16" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_16" class="readfield" id="LateOTHr_16" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_16" class="readfield" id="OTHrPH_16" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_16" class="readfield" id="LateOTHrPH_16" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_16" class="readfield" id="OTHrLH_16" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_16" class="readfield" id="LateOTHrLH_16" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_16" class="readfield" id="Replacement_16" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_16" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_17" id="FlagApp_17" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_17" id="IsHol_17" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_17" id="OTDetID2_17" type="text"></td> <td> <select name="CategoryID_17" id="CategoryID_17" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_17" class="readfield2" id="Calendar_17" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_17" class="readfield3" id="ReferDate_17" type="text" readonly="readonly" value="2020-01-18"></td> <td>Wed</td> <td><input name="Start_17" class="timeformat2" id="Start_17" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_17" class="timeformat2" id="End_17" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_17" class="timeformat2" id="StartBreakHr_17" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_17" class="timeformat2" id="EndBreakHr_17" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_17" class="readfield" id="WorkingHr_17" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_17" class="readfield" id="OTHr_17" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_17" class="readfield" id="LateOTHr_17" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_17" class="readfield" id="OTHrPH_17" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_17" class="readfield" id="LateOTHrPH_17" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_17" class="readfield" id="OTHrLH_17" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_17" class="readfield" id="LateOTHrLH_17" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_17" class="readfield" id="Replacement_17" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_17" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_18" id="FlagApp_18" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_18" id="IsHol_18" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_18" id="OTDetID2_18" type="text"></td> <td> <select name="CategoryID_18" id="CategoryID_18" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_18" class="readfield2" id="Calendar_18" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_18" class="readfield3" id="ReferDate_18" type="text" readonly="readonly" value="2020-01-19"></td> <td>Wed</td> <td><input name="Start_18" class="timeformat2" id="Start_18" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_18" class="timeformat2" id="End_18" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_18" class="timeformat2" id="StartBreakHr_18" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_18" class="timeformat2" id="EndBreakHr_18" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_18" class="readfield" id="WorkingHr_18" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_18" class="readfield" id="OTHr_18" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_18" class="readfield" id="LateOTHr_18" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_18" class="readfield" id="OTHrPH_18" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_18" class="readfield" id="LateOTHrPH_18" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_18" class="readfield" id="OTHrLH_18" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_18" class="readfield" id="LateOTHrLH_18" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_18" class="readfield" id="Replacement_18" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_18" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_19" id="FlagApp_19" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_19" id="IsHol_19" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_19" id="OTDetID2_19" type="text"></td> <td> <select name="CategoryID_19" id="CategoryID_19" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_19" class="readfield2" id="Calendar_19" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_19" class="readfield3" id="ReferDate_19" type="text" readonly="readonly" value="2020-01-20"></td> <td>Wed</td> <td><input name="Start_19" class="timeformat2" id="Start_19" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_19" class="timeformat2" id="End_19" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_19" class="timeformat2" id="StartBreakHr_19" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_19" class="timeformat2" id="EndBreakHr_19" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_19" class="readfield" id="WorkingHr_19" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_19" class="readfield" id="OTHr_19" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_19" class="readfield" id="LateOTHr_19" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_19" class="readfield" id="OTHrPH_19" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_19" class="readfield" id="LateOTHrPH_19" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_19" class="readfield" id="OTHrLH_19" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_19" class="readfield" id="LateOTHrLH_19" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_19" class="readfield" id="Replacement_19" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_19" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td style="display: none;"><input name="FlagApp_20" id="FlagApp_20" type="checkbox" value="false"></td> <td style="display: none;"><input name="IsHol_20" id="IsHol_20" type="hidden" value="1"></td> <td style="display: none;"><input name="OTDetID2_20" id="OTDetID2_20" type="text"></td> <td> <select name="CategoryID_20" id="CategoryID_20" onchange="setWorkingTime(this.id, this.value)"> <option value="">-- Please Select Category --</option> <option value="11">Annual Leave</option> <option value="12">Annual Leave(Half, AM)</option> <option value="13">Annual Leave(Half, PM)</option> <option value="23">Child Care Leave</option> <option value="24">Family Care Leave</option> <option value="18">Funeral Leave</option> <option value="27">Leave of Absence(Sickness)</option> <option value="19">Marriage Leave</option> <option value="21">Maternity Leave</option> <option value="25">Menstrual Leave</option> <option value="33">No Work</option> <option value="22">Paternity Leave</option> <option value="20">Refresh leaves</option> <option value="17">Sick leave</option> <option value="30">Sick leave(Half, AM)</option> <option value="31">Sick leave(Half, PM)</option> <option value="14">Substitute Leave</option> <option value="15">Substitute Leave(Half, AM)</option> <option value="16">Substitute Leave(Half, PM)</option> <option value="28">Unpaid leave</option> <option value="29">Working on Holiday</option> </select> </td> <td><input name="Calendar_20" class="readfield2" id="Calendar_20" style="background-color: rgb(255, 246, 208);" type="text" readonly="readonly"></td> <td><input name="ReferDate_20" class="readfield3" id="ReferDate_20" type="text" readonly="readonly" value="2020-01-21"></td> <td>Wed</td> <td><input name="Start_20" class="timeformat2" id="Start_20" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="End_20" class="timeformat2" id="End_20" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="StartBreakHr_20" class="timeformat2" id="StartBreakHr_20" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="EndBreakHr_20" class="timeformat2" id="EndBreakHr_20" onblur="validateTime(this)" onchange="calcOT(this.id, this.value)" type="text" maxlength="5" placeholder="HH:MM"></td> <td><input name="WorkingHr_20" class="readfield" id="WorkingHr_20" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHr_20" class="readfield" id="OTHr_20" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHr_20" class="readfield" id="LateOTHr_20" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrPH_20" class="readfield" id="OTHrPH_20" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrPH_20" class="readfield" id="LateOTHrPH_20" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="OTHrLH_20" class="readfield" id="OTHrLH_20" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="LateOTHrLH_20" class="readfield" id="LateOTHrLH_20" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><input name="Replacement_20" class="readfield" id="Replacement_20" onblur="validateTime(this)" type="text" maxlength="5" readonly="readonly" placeholder="HH:MM"></td> <td><textarea name="Remark0" id="Remark_20" rows="3" cols="50"></textarea></td> </tr> <tr class="GridViewScrollItem"> <td colspan=12> <input name="butSubmitDraft" id="butSubmitDraft" onclick="this.value='Sending, please wait...';Save('Draft')" type="submit" value="Save as Draft"> <input name="butSubmit" id="butSubmit" style="display: none;" onclick="this.value='Sending, please wait...';Save('Review')" type="submit" value="Submit for Approval"> <input name="butSubmitPreview" id="butSubmitPreview" onclick="PreviewSummary('')" type="button" value="Preview Summary"> </td> </tr> </table> </div> </div> <input name="__RequestVerificationToken" type="hidden" value="ggggggggggggggggggggggggggggggggggggggggggggg"></form> <br> <footer> <p>© 2019 - XXXX</p> </footer> </div> </body>
</html>Please advise,
Thanks.
Regards,
Micheale
Friday, January 3, 2020 2:12 PM
All replies
-
User1535942433 posted
Hi micnie2020,
micnie2020
How to hide 2nd last of GridViewScroll Footer repeated twice, refer to the button submission [ Save as Draft ] [ Preview Summary ]According to your codes,I suggest you could change the footer class to be GridViewScrollFooterFreeze.GridViewSrcoll has itself contains footer.Because it is not marked and declared footer, so it is not recognized, and it appears twice.
More details,you could refer to below codes:
<tr class="GridViewScrollFooterFreeze"> <td colspan=12> <input name="butSubmitDraft" id="butSubmitDraft" onclick="this.value='Sending, please wait...';Save('Draft')" type="submit" value="Save as Draft"> <input name="butSubmit" id="butSubmit" style="display: none;" onclick="this.value='Sending, please wait...';Save('Review')" type="submit" value="Submit for Approval"> <input name="butSubmitPreview" id="butSubmitPreview" onclick="PreviewSummary('')" type="button" value="Preview Summary"> </td> </tr>
Result:
If my window resolution change, device resolution change, how to do auto fit for everything including GridViewScroll table ?
If Browser Zoom Level change, how to do auto fit for everything including GridViewScroll table ?
I suggest you could set overflow to be srcoll about body and table.More details,you could refer to below codes:<table id="topInfo" style="overflow-x:scroll">
.......</table><div id="expenseTypesListContainer" style="overflow: scroll; background-color:white;"> .......</div>
Result:Best regards,
Yijing Sun
Monday, January 6, 2020 10:41 AM