﻿#wrapper {
    background-color: none;
    width: 80%;
    text-align: center;
    margin: 0 auto;
    overflow: hidden;
    margin-bottom: 20px;
}

#wrapperBd {
    background-color: none;
    width: 100%;
    text-align: center;
    margin: 0 auto;
    overflow: hidden;
}

body {
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
    background: url('../images/ffon.jpg') repeat-x;
}

#logoPeri {
    width: 100%;
}

/* Header completo con imagen y menu*/
#header {
    font-family: Arial, Helvetica, sans-serif;
    margin: 0 auto;
    width: 100%;
}

    #header ul {
        margin: 0 auto;
        width: 99%;
        padding-left: 0px;
    }

ul, ol {
    list-style: none;
}


/*Porcentaje que será utilizado por cada uno de los menus*/
.nav > li {
    float: left;
    width: 16.66%; /*100 dividido por la cantidad de registros del menu*/
}

.nav li a {
    background: rgba(5,30,158,1);
    font-weight: normal;
    width: 100%;
    color: #fff;
    text-decoration: none;
    padding: 1px;
    display: block;
    font-size: 15px;
    font-weight: bold;
    font-family: Century Gothic, Verdana, Geneva, sans-serif;
    text-transform: uppercase;
}

    .nav li a:hover {
        background: -webkit-linear-gradient(#5882FA, #0101DF);
        background: -o-linear-gradient(#5882FA, #0101DF);
        background: -moz-linear-gradient(#5882FA, #0101DF);
        background: linear-gradient(#5882FA, #0101DF);
        color: yellow;
    }

.nav li ul {
    display: none;
    position: absolute;
    min-width: 13%;
    max-width: 13%;
}

    .nav li ul li a {
        font-size: 11px;
    }

.nav li:hover > ul {
    display: block;
}

.nav li ul li {
    position: relative;
}

    .nav li ul li ul {
        right: -100px;
        top: 0px;
    }

article {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,d6d6d6+100 */
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #d6d6d6 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffffff 0%,#d6d6d6 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffffff 0%,#d6d6d6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d6d6d6',GradientType=0 ); /* IE6-9 */
    position: relative;
    border-bottom: solid 2px #DAA520;
}

    article div label {
        font-size: 12px;
        color: #696969;
    }

#dvImg {
    padding-top: 15px;
    padding-right: 0px;
    padding-left: 15px;
    z-index: 0;
    position: relative;
    float: left;
}


.navv > li {
    float: left;
    width: 16.66%; /*100 dividido por la cantidad de registros del menu*/
}

.navv li a {
    background: rgba(49, 58, 75, 1);
    font-weight: normal;
    width: 100%;
    color: gray;
    text-decoration: none;
    padding: 1px;
    display: block;
    font-size: 15px;
    font-weight: bold;
    font-family: Century Gothic, Verdana, Geneva, sans-serif;
    text-transform: uppercase;
}

/*.navv li a:hover {
        background: -webkit-linear-gradient(rgba(49, 58, 75, 1), rgba(49, 58, 75, 1));
        background: -o-linear-gradient(rgba(49, 58, 75, 1),rgba(49, 58, 75, 1));
        background: -moz-linear-gradient(rgba(49, 58, 75, 1), rgba(49, 58, 75, 1));
        background: linear-gradient(rgba(49, 58, 75, 1), rgba(49, 58, 75, 1));
        color:gray;
}*/

.navv li ul {
    display: none;
    position: absolute;
    min-width: 15.8%;
    max-width: 15.8%;
}

    .navv li ul li a {
        font-size: 11px;
    }

.navv li:hover > ul {
    display: block;
}

.navv li ul li {
    position: relative;
}

    .navv li ul li ul {
        right: -100px;
        top: 0px;
    }



table {
    margin: 0;
    padding: 0;
    border: 0;
    border-collapse: collapse;
}

body {
    font-size: 10pt;
    font-family: Tahoma, sans-serif;
    color: #888;
    height: 100%;
    background: url('../images/ffon.jpg') repeat-x;
}

h1 {
    font-family: Century Gothic, Verdana, Geneva, sans-serif;
    font-weight: normal;
    color: #007057;
    font-size: 1.6em;
    letter-spacing: 0.15em;
}

    h1 sup {
        font-family: Century Gothic, Verdana, Geneva, sans-serif;
        color: #D88100;
        font-size: 1.0em;
        font-weight: bold;
    }

#tableHeader {
    background: #E9E9E9; /*#D88100*/
}

#divHeaderOverBottom {
    background: rgba(0, 64, 127, 1);
    width: 100%;
    height: 3px;
    overflow: hidden;
    margin-bottom: 0px;
}

#tableBody {
    text-align: left;
    width: 270px;
    /*margin-left: 100px;
    margin-right: auto;*/
    margin-top: 10px;
    margin-bottom: 10px;
    margin: auto;
}


    #tableBody td {
        text-align: left;
    }

.td-field {
    width: 60px;
}

.middle {
    width: 10px !important;
}

.txt {
    width: 170px;
    font-size: 14px !important;
}

.btn-action {
    padding-right: 0px !important;
    margin-right: 0px !important;
    height: 20px;
    width: 100px;
    margin: 5px;
    color: rgb(102, 102,102);
    background-color: rgb(225,225,225);
    border: 1px solid rgb(180,180,180);
    font-size: 10px;
    font-weight: bold;
    font-family: Arial, Sans-Serif;
    text-align: center;
    cursor: pointer;
    border-radius: 7px 7px 7px 7px;
    -moz-border-radius: 7px 7px 7px 7px;
    -webkit-border-radius: 7px 7px 7px 7px;
}

    .btn-action:hover {
        border: 1px solid rgba(110,158,230,1);
    }

#divLogin {
    -webkit-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.75);
    box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.75);
}

#txtSaveEmail {
    width: 240px;
}

.radius {
    border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    height: 20px;
    border: 1px solid #696969;
}

input.txt:-ms-input-placeholder {
    text-align: left;
    color: #A9A9A9;
}




.etiquetaError {
    font-size: 11px;
    color: red;
    vertical-align: middle;
    text-align: center;
    line-height: 150%;
}


@media screen and (max-width:990px) {

  ,


    .etiquetaError {
        font-size: 25px  !important;
        color: red;
        vertical-align: middle;
        text-align: center !important;
        line-height: 150%;
    }

    #logoPeri2 {
        /*position: absolute;*/
        /*z-index: 1;*/
        /*width: 400px;
        height: 200px;*/
        display: block;
        /*margin-top: 5px;*/
        /*margin-left: 10px;*/
        /*width :110px;*/
    }

    #logoPeri2 {
        padding-top: 10px;
        padding-right: 0px;
        padding-left: 10%;
        z-index: 0;
        position: relative;
        float: left;
    }

    #logoPeri3 {
        /*position: absolute;*/
        /*z-index: 1;*/
        /*width: 160px;*/
        /*height: 60px;*/
        display: block;
        /*margin-top: 5px;*/
        /*margin-left: 10px;*/
        /*width :110px;*/
    }

    #logoPeri3 {
        padding-top: 10px;
        padding-right: 0px;
        padding-left: 2%;
        z-index: 0;
        position: relative;
        float: left;
    }



    #article1 {
        display: none;
    }

    .grid {
        width: 100% !important;
    }

    .grid {
        font-family: Tahoma;
        font-size: 25px;
        border: solid 1px #191970; /*#B3C59C;*/
        border-collapse: collapse;
        color: #333333;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        display: none;
    }

    h2 {
        font-size: 25px !important;
    }

    .grid th {
        font-size: 25px;
    }


    #divLogin {
        width: 60% !important;
    }

    h1 {
        font-size: 3em;
    }

    .radius {
        height: 35px;
    }

    .txt {
        width: 220px;
        font-size: 25px !important;
    }

    .btn-action {
        height: 35px !important;
        width: 130px !important;
        margin: 5px;
        font-size: 18px !important;
    }

    .span_movil {
        font-size: 20px !important;
    }
}

@media screen and (min-width: 990px) {
    #article_movil {
        display: none;
    }
}
