/***************************************/
/***************************************/
/***************************************/
/***************************************/
/***************************************/
/***************************************/

/* enZo Super Css */

/* 1.5em = 1.5 * font-size */

/* media query include */
/*<link rel="stylesheet" media="screen and (min-width:300px)" href="over300.css">*/
/*<link rel="stylesheet" media="screen and (max-width:300px)" href="below300.css">*/
/* Flex */

.flex-container {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

/* font-size: 16-18px; */
/* line-height: 1.2em; */


/* inner div that scrolls and the bg[body] remains fixed */
html {
    background: linear-gradient( rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4) ), url("../images/background.jpg") no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

body {
    height: 100%;
    background-color: transparent;
}

.container-wrapper {
    width : 100%;
    height : auto;
    min-height: calc(100vh - 50px - 62px);
}

/* Avoid pixelization */
img, embed, object, video {
    max-width: 100%;
}

/*!* Human thumb size : 40px *!*/
/*nav a, button {*/
/*min-width : 48px;*/
/*min-height: 48px;*/
/*}*/

.clickable-tr {
    cursor : pointer;
}

.no-padding {
    padding : 0px;
}

.no-padding-f {
    padding : 0px !important;
}

.no-margin {
    margin : 0px;
}

.no-margin-f {
    margin : 0px !important;
}

.full-width {
    width : 100%;
}

.half-width {
    width : 50%;
}

.quarter-width {
    width : 25%;
}

.full-height {
    height : 100%;
}

.auto-width {
    width : auto;
}

.no-corners {
    border-radius : 0px;
}

.no-borders {
    border : 0px;
}

.btn-custom  {
    /*
    color : #fff;
    background-color : #smthLight;
    border : 1px solid #smthDarker;
    */
}

.btn-custom:hover,
.btn-custom:focus,
.btn-custom:active {
    /*
    color : #fff;
    background-color : #smthDarker;
    */
}

/*********/
/* FONTS */
/*********/

/* <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"> */
/* <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">    */

.open-sans {
    font-family: 'Open Sans', sans-serif;
}

.roboto {
    font-family: 'Roboto', sans-serif;
}

.font-white {
    color : #fff;
}

.font-white:hover,
.font-white:focus,
.font-white:active
{
    color : #fff;
}

.font-white-f {
    color : #fff !important;
}

.font-black {
    color : #000;
}

.fa-btn {
    margin-right: 6px;
}

.fa-left {
    margin-right: 6px;
}

.fa-right {
    margin-left: 6px;
}

.bold {
    font-weight: 600;
}

.font-normal {
    font-weight: 100;
}

.no-decor-white {
    color : #fff;
    text-decoration: none;
}

.no-decor-black {
    color : #000;
    text-decoration: none;
}

.no-decor-white:hover,
.no-decor-white:focus,
.no-decor-white:active
{
    color : #fff;
    text-decoration: none;
}

.no-decor-black:hover,
.no-decor-black:focus,
.no-decor-black:active
{
    color : #000;
    text-decoration: none;
}

.no-underline,
.no-underline:hover,
.no-underline:focus,
.no-underline:active
{
    text-decoration: none;
}

/***************/
/* backgrounds */
/***************/

.bg-white {
    background-color : #fff;
}

.bg-black-70 {
    color : #fff;
    background: rgba(0,0,0,0.7);
}

/*************/
/* alignment */
/*************/

.display-inline {
    display : inline;
}

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

.display-none {
    display : none;
}

.display-block {
    display : block;
}

.y-centerized {
    width : 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.vertical-center {
    width : 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.x-centerized {
    margin-left: auto;
    margin-right: auto;
}

.xy-centerized {
    position: absolute;
    width: 400px;
    height: 375px;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.pos-abs {
    position : absolute;
}

.scroll {
    overflow: auto;
}

.scroll-y {
    overflow-y: auto;
}

.scroll-x {
    overflow-x: auto;
}


/*******************/
/* BOOTSTRAP MODAL */
/*******************/

.modal-header button.close {
    color : #fff;
    opacity: 1;
    min-height: 24px;
}

.modal-content {
    border-radius: 0px;
}

.modal-body {
    padding: 25px 15px;
}

/*******************/
/* BOOTSTRAP PANEL */
/*******************/

.panel-custom {
    font-family: 'Open Sans';
    margin-bottom: 20px;
    background-color: rgba(0,0,0,0.8);
    border: 1px solid transparent;
    border-radius: 0px !important;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.05);
    box-shadow: 0 1px 1px rgba(0,0,0,.05);
    color : #fff;
}

.panel-custom .panel-body {
    border-top: 0px !important;
    border-radius: 0px;
}

.panel-custom>.panel-heading {
    border-radius: 0px;
    /*
    color: #333;
    background-color: #000;
    opacity : 0.8;
    border-color: #ddd;
    */
}

.panel-custom > .panel-body {
    padding: 15px;
}

/************************************************************************************/
/* -------------------------- MARGINS AND PADDINGS ---------------------------------*/
/************************************************************************************/

.m-5 {
    margin : 5px;
}

.m-10 {
    margin : 10px;
}

.m-15 {
    margin : 15px;
}

.m-20 {
    margin : 20px;
}

.m-25 {
    margin : 25px;
}

/* margin-top */

.m-t-5 {
    margin-top : 5px;
}

.m-t-10 {
    margin-top : 10px;
}

.m-t-15 {
    margin-top : 15px;
}

.m-t-20 {
    margin-top : 20px;
}

.m-t-25 {
    margin-top : 25px;
}

.m-t-50 {
    margin-top : 50px;
}

.m-t-100 {
    margin-top : 100px;
}

.m-t-150 {
    margin-top : 150px;
}

.m-t-200 {
    margin-top : 200px;
}

/* margin-right */

.m-r-5 {
    margin-right : 5px;
}

.m-r-10 {
    margin-right : 10px;
}

.m-r-15 {
    margin-right : 15px;
}

.m-r-20 {
    margin-right : 20px;
}

.m-r-25 {
    margin-right : 25px;
}

.m-r-50 {
    margin-right : 50px;
}

.m-r-100 {
    margin-right : 100px;
}

.m-r-150 {
    margin-right : 150px;
}

.m-r-200 {
    margin-right : 200px;
}

/* margin-bottom */

.m-b-5 {
    margin-bottom : 5px;
}

.m-b-10 {
    margin-bottom : 10px;
}

.m-b-15 {
    margin-bottom : 15px;
}

.m-b-20 {
    margin-bottom : 20px;
}

.m-b-25 {
    margin-bottom : 25px;
}

.m-b-50 {
    margin-bottom : 50px;
}

.m-b-100 {
    margin-bottom : 100px;
}

.m-b-150 {
    margin-bottom : 150px;
}

.m-b-200 {
    margin-bottom : 200px;
}

/* margin-left */

.m-l-5 {
    margin-left : 5px;
}

.m-l-10 {
    margin-left : 10px;
}

.m-l-15 {
    margin-left : 15px;
}

.m-l-20 {
    margin-left : 20px;
}

.m-l-25 {
    margin-left : 25px;
}

.m-l-50 {
    margin-left : 50px;
}

.m-l-100 {
    margin-left : 100px;
}

.m-l-150 {
    margin-left : 150px;
}

.m-l-200 {
    margin-left : 200px;
}

.p-5 {
    padding : 5px;
}

.p-10 {
    padding : 10px;
}

.p-15 {
    padding : 15px;
}

.p-20 {
    padding : 20px;
}

.p-25 {
    padding : 25px;
}


/* padding-top */

.p-t-5 {
    padding-top : 5px;
}

.p-t-10 {
    padding-top : 10px;
}

.p-t-15 {
    padding-top : 15px;
}

.p-t-20 {
    padding-top : 20px;
}

.p-t-25 {
    padding-top : 25px;
}

.p-t-50 {
    padding-top : 50px;
}

.p-t-100 {
    padding-top : 100px;
}

.p-t-150 {
    padding-top : 150px;
}

.p-t-200 {
    padding-top : 200px;
}

/* padding-right */

.p-r-5 {
    padding-right : 5px;
}

.p-r-10 {
    padding-right : 10px;
}

.p-r-15 {
    padding-right : 15px;
}

.p-r-20 {
    padding-right : 20px;
}

.p-r-25 {
    padding-right : 25px;
}

.p-r-50 {
    padding-right : 50px;
}

.p-r-100 {
    padding-right : 100px;
}

.p-r-150 {
    padding-right : 150px;
}

.p-r-200 {
    padding-right : 200px;
}

/* padding-bottom */

.p-b-5 {
    padding-bottom : 5px;
}

.p-b-10 {
    padding-bottom : 10px;
}

.p-b-15 {
    padding-bottom : 15px;
}

.p-b-20 {
    padding-bottom : 20px;
}

.p-b-25 {
    padding-bottom : 25px;
}

.p-b-50 {
    padding-bottom : 50px;
}

.p-b-100 {
    padding-bottom : 100px;
}

.p-b-150 {
    padding-bottom : 150px;
}

.p-b-200 {
    padding-bottom : 200px;
}

/* padding-left */

.p-l-5 {
    padding-left : 5px;
}

.p-l-10 {
    padding-left : 10px;
}

.p-l-15 {
    padding-left : 15px;
}

.p-l-20 {
    padding-left : 20px;
}

.p-l-25 {
    padding-left : 25px;
}

.p-l-50 {
    padding-left : 50px;
}

.p-l-100 {
    padding-left : 100px;
}

.p-l-150 {
    padding-left : 150px;
}

.p-l-200 {
    padding-left : 200px;
}

.font-14 {
    font-size : 14px;
}
.font-16 {
    font-size : 16px;
}
.font-18 {
    font-size : 18px;
}
.font-20 {
    font-size : 20px;
}
.font-21 {
    font-size : 21px;
}
.font-22 {
    font-size : 22px;
}
.font-23 {
    font-size : 23px;
}
.font-24 {
    font-size : 24px;
}

/* width & height */

.h15 {
    height: 15px;
}

.h25 {
    height: 25px;
}

.h50 {
    height: 50px;
}

.w-320 {
    width : 320px;
}

.w-768 {
    width : 768px;
}

.min-w-100 {
    min-width: 100px;
}

.min-w-125 {
    min-width: 125px;
}

.w25-f {
    width : 25% !important;
}

.w33-f {
    width : 33% !important;
}

.w50-f {
    width : 50% !important;
}

.w75-f {
    width : 75% !important;
}

.modal-danger .modal-header {
    background-color: #d9534f !important;
    text-align: center;
    color: #fff;
}

.modal-lime .modal-header {
    background-color: #8aca1e !important;
    text-align: center;
    color: #fff;
}

.modal-primary .modal-header {
    background-color: #337ab7 !important;
    text-align: center;
    color: #fff;
}

.modal-info .modal-header {
    background-color: #5bc0de !important;
    text-align: center;
    color: #fff;
}

.modal-success .modal-header {
    background-color: #2ca02c !important;
    text-align: center;
    color: #fff;
}

.modal-purple .modal-header {
    background-color: #cd38ea !important;
    text-align: center;
    color: #fff;
}

.table-padding-10-15 th,
.table-padding-10-15 td
{
    padding: 10px 15px !important;
    vertical-align: middle !important;
}

.table-form tr,
.table-form tr td
{
    border-top: 0px !important;
}


.dropup .btn {
    min-width: 0px;
}

.dropup .w-150 {
    min-width: 150px;
}

.btn-round {
    border-radius: 4px !important;
}


.button-panel-right {
    text-align: right;
}

.button-panel-right .btn {
    margin-left: 10px;
    margin-bottom: 10px;
}

.button-panel-left {
    text-align: left;
}

.button-panel-left .btn {
    margin-right: 10px;
    margin-bottom: 5px;
}

.panel-group .panel-xalandri {
    border-radius: 0px;
}

.fa-t-10 {
    margin-top: 10px;
}

.label-orange {
    background-color: #ff8f00;
}

.label-orange-tag:hover,
.label-orange-tag:focus,
.label-orange-tag:active {
    background-color: #f98900;
}

.label-lime {
    background-color: #96c71e;
}

.label-lime-tag:hover,
.label-lime-tag:focus,
.label-lime-tag:active {
    background-color: #93c31b;
}


.btn-purple {
    color : #fff;
    background-color : #cd38ea;
}

.btn-purple:hover,
.btn-purple:focus,
.btn-purple:active {
    color : #fff;
    background-color : #c92ee8;
}

.btn-excel {
    color : #fff;
    background-color : #178419;
}

.btn-excel:hover,
.btn-excel:focus,
.btn-excel:active {
    color : #fff;
    background-color : #157516;
}

/*
 * Select2
 */

.select2-container--default .select2-selection--multiple {
    border: 1px solid #ccc;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: 1px solid #ccc;
    min-height: 34px;
    outline: 0;
}

.select2-container--default .select2-selection--multiple {
    min-height: 34px;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #9b1f1f;
}

.modal-768 {
    max-width: 768px;
}

.datepicker-condensed {
    display: inline;
    width: 150px;
}

.full-width-f {
    width : 100% !important;
}

.border-white {
    border : 1px solid #fff;
}

.fa-green {
    color: #8aca1e;
}

.fa-purple {
    color: #c92ee8;
}

.fa-red {
    color: #bf4141;
}

.fa-orange {
    color: #f7931e;
}

.cursor-pointer {
    cursor : pointer;
}

.sortable-collection th>a {
    color: #000;
}

.wide-table-wrapper {
    /*padding: 0px;*/
    overflow-x: auto;
    margin-bottom: 20px;
}

.btn-icon {
    min-width: 38px;
    max-width: 38px;
}