﻿div[type='Notificacion'].modal {
    height: auto !important;
    width: auto !important;
    right: 0 !important;
    left: auto !important;
    bottom: auto !important;
    top: 35px !important;
    position: absolute;
    -ms-background-clip: padding-box;
    background-clip: padding-box;
    padding-top: 15px;
    padding-left: 10px;
    padding-right: 10px;
}

div[type='Notificacion'].modal div.modal-dialog {
    padding: 0 !important;
    height: 650px;
    padding-left: 10px;
}

div[type='Notificacion'].modal div.modal-dialog div.modal-content {
    border: none;
    -webkit-box-shadow: 10px 9px 5px -5px rgba(0,0,0,0.15);
    -moz-box-shadow: 10px 9px 5px -5px rgba(0,0,0,0.15);
    -ms-box-shadow: 10px 9px 5px -5px rgba(0,0,0,0.15);
    box-shadow: 10px 9px 5px -5px rgba(0,0,0,0.15);
    /*border-width: 1px;
    border-color: #FEFEFE;*/
}

div[type='Notificacion'].modal div.modal-dialog:before {
    content: ' ';
    height: 0;
    position: absolute;
    width: 0;
    top:  -20px;
    right: 4px;
    border: 10px solid transparent;
    border-bottom-color: #DEE7E7;
}

div[type='Notificacion'].modal div.modal-dialog div.modal-header{
    background-color: #DEE7E7;
    height: 45px;
    padding-top: 10px;
    padding-bottom: 10px;
}

div[type='Notificacion'].modal div.modal-dialog div.modal-body .areaNotificaciones{
    overflow: scroll;
    overflow-x: hidden;
    height: 450px;
    padding-right: 10px;
}


div[type='Notificacion'].modal div.modal-dialog div.modal-body .areaNotificaciones::-webkit-scrollbar-track
{
	/*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 10px;
	background-color: #F5F5F5;*/
    /*display: none;*/
    background-color: #FFFFFF;
}

div[type='Notificacion'].modal div.modal-dialog div.modal-body .areaNotificaciones::-webkit-scrollbar
{
	width: 10px;
    margin-left: 15px;
	background-color: #F5F5F5;
}

div[type='Notificacion'].modal div.modal-dialog div.modal-body .areaNotificaciones::-webkit-scrollbar-thumb {
    -ms-border-radius: 10px;
    border-radius: 10px;
	background-color: #E2E2E3;
}


div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row div:first-child {
        -moz-text-overflow: ellipsis;
        text-overflow: ellipsis;
        white-space: nowrap; 
        overflow: hidden;
    }

#areaNotificaciones div.row {
    padding-top: 10px;
}

#areaNotificaciones {
    margin-bottom: 20px;
}



div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row:nth-child(even), #areaNotificaciones table tr:nth-child(even) {
        background-color: #f6f6f6;
    }

#areaNotificaciones table tr {
    padding-top: 5px;
    padding-bottom: 5px;
}

#areaNotificaciones table tr td {
    font-size: 12px;
}

#areaNotificaciones table tr td p {
    margin-bottom: 5px;
}

#areaNotificaciones table tr td p[data-type="fecha"] {
    font-size: 11px;
}

div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row div:last-child span{
    color: #DEECEB;
}

#areaNotificaciones span.glyphicon {
    color: #DEECEB;
}

div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row div:last-child div.circle,   #areaNotificaciones  table tr td:last-child div.circle{
        height: 5px;
        width: 5px;
        background-color: #FF7722;
        display: inline-block;
        text-align: center;
        border-radius: 50%;
        color: white;
        font-size: 9px;
}


#areaNotificaciones div.row div:last-child {
    text-align: right;
}

.tooltip > .tooltip-inner {
    background-color: #636D74;
}

 .tooltip.top > .tooltip-arrow:before {
     border-color: #636D74;
     background-color: #636D74;
 }

  .tooltip.top > .tooltip-arrow:after {
     border-color: #636D74;
     background-color: #636D74;
 }

div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row div:first-child p {
    color: #B5B6B9;
    }

div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row div:first-child p:last-child {
    font-size: 11px;
    }


div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row div:first-child p b {
    color: #597078;
    }

.areaComandos {
    text-align: center;
}

.areaComandos hr{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3e5978+0,3e5978+22,92a1b2+22,92a1b2+22,92a1b2+75,3e5978+76,3e5978+100 */
    background: #3e5978; /* Old browsers */
    border: 0;
    height: 1px;
}

.areaComandos a {
    color: #2B486A;
    font-size: 15px;
}

.conteoNotificaciones {
    height: 16px;
    width: 16px;
    background-color: #FF7722;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
    color: white;
    position: absolute;
    right: 6px;
    top: 7px;
    font-size: 9px;
}

@keyframes marquee { 0% { text-indent: 430px } 100% { text-indent: -485px } } @-webkit-keyframes marquee { 0% { text-indent: 430px } 100% { text-indent: -485px } } .marquee {
                                                                                                                                                                         -webkit-animation-play-state: paused; animation-play-state: paused;
                                                                                                                                                                         
                                                                                                                                                                    } .marquee:hover {
                                                                                                                                                                         overflow: hidden; white-space: nowrap; animation: marquee 17s linear infinite; -webkit-animation: marquee 17s linear infinite; 
                                                                                                                                                                      } 



@media screen and (max-width: 300px) {
}

@media screen and (max-width: 400px) {
    div[type='Notificacion'].modal {
        top: 50px !important;
    }
    
    div[type='Notificacion'].modal {
        width: 100% !important;
    }

    div[type='Notificacion'].modal div.modal-dialog {
        width: 100% !important;
        padding: 0 !important;
    }

    
    div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row {
        padding-top: 5px;
        padding-bottom: 5px;
    }
}
@media (max-width: 767px) {

    div[type='Notificacion'].modal {
        top: 50px !important;
    }
    

    div[type='Notificacion'].modal {
        width: 100% !important;
    }
    div[type='Notificacion'].modal div.modal-dialog {
        width: 100% !important;
        padding: 0 !important;
        height: 100% !important;
    }

    
    div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row {
        padding-top: 5px;
        padding-bottom: 5px;
    }


}
@media (min-width: 768px) and (max-width: 991px) {
        div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row {
        padding-top: 5px;
        padding-bottom: 5px;
        height: 65px;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
        div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row {
        padding-top: 5px;
        padding-bottom: 5px;
        height: 65px;
    }
}
@media (min-width: 1200px) {
        div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row {
        padding-top: 5px;
        padding-bottom: 5px;
        height: 65px;
    }
}

@media (min-width: 340px) {
        div[type='Notificacion'].modal div.modal-dialog div.modal-body div.row {
        padding-top: 5px;
        padding-bottom: 5px;
        height: 65px;
    }

}