@charset "UTF-8";
/* CSS Document */
html, body {
	height: 100%;
}

*{
    box-sizing: border-box;
}

#wrap { 
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -100px;
}

qcomp{
    display:none;
}

.clear:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }

body {
    background-color: #eaeaea;
    color: #b0b0b0;
    /*font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;*/
    font-family: Helvetica, Arial, sans-serif;
    margin:0px;
    border:0px;
}



#push,
#footer {
    height: 70px;
    /* margin-top: 30px; */
}

#footer {
    background-color: #ffffff;
    margin-top: 30px;
}

img.suncor {
    width: 75%;
    padding-top: 5%;
    float: right;
}

img.agasga {
    width: 70%;
    padding-top: 5%;
}

img.backarrow {
    padding-top: 25%;
}

img.helpactive {
    padding-top: 10%;
}

img.imgholder {
    padding-bottom: 5%;
}

.regular {
    background-color: #ffffff;
}

.headmenu {
    background-color: #eaeaea;
    color: #000000;
    /* padding: 10px 0px; */
}

.headmenu h1 {
    font-weight: 100 !important;
    margin:0px;
    /* font-size: 33px; */
    padding: 5px 0px;
}

.headmenu h1 span {
    font-size: 22px;
}

.stepmenu {
    background-color: #f9f9f9;
    min-height: 40px;
    padding-top: 10px;
    font-weight: 100 !important;
    color: #000000;
    margin-bottom:20px;
}

.stepmenu a {
    text-decoration: none;
    color: #007ff6;
    font-size: 18px;
}

.numberCircle {
    border-radius: 50%;
    behavior: url(PIE.htc); /* remove if you don't care about IE8 */

    width: 36px;
    height: 24px;
    padding: 2px 6px;

    background: #fff;
    border: 1px solid #007ff6;
    color: #666;
    text-align: center;

}
.refnum {
    width: 30%;
    margin-right: 3%;
    float: left;
}

.submessage {
    font-weight: 100 !important;
    font-size: 20px;
    color: #000000;
    line-height: 1.25em;
}

.container {
    width: 970px !important;
   /* display:inline-block;*/
   margin:auto;
   position:relative;
}

/*.subheader { border-radius: 5%; background-color: #eaeaea; text-align: center; margin: 2% 0px; font-size: 20px; font-weight: 100; }*/

.subheader {
    border-radius: 10px;
    background-color: #eaeaea;
    text-align: center;
    margin: 2% 0px;
    font-size: 23px;
    font-weight: 300;
    width: 100%;
    display: inline-block;
    color: #000;
    vertical-align: middle;
    padding: 10px 0px;
}



button{
    background: rgba(179,220,237,1);
    background: -moz-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(179,220,237,1)), color-stop(32%, rgba(41,184,229,1)), color-stop(100%, rgba(8,131,246,1)));
    background: -webkit-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: -o-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: -ms-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: linear-gradient(to bottom, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3dced', endColorstr='#0883f6', GradientType=0 );
    endColorstr='#0883f6', GradientType=0 );
    width: auto;
    height: 60px;
    border-radius: 10px;
    color: #fff;
    padding: 0px 20px;
    border: none;
    vertical-align: middle;
    font-size: 20px;
    font-weight: 300;
    cursor: pointer;
}

button.white{
    background:#fff;
    border-color:#eaeaea;
    color:#007ff6;
    border:solid 1px #EAEAEA;
}

button.white:hover{
    border-color:#007FF6;
}

button:active, button.focus{
    outline: none;
}

button.green{
    background: #33d842;
    border-color:#eaeaea;
    color: #fff;
    border:solid 1px #EAEAEA;
}

button.red{
    background: #df3030;
    border-color:#eaeaea;
    color: #fff;
    border:solid 1px #EAEAEA;
}

/* Home page */
/*.home .next {
    background: rgba(179,220,237,1);
    background: -moz-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(179,220,237,1)), color-stop(32%, rgba(41,184,229,1)), color-stop(100%, rgba(8,131,246,1)));
    background: -webkit-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: -o-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: -ms-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: linear-gradient(to bottom, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3dced', endColorstr='#0883f6', GradientType=0 );
    endColorstr='#0883f6', GradientType=0 );
    width: 100px;
    height: 60px;
    border-radius: 10px;
}
.home .next a{
    color:white;
    font-size: 20px;
    font-weight: 300;
}*/

.home .select_site{
    padding: 10px 16px;
    font-size: 20px;
    font-weight: 300;
    height: 60px;
    border-radius: 10px!important;
    margin-right: 25px;
    color: #9A9999;
    line-height: 1.3333333;
    border-radius: 6px;
}
/*.next {
    background: rgba(179,220,237,1);
background: -moz-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(179,220,237,1)), color-stop(32%, rgba(41,184,229,1)), color-stop(100%, rgba(8,131,246,1)));
background: -webkit-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
background: -o-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
background: -ms-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
background: linear-gradient(to bottom, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3dced', endColorstr='#0883f6', GradientType=0 );
endColorstr='#0883f6', GradientType=0 );
width: 100px;
height: 60px;
border-radius: 10px;
}*/

.next a{
    color:white;
    font-size: 20px; 
    font-weight: 300;
}
.next a:hover{
    text-decoration: none;
}

.info{
    padding: 10px 16px;
    font-size: 20px; /* Original Size 26px */
    font-weight: 300;
    height: 60px;  /* Original Size 80px */
    border-radius: 10px!important;
    margin-right: 8px;
    color: #9A9999;
    line-height: 1.3333333;
    border-radius: 6px;
}

.info a:hover{
    text-decoration: none;
}

.info:hover{
    text-decoration: none;
}

.img_wrapper{
    text-align: center;
}

.img_wrapper div{
    /*float: left;
    margin-left: 0px;
    margin-right: 15px;
    margin-bottom: 20px;*/
    display:inline-block;
    margin:5px;
}

.img_wrapper div img{
    width: 200px; /* Originally 250px */
}

.next_page4{
    text-align: right;
    float: right;
    clear: both;
    margin-bottom: 50px;
}
/*.next_page4:hover{
    background: url(../images/images/next_hover_14.png)no-repeat;
    background-size: 100%;
    background-position: 0px 0px;
    content: "";
    width: 93px;
    height: 72px;
    z-index: 3;
    position: relative;
    cursor: pointer;
}*/
/*.next_page4:hover img{
    display: none;
}*/
.nav.nav-tabs h1{
    text-align: center;
    font-weight: 300;
    color:#777;
    margin-bottom: 50px;
    font-size: 26px;
}


.nav.nav-tabs{
    text-align: center;
    width: 450px;
    height: 52px;
    margin: 30px auto 0px;
    border:none;
}

.nav.nav-tabs>li{
    float: left;
    width:33%;
    font-size: 20px;
}
.nav.nav-tabs>li:first-child a{
 border-bottom-left-radius: 10px;
 border-top-left-radius: 10px;
 border-top-right-radius: 0px;
 border-right: 0px;
 /*width: 148px;*/
}

.nav.nav-tabs>li:last-child a{
 border-bottom-right-radius: 10px;
 border-top-right-radius: 10px;
 border-top-left-radius: 0px;
 border-left: 0px;
 /*width: 148px;*/
}

.nav.nav-tabs>li a{
    color:#555;
    border:1px solid grey;
    border-radius: 0;
    margin-right:0;
}

.nav.nav-tabs>li.active>a{
    color:#0883f6;
}
.locksets{
    margin-top: 60px;
    text-align:center;
}


.locksets > *{
    display:inline-block;
    vertical-align: top;
}
.lockset.lockset2, .lockset.lockset1{
    /*opacity: 0.4;*/
}
.lockset {
    width:33%;
    float: left;
    text-align: center;
}

body .lockset h2{
 text-align: center;
 margin: 0 auto;
 border: 1px solid blue;
 width: 80%;
 border-radius: 10px;
 padding-top: 15px;
 height: 60px;
 font-weight: 300;
 color:#555;
}

.set3 img{
    /*margin-left: 50px;*/
}

.panel-info>.panel-heading {
    color:#777;
    background-color: #fff;
    border:none;
}
.panel-info{
    border:none;
}
/*tbody {
    width: 50%;
    display: block;
    margin: 0 auto;
    font-size: 20px;
    font-weight: 300;
    color: #777;
}*/
/*tbody tr:first-child{
    border-bottom:1px solid #ddd;
}*/
table#InvoiceTable tbody tr:last-child{
    /*border-bottom:1px solid #ddd;*/
    /*margin-top: 10px;*/
}
table#InvoiceTable  tr{
    width:100%;
    display: inline-table;
}

table#InvoiceTable  tr th{
    padding:20px 0;
    width: 25%;
    font-weight: 300;
}
table#InvoiceTable  tr th:first-child{
    width:15%;
}
table#InvoiceTable  tr td:first-child{
    width:15%;
}
/*.page-5 table tr th:first-child{
    width:14%;
    padding: 20px 35px;
}
.page-5 table tr td:first-child{
    width:12%;
    padding: 10px 35px;
}
.page-5 table tr th:last-child{
    text-align: left;
}
.page-5 table thead{
    background-color: #f9f9f9;
    border-radius: 10px;
    display: table-caption;
}*/
/*table#InvoiceTable tr td{
    text-align: left;
      padding:15px 0;
    width: 25%;
}*/

/*.page-5 tbody tr{
    border:2px solid #fff;
    position:relative;
}

.page-5 .interactive tbody tr:hover{
    border:2px solid #007ff6;
    border-radius: 10px;
}*/
/*.page-5 tbody tr:hover .popup{
    display: block;
}*/

.panel-heading img:first-child{
    margin-left: 62px;
    margin-right: 49px;
}
.panel-heading h3{
   /* display: inline-block;*/
    width:50%;
    margin-left: 30px;
    font-weight: 300;
    color: #555;
    font-size: 18px;
}
.page-5 .frontlock h2{
    text-align: left;
    color: #555;
    font-weight: 300;
    float: left;
}
.page-5 .frontlock .exit{
    display: inline-block;
    float: right;
}
.page-5 .frontlock .exit img{
    position: static;
}

.popup{
    background: url(../images/action-bg_03.png)no-repeat;
    -webkit-background-size: 100%;
    width: 220px;
    height: 80px;
    display: none;

    
}

.action-popup{
    position: absolute;
    right: 200px;
    z-index: 200;
}
.popup h3{
    display: inline-block;
    font-weight: 300;
    margin-left: 20px;
    color:#777;
}
.popup img.change{
    position: absolute;
    right:70px;
    top:13px;
}
.popup img.dump{
    position: absolute;
    right:25px;
    top:13px;
}
table tbody {
    position: relative;
}
img.popup{
    width:220px;
    position: absolute;
    top: -58px;
    right:0;
    height:auto;
    display: none;
}
/*.page-5 table {
    margin-top: 45px;
     border-collapse: separate; 
     position: relative;
}*/
.page-7 .panel-heading{
    width:15%;
    display: inline-block;
}

.page-7 .panel .row{width:80%;display: inline-block;}

.page-7 .btn{
    border:none;
}
.page-7 .panel{
    margin-top: 30px;
    padding-bottom: 25px;
}
.submit.row {
width: 100%;
margin: 0 auto;
text-align: center;
}
.page-5 .panel .submit.row img{
    width:120px;
    height:auto;
}
.page-7 .form-group{
    width: 17%;
    margin-left: 19px;
    display: inline-block;
}
.page-7 .form-group input {
    width:100%;
}
.page-7 .form-inline .btn{
    display: inline-block;
    width:50%;
}
.page-7 .btn-default:hover{
    border:none;
    background-color: transparent;
}
.page-7 tbody tr:last-child{
    /*border-bottom: 1px solid rgba(150,150,150,0.2);*/
}
.page-7 .panel-heading span{
font-size: 19px;
margin-left: 20px;
margin-right: 26px;
}
table#InvoiceTable tr td:last-child{
    text-align: center;
}
table#InvoiceTable tr th:last-child{
    text-align: center;
}
.page-5 table tr td:last-child{
    text-align: left;
}
.page-5table tr th:last-child{
    text-align: center;
}
table#InvoiceTable tr td img{
    margin-left: 30px;
}
.page-5 tbody{
    width:100%;
}
.page-5 tbody td{
    padding-top: 0px;
    padding-bottom: 0px;
}
.page-5 table tr td{
    width:14%;
    width: 14%;
    font-size: 18px;
}
.page-5 table tr th{
    width: 14%;
    font-weight: 300;
    font-size: 20px;
    color: #777;
}
.page12{
    background-color: #eaeaea;
    color: #b0b0b0;
}

.exit img{width: 120px;
height: auto;
position: absolute;
top: -47px;
right: 47px;}

.exit:hover{
    background: none;
}
.page-10 .frontlock.frontlock3{
    margin-bottom: 60px;
}
.page-10 thead{
    width:100%;
    text-align: center;
}
.page-10 thead tr{
    width:50%;
}
.page-10 table tr th:last-child{
    text-align: left;
}
.page-10 table tr td:last-child{
     text-align: left;
}

.gradient_btn {
    background: rgba(179,220,237,1);
    background: -moz-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(179,220,237,1)), color-stop(32%, rgba(41,184,229,1)), color-stop(100%, rgba(8,131,246,1)));
    background: -webkit-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: -o-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: -ms-linear-gradient(top, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    background: linear-gradient(to bottom, rgba(179,220,237,1) 0%, rgba(41,184,229,1) 32%, rgba(8,131,246,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3dced', endColorstr='#0883f6', GradientType=0 );
    endColorstr='#0883f6', GradientType=0 );
    height: 60px;
    border-radius: 10px;
    font-size: 20px !important; 
}

.gradient_btn a { color: #ffffff !important; text-decoration: none !important; font-weight: 100; padding: 0px 20px !important; }

.frontlock{
    position:relative;
}

[page='customize'] .tab-pane .tab-content{
    text-align: center;
}

[page='customize'] .tab-pane .lock h1{
    margin:50px 0px;
}

[page='customize'] .tab-pane .lock .efield{
    position: absolute;
    width: 170px;
   /* border-radius: 10px;
    font-size: 16px;
    text-align: center;*/
    bottom: 110px;
    left: 16px;
    /*padding: 0px 10px;
    height: 54px;*/
}

[id *='A7KEY']{
    top: 62px;
    width: 90px;
    right: 11px;
    position: absolute;
    font-size: 18px;
    display: inline-block;
    background-color: #fff;
    z-index: 200;
    color:#333;
}

.lock > h1 {
    display:none;
}

[page='customize'] .tab-pane .lock{
    display:inline-block;
    text-align: center;
    position:relative;
    margin-top: 70px;
}

[page='customize'] .tab-pane .lock .lock-img{
    position: relative;
    display:inline-block;
}

[page='customize'] .tab-pane .lock .lock-img .efield[disabled]{
    background:none;
    border:none;
    box-shadow: none;
}

#front .lock .efield:nth-child(2){
    bottom: 40px;
}


#right .lock .efield{
    width: 236px;
    left: 242px;
}

#right .lock .efield:nth-child(1) {
    top: 0px;   
}

#right .lock .efield:nth-child(2) {
    top: 64px;
}

#left .lock .efield[field-id *='A6L1']{
    width: 197px;
    left: 27px;
    top: 78px;
}

.border-style1{
    border-radius: 12px;
    border: solid 1px #EAEAEA;
    background-color: #F9F9F9;
}

.border-style1:focus{
    outline:none;
    border-color:#007ff6;
}


/* Stepper */

.stepper{
     display: table;
     background-color: rgba(255, 255, 255, 0.4);
     color: #000;
     margin: 0 auto;
     
}
.stepper > * {
    display: table-cell;
    vertical-align: middle;
    width: 33%;
    height: 100%;
    font-size: 100%;
}

.stepper > num{
    border:solid 1px #000;
    border-radius: 6px;
    text-align: center;
    border-radius: 12px;
    border: solid 1px #EAEAEA;
    background-color: #F9F9F9;
}

.stepper > num:focus{
    outline:none;
    border-color:#007ff6;
}

.stepper > div{

    background-image: url('/images/blue-arrow.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 43%;
    cursor: pointer;

     -webkit-user-select: none; /* webkit (safari, chrome) browsers */
    -moz-user-select: none; /* mozilla browsers */
    -khtml-user-select: none; /* webkit (konqueror) browsers */
    -ms-user-select: none; /* IE10+ */


}

.stepper[no-arrows] > div{
    visibility:hidden;
}

.stepper > div:last-child{
     -webkit-transform: scaleY(-1);
     -moz-transform: scaleY(-1);
     -ms-transform: scaleY(-1);
     transform: scaleY(-1);
}

.stepper > div:active{
    background-size: 40%;
}

.lockset .stepper{
    padding-top: 30px;
    width: 125px;
    height: 69px;
}

.lockset{
    position:relative;
    float:none;
    margin:auto;
}

.lockset.disabled:hover h2{
    border-color: blue;
}

.lockset .lockImgHolder{
    margin-top:20px;
    height:200px;
}

.lockImgHolder img.lockImg {
    position: absolute;
    left: 108px;
}

select{
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 10px;
    border: 2px solid rgba(153, 153, 153, 0.53);
    padding:5px;
    width:auto;
    text-align:center;
    margin: 0px;
    cursor: pointer;
    background-image: url(/images/blue-arrow.png);
    background-repeat: no-repeat;
    background-size: 7%;
    background-position: 94%;
    padding-right: 5%;
    background-color: transparent;
}

/*select {

    
    padding: 15px 10px;
    font-size: 22px;
    width: 300px;
    background-color: transparent;
}*/

select:active, select:focus{
    outline: none;
    border-color: #007ff6; 
}

select.big{
    padding: 15px 5% 15px 10px;
    font-size: 22px;
}



.glyphicon{
    top: 6px;
    left: -30px;
    font-size: 24px;
    z-index: -1;
}

.disabled{
    opacity: 0.4;
}

.error {
    color:red;
    display: none;
}

.appr_status.error{
    display:initial;
}
.page1 .error.name, .page1 .error.phone, .page1 .error.email{
    text-align: left;
    padding-left:5px;
    margin-bottom: -20px;
}
.page1 .error.info{
    text-align: center;
}
.error.type{
    margin-top: 10px;
    font-size: 20px;
}
.frontlock3 .error.type{
    text-align: right;
}
.lockset.disabled h2{
    border-color: rgba(150, 150, 150, 0.3);
}

/*input.inp-error{
    border: 1px solid red;
}*/
.tab-error{
    border-color: red !important;
    background-color: rgba(255, 0, 0, 0.1);
}

#lockTotal{
  display: inline-block;
   vertical-align: middle;
  color: #000;
  font-size: 22px;
  margin-right:20px;
}

#lockTotal > *{
    display:table-cell;
    vertical-align: middle;
} 

#InvoiceTable{
    width: 100%;
}
#InvoiceTable{
    border-bottom: 1px solid rgba(204,204,204,0.3);
}

.img_wrapper[lock-type] img{
    border: 2px solid #E2E2E2;
    border-radius: 12px;
    cursor: pointer;
}

.img_wrapper[lock-type] img:hover{
    border: 2px solid;
}

.img_wrapper[lock-type] img.selected{
    border-color: blue;
}
.selected {
    opacity: 1;
}
.next.btn.btn-default {
    padding: 0;
    color: #fff;
    font-size: 20px;
    font-weight: 300;
}
.next.btn.btn-default a{
    padding:15px 29px;
    display: inline-block;
}

div.lockname{
    position: absolute;
    top: 0;
    left: 105px;
    top: 219px;
    text-align: center;
    width: 76px;
    color: #444;
    font-size: 14px;
    line-height: 16px;
    display: none;
}
.panel-heading a img{
    margin-left: 0!important;
    margin-right: 0!important;
}
.btn-add-new-lock:hover {
border: solid 1px #007ff6;
border-radius: 6px;
}
.btn-add-same-lock:hover{
    border:solid 1px #007ff6;
    border-radius: 4px;
}

.panel > .submit.row{
    display:none;
    padding:20px;
    width:auto;
}

.edit-mode .panel > .panel-heading{
    display:none;
}

.edit-mode .panel > .submit.row{
    display:block;
}

#InvoiceTable tr.edit{
    border: 1px solid #EAEAEA;
    border-radius: 10px;
    /*background-color: rgba(0,0,0,0.6)*/
}


tr .action{
    display:none;
    position:absolute;
    right:0px;
    top:-55px;
}

tr:hover .action{
    display:block;
}

.edit-mode tr:hover .action{
    display:none;
}

.action .bg {
    margin: 0px;
    width:200px;
}

.action > div {
    position: absolute;    
    top: 16px;
    left: 19px;
}


tr > .edit-fields{
    position:absolute;
    width: 100%;
    min-height:75px;
    background-color: #fff !important;
    border-radius: inherit;
    left:0px;
    padding: 10px;
    border:solid 1px;
}

.page-14 .col-md-2{
    width:15.66666%;
}
.page-14 .col-md-2 button{
    background: none;
    border: none;
}
.page-14 .col-md-6 {
width: 53%;
background-color: #f9f9f9;
padding: 14px;
border-radius: 15px;
}
.page-14 .col-md-6 h1{
    font-weight: 300;
    font-size: 18px!important;
    color: #222;
}
.print_icon.col-xs-2.col-sm-2.col-md-2.text-right{
    padding-right: 0;
}
.email_icon, .print_icon{
    opacity: 0.5;
}
.action > div > img{
    height: 30px;
    width:auto;
    margin: 0px 0px 0px 9px;
}

.action > div > *{
    vertical-align:middle;
}


/*.table .table{
    background-color: initial;
}*/

.table{
  display:table;
  width:auto;
  margin:0px;
  position: relative;

}

.table.hmax{
    width:100%;
}
.table.vmax{
    height:100%;
}


.table.layout-auto{
  table-layout: auto;
}
.table.layout-fixed{
  table-layout: fixed;
}
.table.inline{
  display:inline-table;
}
.table > *{
  display:table-row;
  position:relative;
}
.table > * > *{
  display:table-cell;
  position:relative;
}

.table.valign-middle > * > *, .valign-middle{
  vertical-align: middle;
}
.table.valign-top > * > *, .valign-top{
  vertical-align: top;
}
.table.valign-bottom > * > *, .valign-bottom{
  vertical-align: bottom;
}
.table.halign-left > * > *, .halign-left{
  text-align: left;
}
.table.halign-center > * > *, .halign-center{
  text-align: center;
}
.table.halign-right > * > *, .halign-right{
  text-align: right;
}

.lock-details{
    display:inline-block;
    text-align:left;
}
.lock-details > *{
    display:inline-block;
    vertical-align: middle;
}

.lock-details img.lock{
    width: 99px;
    margin-right: 20px;
}

.lock-details .lock-type{
    font-weight: bold;
    font-size: large;
    vertical-align: middle;
}
.lock-details .lock-info.table > * > *{
    padding-right:10px
}

.infodot{
    margin:5px;
    width: 15px;
    vertical-align: middle
}


.bot-status.container{
    border-top:1px solid rgba(0,0,0,0.1);
    padding-top:25px;
    margin: 50px 0px;
    position:relative;
}

#error-list {
    border: solid 1px #b0b0b0;
    border-radius: 5px;
    position:absolute;
    width:172px;
    bottom: 65px;
    right:-23px;
    text-align: center;
    background-color:#f9f9f9;
    color: #000;
    padding: 5px;
    opacity: 0;
    box-shadow: 3px 3px 5px -2px;
   /* display:none;*/

    /* For Safari 3.1 to 6.0 */
    -webkit-transition-property: bottom, opacity, background-color, height;
    -webkit-transition-duration: 0.3s;
    -webkit-transition-timing-function: linear;
    -webkit-transition-delay: 0.4s, 0.4s, 0s;
    /* Standard syntax */
    transition-property: bottom, opacity, background-color, height;
    transition-duration: 0.3s;
    transition-timing-function: linear;
    transition-delay: 0.4s, 0.4s, 0s;
}

#error-list.show{
    display:block !important;
    bottom: 80px;
    opacity: 1;
}

#error-list.valid{
    background-color:#C0FF62;
}

#error-list .error-list-item{
    cursor:pointer;
    font-weight:bold;
    font-size: 18px;
    white-space: nowrap;

}

#error-list .error-list-item:hover{
    text-decoration: underline;
}

#error-list .list {
    margin-top: 10px;
    font-size: larger;
}

.stroke{
    -webkit-filter: drop-shadow(0px 0px 2px rgba(1,0,0,1));
    /*filter: url(dropshadow1.svg#drop-shadow);*/
    -ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=0, OffY=0, Color='#ff0000')";
    filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=0, OffY=0, Color='#ff0000')";
}

input[type="checkbox"] {
  border: solid 2px;
  background: none;
  margin: 0px;
  width: 26px;
  height: 26px;
  vertical-align: middle;
}

.uploadModule{
    margin:auto;
    text-align:center
}

.uploadModule > div{
    text-align:left;
    display:inline-block
}

.efield{
    display: inline-block;
    margin: 5px;
    border-spacing: 0px;
    vertical-align: top;
}


.efield > div{
    border: solid 1px #EAEAEA;
    display: table;
    padding: 2px 5px;
    
    line-height: normal;
    background-color: #F9F9F9;
    font-size: 12px;
    color: #929292;
}



.efield > .placeholder, .efield > .status{
    display:none;

}

.efield a{
    font-size:inherit;
}

.efield.placeholder > .placeholder{
    display:table;
    border-bottom: none;
    border-top-right-radius: 6px;
    border-top-left-radius: 6px;
}

.efield.status > .status{
    display:table;
    border-top: none;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
    margin-left:auto;
}

.efield select[control]:focus {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom: none;
}



.efield > [control]{
    color:#000;
    width: inherit;
    border-radius: 12px;
    border: solid 1px #EAEAEA;
    padding: 7px 10px;
    background-color: #F9F9F9;
    font-size: 17px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.efield.status > [control]{
    border-bottom-right-radius:0px
}

.efield > [control]:focus, .efield.active .placeholder{
    outline:none;
    border-color:#007ff6;
}

/*.efield.active .placeholder{
    border-bottom: solid 1px #F9F9F9;
}*/



.efield.placeholder > div + [control]{
    border-top-left-radius: 0px !important;
}

.edit-fields .stepper {
  width: 115px;
  height: 38px;
  display:inline-table;
}

.edit-fields .stepper num{
    font-size:17px;
}

.edit-fields .efield{
    width: 142px;
}

.edit-fields [btn] {
    height:50px;
    display:inline-block;
    margin:10px 6px 0px
}


.edit-fields [entrypoint]{
    /*width:470px;*/
}



.edit-fields > * > * > .table > * > :first-child {
    width:12%;
}

.edit-fields > * > * > .table > * > :first-child > * {
    vertical-align:middle;
}

.edit-fields > * > * > .table > * > :nth-child(2) {
    width:14%;
}

.edit-fields > * > * > .table > * > * {
    padding: 0px 5px;
}

.edit-fields > * > * > .table > * >:last-child {
    border-left:1px solid #EAEAEA;
    width:212px;
}

.edit-fields .lockImg{
    margin-left:22px;
}
.edit-fields .lockNum{
    margin-left:20px;
}

.edit-fields > *:nth-child(2) > *{
    border-top:solid 1px #EAEAEA;
    margin: 19px;
}

.edit-fields > * > *{
    padding: 15px 0px
}

.edit-fields .quants{
    width:100%;
    height:100%;
    min-height:100px;
}






.edit-mode .footer-status{
    display:none;
}

.lockset{
    display:inline-block;
    margin-top:30px;
}

.lockset .bHeader{
    text-align: center;
    margin: 10px auto;
    border: 2px solid;
    border-color:  rgba(0,0,0,0.0);
    border-radius: 10px;
    padding: 15px;
    font-weight: 300;
    color:#555;
    width: 80%;
    font-size: 20px;

    -webkit-transition: border-color 0.5s; /* Safari */
    transition: border-color 0.5s;
}

.lockset:hover .bHeader{
    border-color: rgba(0,0,0,0.2);

}

.lockset.selected .bHeader{
    border-color: #0000ff;

}

.lock-selector{
    display:inline-block;
    width:460px;
    margin:0px 10px;
}

.lock-selector{
    text-align:center;
}

.lock-selector .item-list{
    width: 425px;
    margin: auto;
    text-align: left;
}

.lock-info-item{
    display:inline-block;
    width: 200px;
    height: 130px;
    border: 2px solid rgba(0,0,0,0.2);
    border-radius: 10px;
    margin:5px;
    cursor: pointer;
    position: relative;
}

.lock-info-item:hover{
    border: 2px solid rgba(0,0,0,0.5);
}

.lock-info-item.selected{
    border-color:#0000ff;
}

.lock-info-item title, .lock-info-item ident{
    display:block;
}

.lock-info-item > .table{
    width:inherit;
    height: inherit;
}

.lock-info-item img {
  width: 60px;
}

.lock-info-item .info{
    display:inline-block;
    width: 115px;
    height: auto;
    padding: 0px;
    font-size: 15px;
    color: #000;
    text-align:left;
    font-weight: 600;
    margin: 0px 0px 0px 5px;
}

.lock-info-item .info > *{
    vertical-align:middle;
}

.lock-info-item .info ident{
    font-size:10px;
    color:rgba(0,0,0, 0.5)
}

.lock-info-item .table  > * > * > *{
    vertical-align: middle;
}

.lock-info-item infodot{
    position: absolute;
    top: 5px;
    right: 5px;
}

.replacement-select {
    text-align:center;
    margin-top:2px;
    display:none;
    position: absolute;
    background-color: #fff;
    top: 30px;
    left: 40px;
}

.replacement-select select{
    padding:5px;
    width:auto;
    text-align:center;
    margin: 0px;
    font-size: 15px;
    cursor: pointer;
    background-image: url(/images/blue-arrow.png);
    background-repeat: no-repeat;
    background-size: 7%;
    background-position: 94%;
    padding-right: 14%;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    border-bottom: none;
}

.replacement-select select:focus{
    border-color: #009EFF;
    outline:none;
}


.replacement-select .enter-key-number{
    display:none;
    width: auto;
}

.replacement-select .select-key-number{
    display:none;
}

.replacement-select[action='enter'] .enter-key-number{
    display:inline-block;
}

.replacement-select[action='select'] .select-key-number{
    display:initial;
}

.float-next-btn{
    position:fixed;
    bottom:10px;
    pointer-events: none;
    width: 970px;
    text-align: right;
}



.float-next-btn > div{
    display: inline-block;
    text-align: center;
    pointer-events: all;
}

.float-next-btn > div > #error-list{
    left: auto;
    right: auto;
    bottom: auto;
    margin: 20px auto;
    position: relative;
}

.float-next-btn > div > #error-list.inline{
    display: inline-block !important;
    vertical-align: middle;
    width: auto;
    height: auto;
    margin-right: 10px;
}

.float-next-btn > div > #error-list.inline .list{
    display:none;
}

.float-next-btn > div > #error-list.inline .msg{ 
    font-weight: bold;
}

[fixed-bottom-or]{
    position:fixed;
}

infodot{
    display:inline-block;
    width:15px;
    height:15px;
    border-radius:50%;
    background-size: auto 60%;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #007ff6;
    vertical-align: middle    
}

infodot[type='info'] {
    background-color:#007ff6;
    background-image: url(/images/info-dot-i.png);
}

infodot[type='help'] {
    background-color:#007ff6;
    background-image: url(/images/info-dot-q.png);
}

infodot[type='positive']{
    background-color: #00b138;

}

infodot[type='negative']{
    background-color: #f13438;
}

.headmenu > .container.table img {
    height: 50px;
    width:auto;
    vertical-align:middle;
    float:none;
    padding:0px;
    margin: 5px 3px;
}

.headmenu > .container.table [action='cart'] img {
    height: 55%;
}

.headmenu > .container.table{
    margin:auto;
    /* height: 100px; */
}

.headmenu > .container.table > * > :first-child, .headmenu > .container.table > * > :last-child{
    width:235px;
}

.btn-group{
    display:inline-block;
}

#footer img[src$="masterlock.png"]{
    width:160px;
    height:auto;
}

#footer img[src$="suncor.png"]{
    width:100px;
    height:auto;
}

#footer .container > p {
    text-align:center;
}


/*body > .table > *:first-child > *{
    height:1px;
}

body > .table > *:last-child > *{
    height:1px;
}*/

.img-responsive{
    width:100%;
    display:block;
    height:auto;
}

hidden{
    display:none;
}

.help-dialog{
    padding: 20px;
    display: inline-block;
    background-color: #FFF;
    border-radius: 16px;
    width: 400px;
}

.help-dialog h2{
    margin-top:0px;
}

.round{
    border-radius: 50%;
    padding:0px;
    background-size:fill;
    background-repeat:no-repeat;
}

a.round{
    display:inline-block;
}


@keyframes red-pulse{
    to{
        border-color: red;
        box-shadow: 0px 0px 5px red;
    }
}

@-webkit-keyframes red-pulse{
    to{
        border-color: red;
        box-shadow: 0px 0px 5px red;
    }
}

@keyframes red-pulse-text{
    to{
        color: red;
        text-shadow: 0px 0px 5px red;
    }
}

@-webkit-keyframes red-pulse-text{
    to{
        color: red;
        text-shadow: 0px 0px 5px red;
    }
}

.error-pulse, .inp-error{

    box-shadow: 0px 0px 0px;

    animation-name: red-pulse;
    animation-duration: 0.7s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease-in;

    -webkit-animation-name: red-pulse;
    -webkit-animation-duration: 0.7s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-timing-function: ease-in;
}

.error-pulse-text{

    box-shadow: 0px 0px 0px;

    animation-name: red-pulse-text;
    animation-duration: 0.7s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: ease-in;

    -webkit-animation-name: red-pulse-text;
    -webkit-animation-duration: 0.7s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    -webkit-animation-timing-function: ease-in;
}



.table.tablist {
    width:450px;
    height:60px;
    border-radius: 15px;
    border-color: #ccc;
    margin:auto;
    font-weight: bold;
    color: #000;
    font-size:20px
}

.table.tablist > *{
    border-radius: inherit;
    border-color: inherit;
    border:inherit;
}

.table.tablist > * >*{
    border:solid 1px;
    border-color: inherit;
    border-right:none;
    cursor:pointer;
}

.table.tablist > * >*:first-child{
    border-bottom-left-radius: inherit;
    border-top-left-radius:inherit;
}

.table.tablist > * >*:last-child{
    border-bottom-right-radius: inherit;
    border-top-right-radius:inherit;
    border-right:solid 1px;
    border-right-color: inherit;
}

.table.tablist > * >*:hover{
    background-color:rgba(255,0,0,0.1);
    color:#007ff6;
}

.table.tablist > * >*.active{
    background-color:rgba(0,0,255,0.1);
}

.tab-content .tab-pane{
    display:none;
}

.tab-content .tab-pane.active{
    display:block;
}

.form-control, input {
  display: block;
  font-size: 18px;
  line-height: normal;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}

.form-control, input:focus{
    outline:none;
}


.lock-view{
    display:inline-block;
    position:relative;
    font-size: 30px;
}

.lock-view > img{
    height:inherit;
    width:inherit;
}

.lock-view [lock-field]{
    position:absolute;
    width:100%;
    white-space: normal;
}

.lock-view [lock-field='A1L1']{
    top: 210px;
}
.lock-view [lock-field='A1L2']{
    top: 265px;
}

.setsize-select .lock-view{
    position: absolute;
    transform-origin: 160% center;
}

.lock-set-view{
    display:block;
    position:relative;
    white-space: nowrap;
}


.table.setsize-select {
  border-spacing: 6px;
  font-size:25px;
}

.table.setsize-select > * > *{
    border:solid 1px #eaeaea;
    border-radius: 16px;
    width: 128px;
    height: 200px;
    background-color: #F9F9F9;
    color: #000;
    vertical-align: bottom;
}

.table.setsize-select > * > *:hover{
    border-color:#32cf13;
}

.table.setsize-select .lock-set-view {
    transform: scale(0.277008);
}


/*.table.setsize-select > * > *.selected{
    border-color:#32cf13;
    border-width: 2px;
}*/


/*[setsize] [lock-sets]{
    border-color:#32cf13;
    border-width: 2px;
}*/

[setsize='1'] [lock-sets='1']{
    border-color:#32cf13;
    border-width: 2px;
}
[setsize='2'] [lock-sets='2']{
    border-color:#32cf13;
    border-width: 2px;
}
[setsize='3'] [lock-sets='3']{
    border-color:#32cf13;
    border-width: 2px;
}
[setsize='4'] [lock-sets='4']{
    border-color:#32cf13;
    border-width: 2px;
}

.bheader {
    border:solid 1px;
    border-radius:10px;
    font-size: 22.75px;
    width:225px;
    height:50px;
    margin: 0px 0px 40px;
    color: #000;
    border-color: #eaeaea;
}

hr.connector-lines{
    border:0;
    border-bottom-style: dashed;    
    border-width: 1px;
    position: relative;
}

hr.connector-lines.selected{
    border-bottom-color:#32cf13;
    border-bottom-width: 2px;
}

[setsize='1'] hr.connector-lines.left{
    border-bottom-color:#32cf13;
    border-bottom-width: 2px;
    border-bottom-style: solid;
}
[setsize='2'] hr.connector-lines.middle{
    border-bottom-color:#32cf13;
    border-bottom-width: 2px;
    border-bottom-style: solid;
}
[setsize='3'] hr.connector-lines.right{
    border-bottom-color:#32cf13;
    border-bottom-width: 2px;
    border-bottom-style: solid;
}

[setsize='4'] hr.connector-lines.right-4{
    border-bottom-color:#32cf13;
    border-bottom-width: 2px;
    border-bottom-style: solid;
}


hr.connector-lines.left {
    width: 60px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    left: -73px;
    top: 15px;
}

hr.connector-lines.middle {
    width: 25px;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    left: 0px;
    top: -2px;
}

hr.connector-lines.right {
    width: 60px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    left: 73px;
    top: -2px;
}


[max-sets='4'] hr.connector-lines.left {
    width: 104px;
    transform: rotate(35deg);
    -webkit-transform: rotate(35deg);
    -moz-transform: rotate(35deg);
    left: -110px;
    top: 20px;
}

[max-sets='4'] hr.connector-lines.middle {
    width: 32px;
    transform: rotate(65deg);
    -webkit-transform: rotate(65deg);
    -moz-transform: rotate(65deg);
    left: -29px;
    top: -8px;
}

[max-sets='4'] hr.connector-lines.right {
    width: 42px;
    transform: rotate(-52deg);
    -webkit-transform: rotate(-52deg);
    -moz-transform: rotate(-52deg);
    left: 30px;
    top: -15px;
}

[max-sets='4'] hr.connector-lines.right-4 {
    width: 109px;
    transform: rotate(-30deg);
    -webkit-transform: rotate(-30deg);
    -moz-transform: rotate(-30deg);
    left: 106px;
    top: -15px;
}

.select-quantity.table > * > *:first-child{
    border-right:solid 1px #eaeaea
}

.table.file-upload {
    /*border-spacing:40px*/
}

.dim{
    opacity: 0.6;
}

[page='bulkorder'] .content{
    line-height:normal;
    font-size:14.22px;
    color: #000;
    
}

[page='bulkorder'] .content h1{
    font-size:22.75px;
    color: #007ff6;
    font-weight:300;
    margin-top:0px;
}


[page='bulkorder'] .content .video-thumb{
    width: 303px;
    height: 180px;
    display:inline-block;
}




.video-thumb{
    border:1px solid #9a9a9b;
    background-color: #f9f9f9;
    background-image: url(http://i.ytimg.com/vi/t5ooMQo6W4s/sddefault.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
div.round{
    display:inline-block;
    vertical-align: middle;
}

div.round.blue{
    background-color: #007ff6;
    
}

.or-sep{
    background-image: url(/images/sep-line.png);
    background-size: 1px 100%;
    background-repeat: no-repeat;
    background-position: center;
    color:#fff;
    font-weight:600;
    width: 100px;
}

.or-sep .round{
    width: 50px;
    height: 50px;
    border-spacing: 0px;
    vertical-align: middle;
    color:#fff;
}

hr.grey{
    border:0;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    margin: 25px 0px;
}

textarea.noresize{
    resize:none;
}

.blue{
    color:#007FF6;
}

.qpopup{
    position:fixed;
    background-color: rgba(0,0,0,0.7);
    top:0px;
    left:0px;
    transition: opacity 200ms;
    -webkit-transition: opacity 200ms;

    opacity: 0;
    z-index: 2000;
}

.qpopup.show{
    opacity: 1;
}

.bo-verify-popup.table {
    background-color: #fff;
    border-radius: 16px;
    width:70%;
    height:90%;
}

.bo-verify-popup .lock-list{
    width:100%;
    height: 100%;
}

.bo-verify-popup .lock-list > table thead{
    background-color: #007FF6;
    color: #FFF;
}

.bo-verify-popup .lock-list > table th{
    padding:10px;
}

.bo-verify-popup .lock-list > table tbody tr:nth-child(odd){
    background-color: #f9f9f9;
}

.bo-verify-popup .lock-list-item td:first-child{
    background-image: url(/images/green-check.png);
    background-repeat:no-repeat;
    background-size:15px;
    background-position: 15px center;
}

.bo-verify-popup .lock-list-item.inp-error td:first-child{
    background-image: url(/images/red-x.png);
}


/*.bo-verify-popup .lock-list > table th:first-child, 
.bo-verify-popup .lock-list > table th:nth-child(2){
    width: 10%;
}

.bo-verify-popup .lock-list > table th:nth-child(3){
    width:25%;
    text-align:left;
}*/

.bo-verify-popup .header{
    padding:20px 20px 0px 20px;
    font-size: 22.75px;
}

.bo-verify-popup .footer {
    padding:20px;
    border-top:1px solid
}

.bo-verify-popup .lock-list-item{
    height:50px;
    color:#000;
}

/*.bo-verify-popup .lock-list-item > td{
    border-top:solid 1px;
    border-bottom:solid 1px;
    border-color:rgba(0,0,0,0);
    position: relative
}*/

.bo-verify-popup .lock-list-item .action{
    position:absolute;
    top:initial;
    left:initial;
    right: 10px;
    bottom: 5px;
    display:none;
    z-index:1000;
}

.bo-verify-popup .lock-list-item .action img{
    margin:5px;
}

.bo-verify-popup .lock-list-item .action img.bg{
    width: 110px;
}

.bo-verify-popup .lock-list-item:hover .action{
    display: block;
}

.bo-verify-popup .lock-list-item .action > div{
    position:absolute;
    width:100%;
    top: 23px;
    left:0px;
}

/*.bo-verify-popup .edit .lock-list-item:hover .action{
    display: none;
}



.bo-verify-popup .lock-list-item:hover > td{
    border-top:solid 1px;
    border-bottom:solid 1px;
    border-color:#007FF6;
}
.bo-verify-popup .lock-list-item.edit:hover > td{
    border:none;
}*/

.bo-verify-popup .lock-list tr.hover-highlight{
    border-radius: 16px;
    border-color: rgba(0,0,0,0);
    border-width: 2px;
    border-style: solid;
}

.bo-verify-popup .lock-list tr.hover-highlight:hover{
    border-color: #007ff6;
}



.bo-verify-popup .scrollContent{
    overflow:auto;
    position:relative;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    padding-top: 25px;
}

.bo-verify-popup .lock-list-item.edit{
    
}

.bo-verify-popup .edit-fields{
    position:absolute;
    -webkit-column-span: all;
    column-span:all;
    background-color: #FFF;
    border:solid 1px #aeaeae;
    border-radius: 16px;
    left:0px;
    width: 100%;
}

.bo-verify-popup .edit-fields .lockNum{
    display:none;
}



.lock-list > table{
    width: 100%;
    height: auto;
    border-spacing: 0px;
    position:relative;
}
.lock-list > table th{
    font-weight:300;
}

.pagination{
     -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color:#000;
    white-space: nowrap;
}

.pagination .btn{
    border:1px solid #eaeaea;
    width:40px;
    height:40px;
    border-radius:10px;
    background-size:35% auto;
    background-repeat:no-repeat;
    background-position: center;
    cursor: pointer;   
}

.pagination .btn:hover:not(.disabled){
    border-color:#007FF6;
}

.pagination .btn:active:not(.disabled){
    background-size:34% auto;
}

.pagination .btn.prev{
    background-image:url(/images/blue-arrow-left.png);
}

.pagination .btn.next{
    background-image:url(/images/blue-arrow-right.png);
}

.pagination .pages span{
    display:inline-block;
    padding:0px 10px;
    cursor:pointer;
}

.pagination .pages span[page]:hover{
    color:#007FF6;
    text-decoration: underline;
}

.pagination .pages span[page].selected{
    color:#007FF6;
    text-decoration: underline;
}

.pagination .btn.disabled{
    opacity:0.1;
    cursor:auto;
}


.engrnum{
    font-weight: bold;
    cursor: cell;
}

span.line-number {
    font-size: 9px;
    display: inline-block;
    position: absolute;
    bottom: 0px;
    left: 6px;
}


.current-locks .lock-list > table thead{
    font-size:20px;
    background-color:#f9f9f9;
    color:#777;
}
.current-locks .lock-list > table tr{
    height: 70px;
}

.current-locks .lock-list > table tr td{
    /*border:inherit;*/
    position:relative;
}

.current-locks .lock-list > table td > *{
    vertical-align:middle;
}

.current-locks .lock-list > table thead th:first-child{
    border-top-left-radius:16px;
    border-bottom-left-radius: 16px;
}
.current-locks .lock-list > table tr > td:first-child > *{
    margin:10px;
}

.current-locks .lock-list > table thead th:last-child{
    border-top-right-radius:16px;
    border-bottom-right-radius: 16px;
}

.current-locks .lock-list tr.hover-highlight{
    border-radius: 16px;
    border-color: rgba(0,0,0,0);
    border-width: 2px;
    border-style: solid;
}

.current-locks .lock-list tr.hover-highlight:hover{
    border-color: #007ff6;
}

.current-locks .lock-list tr.hover-highlight:hover > td .action{
    display:block;
}

.lock-list tr.edit{
    visibility: hidden;
}



[mode='edit'] .lock-list tr.hover-highlight{
    cursor: auto;
}

[mode='edit'] .lock-list tr.hover-highlight:hover{
    border-color: rgba(0,0,0,0);
}

[mode='edit'] .lock-list tr.hover-highlight:hover > td .action{
    display:none;
}

[mode='edit'] .pagination{
    display: none;
}

/*
    Handle table row highlighting
*/
tr.hover-highlight{
    cursor: pointer;

    -webkit-transition-property: border-color;
    -webkit-transition-duration: 0.2s;
    -webkit-transition-timing-function: linear;

    /* Standard syntax */
    transition-property: border-color;
    transition-duration: 0.2s;
    transition-timing-function: linear;
}

tr td{
    position:relative;
}

tr.hover-highlight:hover{
    border-style: solid;
}

tr.hover-highlight > td{
    border-color: inherit;
    border-top-style: inherit;
    border-top-width:inherit;
    border-bottom-width: inherit;
    border-bottom-style: inherit;
}

tr.hover-highlight > td:first-child{
    border-top-left-radius: inherit;
    border-bottom-left-radius: inherit;
    border-left-style: inherit;
    border-left-width: inherit;
}

tr.hover-highlight > td:last-child{    
    border-top-right-radius: inherit;
    border-bottom-right-radius: inherit;
    border-right-style: inherit;
    border-right-width: inherit;
}

td .action{
    display:none;
}

body .table.root > *:first-child, body > .table.root > *:last-child{
    height:1px;
}

.sap-popup {
    overflow: auto;
    height: 100%;
    max-width: 970px;
    margin: auto;
    position: relative;
}

.sap-popup .sap-image{
    height:100%;
    overflow:auto;
}

.sap-popup .sap-image > img{
    width:100%;
    display:block;
}

.btn-close{
    position: absolute;
    width:25px;
    height: 25px;
    background-color: #2391f7;
    color: #fff;
    top: 10px;
    left:10px;
    border-radius: 50px;
    cursor: pointer;
}

[payment-option='cc'] .submessage.placed{
    display:none;
}

[payment-option='pr'] .sap-icon, [payment-option='pr'] .pr-inst{
    display:block;
}

.pr-inst{
    display:none;
}

.sap-icon{
    cursor: pointer;
    display:none;
}

.sap-icon:hover{
    text-decoration: underline;
}

[payment-option] .payment-options{
    display:none;
}

.payment-options {
    text-align:center;
}

.payment-options > button{
    width: 35%;
}

.cc-inst{
    display:none;
    background-color: #0481fa;
    color: #fff;
    width: 70%;
    margin:auto;
    padding: 20px;
    font-size: 24px;
    border-radius: 6px;   
    line-height: 1.25em;
    text-align:center;
}

.cc-inst .smaller{
    display:inline-block;
    font-size:15px;
    line-height:normal;
    width:70%;
    margin-top:20px;
}

.cc-inst [site-data="client.email"]{
    white-space: nowrap;
}

[payment-option='cc'] .cc-inst{
    display: block;
}

.cc-info-confirm .complete{
    display:none;
}

.cc-info-confirm[mode='complete'] .complete{
    display: block;
}

.cc-info-confirm[mode='complete'] .confirm{
    display: none;
}

.cc-info-confirm[mode='error'] .error{
    display: block;
    color: #fff;
}

.cc-info-confirm .error{
    font-size: smaller;
    line-height: normal;
    padding: 10px;
    color: #B30000;
}


.headmenu .selected[action]{
    background-color: #fff;
}

.headmenu .menus.container{
    position: relative;
    display:block;
    overflow: visible;
    margin:auto;
}

.menu-tab{
    background-color:#fff;
    overflow:auto;
    position:absolute;
    right: 0px;
    z-index: 1000;
    box-shadow: 0px 14px 43px -14px;
}

.shopping-cart {
    width:400px;
    height: 500px;
}

.shopping-cart .current-locks{
    display:block;
    width: auto !important;
}

.shopping-cart .current-locks thead{
    display:none;
}

.shopping-cart .current-locks tr:nth-child(odd){
    background-color:#F9F9F9;
}

.cart-quant {
    position:absolute;
    bottom:5px;
    left: 28px;
    border:solid 2px;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    background-color:red;
    color:#fff;
}

.help-tab {
    padding:20px;
    text-align:center;
}

.help-tab h3{
    margin-top:0px;
    font-weight: 300;
}

.help-tab .video-thumb{
    display:inline-block;
}

.help-tab button.white{
    width:100%;
    height: 75px;
    font-weight: 300;
    font-size: 18px;
}

.step-progress{
    text-align:center;
    background-color: #f9f9f9;
    padding: 5px 0px;
    margin-bottom: 20px;
}

.step-progress > span{
    display:inline-block;
    margin:2px;    
    border-radius: 50%;
    width:25px;
    height:25px;
    padding-top:2px;
    
}

.step-progress > span.selected{
    border:solid 1px #007ff6;
}

select.schema-select {
    position:absolute;
    top: 0px;
    left: 0px;
    padding: 1px 5% 1px 1px;
    border-top: none;
    border-left: none;
    border-radius: 6px 0px 0px 0px;
}


.billing-details > .efield, .cc-details > .efield {
    width:275px;
}
.billing-details > .efield.short{
    width:130px;
}

.container.totals{
    text-align: right;
    border-top: solid 1px rgba(0,0,0,0.1);
    padding-top: 20px;
}

.container.totals > .table{
    /* border-spacing: 12px; */
    /* border-bottom: solid 1px rgba(0,0,0,0.1); */
    /* margin-bottom: 50px; */
    /* padding: 1px; */
}

.container.totals > .table > * > *:first-child{
    text-align:left;
}

.cc-processing {
    border: solid 1px;
    border-radius: 12px;
    display: inline-block;
    width: 400px;
    height: 200px;
    background-color: #fff;

}

.cc-processing button{
    display:none;
}

.cc-processing[state] button{
    display:inline-block;
}

.cc-processing[state='error']{
    background-color:red;
}

.cc-thankyou h2 {
    color:blue;
    font-weight:100;
    line-height: 40px;
}
.cc-failure { 
    width: 300px;
    margin: 0px auto;
    background-color: white;
    border-radius: 10px;
    padding: 20px;
}

select::-ms-expand {
    display: none;
}

#dock-list { width: 420px; }

.other_location { display: block; width: 420px; }


.pin-entry { width: 300px; font-size: 40px; margin: 0px auto; text-align: center; }
.pin-help { width: 450px; margin: 20px auto; }
.pin-submit { margin: 20px auto; }
.invalid-pin { display: none; color: red; font-weight: bold; }

.main-logo{
    margin:50px 0px;
}

.accepted{
    color:green;
}

.uname{
    text-transform:capitalize;
}

.appr_info.table{
    border-spacing: 0px 10px;
}

.totals-view > *:first-child > *{
    border-bottom: 1px dashed;
}

.totals-view > *:last-child > *{
    border:none;
}

.totals-view > * > *{
    padding:10px 0px;
}


.opentip-container{
    z-index: 2010 !important;
}