@charset "utf-8";

/*
==============================================
CSS TIPOGRAFÍA
==============================================
*/
@font-face {
	font-family:Bahnschrift;
	src: url("../font/bahnschrift.ttf") format("truetype");
}
@font-face {
	font-family:Bahnschrift;
	src: url("../font/bahnschrift.eot");
}
/*
==============================================
CSS BODY
==============================================
*/
.d_helperresources{
    display: none;
    background-image:
        url(../img/portafoliofavicon.png),
        url(../img/portafolioico.png),
        url(../img/proyect_arrowup.png),
        url(../img/proyect_bodytexture.png),
        url(../img/proyect_headertexture.png),
        url(../img/proyect_sectionclose.png),
        url(../img/proyect_sectiontxt.png),
        url(../img/muestras/dispositivos1.png),
        url(../img/muestras/dispositivos2.png),
        url(../img/muestras/dispositivos3.png),
        url(../img/muestras/dispositivos4.png),
        url(../img/muestras/game1.png),
        url(../img/muestras/game1.png),
        url(../img/muestras/img1.png),
        url(../img/muestras/img2.png),
        url(../img/muestras/img3.png),
        url(../img/muestras/min1.png),
        url(../img/muestras/min2.png),
        url(../img/muestras/min3.png),
        url(../img/muestras/min4.png),
        url(../img/muestras/min5.png),
        url(../img/muestras/min6.png),
        url(../img/muestras/min7.png),
        url(../img/muestras/min8.png),
        url(../img/muestras/min9.png),
        url(../img/muestras/min10.png),
        url(../img/muestras/min11.png),
        url(../img/muestras/min12.png),
        url(../img/muestras/min13.png),
        url(../img/muestras/min14.png),
        url(../img/muestras/min15.png),
        url(../img/muestras/otros1.png),
        url(../img/muestras/otros2.png),
        url(../img/muestras/otros3.png),
        url(../img/muestras/rm1.png),
        url(../img/muestras/rm2.png),
        url(../img/muestras/rm3.png),
        url(../img/muestras/rm4.png),
        url(../img/muestras/rm5.png),
        url(../img/muestras/rm6.png),
        url(../img/muestras/rob1.png),
        url(../img/muestras/rob2.png),
        url(../img/muestras/rob3.png),
        url(../img/muestras/rob4.png),
        url(../img/muestras/crk1.png),
        url(../img/muestras/crk2.png),
        url(../img/muestras/crk3.png),
        url(../img/muestras/crk4.png),
        url(../img/muestras/crk5.png),
        url(../img/muestras/crk6.png),
        url(../img/muestras/crk7.png),
        url(../img/muestras/crk8.png),
        url(../img/muestras/ver1.png),
        url(../img/muestras/ver2.png),
        url(../img/muestras/ver3.png),
        url(../img/muestras/ver4.png),
        url(../img/muestras/ver5.png),
        url(../img/muestras/video1.png),
        url(../img/muestras/video2.png),
        url(../img/muestras/video3.png),
        url(../img/muestras/video4.png),
        url(../img/muestras/movilidadapp1.png),
        url(../img/muestras/movilidadapp2.png),
        url(../img/muestras/movilidadapp3.png),
        url(../img/muestras/movilidadapp4.png),
        url(../img/muestras/movilidadapp5.png),
        url(../img/muestras/movilidadweb1.png),
        url(../img/muestras/movilidadweb2.png),
        url(../img/muestras/movilidadweb3.png),
        url(../img/muestras/movilidadweb4.png),
        url(../img/muestras/movilidadweb5.png),
        url(../img/muestras/vidocweb1.png),
        url(../img/muestras/vidocweb2.png),
        url(../img/muestras/vidocweb3.png),
        url(../img/muestras/vidocweb4.png),
        url(../img/muestras/vidocweb5.png);
}
html{
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
body{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: antiquewhite;
    background-image: url(../img/proyect_bodytexture.png);
    background-repeat: repeat;
    background-size: auto;
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
}
/*
==============================================
CSS HEADER
==============================================
*/
.p_header{
    width: 100%;
    position: sticky;
    background-color: #333333;
    background-image: url(../img/proyect_headertexture.png);
    background-position: center;
    background-repeat: repeat;
    background-attachment: fixed;
    background-size: auto;
    /*box-shadow: 0px 2px 4px rgba(0,0,0,.25);*/
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.p_headerin{
    width: 94%;
    max-width: 1024px;
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    flex-direction: column;
    padding: 2rem 1rem 1.5rem 1rem;
}
.p_headertitle{
    font-family: Bahnschrift;
    text-align: right;
    font-size: 3rem;
    text-shadow: 0px 0px 4px rgba(0,0,0,.3);
}
.p_headertitle > span{
    padding: 0 0.4rem 0 0.4rem;
}
.p_headertitle > span:nth-child(1){
    color: #FDC10D;
}
.p_headertitle > span:nth-child(2){
    color: #1AA7C5;
}
.p_headertitle > span:nth-child(3){
    color: #FF8E00;
}
.p_headername{
    font-family: Bahnschrift;
    text-align: right;
    font-size: 3rem;
    text-shadow: 0px 0px 4px rgba(0,0,0,.3);
    margin-top: -2rem;
}
.p_headername > span{
    padding: 0 0.4rem 0 0.4rem;
}
.p_headername > span:nth-child(1){
    color: #f2f2f2;
    font-size: 1.8rem;
}
.p_headercv a{
    font-family: Bahnschrift;
    text-align: right;
    font-size: 3rem;
    text-shadow: 0px 0px 4px rgba(0,0,0,.3);
    color: #f2f2f2;
    font-size: 1rem;
    text-decoration: underline;
    cursor: pointer;
    font-style: italic;
    padding-right: 0.8rem;
}
/*
==============================================
CSS SECTION
==============================================
*/
.p_section{
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    /*height: calc(100% - 100px);*/
    /*overflow-y: scroll;*/
}
/*
==============================================
CSS ARTICLE
==============================================
*/
.p_article > div{
    position: relative;
    float: left;
}
.p_article{
    width: 96%;
    max-width: 1024px;
    margin: auto;
    display: table;
    /*background-color: rgba(0,0,0,.1);*/
    margin-top: 30px;
    margin-bottom: 30px;
}
.p_articleline{
    width: 100%;
    height: 6px;
    background-color: #333333;
    border-radius: 3px;
    box-shadow: 0px 0px 4px rgba(0,0,0,.35);
}
.p_articletitle{
    width: 100%;
    font-family: Bahnschrift;
    font-size: 1.6rem;
    color: #333333;
    text-align: right;
    text-shadow: 0px 0px 4px rgba(0,0,0,.35);
    padding: 1rem 0 1rem 0;
}
.p_articlebox{
    display: table;
    padding: 0.8rem;
    margin: auto;
    margin-top: 0.8rem;
    margin-bottom: 0.8rem;
    background-image: url(../img/proyect_headertexture.png);
    background-position: center;
    background-repeat: repeat;
    background-attachment: fixed;
    background-size: auto;
    border-radius: 0.8rem;
    box-shadow: 0.2rem 0.2rem 0.4rem rgba(0,0,0,.35);
}
.p_articlebox{
    transition: all ease 0.2s;
    cursor: pointer;
}
.p_articlebox:hover{
    transform: scale(1.1) rotate(2deg);
}
.p_articleboxin{
    border-radius: 0.6rem;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    box-shadow: 0.2rem 0.2rem 0.4rem rgba(0,0,0,.35);
    border: 1px solid #f2f2f2;
    box-sizing: border-box;
    float: left;
}
.p_articletxt{
    width: 16rem;
    height: 100%;
    background-image: url(../img/proyect_sectiontxt.png);
    background-size: 80%;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    bottom: 0;
    right: 0;
    display: none;
}
/*BOX 1*/
.p_articlediv1{
    width: 50%;
}
.p_articlediv1 > .p_articlebox{
    background-color: #1AA7C5;
}
.p_articlediv1 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 11.5rem;
    background-image: url(../img/muestras/img2.png);
}
/*BOX 2*/
.p_articlediv2{
    width: 50%;
}
.p_articlediv2 > .p_articlebox{
    background-color: #FF8365;
}
.p_articlediv2 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 11.5rem;
    background-image: url(../img/muestras/img1.png);
}
/*BOX 3*/
.p_articlediv3{
    width: 50%;
}
.p_articlediv3 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv3 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 11.5rem;
    background-image: url(../img/muestras/img3.png);
}
/*BOX 3-1*/
.p_articlediv3-1{
    width: 50%;
}
.p_articlediv3-1 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv3-1 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 11.5rem;
    background-image: url(../img/muestras/img3-1.png);
}
/*BOX 4*/
.p_articlediv4{
    width: 100%;
}
.p_articlediv4 > .p_articlebox{
    background-color: #FDC10D;
}
.p_articlediv4 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/min1.png);
}
/*BOX 5*/
.p_articlediv5{
    width: 50%;
}
.p_articlediv5 > .p_articlebox{
    background-color: #88A80D;
}
.p_articlediv5 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/min2.png);
}
/*BOX 6*/
.p_articlediv6{
    width: 50%;
}
.p_articlediv6 > .p_articlebox{
    background-color: #93437A;
}
.p_articlediv6 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/min14.png);
}
/*BOX 7*/
.p_articlediv7{
    width: 100%;
}
.p_articlediv7 > .p_articlebox{
    background-color: #4D4D4D;
}
.p_articlediv7 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/min3.png);
}
/*BOX 8*/
.p_articlediv8{
    width: 50%;
}
.p_articlediv8 > .p_articlebox{
    background-color: #1AA7C5;
}
.p_articlediv8 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/min8.png);
}
/*BOX 9*/
.p_articlediv9{
    width: 50%;
}
.p_articlediv9 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv9 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/min6.png);
}
/*BOX 10*/
.p_articlediv10{
    width: 100%;
}
.p_articlediv10 > .p_articlebox{
    background-color: #FDC10D;
}
.p_articlediv10 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/min9.png);
}
/*BOX 11*/
.p_articlediv11{
    width: 50%;
}
.p_articlediv11 > .p_articlebox{
    background-color: #FDC10D;
}
.p_articlediv11 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/rob1.png);
}
/*BOX 12*/
.p_articlediv12{
    width: 50%;
}
.p_articlediv12 > .p_articlebox{
    background-color: #88A80D;
}
.p_articlediv12 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/rob2.png);
}
/*BOX 13*/
.p_articlediv13{
    width: 50%;
}
.p_articlediv13 > .p_articlebox{
    background-color: #93437A;
}
.p_articlediv13 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/rob3.png);
}
/*BOX 14*/
.p_articlediv14{
    width: 50%;
}
.p_articlediv14 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv14 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/rob4.png);
}
/*BOX 15*/
.p_articlediv15{
    width: 50%;
}
.p_articlediv15 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv15 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/rm1.png);
}
/*BOX 16*/
.p_articlediv16{
    width: 50%;
}
.p_articlediv16 > .p_articlebox{
    background-color: #93437A;
}
.p_articlediv16 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/rm2.png);
}
/*BOX 17*/
.p_articlediv17{
    width: 50%;
}
.p_articlediv17 > .p_articlebox{
    background-color: #88A80D;
}
.p_articlediv17 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/rm3.png);
}
/*BOX 18*/
.p_articlediv18{
    width: 50%;
}
.p_articlediv18 > .p_articlebox{
    background-color: #FDC10D;
}
.p_articlediv18 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/rm4.png);
}
/*BOX 19*/
.p_articlediv19{
    width: 50%;
}
.p_articlediv19 > .p_articlebox{
    background-color: #FDC10D;
}
.p_articlediv19 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/rm5.png);
}
/*BOX 20*/
.p_articlediv20{
    width: 50%;
}
.p_articlediv20 > .p_articlebox{
    background-color: #88A80D;
}
.p_articlediv20 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/rm6.png);
}



/*BOX 21*/
.p_articlediv21{
    width: 50%;
}
.p_articlediv21 > .p_articlebox{
    background-color: #93437A;
}
.p_articlediv21 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/crk1.png);
}
/*BOX 22*/
.p_articlediv22{
    width: 50%;
}
.p_articlediv22 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv22 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/crk2.png);
}
/*BOX 23*/
.p_articlediv23{
    width: 50%;
}
.p_articlediv23 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv23 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/crk3.png);
}
/*BOX 24*/
.p_articlediv24{
    width: 50%;
}
.p_articlediv24 > .p_articlebox{
    background-color: #93437A;
}
.p_articlediv24 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/crk4.png);
}
/*BOX 25*/
.p_articlediv25{
    width: 50%;
}
.p_articlediv25 > .p_articlebox{
    background-color: #88A80D;
}
.p_articlediv25 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/crk5.png);
}
/*BOX 26*/
.p_articlediv26{
    width: 50%;
}
.p_articlediv26 > .p_articlebox{
    background-color: #FDC10D;
}
.p_articlediv26 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/crk6.png);
}
/*BOX 27*/
.p_articlediv27{
    width: 50%;
}
.p_articlediv27 > .p_articlebox{
    background-color: #FDC10D;
}
.p_articlediv27 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/crk7.png);
}
/*BOX 27.5*/
.p_articlediv275{
    width: 50%;
}
.p_articlediv275 > .p_articlebox{
    background-color: #FDC10D;
}
.p_articlediv275 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/crk8.png);
}



/*BOX 28*/
.p_articlediv28{
    width: 100%;
}
.p_articlediv28 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv28 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 12rem;
    background-image: url(../img/muestras/video1.png);
}
/*BOX 29*/
.p_articlediv29{
    width: 50%;
}
.p_articlediv29 > .p_articlebox{
    background-color: #1AA7C5;
}
.p_articlediv29 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 12rem;
    background-image: url(../img/muestras/video2.png);
}
/*BOX 30*/
.p_articlediv30{
    width: 50%;
}
.p_articlediv30 > .p_articlebox{
    background-color: #88A80D;
}
.p_articlediv30 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 12rem;
    background-image: url(../img/muestras/video3.png);
}
/*BOX 31*/
.p_articlediv31{
    width: 100%;
}
.p_articlediv31 > .p_articlebox{
    background-color: #93437A;
}
.p_articlediv31 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 12rem;
    background-image: url(../img/muestras/video4.png);
}
/*BOX 32*/
.p_articlediv32{
    width: 100%;
}
.p_articlediv32 > .p_articlebox{
    background-color: #FDC10D;
}
.p_articlediv32 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 12rem;
    background-image: url(../img/muestras/ver4.png);
}
/*BOX 33*/
.p_articlediv33{
    width: 50%;
}
.p_articlediv33 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv33 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 12rem;
    background-image: url(../img/muestras/ver2.png);
}
/*BOX 34*/
.p_articlediv34{
    width: 50%;
}
.p_articlediv34 > .p_articlebox{
    background-color: #1AA7C5;
}
.p_articlediv34 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 12rem;
    background-image: url(../img/muestras/ver1.png);
}
/*BOX 35*/
.p_articlediv35{
    width: 100%;
}
.p_articlediv35 > .p_articlebox{
    background-color: #88A80D;
}
.p_articlediv35 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 12rem;
    background-image: url(../img/muestras/ver5.png);
}
/*BOX 36*/
.p_articlediv36{
    width: 100%;
}
.p_articlediv36 > .p_articlebox{
    background-color: #4D4D4D;
}
.p_articlediv36 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 12rem;
    background-image: url(../img/muestras/ver3.png);
}
.p_derechos{
    font-family: Bahnschrift;
    font-size: 1.2rem;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.5rem 1rem 1rem 1rem;
    text-align: center;
}
/*BOX 37*/
.p_articlediv37{
    width: 50%;
}
.p_articlediv37 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv37 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 20rem;
    background-image: url(../img/muestras/game1.png);
}
/*BOX 38*/
.p_articlediv38{
    width: 50%;
}
.p_articlediv38 > .p_articlebox{
    background-color: #93437A;
}
.p_articlediv38 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 20rem;
    background-image: url(../img/muestras/game2.png);
}
/*BOX 39*/
.p_articlediv39{
    width: 100%;
}
.p_articlediv39 > .p_articlebox{
    background-color: #FF8E00;
}
.p_articlediv39 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 11rem;
    background-image: url(../img/muestras/dispositivos1.png);
}
/*BOX 40*/
.p_articlediv40{
    width: 50%;
}
.p_articlediv40 > .p_articlebox{
    background-color: #1AA7C5;
}
.p_articlediv40 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 11rem;
    background-image: url(../img/muestras/dispositivos2.png);
}
/*BOX 41*/
.p_articlediv41{
    width: 50%;
}
.p_articlediv41 > .p_articlebox{
    background-color: #88A80D;
}
.p_articlediv41 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 11rem;
    background-image: url(../img/muestras/dispositivos3.png);
}
/*BOX 42*/
.p_articlediv42{
    width: 100%;
}
.p_articlediv42 > .p_articlebox{
    background-color: #93437A;
}
.p_articlediv42 > .p_articlebox > .p_articleboxin{
    width: 24rem;
    height: 11rem;
    background-image: url(../img/muestras/dispositivos4.png);
}
/*BOX 43*/
.p_articlediv43{
    width: 100%;
}
.p_articlediv43 > .p_articlebox{
    background-color: #FDC10D;
}
.p_articlediv43 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/otros1.png);
}
/*BOX 44*/
.p_articlediv44{
    width: 50%;
}
.p_articlediv44 > .p_articlebox{
    background-color: #88A80D;
}
.p_articlediv44 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/otros2.png);
}
/*BOX 45*/
.p_articlediv45{
    width: 50%;
}
.p_articlediv45 > .p_articlebox{
    background-color: #93437A;
}
.p_articlediv45 > .p_articlebox > .p_articleboxin{
    width: 20rem;
    height: 13.5rem;
    background-image: url(../img/muestras/otros3.png);
}


/*BOX 46*/
.p_articlediv46{
    width: 100%;
}
.p_articlediv46 > .p_articlebox{
    background-color: #1AA7C5;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-flow: wrap;
    width: fit-content;
    gap: 0.5rem;
}
.p_articlediv46 > .p_articlebox > .p_articleboxin{
    width: 17rem;
    height: 11.4rem;
}
.p_articlediv46 > .p_articlebox > .p_articleboxin:nth-child(1){
    background-image: url(../img/muestras/movilidadweb1.png);
}
.p_articlediv46 > .p_articlebox > .p_articleboxin:nth-child(2){
    background-image: url(../img/muestras/movilidadweb2.png);
}
.p_articlediv46 > .p_articlebox > .p_articleboxin:nth-child(3){
    background-image: url(../img/muestras/movilidadweb3.png);
}
/*BOX 47*/
.p_articlediv47{
    width: 100%;
}
.p_articlediv47 > .p_articlebox{
    background-color: #FDC10D;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-flow: wrap;
    width: fit-content;
    gap: 0.5rem;
}
.p_articlediv47 > .p_articlebox > .p_articleboxin{
    width: 10rem;
    height: 20.5rem;
}
.p_articlediv47 > .p_articlebox > .p_articleboxin:nth-child(1){
    background-image: url(../img/muestras/movilidadapp1.png);
}
.p_articlediv47 > .p_articlebox > .p_articleboxin:nth-child(2){
    background-image: url(../img/muestras/movilidadapp2.png);
}
.p_articlediv47 > .p_articlebox > .p_articleboxin:nth-child(3){
    background-image: url(../img/muestras/movilidadapp3.png);
}
.p_articlediv47 > .p_articlebox > .p_articleboxin:nth-child(4){
    background-image: url(../img/muestras/movilidadapp4.png);
}
.p_articlediv47 > .p_articlebox > .p_articleboxin:nth-child(5){
    background-image: url(../img/muestras/movilidadapp5.png);
}
/*BOX 48*/
.p_articlediv48{
    width: 100%;
}
.p_articlediv48 > .p_articlebox{
    background-color: #FF8E00;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-flow: wrap;
    width: fit-content;
    gap: 0.5rem;
}
.p_articlediv48 > .p_articlebox > .p_articleboxin{
    width: 17rem;
    height: 12rem;
}
.p_articlediv48 > .p_articlebox > .p_articleboxin:nth-child(1){
    background-image: url(../img/muestras/vidocweb2.png);
}
.p_articlediv48 > .p_articlebox > .p_articleboxin:nth-child(2){
    background-image: url(../img/muestras/vidocweb3.png);
}
.p_articlediv48 > .p_articlebox > .p_articleboxin:nth-child(3){
    background-image: url(../img/muestras/vidocweb4.png);
}
/*BOX 49*/
.p_articlediv49{
    width: 100%;
}
.p_articlediv49 > .p_articlebox{
    background-color: #FF8E00;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-flow: wrap;
    width: fit-content;
    gap: 0.5rem;
}
.p_articlediv49 > .p_articlebox > .p_articleboxin{
    width: 17rem;
    height: 9.4rem;
}
.p_articlediv49 > .p_articlebox > .p_articleboxin:nth-child(1){
    background-image: url(../img/muestras/portales1.png);
}
.p_articlediv49 > .p_articlebox > .p_articleboxin:nth-child(2){
    background-image: url(../img/muestras/portales2.png);
}
.p_articlediv49 > .p_articlebox > .p_articleboxin:nth-child(3){
    background-image: url(../img/muestras/portales3.png);
}
/*BOX 50*/
.p_articlediv50{
    width: 100%;
}
.p_articlediv50 > .p_articlebox{
    background-color: #FF8E00;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    flex-flow: wrap;
    width: fit-content;
    gap: 0.5rem;
}
.p_articlediv50 > .p_articlebox > .p_articleboxin{
    width: 17rem;
    height: 11.4rem;
}
.p_articlediv50 > .p_articlebox > .p_articleboxin:nth-child(1){
    background-image: url(../img/muestras/nem1.png);
}
.p_articlediv50 > .p_articlebox > .p_articleboxin:nth-child(2){
    background-image: url(../img/muestras/nem2.png);
}
.p_articlediv50 > .p_articlebox > .p_articleboxin:nth-child(3){
    background-image: url(../img/muestras/nem3.png);
}
/*
==============================================
CSS FOOTER
==============================================
*/
.p_footer{
    width: 100%;
    /*height: 80px;*/
    float: left;
    background-color: #333333;
    background-image: url(../img/proyect_headertexture.png);
    background-position: center;
    background-repeat: repeat;
    background-attachment: fixed;
    background-size: auto;
    /*box-shadow: 0px -2px 4px rgba(0,0,0,.25);*/
    display: flex;
    justify-content: center;
    flex-direction: column;
    padding-bottom: 2rem;
    /*z-index: 1;*/
}
.p_footertitle{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    font-family: Bahnschrift;
    font-size: 1.4rem;
    text-shadow: 0px 0px 4px rgba(0,0,0,.3);
    padding: 1rem 1rem 0.5rem 1rem;
}
.p_footertitle > span{
    padding: 0 0.2rem 0 0.2rem;
}
.p_footertitle > span:nth-child(1){
    color: #FDC10D;
}
.p_footertitle > span:nth-child(2){
    color: #1AA7C5;
}
.p_footertitle > span:nth-child(3){
    color: #FF8E00;
}
/*
==============================================
CSS EMERGENTE
==============================================
*/
.p_emergente{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0%;
    left: 0%;
    background-color: rgba(0,0,0,.9);
    background-image: url(../img/muestras/img1.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
    display: none;
}
.p_emergenteclose{
    width: 3rem;
    height: 3rem;
    background-color: black;
    background-image: url(../img/proyect_sectionclose.png);
    background-size: 80%;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    cursor: pointer;
    top: 0%;
    right: 0%;
    border-bottom-left-radius: 0.5rem;
}
.p_emergenteclose:hover{
    transform: scale(1.1);
}
/*
==============================================
CSS ARROW
==============================================
*/
.p_arrowup{
    width: 3rem;
    height: 3rem;
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    background-image: url(../img/proyect_arrowup.png);
    background-size: 86%;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    border-radius: 50%;
    background-color: #333333;
    border: 1px solid #f2f2f2;
    box-sizing: border-box;
    /*box-shadow: 0px 0px 6px rgba(0,0,0,.5);*/
    display: none;
}
.p_arrowup:hover{
    bottom: 10px;
    transition: all 0.5s ease;
}
/*
==============================================
CSS MEDIA QUERIES MAX-WIDTH
==============================================
*/
@media screen and (max-width: 1200px) {
    html{
        font-size: 14px;
    }
}
@media screen and (max-width: 800px) {
    html{
        font-size: 12px;
    }
}
@media screen and (max-width: 700px) {
    html{
        font-size: 16px;
    }
    .p_articlediv1,.p_articlediv2,.p_articlediv3, .p_articlediv3-1,.p_articlediv4,.p_articlediv5,.p_articlediv6,.p_articlediv7,.p_articlediv8,.p_articlediv9,.p_articlediv10,.p_articlediv11,.p_articlediv12,.p_articlediv13,.p_articlediv14,.p_articlediv15,.p_articlediv16,.p_articlediv17,.p_articlediv18,.p_articlediv19,.p_articlediv20,.p_articlediv21,.p_articlediv22,.p_articlediv23, .p_articlediv24,.p_articlediv25,.p_articlediv26,.p_articlediv27,.p_articlediv28,.p_articlediv29,.p_articlediv30,.p_articlediv31,.p_articlediv32,.p_articlediv33,.p_articlediv34,.p_articlediv35,.p_articlediv36,.p_articlediv37,.p_articlediv38, .p_articlediv39, .p_articlediv40, .p_articlediv41, .p_articlediv42, .p_articlediv43, .p_articlediv44, .p_articlediv45{
        width: 100%;
    }
    .p_headertitle{
        font-size: 2.4rem;
    }
    .p_articletxt{
        display: none;
    }

    .p_articlediv46 > .p_articlebox{
        flex-direction: column;
    }
    .p_articlediv47 > .p_articlebox{
        flex-direction: column;
    }
    .p_articlediv48 > .p_articlebox{
        flex-direction: column;
    }
}
@media screen and (max-width: 500px) {
    html{
        font-size: 10px;
    }
}
@media screen and (max-width: 300px) {
    html{
        font-size: 8px;
    }
}
/*
@media screen and (max-device-width: 1024px) and (orientation: portrait) {
    .p_articlediv1,.p_articlediv2,.p_articlediv3,.p_articlediv4,.p_articlediv5,.p_articlediv6,.p_articlediv7,.p_articlediv8,.p_articlediv9,.p_articlediv10,.p_articlediv11,.p_articlediv12,.p_articlediv13,.p_articlediv14,.p_articlediv15,.p_articlediv16,.p_articlediv17,.p_articlediv18,.p_articlediv19,.p_articlediv20,.p_articlediv21,.p_articlediv22,.p_articlediv23, .p_articlediv24,.p_articlediv25,.p_articlediv26,.p_articlediv27,.p_articlediv28,.p_articlediv29,.p_articlediv30,.p_articlediv31,.p_articlediv32,.p_articlediv33,.p_articlediv34,.p_articlediv35,.p_articlediv36,.p_articlediv37,.p_articlediv38, .p_articlediv39,.p_articlediv40,.p_articlediv41,.p_articlediv42,.p_articlediv43,.p_articlediv44,.p_articlediv45{
        width: 100%;
    }
    html{
        font-size: 30px;
    }
    .p_header{
        height: 180px;
    }
    .p_section{
        height: calc(100% - 180px);
    }
    .p_footer{
        height: 100px;
    }
    .p_articletxt{
        display: none;
    }
    .p_arrowup{
        width: 100px;
        height: 100px;
        bottom: 20px;
    }
}
@media screen and (max-device-width: 1024px) and (orientation: landscape) {
    .p_header{
        height: 100px;
    }
    .p_section{
        height: calc(100% - 100px);
    }
    .p_footer{
        height: 100px;
    }
}
*/