@font-face {
    font-family: 'MICR';
    src: url('/media/fonts/micr.eot');
    src: url('/media/fonts/micr.eot?#iefix') format('embedded-opentype'),
         url('/media/fonts/micr.woff') format('woff'),
         url('/media/fonts/micr.ttf') format('truetype'),
         url('/media/fonts/micr.svg#MICR') format('svg');
    font-weight: normal;
    font-style: normal;

}



html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/* JROCK FRAMEWORK */
.wrapper{width:1170px; margin: 0 auto; padding: 0;}
.right{float: right}
.left{float: left}
.middle{margin: 0 auto;}
.center{float: left; margin-left: 2%;}
.whole{width: 100%;}
.half{width: 49%; }
.third{width: 32%;}
.third-middle{margin-left: 2%}
.two-third{width: 65%}
.quarter{width: 22.9%; margin-right: 20px;}
.txtRight{text-align: right}
.txtLeft{text-align: left}
.txtCenter{text-align: center;}
b{font-weight: bold}
.clear{clear: both}
.open{display: block};
#holder{width: 100%}
img {
	max-width: 100%;
 /* ie8 */
}

#videoWrapper {
    position: relative;
    padding-bottom: 53.25%;
    padding-top: 25px;
    height: 0;
}

#videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#videoHolder {max-width: 480px; margin: 0 auto 20px auto}

body{background-color: #ffffff; font-family: 'Open Sans', Arial, sans-serif; font-size: small; line-height: 1.2}
.wrapper{width: 1170px; margin: 0 auto 0 auto;/*  border: 1px solid red; */}
.content{background-color: #efefef; padding: 0 0 80px 0; float: left; width: 100%; min-height: 700px}
#footer{
	background-color: #ffffff;
	min-height: 90px;
	text-align: center;
	padding: 40px 0; width: 100%; float: left;
	border-top: 20px solid #4e5a64;
}


/*SHARED ELEMENTS */
h1,h2,h3,h4,h5,h6,.nav{font-family: 'Montserrat', Arial, sans-serif; line-height: 1;}
h1{font-size: 33px; font-weight: normal; line-height: 33px; margin: 0 0 25px 0;}
h2{font-size: 22px; font-weight: normal; line-height: 20px; margin: 0 0 15px 0; color: #5a5a5a;}
h3{font-size: 18px; font-weight: normal; line-height: 18px; margin: 0 0 10px 0; color: #5a5a5a; clear: both}
h4{font-size: 16px; line-height: 16px; margin: 0 0 10px 0; color: #5a5a5a;}
h5{font-size: 14px; font-weight: bold; text-transform: uppercase; color: #5a5a5a;}

p{font-size: 12px; margin-bottom: 10px; color: #696969}

.divider{border-top: 2px dashed #989898; clear: both; margin-top: 20px; margin-bottom: 30px; height: 2px; float: left; width: 100%;}
/**/

.strike{text-decoration: line-through; opacity: .5}

.bold{font-weight: bold;}

.showMobile{display: none;}

.flex {
    display: flex;
}

.add-flex{
    display: flex;
    justify-content: space-between;
}

/*HEADER STUFF */
#header{width: 100%; min-height: 50px; margin-bottom: 50px; float: left}
#topHeader{background-color: #4e5a64; min-height: 75px; float: left; width: 100%; position: relative}
#topHeader img{margin-left: 20px;}
.nav{background-color: #ffffff;  box-shadow: 0px 2px 4px 0 rgba(0,0,0,0.2); border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; list-style: none; width: 100%; float: left; height: 50px; }
.nav li{float: left;}
.nav li.last{float: right}
.nav li.last a{margin: 0;}
.nav li a:visited{color: #4e5a64;}
.nav li a{height: 50px; line-height: 50px; text-decoration: none; margin: 0 10px 0 0; color: #4e5a64; display: block; padding: 0 10px; transition: background-color .3s ease, color .3s ease,border-bottom-right-radius .3s ease, border-bottom-left-radius .3s ease; font-size: 16px;}
.nav li a:hover, .nav li a.active{background-color: #4e5a64; color: #ffffff; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }
#mobileNavControl{display: none}
/**/



/*LOGO -HTML/CSS*/
#logo{float: left;position: relative; margin-top: 18px; margin-left: 14px}
#logo p{color: #ffffff; text-transform: lowercase; font-family: 'Montserrat', Arial, sans-serif; font-size: 30px;font-weight:normal; letter-spacing: -.4px; margin: 0 0 0 40px; padding: 0; }
#logo .logoBox{display: block; position: absolute; width: 25px; height: 12px; background-color: #86adcb; border-radius: 3px;}
#logo .front{left: 8px; top:17px; z-index: 2; }
#logo .back{background-color: #bed6e4; z-index: 1; top:11px; left: 14px}
/**/



/*UNITS */
.unit{box-shadow: 0px 2px 4px 0 rgba(0,0,0,0.2); border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; margin-bottom: 25px;}
.unit div:first-child{border-top-left-radius: 4px; border-top-right-radius: 4px;}
.unitHeader{background-color: #4e5a64; color: #ffffff; height: 50px; padding: 0 10px; line-height: 50px; font-family: 'Montserrat'}
.unitHeader h1, .unitHeader h2{font-size: 16px; margin-bottom: 0; line-height: 50px; color: #ffffff; float: left}
.unitHeader a{color: #ffffff; text-decoration: none;}
.unitHeader i{font-size: 16px}
.unitBody{background-color: #ffffff; padding: 20px 20px;}
.unitFooter{background-color: #f3f4f7; height: 25px; color: #a3a3a3; font-size: 10px; line-height: 24px; padding: 0 10px; }
.unit div:last-child{ border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; min-height: 10px; }
.unitBody h3{border-bottom: 2px dashed #989898; padding-bottom: 5px; margin-bottom: 20px; color: #86adcb; margin-top: 40px}
.unitBody h3:first-child{margin-top: 0;}
.unitBody h3.txtRed { color: #eb815e; }
/**/

.footerIcons a{font-size: 14px; text-decoration: none; padding-left: 5px;}

/*LOGIN FORM*/
.login{max-width: 335px; margin: 150px auto 0 auto;}
/**/



/*CREATE ACCOUNT */
#createUnit{max-width: 600px; margin: 50px auto;}
#createUnit input{width: 93%}
#state_holder{width: 62%; float: left; margin-right: 8%}
#zip_holder{width: 25%; float: left}
/**/



/*TABLES*/
table{width: 100%; clear: both}
thead{background-color: #e0e2e6}
thead th{padding: 5px 5px; font-weight: bold; font-size: 15.5px}
tbody td{padding: 5px 5px; font-family: "Lekton", "Courier New"; font-size: 14.5px; border-bottom: 1px solid #f3f4f7}
tbody td .tag{font-family: 'Open Sans'; font-size: 10px}
/**/



/*NOTICES*/
.notice{color: rgba(0,0,0,0.6); border-radius: 4px; margin-bottom: 25px; /* box-shadow: inset 0 1px 0 rgba(255,255,255,0.5),0 2px 4px rgba(0,0,0,0.08),inset 0 -1px 0 rgba(0,0,0,0.15); */ padding: 9px 35px 9px 14px; position: relative;}
.notice .closer{position: absolute; top:6px; right:10px; font-size: 18px; color: rgba(255,255,255,.8); text-decoration: none;}
/**/



/*TAGS */
.tag{border-radius: 4px; padding: 3px 8px; color: #ffffff; background-color: red; font-size: 12px; font-weight: 400; line-height: 25px; background-color: #a5a7af }
/**/



/* BUTTONS */
.button, input[type="submit"]{background-color: #4e5a64; color: #ffffff; text-decoration: none;  font-size: 17.5px; border-radius: 6px; cursor: pointer; padding: 11px 10px; font-family: 'Montserrat', Arial, sans-serif; line-height: 17.5px; display: inline-block; margin-bottom: 20px;transition: opacity .4s ease; border: none; height: auto; width: auto; box-shadow: inset 0px -.15em 0px 0px rgba(0,0,0,.2), inset 0px 0px 0px 100px rgba(0,0,0,0), 0px .2em .15em 0px rgba(0,0,0,.15);}
.button:hover{opacity: .85;}
.button:active{box-shadow: inset 0px -.1em 0px 0px rgba(0,0,0,.25), inset 0px 0px 0px 100px rgba(0,0,0,.1), 0px .1em 0px 0px rgba(0,0,0,.2);}
.buttonHolder{margin-top: 20px; padding-top: 20px; clear: both; border-top: 2px dashed #989898;}
.small-button, .button-small, #batchPrintSubmit{font-size: 12.5px; padding: 7px 10px; line-height: 12.5px}
/**/
#batchPrintSubmit { margin: 0; text-transform: uppercase; letter-spacing: 0.5px;}
.batchPreview .unitBody p { font-family: "Lekton", "Courier New"; font-size: 14px;}

.helperBox{width: 80%; border: 2px solid #8F9498; border-radius: 8px; padding: 20px 10px; text-align: center; margin: 0 auto 40px auto; position: relative}
.helperCloser{background-color: #ffffff; text-align: center; width: 30px; line-height: 19px; border-radius: 10px; border: 1px solid #d0d0d0; position: absolute; top:-10px; right: -10px; transition: all .2s ease}
.helperCloser:hover{background-color: #eb815c; color: #ffffff;}

/*TEMPLATE EDIT*/
#templateWrapper{width: 100%; margin: 10px auto 20px auto; float: left; }
#templateHolder{border-radius: 5px; border: 3px dashed #c4c4c4; float: left; position: relative; width: 100%; height: 933px}

/*
.inputElement, .inputElement2{display: block; width: 150px; height: 20px; padding: 0 2px; font-size: 13px; font-family: "Courier New"; border:1px dashed #333333; margin-bottom: 5px; position: relative; overflow: hidden; z-index: 10}
.inputElement:hover, .inputElement2:hover{cursor: move; border-color: red}

#templateHolder .inputElement, .inputElement2{border: 1px solid transparent}
#templateHolder .inputElement, .inputElement2:hover{border:1px dashed #333333;}
*/

#thin-text-area{background:transparent; border:none; width: 100%; height: 100%; resize: none; font-family: "Courier New", Courier; font-size: 12pt}
#thin-text-area:focus{outline: none;}

#elementHolder{position: relative; float: left}

.trash{position: absolute; display: block; width: 25px; height: 25px; background-color: #e37f7f; color: #ffffff; border-radius: 2px; text-align: center; font-weight: bold; font-size: 22px; padding: 5px; box-shadow: 0 0 1px 1px rgba(0,0,0,.2); display: none;}
.trash1{top: -40px; left: -40px}
.trash2{top: -40px; right: -40px}
.trash3{top: 48%; left: -40px}
.trash4{top: 48%; right: -40px}
.trash5{bottom: -40px; left: -40px}
.trash6{bottom: -40px; right: -40px}
.trashHover{background-color: #333333;}

.templateHolder {position: relative;}
.templateHolder .unitBody a{border: 2px solid white;float: left; display: block; overflow: hidden; height: 290px; transition: border 0.2s ease}
.templateHolder .unitBody a:hover{border: 2px solid #8dbdca;}
#uploadCloud{font-size: 215px; color: #8dbdca; text-decoration: none; height: 295px; display: block;}
#specialStar{font-size: 16px; color: #f5ef6b;}

#signature-pad{position: relative; width: 100%;}
#signature-pad canvas{z-index: 10; position: relative; border: 1px solid #cdcdcd; border-radius: 10px; margin: 0 auto; width: 100%;}
#signatureLine{position: absolute; width: 80%; border-top: 1px solid #979797; color: #979797; font-size: 10px; top:70%; z-index: 1; text-align: center; margin-left: 10%;}

.customElHolder{position: relative}
.remove-custom-field{position: absolute; right:-20px; top: 0; padding: 4px; color: #de7a7a; font-size: 16px; transition: 0.2s ease}
.remove-custom-field:hover{cursor: pointer; color: #333333; font-size: 17px}
.edit-custom-field{position: absolute; right: -20px; top: 0; padding: 4px; color:#8dbdca; font-size: 16px; transition: 0.2s ease}
/*check for brwoser support */
.knockOut{background-color: rgba(243,177,85,0.77); position: relative; display: none; background-image: repeating-linear-gradient(20deg, transparent, transparent 10px, rgba(255,255,255,.4) 10px, rgba(255,255,255,.4) 20px); position: absolute; z-index: 1; top:0; left:0;}

.knockTop{border-bottom: 5px solid #f2b154; border-top: 5px solid #f2b154; height: 4%; width: 100%; top:28%; z-index: 2}
.knockOut span{position: absolute; font-weight: bold; color: #b66a00; font-size: 10px}
.knockOut .zone1{top:0; left:5px;}
.knockOut .zone2{top:0; right:5px;}
.knockOut .zone3{bottom:0; right:5px;}
.knockOut .zone4{bottom:0; left:5px;}


.micr{font-family: "MICR"; width: 80%; text-align: center; width: 100%}
#hiddenSig{display: none}
/* --close template edit--*/



/*INPUTS */
input, textarea{display: inline-block; height: 20px; padding: 4px 6px; line-height: 25px; border-radius: 4px; vertical-align: middle; border: 1px solid #c2ccd3; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); margin-bottom: 20px; font-size: 16px; transition: border linear .2s, box-shadow linear .2s; font-family: "Courier New" ; width: 80%;  /* font-family: "Lekton", "Courier New" */;}
input:focus, textarea:focus{border-color: #7f8c8d;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none; outline: 0}

input[type="file"]{
  background-color: #ffffff;
}

#habla_window_div textarea{min-height: inherit;}

input[type="submit"]{background-color: #86adcb; border: none; -webkit-appearance: none;}
input[type="submit"]{}

label{ margin-bottom: 4px; font-weight: bold; display: block}

.input-prepend span:first-child, .input-prepend a:first-child { border-top-left-radius: 4px; border-bottom-left-radius: 4px;}
.input-prepend span, .input-prepend a {background-color: #d7dfe5; height: 30px; width: 32px; font-weight: bold; display: block; float: left; text-align: center; line-height: 33px; font-size: 18px;color: #7f8c8d; text-decoration: none; font-family: 'Montserrat'}
.input-prepend span.active, .input-prepend a.active{background-color: rgba(0,0,0,.7); color: #ffffff;}

.input-append .addon{ border-top-right-radius: 4px; border-bottom-right-radius: 4px;}
.input-append span, .input-append a {background-color: #d7dfe5; height: 30px; width: 32px; font-weight: bold; display: block; float: left; text-align: center; line-height: 33px; font-size: 18px;color: #7f8c8d; text-decoration: none; font-family: 'Montserrat'}
.input-append span.active, .input-append a.active{background-color: rgba(0,0,0,.7); color: #ffffff;}


.login #email, .login #password{width: 84%; background-color: #d7dfe5; box-shadow: none; border: none; height: 22px;}
#loginButton {border: none; background-color: #eb815c; /*blue */ width: 99%; height: 50px; margin-bottom: 0;}

select{padding: 7px 10px 7px 10px; margin: 0; border-radius: 6px; border: none; outline: none; background: #f3f4f7; -webkit-appearance:none; appearance:none; -moz-appearance: none; -ms-appearance: none;text-indent: 1px; font-family: 'Montserrat'; font-size: 12.5px; text-overflow: ''; position: relative; width: 150px; margin-bottom: 20px; box-shadow: inset 0px -.15em 0px 0px rgba(0,0,0,.2), inset 0px 0px 0px 100px rgba(0,0,0,0), 0px .2em .15em 0px rgba(0,0,0,.15);}
select:hover{cursor: pointer}
.select{position: relative; display: inline;}
.select:after{ content: '\2261'; font-size: 30px; background: #f3f4f7; position: absolute; right:8px; top:-4px; display: block; width: 17px; z-index: 10; pointer-events: none; border-left:1px solid #ddd;  color: #b3b3b3; font-weight: bold; line-height: 25px; padding-left: 6px; height: 24px; font-family: Arial;}

#passwordHolder{display: none}
#accountcompany_name{width: 89%;  }
/**/



/*PRINT-BORWSER STATUS*/
.browser{display: block; width: 65px; height: 61px; background: url('/media/images/browsers.png') top left no-repeat; }
.chrome{background-position-x: -67px}
.safari{background-position-x: -139px}
.firefox{background-position-x: 0px}
.ie{background-position-x: -280px}
/**/



/*CREATE CHECK*/
#create-check input{width: 80%}
#create-check input[type="submit"]{width: auto}
#stateHolder{width: 59%; float: left}
#zipHolder{width: 27%; float: left}
#checkNumberHolder{float: left; width: 39%;}
#create-check textarea{resize: none; height: 90px;}
#edit-check textarea{resize: none; height: 90px;}
/**/



/*COLORS -- keep low on sheet*/
.success, .green{background-color: #7fc18d; color: #ffffff}
.warning, .orange{background-color: #f2b154;}
.dull, .gray{ background-color: #84898e; color: #ffffff;}
.warningSoft{background-color: #ffe4be;}
.important, .red{background-color: #eb815c;}
.importantSoft { background-color: #ffad91; }
.info, .blue{background-color: #8dbdca; color: #ffffff}
.purple { background-color: #f0daf7; }
.yellow { background-color: #ebd85c; }
.txtGreen{color: #7fc18d;}
.txtOrange{color: #f2b154;}
.txtRed{color: #eb815c;}
.txtBlue{color: #8dbdca;}
/**/

.red .batchDelete { color: #fff; }

#user inputs{width: 92%}


/*UNKNOWN, PLEASE SORT */
#create-check .ui-helper-hidden-accessible { display: none; }
/**/


.detailBtn{width: 150px; text-align: center}
#searchBox{display: none;}

#view_address{font-family: "Courier New"; font-size: 18px; margin-bottom: 40px}
.type{font-family: "Courier New"; }


.pricingBox span{
  font-size: 38px;
  color: #7fc18d;
  font-family: 'Montserrat', Arial, sans-serif;
}
.pricingBox.kill {
  text-decoration: line-through;
}
.pricingBox.kill span{
  color: inherit;
  font-size: 18px;
}

.unitHeaderButton{background-color: rgba(0,0,0,0.2); padding: 0 10px; border-radius: 6px; display: block; width: auto; height: 29px; line-height: 31px; margin-top: 10px; margin-left: 5px; font-size: 14px; outline: none;}



#filterDisclaimer{display: none;}
#tableTools{display: none;}
.fade{opacity: .4}

#errorHolder{max-width: 600px; margin: 100px auto 0 auto; text-align: center; color:rgba(255,255,255,0.75)}
#errorHolder h1{font-size: 170px; font-weight: bold; line-height: 170px; letter-spacing: -6px; margin: 0;}
#errorHolder h3{font-size: 40px; line-height: 40px; margin-bottom: 0 0 60px 0; letter-spacing: -1px;color:rgba(255,255,255,0.75)}
#errorHolder .explainer{background-color: #ffffff; border-radius: 6px; padding: 20px; margin: 40px 0 0 0}




.static_field{font-family: Helvetica; font-size: 10px}

#miniCheck{padding: 10px; border-radius: 7px; background-color: #ddf0f6; margin-bottom: 20px; border: 2px dashed #88baca}
#miniCheck table td, #creditCount td{font-size: 13px; border: none; vertical-align: top}
#miniCheck table td.normal, #creditCount td.normal{font-family: 'Montserrat', Arial, sans-serif; font-size: 10px}

#creditCount{margin-bottom: 20px;}
#creditCount td,  #creditCount td.normal{font-size: 14px;}

.pickAddress{background-color: #f2f2f2; border-radius: 7px; margin-bottom: 20px; padding: 20px; position: relative;}
.pickAddress:hover{cursor: pointer; background-color: #ededed}
.pickAddress .original-address{position: absolute; top: 20px; right: 20px;}

.disabled{cursor: not-allowed; opacity: .2}
.disabled:hover{opacity: .2}


#checkHolder, #results-print, .checkHolder{display: none;}

#cropperHolder div{min-height: 0; border-radius: 0;}
.imgareaselect-border1{
border: dashed 2px #234E70;
}

#micrSet{position: fixed; height: 5px; width: auto; text-indent: -9000px;}

.upgrade{background-color: #f8f2f3; text-align: center}

#footerLinks{font-size: 16px}
#footerLinks a{color: #aaaaaa; text-decoration: none;}
#footerLinks a:hover{color: #8dbdca}
#footerLinks span{margin: 0 10px;}


.loginBody{background-color: #efefef;}

#urlInput{width: 200px}

#addonTable tr td{vertical-align: middle; border-bottom: none}
#addonTable input{margin: 0; width: 98%}

#elementHolder .inputElement{line-height: 22px;}

#features{list-style: disc; margin: 0 0 20px 20px}

.payments input{width: 96%;}
.payment{width: 96%;}
#slasher{font-size: 18px; color: #afafaf}
.couponHolder{display: none;}

select:focus{box-shadow: 0 0 5px 2px #8dbdca;}

.account-switcher {
    position: absolute;
    top: 20px;
    right: 60px;
}

/*
#bankHolder{ position: relative;}
#bank-location { width: 100%; padding: 10px; background-color: #86adcb; position: absolute; min-height: 9px; margin-top: 19px; margin-left: -62px; }
#bank-location::after {
  content: "";
  	width: 0;
	height: 0;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
	position: absolute;
	border-right:10px solid #86adcb;
	left: -9px;
	top: 5px;

}
*/


.headerMenu {
  position: absolute;
  top: 14px;
  right: 8px;
}

.headerMenu > li{
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  background-color: #4e5a64;
  color: #ffffff;
  position: relative;
  float: right;
  line-height: 20px;
  text-align: center;
  transition: background-color 0.3s ease;
}

.headerMenu > li:hover {
  background-color: #69737d;
}

.headerMenu li ul {
  width: 100px;
  background-color: #4e5a64;
  color: #ffffff;
  position: absolute;
  right: 0;
  padding: 5px;
  top: 16px;
  border-radius: 4px 0 4px 4px;
  box-shadow: 0px 4px 7px -2px rgba(0,0,0, 0.4);
  transition: all 0.4s ease;
  display: none;
}

.headerMenu li ul li {
  width: 100%;
  float: left;
}

.headerMenu li ul li {
    border-bottom: 1px solid #ccc;
    padding: 5px 0;
}

.headerMenu li ul li:last-child {
  border-bottom: none;
}

.headerMenu a {
  color: #ffffff;
  text-decoration: none;
  font-size: 16px;
  font-family: 'Montserrat', Arial, sans-serif;
  display: block;
  width: 100%;
  padding: 5px 0;
  border-radius: 4px;
  transition: all .3s ease;
  font-weight: normal;
  line-height: 24px;
  text-align: center;
}

.headerMenu > li.open {
  background-color: #4e5a64;
  color: #ffffff;
}

.headerMenu li ul.open {
  display: block;
  opacity: 1;
}

.headerMenu a:hover {
  color: #4e5a64;
  background-color: #ffffff;
}

.headerMenu li:hover  {
  cursor: pointer;
}

/*little tiny menu button in the registry */
#actionMenu > li {
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  background-color: #4e5a64;
  color: #ffffff;
  position: relative;
  float: right;
}

#actionMenu li ul {
  width: 100px;
  background-color: #4e5a64;
  color: #ffffff;
  position: absolute;
  right: 0;
  padding: 5px;
  top: 16px;
  border-radius: 4px 0 4px 4px;
  box-shadow: 0px 4px 7px -2px rgba(0,0,0, 0.4);
  transition: all 0.4s ease;
  display: none;
}

#actionMenu li ul li {
  width: 100%;
  float: left;
}

#actionMenu li ul li {
    border-bottom: 1px solid #ccc;
    padding: 5px 0;
}

#actionMenu li ul li:last-child {
  border-bottom: none;
}

#actionMenu a {
  color: #ffffff;
  text-decoration: none;
  font-size: 16px;
  font-family: 'Montserrat', Arial, sans-serif;
  display: block;
  width: 100%;
  padding: 5px 0;
  border-radius: 4px;
  transition: all .3s ease;
  font-weight: normal;
}

#actionMenu > li.open {
  background-color: #4e5a64;
  color: #ffffff;
}

#actionMenu li ul.open {
  display: block;
  opacity: 1;
}

#actionMenu a:hover {
  color: #4e5a64;
  background-color: #ffffff;
}

#actionMenu li:hover  {
  cursor: pointer;
}

.batchDelete {
  color: #eb815e;
  text-decoration: none;
}

#mailnow {
  margin-top: 20px;
}

.memoString {
  font-family: 'Open Sans';
  text-decoration: none;
  display: block;
  font-size: 10px;
}

#checkRegistryForm td {
  vertical-align: middle;
  padding: 0;
  margin: 0;
}
#checkRegistryForm td a {
  display: block;
  text-decoration: none;
  line-height: 25px;
  padding: 5px;
  color: #3E4850;
}
#checkRegistryForm table tbody tr:hover {
  background-color: #ffe5bf;
}

#checkRegistryForm .tags a {
  padding: 0 0 0 5px;
}
#checkRegistryForm .checkNum a {
  font-size: 18px;
  color: #959B9F;
  padding: 5px 20px;
}

#checkRegistryForm .memo a,
#checkRegistryForm .templates a {
  color: #959B9F;
}

#checkRegistryForm .checkers{
  padding-right: 5px;
}

#bannerPop{
  box-sizing: border-box;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: #4b5a65;
  padding: 30px;
  color: #ffffff;
  font-size: 14px;
  z-index: 999;
  box-shadow: 1px -1px 13px rgba(0, 0, 0, 0.32);
}

@keyframes pulse {
  50% { background-color: #7fc18d;
    color: #ffffff;
  }
}

#actionMenu li.active{
  animation: pulse .7s ease 2;
}


.input-notice{

}

.hasNotice {position: relative;}

.input-notice{position: absolute; top: 0; left: 90%; width: 55%; padding: 7px 10px 8px 10px; border-radius: 3px;}

.input-notice::before {
  content: "";
  	width: 0;
	height: 0;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
	position: absolute;
	left: -8px;
	top: 7px;
}

.input-notice.success::before {
	border-right:8px solid #7fc18d;
}

.input-notice.important::before {
	border-right:8px solid #eb815c;
}

#check-settings{display: none;}

#signupThing{
  display: block;
  padding: 15px;
  border-radius: 6px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5),0 1px 0 rgba(255,255,255,0.5);
  border: 1px solid rgba(14,41,57,0.1);
  text-align: center;
  margin: 20px auto;
  font-family: 'Montserrat', Arial, sans-serif;
  text-decoration: none;
  color: #696969;
  max-width: 305px;
}

#signupThing span{text-decoration: underline}

#forgotLink {
  margin-top: 20px;
}

#forgotLink .button{
  margin-bottom: 0;
}

.requestHolder, .bugHolder{clear: both;}
.requestDetails, .bugDetails{ width: 85%; float: right;}
.voteHolder{
  width: 13%; float: left; text-align: center;
}
.voteCount{
  padding: 15px 5px;
  border-radius: 6px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5),0 1px 0 rgba(255,255,255,0.5);
  border: 1px solid rgba(14,41,57,0.1);
  text-align: center;
  font-family: 'Montserrat', Arial, sans-serif;
}

.voteCount span{display: block; width: 100%; font-size:  60px; font-weight: bold; text-shadow: rgba(255,255,255,.5) 0 1px 0;}

.icheck-label {
  display: inline;
  margin-left: 10px;
}

.icheck-label:hover {
  cursor: pointer;
}

#xero_table td {
  padding: 7px 5px;
}

.printed {
  opacity: 0.4;
}

.reprint {
  display: none;
}

/*fullfillment styles */
#addressBox {
  padding: 10px;
  border-radius: 8px;
  background-color: #f3f4f7;
  font-size: 11px;
  text-align: center;
  margin-bottom: 20px;
}

#sampleMicr{
  padding: 0 0 0 0;
  font-size: 18px;
  color: #000000;
}

#ca-account, #us-account {
  width: 45%;
}

#routingInputs {
  width: 160px;
  float: left;
}

#sampleCheck {
  margin-bottom: 20px;
}


#branchInputs {
  width: 95px;
  float: left;
  margin-right:4%;
}

#instituationInputs {
  width: 80px;
  float: left;
  margin-right: 4%;
}

#bankerData input{
  font-size: 25px;
  height: 25px;
  width: 85%;
}

.micr.example{
  width: 22px;
float: left;
font-size: 25px;
line-height: 79px;
height: 55px;
text-align: left;
}

dl.one-line dt {
	font-weight: bold;
	display: inline-block;
}
dl.one-line dd {
	display: inline-block;
}
dl.one-line dd:after {
	clear: both;
}

/* System Status Area */

#statusBox {
  position: absolute;
  color: #ffffff;
  text-align: right;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: bold;
}

#registrySpinner {
  position: relative;
  float: right;
  display: inline-block;
  height: 31px;
  margin-top: 18px;
  width: 30px;
}

@keyframes spin {
  to {transform: rotate(360deg);}
}

.spin:before {
  content: '';
  box-sizing: border-box;
  position: absolute;
  left: 0;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  border: 2px solid transparent;
  border-top-color: #ffffff;
  border-bottom-color: #ffffff;
  animation: spin 0.8s ease infinite;
}

.spinner {
  width: 15px;
  height: 15px;
  position: relative;
  float: left;
  margin-right: 5px;
}

.double-bounce1, .double-bounce2 {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #bed5e4;
  opacity: 0.6;
  position: absolute;
  top: 0;
  left: 0;

  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out;
}

.double-bounce2 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

@-webkit-keyframes sk-bounce {
  0%, 100% { -webkit-transform: scale(0.0) }
  50% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bounce {
  0%, 100% {
    transform: scale(0.0);
    -webkit-transform: scale(0.0);
  } 50% {
    transform: scale(1.0);
    -webkit-transform: scale(1.0);
  }
}



@media screen and (min-width: 1170px) {
	.wrapper {width: 1170px;}
}

@media screen and (max-width: 1170px) {
	.wrapper {width: 940px;}
	.stage1, .stage2, .stage3,.stage4{display: none}
	.stage2{display: inline}
	.two-third .quarter{margin-right: 15px;}
	.requestHolder{clear: both}
	.templateHolder .unitBody a{height: 220px}
	#uploadCloud{font-size: 159px; height: 230px;}
	#templateHolder{height: 739px}/*not sure how these will hurt positioning on templates and printing */
	.voteCount span{font-size: 40px;}
  .hideTemplates{display: none;}
}

/*TABLET VERTICAL */
@media (max-width: 940px){
	.wrapper {width: 724px;}
	.templateHolder .unitBody a{height: 151px}
	#uploadCloud{font-size: 117px; height: 160px;}
	#templateHolder{height: 557px} /*not sure how these will hurt positioning on templates and printing */
	.voteCount span{font-size: 30px;}

}

/*MOBILE PHONE*/
@media (max-width: 724px){
	.wrapper {width: 93%; margin: 0 auto}
	.third{width: 100%; float: left}
	.two-third{width: 100%; float: left}
	.half{width: 100%; float: left}
	.quarter{width: 100%; float: left}
	.templateHolder .unitBody a{height: 296px}
	.center{float: left; margin-left: 0;}

	.voteCount span{font-size: 20px;}

	.unitBody{padding: 10px;}

	.login .unitBody{padding: 20px;}

	.login{ margin-top: 60px;}

	.login #email, .login #password{ width: 84%;}

	.hideMobile{display: none;}
	.showMobile{display: block;}

	/*MOBILE NAV */
	.nav{height: auto; display: none}
	.nav li{float: left; display: block; width: 100%}
	.nav li a{margin-right: 0; height: 40px; line-height: 40px;}
	.nav li a:hover, .nav li a.active{border-radius: 5px;}
	#mobileNavControl{display: block; position: absolute; top:18px; right: 2.5%; display: block; width: 40px; height: 40px; text-align: center; line-height: 40px; color: #ffffff; font-weight: bold; font-size: 20px;}
	#mobileNavControl:hover{cursor: pointer}
	#header{margin-bottom: 20px;}
	#topHeader{border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;}
	/**/

	.mobileMemo{
  	font-size: 12px;
  	color: #959B9F;
	}

	#checkRegistryForm td{
  	height: 45px;
	}

	#checkRegistryForm td a{
  	line-height: 14px;
	}

	.input-notice{ width: 79%; position: relative; top:0; left:0; margin-bottom: 10px;}
  .input-notice::before{
    	left: 10px;
  	top: -16px;
  }
  .input-notice.success::before {
  	border-left:8px solid transparent;
  	border-right:8px solid transparent;
  	border-bottom:8px solid #7fc18d;

  }
  .input-notice.important::before {
  	border-left:8px solid transparent;
  	border-right:8px solid transparent;
  	border-bottom:8px solid #eb815c;

  }

  #ca-account, #us-account {
    width: 100%;
  }

}



.swal2-icon.swal2-success .swal2-success-ring {
  border-color: #7fc18d;
}

.swal2-icon.swal2-success [class^='swal2-success-line'] {
  background-color: #7fc18d;
}

.swal2-popup {
   font-family: 'Open Sans', Arial, sans-serif;
}

.swal2-popup .swal2-styled:focus {
  outline: none;
  box-shadow: none;
}

.swal2-confirm{
  outline: none;
}

@media print {
	.slaask-button { display: none; }
}


.system-modal{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 300;
    background-color: rgba(0,0,0,0.4);
}

.system-modal-content {
    width: 350px;
    background-color: #ffffff;
    border-radius: 10px;
    padding: 20px;
    margin: 50px auto;
}

h2.api-queue {
  font-size: 32px;
  line-height: 24px;
  text-align: center;
  margin-bottom: 0;
}
h2.api-queue span {
  font-size: 10px;
  font-style: italic;
  display: block;
}