.back {
	display: none;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background-color: black;
	opacity: 0.3;
	position: fixed;
	z-index: 100;
}

.modal-box {
	position: relative;
	width: 100%;
	height: 100%;
	background-color: black;
	opacity: 1;
}

.modal-box .message-box {
	position: absolute;
	top: 50%;
	left: 40%;
	right: 25%;
	width: 30%; 
	padding: 10px; 
	text-align: left;
	border-radius: 3px; 
	background: #fffec3; 
	box-shadow: 0px 1px 7px rgba(0, 0, 0, 1);
} 

.modal-box2 {
	/*display: none;*/
	position: fixed;
	top: 35%;
	left: 37.5%;
	width: 25%; 
	min-width: 300px;
	padding: 10px; 
	text-align: left;
	border-radius: 3px; 
	background: #fff8d1; 
	box-shadow: 0px 1px 7px rgba(0, 0, 0, 1);
	z-index: 200;
}

.ventana-modal-correo {
    /*display: none;*/
    position: fixed;
    top: 15%;
    left: 27.5%;
    width: 45%;
    min-width: 650px;
    text-align: left;
    border-radius: 3px;
    background: #f4f4f7;
    box-shadow: 0px 1px 7px rgba(0, 0, 0, 1);
    z-index: 200;
}

.ventana-modal-correo .box-content-left {
    width: 10%;
    text-align: left;
    line-height: 40px;
    float: left;
    display: inline-block;
    margin-left: 5px;
}

.ventana-modal-correo .box-content-right {
    width: 88%;
    text-align: left;
    vertical-align: middle;
    float: right;
    display: inline-block;
}

.ventana-modal-correo .cuerpo {

}

.center-box {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 30%;
    width: 50%;
    margin: -15% 0 0 -25%;
}

.boton-confirmar {
	color: #424242;
	font-size: 12px;
	text-decoration: none;
	padding: 3px;
	margin-left: 10px;
	box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.2);
}

.icon-trash:before {
	position: relative;
	color: #3c3c3c;
	font: normal normal normal 16px/1 FontAwesome;
	text-rendering: auto;
	line-height: 25px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	content: "\f1f8";
}

.alerta {
	width: 500px;
	color: #424242;
	padding: 5px 0 5px 0;
	background-color: #fffec3;
	border: 1px solid #a5afbf;
	border-radius: 7px;
	text-shadow: 1px 1px 3px rgba(200, 73, 23, 0.5);
	box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.2);
	line-height: 30px;
	font-size: 13px;
	font-family: sans-serif, Arial, Helvetica
}

.alerta:before {
	position: relative;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
	font: normal normal normal 14px/1 FontAwesome;
	font-size: 25px; 
	text-rendering: auto;
	line-height: 30px;
	color: #ff8a00;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	content: "\f071";
}

.box-info {
	width: 500px; 
	padding: 10px; 
	margin: 10px; 
	text-align: left;
	border-radius: 3px; 
	background: #fffec3; 
	box-shadow: 0px 1px 7px rgba(0, 0, 0, 0.4);
}


.label-info {
	font-size: 13px;
	color: #424242;
	font-weight: bold;
	font-family: sans-serif;
}

.box-info:before {
	position: relative;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: 25px; 
	text-rendering: auto;
	line-height: 30px;
	color: #ff4a48;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	content: "\f071";
}

.box-content-left {
	width: 11%;
	text-align: left; 
	line-height: 40px; 
	float: left;
	display: inline-block; 
	margin-left: 5px;
}

.font-exclamation-icon {
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
    font: normal normal normal 40px/1 FontAwesome;
    font-size: 40px;
    text-rendering: auto;
    color: #ff4a48;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.font-info-icon
{
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
	font: normal normal normal 48px/1 FontAwesome;
	font-size: 48px;
	text-rendering: auto;
	color: #3ebdfd;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}


.font-cubes-icon {
    /*text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);*/
    font: normal normal normal 24px/1 FontAwesome;
    font-size: 24px;
    text-rendering: auto;
    color: #333333;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.box-content-right {
	width: 86%;
	text-align: left; 
	vertical-align: middle;
	float: right;
	display: inline-block; 
}

.panel-correo {
    display: block;
    padding: 10px 10px;
    width: 95.5%;
    max-height: 500px;
    margin: 1% auto;
    text-align: left;
    background-color: white;
    border: 1px solid #e0e4e9;
}

.panel-informacion {
    margin: 10px 10px;
    border: none;
    margin-right: 10px;
}

.botonera {
    text-align: right;
    margin-right: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.botonera .boton-aceptar {
    font-size: 13px;
    text-decoration: none;
    padding: 7px 18px;
    margin-left: 10px;
    color: white;
    background: #1866e7;
    border: none;
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2);
}

.botonera .boton-aceptar:hover {
    background: #005ad9;
}

.botonera .boton-aceptar:disabled {
    background: rgba(24, 102, 231, 0.25);
    color: rgba(255, 255, 255, 0.3);
}

.botonera .boton-cerrar {
    font-size: 13px;
    text-decoration: none;
    padding: 7px 18px;
    color: #0c0c0d;
    background: #e1e1e2;
    border: none;
    margin-left: 10px;
    box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.2);
}

.botonera .boton-cerrar:hover {
    background: #d4d4d4;
}

.form-size-400 {
    Font: 11px Verdana;
    width: 400px;
    background: white;
    background: #f2f2f2;
    padding: 5px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    border: solid 1px #cccccc;
}

    .form-size-400 .titulo-forma {
        margin: 5px;
        height: 30px;
        line-height: 30px;
        text-align: left;
        color: #323232;
        border-bottom: solid 1px #cccccc;
    }

.caja-doble {
    width: 100%;
    height: 22px;
    margin: 5px;
    font-size: 11px;
    line-height: 22px;
    text-align: left;
    color: #323232;
    background: #f2f2f2;
}

    .caja-doble .titulo-dato {
        display: inline-block;
        /*width: calc(40% - 15px);*/
        width: 145px;
        height: 22px;
        margin: 0px 0px 0px 5px;
        text-align: left;
    }

    .caja-doble .dato {
        display: inline-block;
        /*width: calc(60% - 20px);*/
        width: 220px;
        height: 22px;
        margin: 0px 0px 0px 5px;
        padding: 0px 5px;
        text-align: left;
        background: white;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    }
    

.labelbtn {
    background-color: #2196F3;
    color: white;
    padding: 8px;
    font-size: 17px;
    font-family: Arial;
}

    .labelbtn:hover,
    .labelbtn:focus {
        background-color: gray;
        color: black;
        text-decoration: none;
        cursor: pointer;
    }

.lblsuccess {
    background-color: #4CAF50;
    color: white;
    padding: 8px;
    font-size: 17px;
    font-family: Arial;
}

    .lblsuccess:hover,
    .lblsuccess:focus {
        background-color: gray;
        color: black;
        text-decoration: none;
        cursor: pointer;
    }

.inputarchivo[type=text] {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    box-sizing: border-box;
}
.label-default {
    color: #707070;
    padding: 0 5px;
    Font-Size: 13px;
    Width: 75px;
    line-height: 25px;
    font-family: verdana, arial, snas-serif;
}

.label-alert {
    color: #ff6262;
    font-size: 12px;
    padding: 0 5px;
    Font-Size: 11px;
    Width: 100%;
    line-height: 15px;
    font-family: verdana, arial, snas-serif;
}

.label-border {
    color: #707070;
    font-size: 14px;
    padding: 0 5px;
    font-Size: 13px;
    line-height: 30px;
    font-family: verdana, arial, snas-serif;
    border: solid 1px #c1c1c1;
}

.textbox-default {
    Height: 18px;
    line-height: 20px;
    font-family: verdana, arial, snas-serif;
    font-size: 14px;
    color: #707070;
    padding: 3px 5px;
    background: #f0f0f0;
    border: solid 1px #c1c1c1;
    /*color: #303030;
            font-size: 13px;
            padding: 5px 5px;
            Height: 18px;
            line-height: 20px;*/
}

    .textbox-default:focus {
        border-color: #808080;
        background-color: #FFF;
    }

.box-control-left {
    width: 190px;
    text-align: left;
    /*line-height: 40px;*/
    display: inline-block;
    margin: 0 5px;
}

.titulo-naranja-grande {
    font: bold 1.5em 'Trebuchet MS',Arial,Helvetica;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
    font-size: 18px;
    font-weight: 500;
    color: #e49670;
}

.titulo-grande {
    font: bold 1.5em 'Trebuchet MS',Arial,Helvetica;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
    font-size: 22px;
    font-weight: 500;
    color: #29434e;
}

.titulo-mediano {
    color: #FFF;
    font: bold 1.2em 'Trebuchet MS', Arial, Helvetica;
    height: 45px;
    line-height: 45px;
    padding-left: 5px;
    color: #FFF;
    background: #29434e;
}

.list-pad-nivel-1 {
    line-height: 30px;
    color: #707070;
    font-size: 12px;
    padding-left: 5px;
    border-bottom: 1px solid #d6d6d6;
    font-family: verdana, arial, snas-serif;
}

.list-pad-nivel-2 {
    line-height: 25px;
    color: #707070;
    font-size: 12px;
    padding-left: 25px;
    font-family: verdana, arial, snas-serif;
}

.panel-forma {
    overflow: hidden;
    padding: 10px 10px;
    height: 100%;
    /*max-height: 390px;*/
    margin: 10px;
    background-color: #f8f8f8;
    border: 1px solid #a5afbf;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
}

.panel-grid {
    padding: 0;
    width: 400px;
    min-height: 140px;
    max-height: 400px;
    background-color: #f8f8f8;
    border: 2px solid #a5afbf;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
}

.control-button {
    margin: 5px;
    height: 45px;
    width: 150px;
    cursor: pointer;
    border: none;
    color: rgba(7, 17, 17, 0.8);
    background: #ffc400;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    display: inline-block;
    font: bold 15px 'Trebuchet MS', Arial, Helvetica;
    text-align: center;
    text-decoration: none;
    border-radius: 3px;
}

    .control-button:hover {
        color: rgba(7, 17, 17, 0.4);
        border-color: #eacfa4;
        text-shadow: 0px 1px 1px rgba(200, 73, 23, 0.7);
        box-shadow: 0px 0px 7px 0px rgba(255, 72, 0, 0.2);
        background-image: -moz-linear-gradient( 90deg, rgb(237,192,115) 0%, rgb(249,233,188) 100%);
        background-image: -webkit-linear-gradient( 90deg, rgb(237,192,115) 0%, rgb(249,233,188) 100%);
        background-image: -ms-linear-gradient( 90deg, rgb(237,192,115) 0%, rgb(249,233,188) 100%);
    }

/*.icon-excel:before {
            position: relative;
            color: #FFF;
            font: normal normal normal 14px/1 FontAwesome;
            font-size: 18px; 
            text-rendering: auto;
            line-height: 25px;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            content: "\f1c3";
        }*/

.icon-excel:before {
    position: relative;
    color: rgba(64, 64, 64, 0.7);
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 18px;
    text-rendering: auto;
    line-height: 25px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f1c3";
}

.icon-calc:before {
    position: relative;
    color: rgba(64, 64, 64, 0.7);
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 18px;
    text-rendering: auto;
    line-height: 25px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f1ec";
}

.button, .button span {
    border-radius: 0.3em 0.3em 0.3em 0.3em;
}

    .button span {
        background-size: 3px 3px;
        border-top: 1px solid rgba(255, 255, 255, 0.5);
        display: block;
        padding: 0.5em 2.5em;
    }

    .button:hover {
        box-shadow: 0 0 0.1em rgba(0, 0, 0, 0.4);
    }

    .button:active {
        position: relative;
        top: 1px;
    }

.control-textbox {
    font-family: verdana, arial, snas-serif;
    font-size: 13px;
    cursor: pointer;
    color: #404040;
    padding: 3px 5px;
    background: #f0f0f0;
    border: solid 1px #c1c1c1;
    width: 93%;
}

    .control-textbox:focus {
        border-color: #808080;
        background-color: #FFF;
    }

.auto-style1 {
    left: 1px;
    top: 0px;
}

#menu * {
    list-style: none;
    text-align: left;
}

#menu li {
    line-height: 180%;
}

    #menu li a {
        color: #222;
        text-decoration: none;
    }

        #menu li a:before {
            content: "\025b8";
            color: #ddd;
            margin-right: 4px;
        }

#menu input[name="list"] {
    position: absolute;
    left: -1000em;
}

#menu label:before {
    content: "\025b8";
    margin-right: 4px;
}

#menu input:checked ~ label:before {
    content: "\025be";
}

#menu .interior {
    display: none;
}

#menu input:checked ~ ul {
    display: block;
}

.checkbox {
    display: block;
    position: relative;
    padding-left: 25px;
    cursor: pointer;
    font-family: verdana, arial, snas-serif;
    font-size: 13px;
    color: #707070;
    line-height: 25px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .checkbox input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
    }

.check {
    position: absolute;
    top: 3px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #eee;
    border: 1px solid #ccc;
}

.checkbox:hover input ~ .check {
    border: 2px solid #2489C5;
}

.checkbox input:checked ~ .check {
    background-color: #2489C5;
    border: none;
}

.check:after {
    content: "";
    position: absolute;
    display: none;
}

.checkbox input:checked ~ .check:after {
    display: block;
}

.checkbox .check:after {
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.drop-down {
    width: 175px;
    height: 30px;
    background-color: red;
    border: 2px solid #7d6754;
    border-radius: 5px;
    padding: 3px;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 0.01px; /*In Firefox*/
    text-overflow: ''; /*In Firefox*/
}

.drop-down-list {
    width: 175px;
    padding: 5px;
    margin: 5px;
    border-radius: 5px;
    border: solid 1px #c1c1c1;
    color: #404040;
    background: #FFF url("images/down_arrow_1.png") no-repeat right top;
    background-size: 30px;
    -moz-appearance: none;
    -webkit-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: one;
    cursor: pointer;
}

    .drop-down-list:hover {
        background: #F0F0F0 url("images/down_arrow_1.png") no-repeat right top;
    }

.picked-date {
    width: 175px;
    padding: 5px;
    margin: 5px;
    border-radius: 5px;
    border: solid 1px #c1c1c1;
    color: #404040;
    background: #FFF url("images/down_arrow_1.png") no-repeat right top;
    background-size: 30px;
    cursor: pointer;
}

    .picked-date:hover {
        background: #F0F0F0 url("images/down_arrow_1.png") no-repeat right top;
    }

.alerta {
    width: 675px;
    color: #cf7000;
    padding: 5px 0 5px 0;
    background-color: white;
    border: 1px solid #a5afbf;
    border-radius: 7px;
    text-shadow: 1px 1px 3px rgba(200, 73, 23, 0.5);
    box-shadow: 3px 3px 8px rgba(0, 0, 0, 0.2);
    line-height: 30px;
    font-size: 13px;
    font-family: sans-serif, Arial, Helvetica
}

    .alerta:before {
        position: relative;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.25);
        font: normal normal normal 14px/1 FontAwesome;
        font-size: 25px;
        text-rendering: auto;
        line-height: 30px;
        color: #eb6200;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "\f071";
    }

.box-info {
    width: 500px;
    padding: 10px;
    margin: 10px;
    text-align: left;
    border-radius: 3px;
    background: #fffec3;
    box-shadow: 0px 1px 7px rgba(0, 0, 0, 0.4);
}

.label-info {
    font-size: 13px;
    color: #424242;
    font-weight: bold;
    font-family: sans-serif;
}

.box-info:before {
    position: relative;
    /*text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.8);*/
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 25px;
    text-rendering: auto;
    line-height: 30px;
    color: #ff8a00;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f071";
}