/*
    @media screen and (max-width: 700px) and (min-width: 520px) {
        body {
            background: red;
        }
    }
*/

@import url(https://fonts.googleapis.com/css?family=Dosis);
@import url(https://fonts.googleapis.com/css?family=Monda);
@import url('ac_gris.css');

.alerta {
    margin: 0 auto;
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.cssLabel {
    font: normal 11px/24px Arial, Helvetica, sans-serif;
    font-size: 11pt;
    font-family: 'Monda', Arial, serif;
    font-variant: normal;
    font-weight: bold;
    color: #666666;
    text-decoration-style: none;
    margin-bottom: 3px !important;
}

.cssLabel1 {
    font: normal 11px/24px Arial, Helvetica, sans-serif;
    font-size: 11pt;
    font-family: 'Monda', Arial, serif;
    font-variant: normal;
    font-weight:lighter;
    color: #4F9EDA;
    text-decoration-style: none;
    margin-bottom: 3px !important;
}


.cssLabel2 {
    font: normal 10px/24px Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-family: 'Monda', Arial, serif;
    font-variant: normal;
    font-weight: bold;
    color: #c73030;
    line-height: 80%;
    text-decoration-style: none;
    margin-bottom: 3px !important;
}

.cssLabel3 {
    font: normal 12px/22px Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-family: 'Monda', Arial, serif;    
    font-weight: normal;
    color: #35353B;        
    margin-bottom: 3px !important;
    text-align: justify;
}


.cssDropDownList {
    font: normal 10px/22px Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-family: 'Monda', Arial, serif;
    font-variant: normal;
    font-weight:lighter;
    color: #4F9EDA;
    text-decoration-style: none;
}

.cssRadioButtons {
    font: normal 10px/22px Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-family: 'Monda', Arial, serif;
    font-variant: normal;
    font-weight:lighter;    
    color: #4F9EDA;
    text-decoration-style: none;
    border:0px !important;
}

.cssCheckBox {
    font: normal 10px/22px Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-family: 'Monda', Arial, serif;
    font-variant: normal;
    font-weight:lighter;
    color: #4F9EDA;        
    text-align:left;
    text-decoration-style: none;
}

.cssTextBox {
    font: normal 10px/22px Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-family: 'Monda', Arial, serif;
    font-variant: normal;
    font-weight: lighter;
    color: #4F9EDA;
    text-decoration-style: none;
}

.cssTextBoxDisabled {
    font: normal 10px/22px Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-family: 'Monda', Arial, serif;
    font-variant: normal;
    font-weight: lighter;
    color: #EDEDED;
    text-decoration-style: none;
}

.cssDetalle {
    font: normal 10px/22px Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-family: "Dosis", arial, helvetica, sans-serif;
    font-variant: normal;
    font-weight: bold;
    color: #4F9EDA;
    text-decoration-style: none;
}

.textbox-on {
    font-size: 8pt;
    font-family: tahoma, arial, helvetica, sans-serif;
    font-variant: normal;
    font-weight: normal;
    border: 1px solid red;
    color: #585858;
}

.textbox-off {
    font-size: 8pt;
    font-family: tahoma, arial, helvetica, sans-serif;
    font-variant: normal;
    font-weight: normal;
    border: 1px solid #666666;
}

.cssLabelSnap {
    Color: #525252;
    Font-Size: 7pt;
    font-family: Arial;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc !important;
    margin: 1em 0;
    padding: 0;
}


.divform {
    display: table;
    border-collapse: collapse;
}

    .divform .r {
        display: table-row;
    }

    .divform .c {
        display: table-cell;
        padding: 5px 0px;
        vertical-align: top;
    }


input[type=text], input[type=password], select, label {
}

input[type=text], input[type=password], select, textarea, label, input[type=submit] {
    margin: 0 5px;
}

input[type=text], input[type=password], select, textarea, input[type=checkbox] {
    font: normal 12px/25px Arial, Helvetica, sans-serif;
    color: #4F9EDA;
}


input[type=text], input[type=password], select, textarea {
    font: normal 11px/24px Arial, Helvetica, sans-serif !important;
    font-size: 11pt !important;
    font-family: 'Monda', Arial, serif !important;
    font-variant: normal !important;
    font-weight: bold;    
    text-decoration-style: none !important;
    padding-left: 5px !important;
    width: 96%;
    height: 35px !important;
    border: 1px solid #CCC;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) !important;
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) !important;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075) !important;
    border-radius: 4px;
}

table tr {
    border: 0px;
}

input[type=radio], input[type=checkbox] {
    margin: 0 0 0 2%;
    padding: 0;
    vertical-align: top;
}

input[type=text], input[type=password], select, textarea, .divform, .divform .r, .divform .c, form {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

/* iPads (portrait and landscape) */
@media only screen and (min-width:480px) and (max-width:1024px) {
    .divform, .divform .r, .divform .c {
        display: block;
    }

        .divform .r {
            clear: both;
        }

        .divform .c {
            width: 50%;
            float: left;
            padding-left: 10px;
            padding-right: 10px;
        }

            .divform .c:nth-child(2n+3) {
                clear: left;
            }

    label, .fheading, input[type=submit] {
        font: normal 16px/30px Arial, Helvetica, sans-serif;
        margin-left: 0;
        text-indent: 0;
    }

    input[type=submit] {
        font: normal 16px/30px Arial, Helvetica, sans-serif;
        padding-left: 20px;
        padding-right: 20px;
    }

    textarea, input[type=text], input[type=password], select {
        font: normal 16px/30px Arial, Helvetica, sans-serif;
        width: 100%;
        margin: 0;
    }

    input[type=radio], input[type=checkbox] {
        font: normal 16px/30px Arial, Helvetica, sans-serif;
        margin: 0 5px;
        padding: 0;
        vertical-align: top;
    }

    .ver2 .c {
        width: 35%;
    }

        .ver2 .c:nth-child(2n+2) {
            width: 65%;
        }

    .c.frwd {
        width: 100%;
    }

        .c.frwd textarea, .c.frwd input[type=text], input[type=password], .c.frwd select {
            width: 100%;
        }

    .ver2 .frwd.c:nth-child(2n+2) {
        width: 100%;
    }
}

/* Smartphones (portrait and landscape) */
@media only screen and (max-width:480px) {
    h1 {
        margin: 0 0 20px 0;
    }

    label, .fheading, input[type=submit] {
        font: normal 16px/30px Arial, Helvetica, sans-serif;
        margin: 0;
        text-indent: 0;
    }

    .divform, .divform .r, .divform .c {
        display: block;
    }

        .divform .r {
            clear: both;
        }

    input[type=text], input[type=password], select, textarea {
        font: normal 16px/30px Arial, Helvetica, sans-serif;
        width: 100%;
        margin: 0;
    }

    input[type=radio], input[type=checkbox] {
        font: normal 16px/30px Arial, Helvetica, sans-serif;
        margin: 0 2%;
    }

    input[type=submit] {
        width: 100%;
        margin-top: 20px;
    }
}
/* Only Safari */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    select {
        text-indent: 5px;
        line-height: 24px;
    }
}

.AOLPanel {
    position: absolute; /*nos posicionamos en el centro del navegador*/
    width: 700px; /*indicamos que el margen izquierdo, es la mitad de la anchura*/
    margin-left: -200px; /*determinamos una altura*/
    border: 1px solid #808080;
    padding: 5px;
}

.panel {
    margin-bottom: 20px;
    border: 0px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
    border-color: #ddd;
    color: #4F9EDA;
    font: normal 12px/25px Arial, Helvetica, sans-serif;
}

.panel-heading {
    font: normal 12px/25px Arial, Helvetica, sans-serif;
    font-size: 10pt;
    font-family: arial, helvetica, sans-serif;
    font-variant: normal;
    font-weight: bold;
    color: #666666;
    text-decoration-style: none;
    padding: 10px 15px;
    border-bottom: 1px solid #ddd;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background-color: #f5f5f5;
}

table {
    border-spacing: 0 !important;
    border-collapse: collapse !important;    
    border-color: transparent !important;
}

td,
th {
    padding: 0;
}

.panel table thead tr th {
    color: #666666;
    padding: 0px;
}

.panel table tbody tr td {
    /*border: 1px solid #ddd;
    padding: 3px;*/
}

.panel input[type=checkbox] {
    margin: 5px;
    cursor: pointer;
}

#nprogress {
    pointer-events: none;
    -webkit-pointer-events: none;
}

    #nprogress .bar {
        background: #29d;
        position: fixed;
        z-index: 100;
        top: 0;
        left: 0;
        width: 100%;
        height: 2px;
    }

    #nprogress .peg {
        display: block;
        position: absolute;
        right: 0;
        width: 100px;
        height: 100%;
        box-shadow: 0 0 10px #29d,0 0 5px #29d;
        opacity: 1;
        -webkit-transform: rotate(3deg) translate(0px,-4px);
        -moz-transform: rotate(3deg) translate(0px,-4px);
        -ms-transform: rotate(3deg) translate(0px,-4px);
        -o-transform: rotate(3deg) translate(0px,-4px);
        transform: rotate(3deg) translate(0px,-4px);
    }

    #nprogress .spinner {
        display: block;
        position: fixed;
        z-index: 100;
        top: 15px;
        right: 15px;
    }

    #nprogress .spinner-icon {
        width: 14px;
        height: 14px;
        border: solid 2px transparent;
        border-top-color: #29d;
        border-left-color: #29d;
        border-radius: 10px;
        -webkit-animation: nprogress-spinner 400ms linear infinite;
        -moz-animation: nprogress-spinner 400ms linear infinite;
        -ms-animation: nprogress-spinner 400ms linear infinite;
        -o-animation: nprogress-spinner 400ms linear infinite;
        animation: nprogress-spinner 400ms linear infinite;
    }

@-webkit-keyframes nprogress-spinner {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes nprogress-spinner {
    0% {
        -moz-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -moz-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes nprogress-spinner {
    0% {
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-ms-keyframes nprogress-spinner {
    0% {
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -ms-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes nprogress-spinner {
    0% {
        transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@media only screen and (min-width:320px) and (max-width:767px) {
    input[type=text], label, select, textarea {
        width: 85% !important;
    }
}
/*Confirmacion*/
.panel-default > .panel-leftheading
{
    color: #333;
    background-color: #f5f5f5;
    border-color: #ddd;
}

.panel-leftheading
{
    width: 42px;
    padding: 10px 15px;
    border-right: 1px solid transparent;
    border-bottom: 1px solid transparent;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    float: left;
    height: 520px;
    position: absolute;
}

.panel-lefttitle
{
    margin-top: 0;
    margin-bottom: 0;
    margin-left: 15px;
    font-size: 16px;
    color: inherit;
    -webkit-transform: rotate(90deg);
    -webkit-transform-origin: left top;
    -moz-transform: rotate(90deg);
    -moz-transform-origin: left top;
    -ms-transform: rotate(90deg);
    -ms-transform-origin: left top;
    -o-transform: rotate(90deg);
    -o-transform-origin: left top;
    transform: rotate(90deg);
    transform-origin: left top;
    position: absolute;
    white-space: nowrap;
}

.panel-rightbody
{
    float: left;
    margin-left: 45px;
    padding: 15px 15px 0px 15px;
    color:#373434;
    border-right: 1px solid;
    border-top: 1px solid;
    border-bottom: 1px solid;
    height: 520px;
    border-color:#ccc;
}
.DatosCred {
    border: 1px solid;
    border-radius: 10px;
    border-color: #CCC;
    margin-right: 0px !important;
    align-content: center;
}