:root {
    --danger: #D2321E;
    --warning: #F3D2A1;
    --info: #16B9B8;
    --success: #A0E6B4;
    --primary: #B8BBB3;
    --purple: #B800DA;
}

.btn.btn-purple {
    background-color: var(--purple); 
    border-color: #b800da;
    color: #FFF;
}

.alert {
    border-radius: 0!important;
    background: transparent!important;
    border-width: 2px;
    color: #000!important;
}

.alert a {
    color: #000!important;
}

.alert-info {
    border-color: var(--info);
}
.alert-info i.fa {
    color: var(--info);
}
.alert-success {
    border-color: var(--success);
}
.alert-success i.fa {
    color: var(--success);
}
.alert-warning {
    border-color: var(--warning);
}
.alert-warning i.fa {
    color: var(--warning);
}
.alert-danger {
    border-color: var(--danger);
}
.alert-danger i.fa {
    color: var(--danger);
}
.alert-primary {
    border-color: var(--primary);
}
.alert-primary i.fa {
    color: var(--primary);
}
.alert-purple {
    border-color: var(--purple);
}
.alert-purple i.fa {
    color: var(--purple);
}

body {
    font-size: 12pt;
    
}

#ajax-spinner {
	margin: 15px 0 0 15px;
	padding: 13px;
	background: white url('../images/spinner.gif') no-repeat 50% 50%;
	font-size: 0;
	z-index: 123456;
	display: none;
}

div.flash {
	color: black;
	background: #FFF9D7;
	border: 1px solid #E2C822;
	padding: 1em;
	margin: 1em 0;
}

a[href^="#error:"] {
	background: red;
	color: white;
}

form th, form td {
	vertical-align: top;
	font-weight: normal;
}

form th {
	text-align: right;
}

form .required label {
	font-weight: bold;
}

form .error {
	color: #D00;
	font-weight: bold;
}

.main-header>.navbar {
    height: 50px;
}

.logo-lg {
    font-size: 18px;
}


form .box .box-body {
    padding: 10px 25px;
}

form .box .box-footer {
    padding: 20px 25px;
    text-align: right;
}


form th.header-cell {
    text-align: left;
    font-weight: bold;
}

form th .multi-sort {
    padding: 1px 2px;
}

.table>thead>tr>th {
    vertical-align: top;
}

.tw-pagination div.actual {
    display: inline-block;
}

[name='pagination[controls][page]'] {
    display: inline-block;
    width: auto;
}

.icheckbox_square-blue {
    margin: 0 10px 0 0;
}

.sidebar-toggle {
    height: 50px;
}


/* select2 options are separate on rows */
#add-products-box .select2-container--default .select2-selection--multiple .select2-selection__choice {
    clear: left;
}


/* stylovanie twigrid */
.table>tbody>tr.success>td {
    padding: 0;
}
.table>tbody>tr.success>td.body-cell.center .btn-group {
    width: 100px;
    padding-top:2px;
}

/* medzera za checkbox alebo ratio */
.icheckbox_minimal-blue, .iradio_minimal-blue {
    margin-right: 10px;
}

#snippet--product_images_snippet > div > div .btn {
    opacity: 0;
}

#snippet--product_images_snippet > div > div:hover .btn {
    opacity: 0.7;
}

#snippet--product_images_snippet > div > div:hover .btn:hover {
    opacity: 1;
}





form.filter-form {
    background-color: #2c3b41;
    padding: 2px 2px 2px 10px;
    border-radius: 4px;
    color: #FFF;
    opacity: 0.2;
}

form.filter-form input {
    color: #000;
}

form.filter-form:hover, .active form.filter-form {
    opacity: 1;
}

form.filter-form label {
    padding: 0 5px 0 10px;
    font-weight: 400;
}

form.filter-form * {
    cursor: pointer;
}

form.filter-form input {
    cursor: text;
}


.btn.active, .btn:active {
    box-shadow: none;
    border-color: #888;
}


.select2-selection.input-sm {
    padding: 0 5px; 
}



.rev-table {
 background-color:#eeeeee;
 border-radius:3px;
 padding:15px 0 15px 0;
}

.rev-table .left {
 float:left;
 width:40%;
 padding-left:10%;
 min-height:1px;
 margin-right:5%;
}

.rev-table .right {
 float:left;
 width:45%;
 padding-left:0px;
 min-height:1px;
}

.rev-table .left .row1,
.rev-table .left .row2 {
 margin:0 0 8px 0;
}

.rev-table .left .row1,
.rev-table .left .row3 {
 font-size:10px;
 text-align:center;
}

.rev-table .left .row1 .value {
 display:block;
 text-align:center;
 font-weight:bold;
 font-size:16px;
 margin-top:2px;
}

.rev-table .left .row2 {
 text-align:center;
}

.rev-table .left .row2 .star-show {
 display:inline-block;
 background: transparent url("img/stars.png") no-repeat scroll left bottom;
 height: 15px;
 width: 87px;
 position:relative;
}

.rev-table .left .row2 .star-show span {
 position:absolute;
 z-index:5;
 left:0px;
 top:0px;
 height:15px;
 background:url('img/stars.png') top left no-repeat transparent;
}

.rev-table .right ul {
 margin:0px;
 padding:0px;
 list-style:none;
}

.rev-table .right ul li {
 font-size:10px;
}

.rev-table .right ul li span {
 display:inline-block;
}

.rev-table .right ul li span.percent {
 height:8px;
 background-color:#435eac;
 margin:0 2px 0 2px;
 max-width:80px;
}

.rev-table .right ul li span.star {
 width:10px;
 height:10px;
 background: transparent url("img/single_star.png") no-repeat scroll left bottom;
 background-size:100% 100%;
 margin:0 2px 0 2px;
 
}


.article-comment-text::before {
    content: "";
    display: block;
    background-color: #F9F9F9;
    width: 10px;
    height: 10px;
    position: absolute;
    left: -5px;
    top: 15px;
    
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    transform: rotate(45deg);
}


.login-page {
    background-image: url('../images/login_bg.jpg');
    background-size: cover;
    background-position: top center;
}

label[for^="frm-"][for*="-consent-"] {
    font-weight: 400 !important;
}

#frm-blogCommentsGrid-form table td, .datagrid.datagrid-blogCommentGrid td {
    font-size: 85%;
    vertical-align: top;
}

.datagrid.datagrid-blogCommentGrid .datagrid-fit-content.col-customer {
    min-width: 220px;
}

.quotes .quote a {
    color: #000; 
    text-decoration: none;
}

.quotes .quote .quote-logo {
    max-width: 150px; 
    height: 30px; 
    margin: 0 auto 15px auto;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.video-wrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}
.video-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.code {
    font-family: monospace;
    font-size: 80%;
    background-color: #F8F8F8;
    color: #333;
    padding: 10px;
    border: 1px solid #F6F6F6;
    border-radius: 4px;
    overflow-x: scroll;
    white-space: nowrap;
}

.box-body .datagrid {
    padding: 0;
}

.box-body .row-grid-bottom {
    border: none;
}