﻿body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: #333 !important;
    font-family: 'Open Sans', sans-serif !important;
}

h4, .h4 {
    margin: 16px 0px 0px 0px !important;
}

body {
    min-height: 0 !important;
}

a, a:hover {
    color: #87c543;
}

/*
.navbar {
    background-image: -webkit-linear-gradient(#101010, #101010 60%, #1d9ce5);
    background-image: linear-gradient(#101010, #101010 60%, #101010);
    background-repeat: no-repeat;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#101010', endColorstr='#101010', GradientType=0);
    border-bottom: 1px solid #000000;
}
*/

.navbar, .navbar-default {
    background-image: none;
    border-color: #101010;
    background-color: #101010;
}

.navbar-default .navbar-toggle, .navbar-default .navbar-collapse {
    border-color: #333;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: #333;
}

.navbar-default .navbar-nav > li > a:hover {
    background-color: #87c543;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    background-color: #87c543;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    background-color: #87c543;
}

.navbar-brand {
	padding: 0 15px;
}

#body-section {
    margin-top: -20px;
}

.customrow {
	padding-top: 5px;
	padding-bottom: 5px;
	margin-top: 5px;
	margin-bottom: 5px;
	padding-left: 10px;
	padding-right: 10px;
}

.customrow-color {
	background-color: #eee;
	border-radius: 0px;
}

.btn-default {
    color: #333 !important;
    background-image: none;
    background-color: #ccc;
}

.btn {
    border-radius: 0;
}

.btn-primary {
	/*background-image: -webkit-linear-gradient(top,#87c543 0,#00a94f 100%);*/
	/*background-image: linear-gradient(to bottom,#87c543 0,#00a94f 100%);*/
	
    background-image: none;
	background-color: #87c543;
    border: #00a94f;
    border: 1px solid #87c543;
}

.btn-start {
	width: 100%;
	/*font-weight: bold;*/
}

input {
    border-radius: 0 !important;
}

.alert {
    display: none;
    border-radius: 0 !important;
}

.form-container form {
	padding: 0px !important;
}

#loader {
    display: none;
    font-size: 40px;
    color: #ccc;
}

#shop-clear {
    position: absolute;
    right: 30px;
    top: 0;
    bottom: 0;
    height: 14px;
    margin: auto;
    font-size: 14px;
    cursor: pointer;
    color: #ccc;
    z-index: 1000;
}

/* Merchant footer */
.btn-footer {
	width: 49%;
	border-radius: 0;
	border: 0;
	
	margin-top: 0;
	margin-bottom: 0;
	
	color: #fff;
	font-weight: normal;

    background-color: transparent;
    font-size: 24px;
}

.navbar-fixed-bottom {
	min-height: initial;
}

/* FORM */
input {
    padding-right: 26px !important; 
}

.input-group-btn {
    position: relative;    
}

.input-group-btn a.btn {
    position: absolute;
    /*right: 36px;*/
    /*right: 46px;*/
    right: 100px;
    top: 0px;
    z-index: 500;
}

.input-group-btn a.btn:hover,
.input-group-btn a.btn:active {
    box-shadow: none; 
}

.btn-flat {
    border: 1px solid #87c543;
    background-color: #87c543;
    border-color: #87c543;
    color: #fff;

    width: 100px;
}

.btn-divider {
    width: 50px;
    display:inline-block;
}

.clear {
    clear: both;
}

.link {
    cursor: pointer;
}

.linktext {
    cursor: pointer;
    color: #87c543 !important;
}

.navbar .navbar-nav > li button.btn-link {
    padding: 14px 12px;
    color: #fff;
    text-shadow: 0 1px 0 rgba(0,0,0,0.1);
    outline: none;
}
.navbar .navbar-nav > li button.btn-link:hover {
    text-decoration: none;
    background-color: #87c543;
}
.navbar .navbar-nav > li button.btn-link:focus {
    text-decoration: none;
}

.form-control.input-validation-error {
    border-color: #ff6767;
    border-width: 1px;
}
.form-control.input-validation-error:focus {
    border-color: #ff6767;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(255, 103, 103, .6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(255, 103, 103, .6);
}

table {
    font-size: 12px;
}

table h2 {
    margin: 0 !important;
}

.left {
    text-align: left;
}

.right {
    text-align: right;
}

.center {
    text-align: center;
}

@-webkit-keyframes blink-yellow {
    from { background-color: inherit; }
    to { background-color: yellow; }
}
@-moz-keyframes blink-yellow {
    from { background-color: inherit; }
    to { background-color: yellow; }
}
@-o-keyframes blink-yellow {
    from { background-color: inherit; }
    to { background-color: yellow; }
}
@keyframes blink-yellow {
    from { background-color: inherit; }
    to { background-color: yellow; }
}
.blink-yellow {
    -webkit-animation: blink-yellow 1s infinite; /* Safari 4+ */
    -moz-animation:    blink-yellow 1s infinite; /* Fx 5+ */
    -o-animation:      blink-yellow 1s infinite; /* Opera 12+ */
    animation:         blink-yellow 1s infinite; /* IE 10+ */
}

@-webkit-keyframes blink-green {
    from { background-color: inherit; }
    to { background-color: green; }
}
@-moz-keyframes blink-green {
    from { background-color: inherit; }
    to { background-color: green; }
}
@-o-keyframes blink-green {
    from { background-color: inherit; }
    to { background-color: green; }
}
@keyframes blink-green {
    from { background-color: inherit; }
    to { background-color: green; }
}
.blink-green {
    -webkit-animation: blink-green 1s infinite; /* Safari 4+ */
    -moz-animation:    blink-green 1s infinite; /* Fx 5+ */
    -o-animation:      blink-green 1s infinite; /* Opera 12+ */
    animation:         blink-green 1s infinite; /* IE 10+ */
}

@-webkit-keyframes blink-red {
    from { background-color: inherit; }
    to { background-color: red; }
}
@-moz-keyframes blink-red {
    from { background-color: inherit; }
    to { background-color: red; }
}
@-o-keyframes blink-red {
    from { background-color: inherit; }
    to { background-color: red; }
}
@keyframes blink-red {
    from { background-color: inherit; }
    to { background-color: red; }
}
.blink-red {
    -webkit-animation: blink-red 1s infinite; /* Safari 4+ */
    -moz-animation:    blink-red 1s infinite; /* Fx 5+ */
    -o-animation:      blink-red 1s infinite; /* Opera 12+ */
    animation:         blink-red 1s infinite; /* IE 10+ */
}

.startpage-zigzag {
    background-color: #272220;
    position: absolute;
    width: 100%;
    left: 0;
}

.startpage-zigzag:before {
    content: " ";
    display:block;
    position: relative;
    top:0px;left:0px;
    width:100%;
    height:36px;
    background: linear-gradient(#fff 0%, transparent 0%), linear-gradient(135deg, #272220 33.33%, transparent 33.33%) 0 0%, #272220 linear-gradient(45deg, #272220 33.33%, #fff 33.33%) 0 0%;
    background: -webkit-linear-gradient(#fff 0%, transparent 0%), -webkit-linear-gradient(135deg, #272220 33.33%, transparent 33.33%) 0 0%, #272220 -webkit-linear-gradient(45deg, #272220 33.33%, #fff 33.33%) 0 0%;
    background: -o-linear-gradient(#fff 0%, transparent 0%), -o-linear-gradient(135deg, #272220 33.33%, transparent 33.33%) 0 0%, #272220 -o-linear-gradient(45deg, #272220 33.33%, #fff 33.33%) 0 0%;
    background: -moz-linear-gradient(#fff 0%, transparent 0%), -moz-linear-gradient(135deg, #272220 33.33%, transparent 33.33%) 0 0%, #272220 -moz-linear-gradient(45deg, #272220 33.33%, #fff 33.33%) 0 0%;
    background-repeat: repeat-x;
    background-size: 0px 100%, 9px 27px, 9px 27px;
}

.startpage-zigzag h5, .startpage-zigzag h4, .startpage-zigzag h3 {
    color: #fff !important;
}

h2.underlined {
  overflow: hidden;
  position: relative;
}
h2.underlined::after {
  content: '';
  width: 70%;
  height: 2px;
  background: #87c543;
  position: absolute;
  bottom: 0px;
  left: 0px;
}
.content-divider {
    color: #87c543;
    text-align: center;
    font-size: 30px;
}

.rowcontent {
    background-color: #87c543;
    padding: 10px;
    text-align: center;
    margin: 10px 0;
}

.rowcontent h3 {
    padding: 0;
    margin: 0;
    color: #fff !important;
}

h1, h2 {
    font-weight: bold;
}

h2.title {
    background-color: #eee;
    color: #000 !important;
    margin: 0 !important;
    padding: 10px 5px;
    text-align: center;
}

h3.title {
    /*background-color:#009933;*/
    color: #000 !important;
    padding: 5px;
    margin: 0;
}

h4.title {
    /*background-color:#009933;*/
    background-color:#fff;
    color: #000 !important;
    padding: 10px 10px 0px 10px;
}

.bold {
    font-weight: bold;
}
.bolder {
    font-weight: 800;
}
.italic {
    font-style: italic;
}

.lightgreen {
    color: #87c543;
}
.darkgreen {
    color: #009933;
}

a:hover {
    color: #009933;
}

.btn-primary, .btn-default {
    font-weight: bold;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
    border-color: #009933 !important;
    background-color: #009933 !important;
}

ul {
    padding-left: 20px;
}

.tablelist td h3 {
    margin: 0;
}
.tablelist td {
    vertical-align: top;
    margin: 0;
    padding: 5px 10px 5px 0px;
}

.product-image {
    max-height: 50px;
    max-width: 100%;
}

.receipt {
    font-family: monospace;
}

.code {
    font-family: monospace;
    font-size: 12px;
}

.collapse-title {
    font-weight: bold;
    background-color: #eee;
    padding: 5px;
    margin: 20px 0px;
    border: 1px solid #eee;
    cursor: pointer;
}

.collapse-body {
    background-color: #fff;
    padding: 5px;
    margin: -20px 0px 10px 0px;
    border: 1px solid #eee;
    border-top: 0;
}

.slidecontainer {
    width: 100%;
}

.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 15px;
    background: #ccc;
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
    border-radius: 5px;
}

.slider:hover {
    opacity: 1;
}

.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    background: #87c543;
    cursor: pointer;
    border-radius: 50%;
}

.slider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    background: #87c543;
    cursor: pointer;
    border-radius: 50%;
}

input[type="range"]::-moz-range-track {
    padding: 0 10px;
    background: repeating-linear-gradient(to right, #ccc, #ccc 10%, #000 10%, #000 11%, #ccc 11%, #ccc 20%);
}

table.table-sticky {
    position: sticky;
    z-index: 1040;
    background-color: #fff;
}

table.table-sticky thead, table.table-sticky tfoot {
    position: sticky;
    z-index: 1045;
    background-color: #eee;
}

table.table-sticky thead {
    inset-block-start: 0; /* "top" */
}

table.table-sticky tfoot {
    inset-block-end: 0; /* "bottom" */
}

.navbar-fixed-top {
}

.navbar-fixed-bottom {
    z-index: 1050;
}

table.table-sticky th:nth-child(1) {
    position: sticky;
    left: 0;
    z-index: 1050;
    background-color: #eee;
}

table.table-sticky td:nth-child(1) {
    position: sticky;
    left: 0;
    background-color: #fff;
}

.text-success {
    color: #87c543;
}

.report-holder {
    width: fit-content;
    padding: 20px;
    border: solid 1px #eee;
    box-shadow: rgba(0, 0, 0, 0.5) 3px 3px 10px;
}
.sie-holder {
    width: fit-content;
}

.report-holder pre {
    padding: 0;
    margin: 0;
    background-color: transparent;
    border: 0;
    font-size: 12px;
    font-family: monospace;
}

.report-holder td {
    padding: 1.6px 0;
}