@charset "utf-8";
@import url("https://fonts.googleapis.com/css?family=Open+Sans:regular,italic,bold");

html,body
{
    width:100%;
    height:100%;
    position: absolute;
    /*font-family: 'Arial Narrow', 'Arial';*/
}

/* common
----------------------------------------------------------------------------- */
.w100{ width:100% !important; }
.w90{ width:90% !important; }
.w80{ width:80% !important; }
.w70{ width:70% !important; }
.w60{ width:60% !important; }
.w50{ width:50% !important; }
.w40{ width:40% !important; }
.w33{ width:33% !important; }
.w25{ width:25% !important; }
.w20{ width:20% !important; }
.w10{ width:10% !important; }

.w400px { width:400px !important}
.w300px { width:300px !important}
.w250px { width:250px !important}
.w200px { width:200px !important}
.w155px { width:155px !important}
.w150px { width:150px !important}
.w100px { width:100px !important}
.w80px { width:80px !important}
.w70px { width:70px !important}
.w60px { width:60px !important}
.w50px { width:50px !important}
.w40px { width:40px !important}
.w30px { width:30px !important}

.mw800px {max-width: 800px !important;}
.mw1000px {max-width: 1000px !important;}
.mw1200px {max-width: 1200px !important;}

.h400px { height:400px !important}
.h300px { height:300px !important}
.h250px { height:250px !important}
.h200px { height:200px !important}
.h150px { height:150px !important}
.h100px { height:100px !important}
.h80px { height:80px !important}
.h60px { height:60px !important}
.h50px { height:50px !important}
.h40px { height:40px !important}
.h30px { height:30px !important}


/* padding */
.p-20 { padding: 20px !important; }
.p-10 { padding: 10px !important; }
.p-5 { padding: 5px !important; }
.p-0 { padding: 0px !important; }
.pt-10 { padding-top: 10px !important; }
.pt-15 { padding-top: 15px !important; }
.pt-20 { padding-top: 20px !important; }
.pt-30 { padding-top: 30px !important; }
.pt-40 { padding-top: 40px !important; }
.pt-50 { padding-top: 50px !important; }
.pt-60 { padding-top: 60px !important; }
.pb-10 { padding-bottom: 10px !important; }
.pr-10 { padding-right: 10px !important; }
.pl-10 { padding-left: 10px !important; }
.pl-50 { padding-left: 50px !important; }

/* margin */
.m-0{ margin:0px !important;}
.m-10{ margin:10px !important;}
.mt--20{ margin-top:-20px !important;}
.mt-0{ margin-top:0px !important;}
.mt-10{ margin-top:10px !important;}
.mt-20{ margin-top:20px !important;}
.mt-50{ margin-top:50px !important;}
.mb-10{ margin-bottom:10px !important;}
.mb-50{ margin-bottom:50px !important;}
.mr-10{ margin-right:10px !important;}
.mr-5{ margin-right:5px !important;}
.ml-10{ margin-left:10px !important;}
.ml-50{ margin-left:50px !important;}

.material-icons {vertical-align: middle !important;}

/* text-align */
.va-top { vertical-align: top !important; }
.va-middle { vertical-align: middle !important; }
.ta-right { text-align: right !important;}
.ta-left { text-align: left !important;}
.ta-center { text-align: center !important;}
.uppercase { text-transform: uppercase; }

.br { border-right: 1px solid #212967 !important;}
.bt { border-top: 1px solid #212967 !important;}
.bl { border-left: 1px solid #212967 !important;}

.fs-10 { font-size: 10px !important;}
.fs-11 { font-size: 11px !important;}
.fs-12 { font-size: 12px !important;}
.fs-13 { font-size: 13px !important;}
.fs-14 { font-size: 14px !important;}
.fs-15 { font-size: 15px !important;}
.fs-16 { font-size: 16px !important;}
.fs-17 { font-size: 17px !important;}
.fs-18 { font-size: 18px !important;}
.fs-19 { font-size: 19px !important;}
.fs-20 { font-size: 20px !important;}
.fs-30 { font-size: 30px !important;}
.fs-40 { font-size: 40px !important;}
.fs-50 { font-size: 50px !important;}

.fl-l { float: left !important;}
.fl-r { float: right !important;}

.txt-left { text-align: left !important;}
.txt-center { text-align: center !important;}
.txt-right { text-align: right !important;}

.txt-red { color: #ff0000 !important; }
.txt-gold { color: #F8BB00 !important; }
.txt-white { color: #FFF !important; }
.txt-over-black:hover { color: #000 !important; }

.bg-success {
    background-color: #DFF0D8;
    width: 90%;
    margin-left: 50%;
    margin-right: 50%;
}

.bg-danger {
    background-color: #FCA5AD;
    width: 90%;
    margin-left: 50%;
    margin-right: 50%;
}

@media (max-width: 768px) {
    #cv {
        font-size: 12px;
    }
    /* Otros estilos específicos para pantallas pequeñas */
}