#main {
    position: relative;
    margin-left: 0.5%;
    margin-right: 0.5%;
}

    #main:after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        background-image: url(../images/undraw_fans_gr54.svg);
        width: 100%;
        height: 100%;
        opacity: 0.2;
        filter: alpha(opacity=20);
        z-index: -1;
        background-repeat: no-repeat;
        background-position: center;
        background-attachment: fixed;
    }


/** PANEL CUSTOMIZATION *********************************************************************/

.panel-without-heading {
    border-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    /*margin-top: -5px;*/
}

/*Panel scrollable with fixed height*/
.panel-body .scrollablefixed {
    max-height: 300px;
    overflow-y: scroll;
}

/*Custom collapsible panel with icon*/
.panel-collapsible {
}

    .panel-collapsible .row {
        margin-top: 30px;
        padding: 0 10px;
    }

    .panel-collapsible .clickable {
        cursor: pointer;
    }

    .panel-collapsible .panel-heading span {
        margin-top: -20px;
        font-size: 15px;
    }

.panel-body-back-lightgray {
    background-color: #f3f3f3;
}

/* Pannello custom contenente pulsantiera*/
.panel-button {
    background-color: #eaeaea;
    border: 1px solid #ccc;
    /*border-radius:15px;*/
}

/*Panel Steel*/
.panel-steel {
    border-color: #585858;
}

    .panel-steel > .panel-heading {
        color: #ffffff;
        background-color: #585858;
        border-color: #585858;
    }

        .panel-steel > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #585858;
        }

        .panel-steel > .panel-heading .badge {
            color: #585858;
            background-color: #ffffff;
        }

    .panel-steel > .panel-footer + .panel-collapse > .panel-body {
        border-bottom-color: #585858;
    }

/*Panel dark-slate-gray*/
.panel-slate-gray {
    border-color: #596979;
}

    .panel-slate-gray > .panel-heading {
        color: #ffffff;
        background-color: #596979;
        border-color: #596979;
    }

        .panel-slate-gray > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #596979;
        }

        .panel-slate-gray > .panel-heading .badge {
            color: #596979;
            background-color: #ffffff;
        }

    .panel-slate-gray > .panel-footer + .panel-collapse > .panel-body {
        border-bottom-color: #596979;
    }

/*Panel dark-slate-gray*/
.panel-new {
    border-color: #ade1d7;
}

    .panel-new > .panel-heading {
        color: #596979;
        animation: blinkerPanel 5s linear infinite;
        background-color: #ade1d7;
        border-color: #ade1d7;
    }

        .panel-new > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #ade1d7;
        }

        .panel-new > .panel-heading .badge {
            color: #ade1d7;
            background-color: #ffffff;
        }

    .panel-new > .panel-footer + .panel-collapse > .panel-body {
        border-bottom-color: #ade1d7;
    }

@keyframes blinkerPanel {
    50% {
        background-color: #7ed7c5;
        border-color: #7ed7c5;
        /*color:white;*/
        /*opacity: 0.2;*/
    }
}

/*Button sidebar on the left*/

.panel-button-sidebar-body div a {
    margin-top: 10px;
}

.panel-button-sidebar-body div button {
    margin-top: 10px;
}

@media (min-width: 992px) {
    .panel-button-sidebar-bottom-left {
        background-color: transparent;
        padding: 0;
        margin: 0;
        position: fixed;
        left: -195px;
        bottom: 70px;
        border: 0;
        z-index: 1598;
    }

    .panel-button-sidebar-top-left {
        background-color: transparent;
        padding: 0;
        margin: 0;
        position: fixed;
        left: -195px;
        top: 110px;
        border: 0;
        z-index: 1598;
    }

    .panel-button-sidebar-body {
        margin-top: 0;
        margin-left: 0;
        margin-right: 0;
        border: 0;
    }

        .panel-button-sidebar-body div {
            float: none;
            list-style-type: none;
            margin: 0;
            padding: 0;
            -webkit-transition: all 0.25s ease-in-out;
            -moz-transition: all 0.25s ease-in-out;
            -o-transition: all 0.25s ease-in-out;
            transition: all 0.25s ease-in-out;
            width: 240px;
        }

            .panel-button-sidebar-body div:hover {
                margin-left: 190px;
            }

            .panel-button-sidebar-body div a {
                margin-top: 5px;
            }

            .panel-button-sidebar-body div button {
                margin-top: 5px;
            }
}

/** END PANEL CUSTOMIZATION *********************************************************************/

/** BUTTON CUSTOMIZATION *********************************************************************/

.btn-steel {
    color: #ffffff;
    background-color: #585858;
    border-color: #585858;
}

    .btn-steel:focus,
    .btn-steel.focus {
        color: #ffffff;
        background-color: #484848;
        border-color: #444444;
    }

    .btn-steel:hover {
        color: #ffffff;
        background-color: #484848;
        border-color: #484848;
    }

    .btn-steel:active,
    .btn-steel.active,
    .open > .dropdown-toggle.btn-steel {
        color: #ffffff;
        background-color: #484848;
        border-color: #484848;
    }

        .btn-steel:active:hover,
        .btn-steel.active:hover,
        .open > .dropdown-toggle.btn-steel:hover,
        .btn-steel:active:focus,
        .btn-steel.active:focus,
        .open > .dropdown-toggle.btn-steel:focus,
        .btn-steel:active.focus,
        .btn-steel.active.focus,
        .open > .dropdown-toggle.btn-steel.focus {
            color: #ffffff;
            background-color: #414141;
            border-color: #3e3e3e;
        }

    .btn-steel:active,
    .btn-steel.active,
    .open > .dropdown-toggle.btn-steel {
        background-image: none;
    }

    .btn-steel.disabled,
    .btn-steel[disabled],
    fieldset[disabled] .btn-steel,
    .btn-steel.disabled:hover,
    .btn-steel[disabled]:hover,
    fieldset[disabled] .btn-steel:hover,
    .btn-steel.disabled:focus,
    .btn-steel[disabled]:focus,
    fieldset[disabled] .btn-steel:focus,
    .btn-steel.disabled.focus,
    .btn-steel[disabled].focus,
    fieldset[disabled] .btn-steel.focus,
    .btn-steel.disabled:active,
    .btn-steel[disabled]:active,
    fieldset[disabled] .btn-steel:active,
    .btn-steel.disabled.active,
    .btn-steel[disabled].active,
    fieldset[disabled] .btn-steel.active {
        background-color: #585858;
        border-color: #585858;
    }

    .btn-steel .badge {
        color: #585858;
        background-color: #ffffff;
    }






.btn-indigo {
    color: #ffffff;
    background-color: #4b0082;
    border-color: #500983;
}

    .btn-indigo:focus,
    .btn-indigo.focus {
        color: #ffffff;
        background-color: #3b0067;
        border-color: #4a0b79;
    }

    .btn-indigo:hover {
        color: #ffffff;
        background-color: #3b0067;
        border-color: #3b0067;
    }

    .btn-indigo:active,
    .btn-indigo.active,
    .open > .dropdown-toggle.btn-indigo {
        color: #ffffff;
        background-color: #3b0067;
        border-color: #3b0067;
    }

        .btn-indigo:active:hover,
        .btn-indigo.active:hover,
        .open > .dropdown-toggle.btn-indigo:hover,
        .btn-indigo:active:focus,
        .btn-indigo.active:focus,
        .open > .dropdown-toggle.btn-indigo:focus,
        .btn-indigo:active.focus,
        .btn-indigo.active.focus,
        .open > .dropdown-toggle.btn-indigo.focus {
            color: #ffffff;
            background-color: #470578;
            border-color: #541881;
        }

    .btn-indigo:active,
    .btn-indigo.active,
    .open > .dropdown-toggle.btn-indigo {
        background-image: none;
    }

    .btn-indigo.disabled,
    .btn-indigo[disabled],
    fieldset[disabled] .btn-indigo,
    .btn-indigo.disabled:hover,
    .btn-indigo[disabled]:hover,
    fieldset[disabled] .btn-indigo:hover,
    .btn-indigo.disabled:focus,
    .btn-indigo[disabled]:focus,
    fieldset[disabled] .btn-indigo:focus,
    .btn-indigo.disabled.focus,
    .btn-indigo[disabled].focus,
    fieldset[disabled] .btn-indigo.focus,
    .btn-indigo.disabled:active,
    .btn-indigo[disabled]:active,
    fieldset[disabled] .btn-indigo:active,
    .btn-indigo.disabled.active,
    .btn-indigo[disabled].active,
    fieldset[disabled] .btn-indigo.active {
        background-color: #4b0082;
        border-color: #4b0082;
    }

    .btn-indigo .badge {
        color: #4b0082;
        background-color: #ffffff;
    }


/** END BUTTON CUSTOMIZATION *********************************************************************/

/** TABPANEL CUSTOMIZATION *********************************************************************/

.nav-tabs {
    padding-bottom: 0;
    /*background-color: transparent;*/
    /*border: 1px solid #ccc;*/
}

    .nav-tabs > li > a {
        left: 5px;
        border-left: 1px solid #dcdcdc;
        border-top: 1px solid #dcdcdc;
        border-right: 1px solid #dcdcdc;
    }

    .nav-tabs > li.active > a,
    .nav-tabs > li.active > a:focus,
    .nav-tabs > li.active > a:hover {
        background-color: #818e9a !important;
        border-left: 1px solid #ccc;
        border-top: 1px solid #ccc;
        border-right: 1px solid #ccc;
        /*border-bottom: 1px solid #00e8ff;*/
        color: #e1e1e1 !important;
    }

/** END TABPANEL CUSTOMIZATION *********************************************************************/

/** COLUMN CUSTOMIZATION *********************************************************************/
/*.col-align-botton {
    position: absolute;
    bottom:0;
    right:0;
}

.row-align-botton {
    position: relative;
}*/
/** END COLUMN CUSTOMIZATION *********************************************************************/

/* MENU */
.navbar-static-bottom {
    position: relative;
    bottom: 0;
    border-radius: 0;
    width: 100%;
}
/*END MENU */

/*SUB MENU */
.dropdown-submenu {
    position: relative;
}

    .dropdown-submenu > .dropdown-menu {
        top: 0;
        left: 100%;
        margin-top: -6px;
        margin-left: -1px;
        -webkit-border-radius: 0 6px 6px 6px;
        -moz-border-radius: 0 6px 6px 6px;
        border-radius: 0 6px 6px 6px;
    }

    .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }

    .dropdown-submenu > a:after {
        display: block;
        content: " ";
        float: right;
        width: 0;
        height: 0;
        border-color: transparent;
        border-style: solid;
        border-width: 5px 0 5px 5px;
        border-left-color: #cccccc;
        margin-top: 5px;
        margin-right: -10px;
    }

    .dropdown-submenu:hover > a:after {
        border-left-color: #ffffff;
    }

    .dropdown-submenu.pull-left {
        float: none;
    }

        .dropdown-submenu.pull-left > .dropdown-menu {
            left: -100%;
            margin-left: 10px;
            -webkit-border-radius: 6px 0 6px 6px;
            -moz-border-radius: 6px 0 6px 6px;
            border-radius: 6px 0 6px 6px;
        }
/*END SUB MENU */

/* ALERT CUSTOMIZATION*/

.alert {
    position: fixed;
    bottom: 0;
    left: 0;
    transition: all 1s ease;
    opacity: 0;
    z-index: 1599;
}

    .alert .message {
        padding-left: 15px;
        padding-right: 25px;
    }

    .alert.on {
        bottom: 10px;
        left: 50px;
        margin-right: 50px;
        /*right: 50px;*/
        opacity: 0.95;
    }

/* END ALERT CUSTOMIZATION*/

/* PAGINATION CUSTOMIZATION*/

.pagination {
}

    .pagination > li {
    }

        .pagination > li > a,
        .pagination > li > span {
            background-color: #484848;
        }

        .pagination > li:first-child > a,
        .pagination > li:first-child > span {
        }

        .pagination > li:last-child > a,
        .pagination > li:last-child > span {
        }

        .pagination > li > a:hover,
        .pagination > li > span:hover,
        .pagination > li > a:focus,
        .pagination > li > span:focus {
            background-color: #2b2b2b;
        }

    .pagination > .active > a,
    .pagination > .active > span,
    .pagination > .active > a:hover,
    .pagination > .active > span:hover,
    .pagination > .active > a:focus,
    .pagination > .active > span:focus {
        background-color: #2b2b2b;
    }

    .pagination > .disabled > span,
    .pagination > .disabled > span:hover,
    .pagination > .disabled > span:focus,
    .pagination > .disabled > a,
    .pagination > .disabled > a:hover,
    .pagination > .disabled > a:focus {
        background-color: #6c6c6c;
    }

.pagination-lg > li > a,
.pagination-lg > li > span {
}

.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
}

.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
}

.pagination-sm > li > a,
.pagination-sm > li > span {
}

.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
}

.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
}

/* END PAGINATION CUSTOMIZATION*/


/* ROW AND COLUMN CUSTOMIZATION*/

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    margin-top: 2px;
    margin-bottom: 2px;
}

.panel-body .row {
    /*margin-top: 10px;
    margin-bottom: 10px;*/
}

.row {
    /*margin-top: 5px;*/
}

/* ROW AND COLUMN END CUSTOMIZATION*/


/* BG CUSTOMIZATION*/

.bg-default {
    background-color: #95a5a6;
}

a.bg-default:hover,
a.bg-default:focus {
    background-color: #7f8b8b;
}

.bg-light-gray {
    background-color: #eceeee;
}

a.bg-light-gray:hover,
a.bg-light-gray:focus {
    background-color: #dbdbdb;
}

/* BG END CUSTOMIZATION*/


/* CARD */
.card-img-top {
    width: 100%;
    height: 15vw;
    object-fit: cover;
}