body{
    padding: 0;
    margin: 0;
    background: #fff;
    color:#3d3d3d;
/*    background-color: #5f849e;*/
}

div.wrapper{}
/*div.content-wrap{
    width: 95%;
    margin: 0 auto;
}*/

@media only screen and (max-width: 1920px) {
    div.content-wrap{
        width: 95%;
        margin: 0 auto;
    }
}
@media only screen and (max-width: 1200px) {
    div.content-wrap{
        width: 100%;
     }
}
@media only screen and (max-width: 600px) {
    div.content-wrap{
        width: 100%;
    }
}
.content{margin-top: 1.5rem;}

/*################### GENERAL #################*/
h1,h2,h3,h4,h5{color:#5f849e;}
h1.page-header{text-transform: uppercase; margin: 1.2rem 0;}
.clearFix{clear:both;}
div.content-pads{padding: 10px;}
@-moz-document url-prefix() {
  fieldset { display: table-cell; }
}
.centered{text-align: center;}
.full-width{width:100%;}
.left-aligned{text-align: left;}
.right-aligned{text-align: right;}
p.button-wrap{margin-top: 15px;}
table caption{font-weight: bold;font-size: 1.4rem; caption-side: top; margin-left: 10px;}
table caption span{float: right;}
div.list-group a span{float: right;}
table.borderless tr td{border: none;}
.rowBgOne{background: #dfdfdf;}
.rowBgTwo{background: #eee;}
.error{color: #f00;}
.whiteBg{background: #fff;}
.boldTxt{font-weight: bold;}
table tr#rowActive{background:#DFF0D8;}
table tr.last{border-bottom: 1px solid #ddd;}
table thead tr{background:#aaa;}
table.hover-bg tbody tr:hover{background: #fff;}
table td.prop{width: 30%; font-weight: bold;}
table td.propValue{width: 70%;}
div.dataBorder{border: 1px solid #ddd; padding:3px; background: #F5F5F5;}
div.dataBg,div.messageBg{padding:2px; background: #fff;}
div.messageBg{background: #F2DEDE;padding-left: 10px; padding-right: 10px;color: #A94442;}
div.messageBg h3{margin-top: 5px; text-align: center;color: #A94442; text-transform: uppercase;}
div.messageBg div{padding-bottom: 5px;}
div.messageBg p.validity{text-align: right; font-weight: bold; font-size: 12px;}
p.buttons-wrap{text-align: center;}
p.buttons-wrap span{margin-left: 15px;}
form input.error,form select.error,form textarea.error,form checkbox.error{border: 1px solid #f00;}
fieldset{padding:10px;}
div.alert{margin-top: 15px; margin-bottom: 15px; text-align: center; font-weight: bold;}
.half-width{width: 50%; margin: 10px auto;}
.width-70{width: 70%; margin: 10px auto;}
.responsive{max-width: 100%;height: auto;}
.hide{display:none;}
.checkbox-wrap label{display: inline-block; width: 100%; border-bottom: 1px solid #eee}
.checkbox-wrap input{
    float:left;
    display: inline-block;
    width: 3%;
    height: calc(1.0em + .75rem + 2px);
/*    height: 10px;*/
/*    padding: .375rem .75rem;*/
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s;
    margin-right: 1%;
}
.checkbox-wrap span{float: left; width: 90%;}
.btn.dropdown-actions{padding: 0;}

@media only screen and (max-width: 768px) {
    .half-width{width: 100%; margin: 10px 0;}
    .width-70{width: 100%; margin: 10px 0;}
    table.width-60{width: 100%;}
    h1{font-size: 1.5rem;}
    h2{font-size: 1.4rem;}
    h3{font-size: 1.3rem;}
    h4{font-size: 1.3rem;}
    h1.page-header{margin-left: 10px;}   
    #toggleContent{padding: 2px 10px;}
}
.button,a.logout-button{
   -webkit-border-radius: 1px; /* Saf3-4, iOS 1-3.2, Android ≤1.6 */
   -moz-border-radius: 1px; /* FF1-3.6 */
   border-radius: 1px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
  /* useful if you don't want a bg color from leaking outside the border: */
  -webkit-background-clip: padding-box; 
   background-clip: padding-box;
   border: 1px solid #fff;
/*   border: 1px solid #069;*/
/*   -webkit-box-shadow: 0px 0px 4px 0px #000;  Saf3-4, iOS 4.0.2 - 4.2, Android 2.3+ 
   -moz-box-shadow: 0px 0px 4px 0px #000;  FF3.5 - 3.6 
   box-shadow: 0px 0px 4px 0px #000;  Opera 10.5, IE9, FF4+, Chrome 6+, iOS 5 */
/*   background-color:#39c;
    background-image: -webkit-linear-gradient(top, #09f, #39c);  */
   background-color:#5f849e;
   background-image: -webkit-gradient(linear, left top, left bottom, from(#5f849e), to(#5f849e)); /* Saf4+, Chrome */
   background-image: -webkit-linear-gradient(top, #5f849e, #5f849e); /* Chrome 10+, Saf5.1+, iOS 5+ */
   background-image: -moz-linear-gradient(top, #5f849e, #5f849e); /* FF3.6 */
   background-image: -ms-linear-gradient(top, #5f849e,#5f849e); /* IE10 */
   background-image: -o-linear-gradient(top, #5f849e, #5f849e); /* Opera 11.10+ */
   background-image: linear-gradient(to bottom, #5f849e, #5f849e);       
   color:#fff;
   padding: 5px 15px;
   cursor:pointer;
   font-weight: normal;
}
.button:hover,a.logout-button:hover{
    -webkit-border-radius: 1px; /* Saf3-4, iOS 1-3.2, Android ≤1.6 */
   -moz-border-radius: 1px; /* FF1-3.6 */
   border-radius: 1px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
   border: 1px solid #fff;
   color: #eee;
   background-color:#003e64;
}
a.button{text-decoration: none;}
label em,label span{font-style: normal; font-weight: normal;}


.form-group label,.block-label{font-weight: 600;}
.form-group label{margin-bottom: 10px;}
.block-label{display: block;margin-bottom: 5px;}
label.radio-inline{font-weight: normal; margin-right: 10px;}


/*################ HEADER ##########################*/
header
{
    margin:0 0 4px 0; 
    font-size:1.0rem; 
   /* background:#BDCB9A ; */
    background-color: #5f849e;
    padding:5px;    
    /*border-bottom: 2px double #eee;*/
}
header.header-bg{margin-bottom: 15px; padding-bottom: 10px;}

header div.header-right-gen{float:right; padding: 5px; margin-top: 10px;}
header div.header-left{float:left; width:15%;}
header div.header-right{float:right; width: 85%; padding-top: 10px;}
/*header div.header-center{float:left;text-align: center; width: 65%;}*/
header div.header-right h1{color:#fff; margin-top: 10px;}
.header-right-wrap{padding: 5px 10px; background: #003355; color: #fff}

@media only screen and (max-width: 1200px) {
    header div.header-left{width:20%;}
    header div.header-right{ width: 80%;}
   
}
@media only screen and (max-width: 500px) {
    .header-right-wrap{background: none;padding: 5px}
    header div.header-left{width:30%;}    
    header div.header-right{float:right; width: 70%; padding-top: 16px;}
     header div.header-right h1{font-size: 1.4rem;}
}

@media only screen and (max-width: 500px) {
    header div.header-left h1{margin:8px 0 0 0;}
    header div.header-right div.admin-info{float:none;}
    header div.header-right div.admin-info p.admin-name{text-align: right;}
    header div.header-right p.logout-button-wrap{float:none; text-align: right; margin-bottom: 1px;}
    header a.logout-button{padding: 5px 5px; text-decoration: none; font-size:1.0rem; font-weight: bold;}
}

/*################ NAVI ################################*/
ul.languages li a span{margin-right: 10px;} 
.nav-link{font-size: 1.2rem;}
.navbar-nav .nav-link.active{text-decoration: underline;}
/*################ CONTENT ################################*/
div.pager-links{}
div.pagination{   
    float: right;
    padding-right: 10px;
    margin-top: 0;
}
div.pagination > span:first-child,div.pagination > a:first-child{border-left:1px solid #eee;}
div.pagination a,div.pagination span.active{border-top:1px solid #eee;border-right:1px solid #eee;border-bottom: 1px solid #eee; padding: 8px 10px;}
div.pagination a:hover{background: #eee;}
div.pagination span.active{background: #eee;}

ul.pagination .task-completed .page-link{
    background-color: #0f0;
    text-align: center;
    color: #000;
}
ul.pagination .task-open .page-link{
    background-color: #f00;
    text-align: center;
    color: #000;
}
ul.pagination .task-pending .page-link{
    background-color: #ffff00;
    text-align: center;
    color: #000;
}

#toggleButton{text-align: left;}
#toggleButton span{float:right;}
.status-wrap{padding-left: 15px;}

input#voucher-code,select#attendants{width: 70%;}
@media (max-width: 768px) {
    input#voucher-code,select#attendants{width: 100%;}
    .status-wrap{padding-left: 0;}
}


/*PRODUCTS*/

form.edit-image-form div{margin-left: 10px;}
.sort-search-wrap{margin: 15px 0;}
#search-form .form-group{float: left; width: 70%;}
#search-form .form-group input{width: 100%;}
#search-form .search-button-wrap{
    width: 25%; 
    float: left;
    padding-left: 5px;
}

@media (max-width: 768px) {
    #search-form{margin-top: 15px;}
    .sort-search-wrap{padding: 0 10px;}
    #search-form .form-group{float: left; width: 80%;}
    #search-form .search-button-wrap{ width: 15%;}
}

.loadingmodal {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 ) 
                url('../images/ajax-loader.gif') 
                50% 50% 
                no-repeat;
}

/* When the body has the loading class, we turn
   the scrollbar off with overflow:hidden */
body.loading {
    overflow: hidden;   
}

/* Anytime the body has the loading class, our
   modal element will be visible */
body.loading .loadingmodal {
    display: block;
}

.popup-wrap h1.popup-header{color:#fff !important;}

footer{clear: both; margin-top: 15px; background-color: #54595F; color: #fff; padding-left: 1px; padding-right: 1px; padding-bottom: 10px;}
#footer h4{color: #fff; margin-bottom: 15px;}
#footer a{color: #fff; text-decoration: none;}
#footer ul{list-style-type: none; padding-left: 0; margin-left: 0;}
#footer ul li{margin-bottom: 10px;}
#footer ul li a{text-decoration: none;}
footer.dark-bg{background: #43474D; border-top: none;}
footer p.copyright{padding:10px 0 5px 5px; color:#fff; margin-bottom: 0;}
div.stores-img-wrap{
    width: 30%;
}
.social-wrap{width: 30%;}

@media (max-width: 1200px) {
    div.stores-img-wrap{width: 50%;}
    .social-wrap{width: 40%;}
}

@media (max-width: 992px) {
    div.stores-img-wrap{width: 80%;}
    .social-wrap{width: 40%;}
}

@media (max-width: 768px) {
    div.stores-img-wrap{width: 80%;}
    .social-wrap{width: 40%;}
}