/*
rgba(0,142,112,0.60)
verde: #008e70
rosso: #d0043c
*/

html, body {
    height: 100%;
}

html {
    position: relative;
}


body {
    padding-top: 70px;
    background: #EFF0F1;
    font-family: lato,'Tahoma', sans-serif;
    font-size: 16px;
    line-height: 22px;
    color: #666666;
}

.margin-top-30{
    margin-top: 30px;
}
.margin-bottom-30{
    margin-bottom: 30px;
}

.margin-top-10{
    margin-top: 10px;
}
.margin-bottom-10{
    margin-bottom: 10px;
}

.status_centered{
    vertical-align: middle;
}

.status_center_horizontal{
    text-align: center;
}

.equal {
    display: table;
}

.equal [class*="col-"] {
    display: table-cell;
    vertical-align: top;
}

/*----------------- TYPOGRAPHY -------------------*/


h1{
    font-weight: 400;
    color: #d0043c;
    margin-top: 0;
    font-size: 26px;
}

.lead {
    font-size: 18px;
}

h2{
    font-weight: 300;
    margin-top: 0;
    font-size: 20px;
    color:#008e70;
}

h3{
    font-weight: 200;
    margin-top: 0;
    font-size: 16px;
    color:#666666;
}

a{
    color: #999;
    text-decoration: none;
}

a:hover{
    color: #666;
    text-decoration: none;	
}

a.annulla{
    color: #999;
    text-decoration: none;
    padding-top:30px;
    display: block;
    text-transform: uppercase;
}
a.annulla:hover{
    color: #666;
    text-decoration: none;
}


.detail-link {
    font-size: 75%;
    color: #999;
    text-transform: uppercase;
    text-decoration: none;
}

.detail-link a:hover{
    font-size: 75%;
    color: #666;
    text-transform: uppercase;
    text-decoration: none;
}

.form-signin-heading{
    margin-top: 0;
    margin-bottom: 20px;
}

label{
    font-weight: normal;
}

.label-stato {
    display: inline-block;
    padding: 2px;
    height: 14px;
    width: 14px;
    border-radius: 100%;
}

td.detail-link {
    width: 86px;  
    text-align: center;
}
td[data-title="Dettaglio"] {
    width: 90px;  
}
td[data-title="Protocollo"] {
    width: 80px;  
}
td[data-title="Data"] {
    width: 80px;  
    font-size: 80%;
}
td[data-title="Tipologia"] {
    width: 26px;  
    font-size: 80%;
    text-align: center;
}
td[data-title="Tipologia"] .fa {
    font-size: 16px;
}
td[data-title="CausaleSub"] {
    width: 206px;  
    text-align: left;
    font-size: 80%;
    line-height: 1em;
}
td[data-title="Oggetto"] {

}
td[data-title="Stato"] {
    width: 26px;  
    text-align: center;
}


.page-header{
    margin: 0;
    padding-bottom: 0;
    border-bottom: 1px solid #E1E2E4;
    margin-bottom: 30px;
    text-align: center;
}

.nomargin{
    margin-bottom: 0px;
}

.ticket-detail{
    padding: 0 0 20px 0;
}

.hint{
    font-size: 75%;
    text-align: right;
}
.hint_bottoni{
    margin-top:5px;
}

.form-control{
    border-radius: 0;
}


.btn-default{
    text-transform: uppercase;
    color: white;
    font-size: 14px;
    background: #00945e;
    border:1px solid #00945e;
}

.btn-default:hover{
    background: #008e70;
    border:1px solid #2c8e7b;
    opacity: 0.8;
    color: white;    
}


header{
    margin-bottom:10px;
}

.navbar-default{
    height: 70px;
    background: #00945e;
    border-bottom:none;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.2);	
}
.navbar-brand {
    padding-top: 5px;
    padding-bottom: 5px;
}
.navbar-header img {
    height: 60px;
}

.main-container{
    padding: 20px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    min-height: 100%;
    margin: 0 auto;
    padding-bottom: 140px;
}
/*
.main-login{
    padding: 20px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}
*/
.main-login{
    padding: 20px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

.img-login{
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    margin-bottom: 30px;
}



.main-recover{
    padding: 20px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    max-width: 600px;
    margin: 0 auto;	
}

.spam-note{
    border-top:2px solid #e5e5e5; padding-top:10px;margin-top:40px;
    font-size: 90%;
}




.btn-open{
    margin-top: 30px;

}

.btn-open img{
    border-radius: 100%;
    border: 4px solid #2c8e7b;
}


.btn-open img:hover{
    border: 4px solid #d0043c;
}


.wrap-btn{
    position: relative;
    background: #f5f5f5;
    text-align: center;
    width: 100%;
    height: 100%;
    cursor: pointer;
    border-radius: 100%;
}

.wrap-btn:hover{
    background: #cccccc;
    
}


.wrap-btn h3{
    position: absolute;
    z-index: 20;
    top:50%;	
    margin-top: -35px;
    margin-left: 0;
    margin-right: 0;
    left: 0;
    right: 0;
    color: #d0043c;
    font-size: 18px;
    padding: 0px 10px;
}
.wrap-btn h3 .fa {
    font-size: 30px;
    margin-bottom: 10px;
    display: block;
    color: #d0043c;
}

.wrap-btn.overin .testo {
    margin: auto;
    width: 80%;
    position: relative;
    opacity: 0;
    top: 20px;
    font-size: 60%;
    color: #000000;
}

.panel-response{
    background: #e9fbf7;
    border-color: #008e70;
}

.panel-response .page-header{
    border-color: #008e70;
    padding-bottom: 15px;
    margin-bottom: 10px;	
    color: #008e70;
}

.panel-heading.apertura{
    background-color: #eeeeee;
}
.panel-heading.admin{
    background-color: rgba(0,142,112,0.50);
}

/*--------------------------------------------------------------*/
/* FOOTER 
/*--------------------------------------------------------------*/

footer{
    width: 100%;
    padding: 20px 0 0 0;
    margin: 0px;
    background: #4c4c4c;
    color: #999;
    font-size: 14px;
    line-height: 20px;	
    border-top:2px solid #00945e;
    
    position: relative;
    display: none;
}

footer ul{
    margin: 0;
    padding: 0;
}

footer ul li{
    list-style-type: none;
    margin: 0;

}

footer ul.social{
    margin-top: 10px;	
}

footer ul.social li a{
    margin-bottom: 2px;

}



footer ul li.credits a{
    display: block;
    margin-top: 40px;
    padding-left: 35px!important;
}

footer strong{
    color: #ccc;
}


.footer a {
    color: #999;
    text-decoration: none;
}

.footer a:hover {
    color: #fff;
}


.address{
    margin-top: 20px;
    color: #ccc;
}

/*--------------------------------------------------------------*/
/* RESPONSIVE ADJUSTEMENT 
/*--------------------------------------------------------------*/


@media ( min-width:768px ) {

    footer{
        display: inline-block;
    }

    .footer_login footer{
        position: relative;
        display: block;
        bottom: 0px;
    }
    
    
    #hero{
        height: 750px;
        background: #4c4c4c;
        position: relative;
    }

    .slide .txt{
        position: absolute;
        z-index: 4;
        bottom: 200px;	
    }

    h1{
        color: #00945e;
        font-weight: 400;
        margin: 0;
        font-size: 36px;
        line-height: 42px;
    }

    h2{
        color: #4c4c4c;
        font-weight: 400;
        margin: 0;
        font-size: 26px;
        line-height: 36px;
    }


    a{
        -webkit-transition: color .2s ease;
        -moz-transition: color .2s ease;
        -ms-transition: color .2s ease;
        -o-transition: color .2s ease;
        transition: color .2s ease;	
    }

    .slide .txt h1,#hero-small .txt h1{
        color: #fff;
        margin-bottom: 0;
        font-weight: 300;
        font-size: 42px;
        margin-bottom: 10px;
    }


    .moretreat{
        display: block;
    }

    footer ul.social li a{
        display: block;
        height: 24px;
        padding-left: 30px;
        margin-bottom: 2px;
    }

    footer ul.social li a{
        display: block;
        height: 32px;
        padding-left: 35px;
        margin-bottom: 2px;
    }

/*    footer ul li.facebook a , footer ul li.youtube a{
        background: url('../images/social.png') no-repeat;
    }*/

    footer ul li.facebook a{
        background: url('../images/facebook.png') no-repeat;
        background-size: 30px 30px;

/*        background-position: left top;*/
    }

/*    footer ul li.facebook a:hover{
        background-position: left -24px;
    }*/

    footer ul li.twitter a{
        background: url('../images/Twitter_100.png') no-repeat;
        background-size: 30px 30px;

/*        background-position: left -48px;*/
    }

    footer ul li.instagram a{
        background: url('../images/Instagram_100.png') no-repeat;
        background-size: 30px 30px;

/*        background-position: left -48px;*/
    }


    footer ul li.youtube a{
        background: url('../images/youtube.png') no-repeat; 
        background-size: 30px 30px;

/*        background-position: left -48px;*/
    }


    .address{
        margin-top: 0;
    }

}


@media ( min-width:768px ) {
    .wrap-btn h3{
        font-size: 20px;
    }

    a.annulla{
        padding-top:30px;
    }

}

@media ( min-width: 992px ) {
    a.annulla{
        padding-top:0px;
    }

    .wrap-btn h3{
        font-size: 22px;
    }

    h1{
        font-size: 34px;
    }
/*
    .footer {
        position: fixed;
        bottom: 0;
        width: 100%;
    }
*/
}

@media ( min-width: 1200px ) {
    a.annulla{
        padding-top:0px;
    }
    .wrap-btn h3{
        font-size: 24px;
    }

    h1{
        font-size: 34px;
    }
/*
    .footer {
        position: fixed;
        bottom: 0;
        width: 100%;
    }
*/
}

/*------------TABELLA RESPONSIVE---------*/

.table-full{
    width: 100%;
}
.cursor-pointer {
    cursor: pointer;
}


@media only screen and (max-width: 800px) {

    /* Force table to not be like tables anymore */
    #no-more-tables table, 
    #no-more-tables thead, 
    #no-more-tables tbody, 
    #no-more-tables th, 
    #no-more-tables td, 
    #no-more-tables tr { 
        display: block; 
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    #no-more-tables thead tr { 
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    #no-more-tables tr { border: 1px solid #ccc; }

    #no-more-tables td { 
        /* Behave  like a "row" */
        border: none;
        /*border-bottom: 1px solid #eee;*/ 
        position: relative;
        padding-left: 50%; 
        white-space: normal;
        text-align:left;
    }

    #no-more-tables td:before { 
        /* Now like a table header */
        position: absolute;
        /* Top/left values mimic padding */
        top: 8px;
        left: 6px;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        text-align:left;
        font-weight: bold;
    }

    /*
    Label the data
    */
    #no-more-tables td:before { content: attr(data-title); }
}


[class="error"]{
    color: red;
    font-size: 70%;
}

.tooltip-inner {
    max-width: 350px;
    min-width: 100px;


}
.hint{
    font-size: 11px;
    line-height: 12px;
    text-align: right;
}

.bottoneFiltro{
    color:white;
}

.label-tipologiaTicket{
    background-color:#f5f5f5;
    border: 1px solid #999999;
    color:#999999;
}

#ElencoOrdini{
    margin-bottom:22px;
}

.table thead{
    background-color: #f5f5f5;
}
.table thead tr th{
    text-align: center;
    border-bottom: 2px solid #888888;
    color:#008e70;
}

.table-striped > tbody > tr:nth-of-type(2n+1) {
    background-color: #fbfbfb;
}

#hint_tabella{
    display: none;
    margin-top:-20px;
}