.checkbox { padding-left: 20px; }
.checkbox label { display: inline-block; vertical-align: middle; position: relative; padding-left: 5px; }
.checkbox label::before { content: ""; display: inline-block; position: absolute; width: 17px; height: 17px; left: 0; margin-left: -20px; border: 1px solid #cccccc; border-radius: 3px; background-color: #fff; -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out; transition: border 0.15s ease-in-out, color 0.15s ease-in-out; }
.checkbox label::after { display: inline-block; position: absolute; width: 16px; height: 16px; left: 0; top: 0; margin-left: -20px; padding-left: 3px; padding-top: 1px; font-size: 11px; color: #555555; line-height: 1.4; }
.checkbox input[type="checkbox"], .checkbox input[type="radio"] { opacity: 0; z-index: 1; cursor: pointer; }
.checkbox input[type="checkbox"]:focus + label::before, .checkbox input[type="radio"]:focus + label::before { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; }
.checkbox input[type="checkbox"]:checked + label::after, .checkbox input[type="radio"]:checked + label::after { font-family: "FontAwesome"; content: "\f00c"; }
.checkbox input[type="checkbox"]:indeterminate + label::after, .checkbox input[type="radio"]:indeterminate + label::after { display: block; content: ""; width: 10px; height: 3px; background-color: #555555; border-radius: 2px; margin-left: -16.5px; margin-top: 7px; }
.checkbox input[type="checkbox"]:disabled, .checkbox input[type="radio"]:disabled { cursor: not-allowed; }
.checkbox input[type="checkbox"]:disabled + label, .checkbox input[type="radio"]:disabled + label { opacity: 0.65; }
.checkbox input[type="checkbox"]:disabled + label::before, .checkbox input[type="radio"]:disabled + label::before { background-color: #eeeeee; cursor: not-allowed; }
.checkbox.checkbox-circle label::before { border-radius: 50%; }
.checkbox.checkbox-inline { margin-top: 0; }

.checkbox-primary input[type="checkbox"]:checked + label::before, .checkbox-primary input[type="radio"]:checked + label::before { background-color: #337ab7; border-color: #337ab7; }
.checkbox-primary input[type="checkbox"]:checked + label::after, .checkbox-primary input[type="radio"]:checked + label::after { color: #fff; }

.checkbox-danger input[type="checkbox"]:checked + label::before, .checkbox-danger input[type="radio"]:checked + label::before { background-color: #d9534f; border-color: #d9534f; }
.checkbox-danger input[type="checkbox"]:checked + label::after, .checkbox-danger input[type="radio"]:checked + label::after { color: #fff; }

.checkbox-info input[type="checkbox"]:checked + label::before, .checkbox-info input[type="radio"]:checked + label::before { background-color: #5bc0de; border-color: #5bc0de; }
.checkbox-info input[type="checkbox"]:checked + label::after, .checkbox-info input[type="radio"]:checked + label::after { color: #fff; }

.checkbox-warning input[type="checkbox"]:checked + label::before, .checkbox-warning input[type="radio"]:checked + label::before { background-color: #f0ad4e; border-color: #f0ad4e; }
.checkbox-warning input[type="checkbox"]:checked + label::after, .checkbox-warning input[type="radio"]:checked + label::after { color: #fff; }

.checkbox-success input[type="checkbox"]:checked + label::before, .checkbox-success input[type="radio"]:checked + label::before { background-color: #5cb85c; border-color: #5cb85c; }
.checkbox-success input[type="checkbox"]:checked + label::after, .checkbox-success input[type="radio"]:checked + label::after { color: #fff; }

.checkbox-primary input[type="checkbox"]:indeterminate + label::before, .checkbox-primary input[type="radio"]:indeterminate + label::before { background-color: #337ab7; border-color: #337ab7; }
.checkbox-primary input[type="checkbox"]:indeterminate + label::after, .checkbox-primary input[type="radio"]:indeterminate + label::after { background-color: #fff; }

.checkbox-danger input[type="checkbox"]:indeterminate + label::before, .checkbox-danger input[type="radio"]:indeterminate + label::before { background-color: #d9534f; border-color: #d9534f; }
.checkbox-danger input[type="checkbox"]:indeterminate + label::after, .checkbox-danger input[type="radio"]:indeterminate + label::after { background-color: #fff; }

.checkbox-info input[type="checkbox"]:indeterminate + label::before, .checkbox-info input[type="radio"]:indeterminate + label::before { background-color: #5bc0de; border-color: #5bc0de; }
.checkbox-info input[type="checkbox"]:indeterminate + label::after, .checkbox-info input[type="radio"]:indeterminate + label::after { background-color: #fff; }

.checkbox-warning input[type="checkbox"]:indeterminate + label::before, .checkbox-warning input[type="radio"]:indeterminate + label::before { background-color: #f0ad4e; border-color: #f0ad4e; }
.checkbox-warning input[type="checkbox"]:indeterminate + label::after, .checkbox-warning input[type="radio"]:indeterminate + label::after { background-color: #fff; }

.checkbox-success input[type="checkbox"]:indeterminate + label::before, .checkbox-success input[type="radio"]:indeterminate + label::before { background-color: #5cb85c; border-color: #5cb85c; }
.checkbox-success input[type="checkbox"]:indeterminate + label::after, .checkbox-success input[type="radio"]:indeterminate + label::after { background-color: #fff; }



.radio { padding-left: 20px; }
.radio label { display: inline-block; vertical-align: middle; position: relative; padding-left: 5px; }
.radio label::before { content: ""; display: inline-block; position: absolute; width: 17px; height: 17px; left: 0; margin-left: -20px; border: 1px solid #cccccc; border-radius: 50%; background-color: #fff; -webkit-transition: border 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out; transition: border 0.15s ease-in-out; }
.radio label::after { display: inline-block; position: absolute; content: " "; width: 11px; height: 11px; left: 3px; top: 3px; margin-left: -20px; border-radius: 50%; background-color: #555555; -webkit-transform: scale(0, 0); -ms-transform: scale(0, 0); -o-transform: scale(0, 0); transform: scale(0, 0); -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); }
.radio input[type="radio"] { opacity: 0; z-index: 1; cursor: pointer; }
.radio input[type="radio"]:focus + label::before { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; }
.radio input[type="radio"]:checked + label::after { -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); }
.radio input[type="radio"]:disabled { cursor: not-allowed; }
.radio input[type="radio"]:disabled + label { opacity: 0.65; }
.radio input[type="radio"]:disabled + label::before { cursor: not-allowed; }
.radio.radio-inline { margin-top: 0; }

.radio-primary input[type="radio"] + label::after { background-color: #337ab7; }
.radio-primary input[type="radio"]:checked + label::before { border-color: #337ab7; }
.radio-primary input[type="radio"]:checked + label::after { background-color: #337ab7; }

.radio-danger input[type="radio"] + label::after { background-color: #d9534f; }
.radio-danger input[type="radio"]:checked + label::before { border-color: #d9534f; }
.radio-danger input[type="radio"]:checked + label::after { background-color: #d9534f; }

.radio-info input[type="radio"] + label::after { background-color: #5bc0de; }
.radio-info input[type="radio"]:checked + label::before { border-color: #5bc0de; }
.radio-info input[type="radio"]:checked + label::after { background-color: #5bc0de; }

.radio-warning input[type="radio"] + label::after { background-color: #f0ad4e; }
.radio-warning input[type="radio"]:checked + label::before { border-color: #f0ad4e; }
.radio-warning input[type="radio"]:checked + label::after { background-color: #f0ad4e; }

.radio-success input[type="radio"] + label::after { background-color: #5cb85c; }
.radio-success input[type="radio"]:checked + label::before { border-color: #5cb85c; }
.radio-success input[type="radio"]:checked + label::after { background-color: #5cb85c; }

input[type="checkbox"].styled:checked + label:after, input[type="radio"].styled:checked + label:after { font-family: 'FontAwesome'; content: "\f00c"; }
input[type="checkbox"] .styled:checked + label::before, input[type="radio"] .styled:checked + label::before { color: #fff; }
input[type="checkbox"] .styled:checked + label::after, input[type="radio"] .styled:checked + label::after { color: #fff; }


/*=== TAB & PANEL ============================================================================================*/


.panel.with-nav-tabs .panel-heading { padding: 5px 5px 0 5px; }
.panel.with-nav-tabs .nav-tabs { border-bottom: none; }
.panel.with-nav-tabs .nav-justified { margin-bottom: -1px; }
/********************************************************************/
/*** PANEL DEFAULT ***/
.with-nav-tabs.panel-default .nav-tabs > li > a, .with-nav-tabs.panel-default .nav-tabs > li > a:hover, .with-nav-tabs.panel-default .nav-tabs > li > a:focus { color: #777; }
.with-nav-tabs.panel-default .nav-tabs > .open > a, .with-nav-tabs.panel-default .nav-tabs > .open > a:hover, .with-nav-tabs.panel-default .nav-tabs > .open > a:focus, .with-nav-tabs.panel-default .nav-tabs > li > a:hover, .with-nav-tabs.panel-default .nav-tabs > li > a:focus { color: #777; background-color: #ddd; border-color: transparent; }
.with-nav-tabs.panel-default .nav-tabs > li.active > a, .with-nav-tabs.panel-default .nav-tabs > li.active > a:hover, .with-nav-tabs.panel-default .nav-tabs > li.active > a:focus { color: #555; background-color: #fff; border-color: #ddd; border-bottom-color: transparent; }
.with-nav-tabs.panel-default .nav-tabs > li.dropdown .dropdown-menu { background-color: #f5f5f5; border-color: #ddd; }
.with-nav-tabs.panel-default .nav-tabs > li.dropdown .dropdown-menu > li > a { color: #777; }
.with-nav-tabs.panel-default .nav-tabs > li.dropdown .dropdown-menu > li > a:hover, .with-nav-tabs.panel-default .nav-tabs > li.dropdown .dropdown-menu > li > a:focus { background-color: #ddd; }
.with-nav-tabs.panel-default .nav-tabs > li.dropdown .dropdown-menu > .active > a, .with-nav-tabs.panel-default .nav-tabs > li.dropdown .dropdown-menu > .active > a:hover, .with-nav-tabs.panel-default .nav-tabs > li.dropdown .dropdown-menu > .active > a:focus { color: #fff; background-color: #555; }
/********************************************************************/
/*** PANEL PRIMARY ***/
.with-nav-tabs.panel-primary .nav-tabs > li > a, .with-nav-tabs.panel-primary .nav-tabs > li > a:hover, .with-nav-tabs.panel-primary .nav-tabs > li > a:focus { color: #fff; }
.with-nav-tabs.panel-primary .nav-tabs > .open > a, .with-nav-tabs.panel-primary .nav-tabs > .open > a:hover, .with-nav-tabs.panel-primary .nav-tabs > .open > a:focus, .with-nav-tabs.panel-primary .nav-tabs > li > a:hover, .with-nav-tabs.panel-primary .nav-tabs > li > a:focus { color: #fff; background-color: #3071a9; border-color: transparent; }
.with-nav-tabs.panel-primary .nav-tabs > li.active > a, .with-nav-tabs.panel-primary .nav-tabs > li.active > a:hover, .with-nav-tabs.panel-primary .nav-tabs > li.active > a:focus { color: #428bca; background-color: #fff; border-color: #428bca; border-bottom-color: transparent; }
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu { background-color: #428bca; border-color: #3071a9; }
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > li > a { color: #fff; }
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > li > a:hover, .with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > li > a:focus { background-color: #3071a9; }
.with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > .active > a, .with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > .active > a:hover, .with-nav-tabs.panel-primary .nav-tabs > li.dropdown .dropdown-menu > .active > a:focus { background-color: #4a9fe9; }
/************************************************************************************************************/
/*** PANEL SUCCESS ***/
.with-nav-tabs.panel-success .nav-tabs > li > a, .with-nav-tabs.panel-success .nav-tabs > li > a:hover, .with-nav-tabs.panel-success .nav-tabs > li > a:focus { color: #3c763d; }
.with-nav-tabs.panel-success .nav-tabs > .open > a, .with-nav-tabs.panel-success .nav-tabs > .open > a:hover, .with-nav-tabs.panel-success .nav-tabs > .open > a:focus, .with-nav-tabs.panel-success .nav-tabs > li > a:hover, .with-nav-tabs.panel-success .nav-tabs > li > a:focus { color: #3c763d; background-color: #d6e9c6; border-color: transparent; }
.with-nav-tabs.panel-success .nav-tabs > li.active > a, .with-nav-tabs.panel-success .nav-tabs > li.active > a:hover, .with-nav-tabs.panel-success .nav-tabs > li.active > a:focus { color: #3c763d; background-color: #fff; border-color: #d6e9c6; border-bottom-color: transparent; }
.with-nav-tabs.panel-success .nav-tabs > li.dropdown .dropdown-menu { background-color: #dff0d8; border-color: #d6e9c6; }
.with-nav-tabs.panel-success .nav-tabs > li.dropdown .dropdown-menu > li > a { color: #3c763d; }
.with-nav-tabs.panel-success .nav-tabs > li.dropdown .dropdown-menu > li > a:hover, .with-nav-tabs.panel-success .nav-tabs > li.dropdown .dropdown-menu > li > a:focus { background-color: #d6e9c6; }
.with-nav-tabs.panel-success .nav-tabs > li.dropdown .dropdown-menu > .active > a, .with-nav-tabs.panel-success .nav-tabs > li.dropdown .dropdown-menu > .active > a:hover, .with-nav-tabs.panel-success .nav-tabs > li.dropdown .dropdown-menu > .active > a:focus { color: #fff; background-color: #3c763d; }
/*********************************************************************************************************/
/*** PANEL INFO ***/
.with-nav-tabs.panel-info .nav-tabs > li > a, .with-nav-tabs.panel-info .nav-tabs > li > a:hover, .with-nav-tabs.panel-info .nav-tabs > li > a:focus { color: #31708f; }
.with-nav-tabs.panel-info .nav-tabs > .open > a, .with-nav-tabs.panel-info .nav-tabs > .open > a:hover, .with-nav-tabs.panel-info .nav-tabs > .open > a:focus, .with-nav-tabs.panel-info .nav-tabs > li > a:hover, .with-nav-tabs.panel-info .nav-tabs > li > a:focus { color: #31708f; background-color: #bce8f1; border-color: transparent; }
.with-nav-tabs.panel-info .nav-tabs > li.active > a, .with-nav-tabs.panel-info .nav-tabs > li.active > a:hover, .with-nav-tabs.panel-info .nav-tabs > li.active > a:focus { color: #31708f; background-color: #fff; border-color: #bce8f1; border-bottom-color: transparent; }
.with-nav-tabs.panel-info .nav-tabs > li.dropdown .dropdown-menu { background-color: #d9edf7; border-color: #bce8f1; }
.with-nav-tabs.panel-info .nav-tabs > li.dropdown .dropdown-menu > li > a { color: #31708f; }
.with-nav-tabs.panel-info .nav-tabs > li.dropdown .dropdown-menu > li > a:hover, .with-nav-tabs.panel-info .nav-tabs > li.dropdown .dropdown-menu > li > a:focus { background-color: #bce8f1; }
.with-nav-tabs.panel-info .nav-tabs > li.dropdown .dropdown-menu > .active > a, .with-nav-tabs.panel-info .nav-tabs > li.dropdown .dropdown-menu > .active > a:hover, .with-nav-tabs.panel-info .nav-tabs > li.dropdown .dropdown-menu > .active > a:focus { color: #fff; background-color: #31708f; }
/***********************************************************************************************************/
/*** PANEL WARNING ***/
.with-nav-tabs.panel-warning .nav-tabs > li > a, .with-nav-tabs.panel-warning .nav-tabs > li > a:hover, .with-nav-tabs.panel-warning .nav-tabs > li > a:focus { color: #8a6d3b; }
.with-nav-tabs.panel-warning .nav-tabs > .open > a, .with-nav-tabs.panel-warning .nav-tabs > .open > a:hover, .with-nav-tabs.panel-warning .nav-tabs > .open > a:focus, .with-nav-tabs.panel-warning .nav-tabs > li > a:hover, .with-nav-tabs.panel-warning .nav-tabs > li > a:focus { color: #8a6d3b; background-color: #faebcc; border-color: transparent; }
.with-nav-tabs.panel-warning .nav-tabs > li.active > a, .with-nav-tabs.panel-warning .nav-tabs > li.active > a:hover, .with-nav-tabs.panel-warning .nav-tabs > li.active > a:focus { color: #8a6d3b; background-color: #fff; border-color: #faebcc; border-bottom-color: transparent; }
.with-nav-tabs.panel-warning .nav-tabs > li.dropdown .dropdown-menu { background-color: #fcf8e3; border-color: #faebcc; }
.with-nav-tabs.panel-warning .nav-tabs > li.dropdown .dropdown-menu > li > a { color: #8a6d3b; }
.with-nav-tabs.panel-warning .nav-tabs > li.dropdown .dropdown-menu > li > a:hover, .with-nav-tabs.panel-warning .nav-tabs > li.dropdown .dropdown-menu > li > a:focus { background-color: #faebcc; }
.with-nav-tabs.panel-warning .nav-tabs > li.dropdown .dropdown-menu > .active > a, .with-nav-tabs.panel-warning .nav-tabs > li.dropdown .dropdown-menu > .active > a:hover, .with-nav-tabs.panel-warning .nav-tabs > li.dropdown .dropdown-menu > .active > a:focus { color: #fff; background-color: #8a6d3b; }
/********************************************************************/
/*** PANEL DANGER ***/
.with-nav-tabs.panel-danger .nav-tabs > li > a, .with-nav-tabs.panel-danger .nav-tabs > li > a:hover, .with-nav-tabs.panel-danger .nav-tabs > li > a:focus { color: #a94442; }
.with-nav-tabs.panel-danger .nav-tabs > .open > a, .with-nav-tabs.panel-danger .nav-tabs > .open > a:hover, .with-nav-tabs.panel-danger .nav-tabs > .open > a:focus, .with-nav-tabs.panel-danger .nav-tabs > li > a:hover, .with-nav-tabs.panel-danger .nav-tabs > li > a:focus { color: #a94442; background-color: #ebccd1; border-color: transparent; }
.with-nav-tabs.panel-danger .nav-tabs > li.active > a, .with-nav-tabs.panel-danger .nav-tabs > li.active > a:hover, .with-nav-tabs.panel-danger .nav-tabs > li.active > a:focus { color: #a94442; background-color: #fff; border-color: #ebccd1; border-bottom-color: transparent; }
.with-nav-tabs.panel-danger .nav-tabs > li.dropdown .dropdown-menu { background-color: #f2dede; /* bg color */ border-color: #ebccd1; /* border color */ }
.with-nav-tabs.panel-danger .nav-tabs > li.dropdown .dropdown-menu > li > a { color: #a94442; /* normal text color */ }
.with-nav-tabs.panel-danger .nav-tabs > li.dropdown .dropdown-menu > li > a:hover, .with-nav-tabs.panel-danger .nav-tabs > li.dropdown .dropdown-menu > li > a:focus { background-color: #ebccd1; /* hover bg color */ }
.with-nav-tabs.panel-danger .nav-tabs > li.dropdown .dropdown-menu > .active > a, .with-nav-tabs.panel-danger .nav-tabs > li.dropdown .dropdown-menu > .active > a:hover, .with-nav-tabs.panel-danger .nav-tabs > li.dropdown .dropdown-menu > .active > a:focus { color: #fff; /* active text color */ background-color: #a94442; /* active bg color */ }



/******************************
responsive area
********************************/


@media (min-width: 300px) and (max-width: 500px) {
    .parent-container { top: -10px; }

    .top-header { height: 70px; }

    .footer { margin-top: 0px; }

    .login100-form { margin-top: 35px; }

    .navbar-default .navbar-collapse, .navbar-default .navbar-form { background-color: #fff; font-family: sans-serif; }

    .container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse { margin-right: -40px; margin-left: -15px; }

    .hint .tooltiptext { left: -550%; }

    .login { margin-top: -50px; }

    .header-logo img { height: 70px; }

    .parent-container { padding-top: 75px; }
}

@media (min-width: 310px) and (max-width: 379px) {

    .footer .col-sm-2 ul li { width: 25%; float: left; }

    .footer .col-sm-3 { width: 50%; float: left; }

    .footer .col-sm-4 { width: 100%; float: left; }

    .footer .col-sm-4 input { width: 80%; display: inline-block; }

    .tiny-footer { font-size: 10px; }

    .footer-title { font-size: 15px; }

    .footer-widget { padding-bottom: 5px; }

    .footer-widget ul li a { font-size: 11px; }

    .footer-widget input { font-size: 11px; }
}