@import url("style.css");

/*-------------------*/
/*-PALETA DE COLORES-*/
/*-------------------*/
:root {
--bluedark: rgba(10,47,92, 1);
--blue: rgba(0,56,184,1);
--black: rgba(34,34,34, 1);
--violet: rgba(75,0,130, 1);
--gray: rgba(220,220,220, 1);
    }
    /*----------------------------------------*/
    /*------------ESTILOS GENERALES-----------*/
    /*----------------------------------------*/


@media(min-width:320px){
/*--------BANNER-----------*/
#main-banner-intelligence{
position: relative;
width: 100%;
height: 624px;
background: #0A2F5C;
background: linear-gradient(142deg,rgba(10, 47, 92, 1) 0%, rgba(75, 0, 130, 1) 26%, rgba(0, 56, 184, 1) 65%, rgba(10, 47, 92, 1) 100%);
padding: 16px;
box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}
#main-banner-txt-container-intelligence{
width: 100%;
}
#main-banner-title-container-intelligence{
display: flex;
justify-content: flex-end;
align-items:baseline;
width: 100%;
padding-top: 56px;
margin-bottom: 24px;
}
#main-banner-title-container-intelligence img{
height: 65px;
}
#main-banner-title-container-intelligence h2{
font-weight: bold;
font-style: oblique;
font-size: 42px;
color: white;
}
#main-banner-h3-intelligence{
margin-bottom: 148px;
font-weight: 500;
}
#main-banner-h3-intelligence{
margin-bottom: 48px;
font-weight: 500;
color: white;
text-align: right;
}
/*-----------INTRO------------*/
.page-intro{
padding: 48px 24px;
}
.page-intro h3{
color: var(--blue);
text-align: center;
font-weight: 500;
margin-bottom: 36px;
}
.page-intro p{
text-align: center;
margin-bottom: 36px;
}
.page-intro-line-division{
width: 50%;
height: 3px;
background-color: var(--blue);
margin: auto;
}
/*-----------CARDS------------*/
.pagecards{
width: 100%;
height: auto;
position: relative;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: nowrap;
padding: 16px;
}
.intelligence-container{
height: auto;
position: relative;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
}
.page-cards-container{
height: auto;
position: relative;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
margin-bottom: 24px;
}
#page-cards-container-intelligence{
width: 100%;
height: auto;
}
.model-card{
width: 100%;
height: 0;
padding: 28px;
padding-bottom: 100%;
margin-bottom: 24px;
box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
position: relative;
}
.model-card:hover{
box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
}
.model-card h3{
color: white;
margin-bottom: 24px;
font-weight: 900;
}
.model-card h4{
color: white;
margin-bottom: 24px;
font-weight: 900;
}
.model-card  p{
color: white;
font-size: 14px;
line-height: 21px;
font-weight: normal;
}
/*COMMON VALUES OF CARDS*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon,
#model-card-intelligence-sectorial,#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
background: #4B0082;
background: linear-gradient(120deg, rgba(75, 0, 130, 1) 1%, rgba(10, 47, 92, 1) 100%);
border-radius: 16px !important;
padding-bottom: 100%;
}
#model-card-intelligence-sectorial{
padding-bottom:  150%;
}

#model-card-intelligence-machine p, #model-card-intelligence-lenguaje p,
#model-card-intelligence-recon p,
#model-card-intelligence-sectorial p,#model-card-intelligence-dashboards p,#model-card-intelligence-nexai p{
margin-bottom: 18px;
}
#standar-button-intelligence{
position: absolute;
right: 24px;
bottom: 28px;
}


/*---fin de @media---*/
}
@media(min-width:480px){
#main-banner-intelligence{
height: 520px;
}
/*-----------CARDS------------*/
/*COMMON VALUES OF CARDS*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon,
#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
padding-bottom: 55%;
}
#model-card-intelligence-sectorial{
padding-bottom:  105%;
}




/*---fin de @media---*/
}
@media(min-width:540px){

/*--------BANNER-----------*/
#main-banner-intelligence{
height: 480px;
}
#main-banner-title-container-intelligence{
display: flex;
justify-content: flex-end;
align-items:baseline;
width: 100%;
padding-top: 36px;
margin-bottom:36px;
}
/*-----------CARDS------------*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon,#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
padding-bottom: 55%;
}
#model-card-intelligence-sectorial{
padding-bottom:  105%;
}
#model-card-intelligence-machine h3, #model-card-intelligence-lenguaje h3,
#model-card-intelligence-recon h3,
#model-card-intelligence-sectorial h3,#model-card-intelligence-dashboards h3,#model-card-intelligence-nexai h3{
font-size: 32px;
}
#model-card-intelligence-machine p, #model-card-intelligence-lenguaje p,
#model-card-intelligence-recon p,
#model-card-intelligence-sectorial p,#model-card-intelligence-dashboards p,#model-card-intelligence-nexai p{
font-size: 18px;
line-height: 24px;
}
#standar-button-intelligence{
right: 48px;
bottom: 32px;
}
#standar-button-intelligence a{
font-size: 21px;
}
/*---fin de @media---*/
}
@media(min-width:640px){
/*--------BANNER-----------*/
#main-banner-intelligence{
height: 450px;
}

/*-----------INTRO------------*/
.page-intro{
padding: 6% 12.5%;
}
/*-----------CARDS------------*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon,
#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
padding-bottom: 45%;
}
#model-card-intelligence-sectorial{
padding-bottom:  80%;
}
/*---fin de @media---*/
}
@media(min-width:720px){

/*-----------CARDS------------*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon,
#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
padding-bottom: 40%;
}
#model-card-intelligence-sectorial{
padding-bottom:  60%;
}


/*---fin de @media---*/
}
 @media(min-width:800px){
/*--------BENNER-----------*/
#main-banner-intelligence{
padding: 0 36px;
height: 400px;
}
/*-----------CARDS------------*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon,
#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
padding-bottom: 33%;
}
#model-card-intelligence-sectorial{
padding-bottom:  55%;
}

/*---fin de @media---*/
}
@media(min-width:900px){
/*-----------CARDS------------*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon,
#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
padding-bottom: 28%;
}
#model-card-intelligence-sectorial{
padding-bottom:  45%;
}

/*---fin de @media---*/
}
@media(min-width:1024px){
/*--------BENNER-----------*/
#main-banner-intelligence{
background-image: url(../img/Banner-intelligence.jpg);
background-repeat: no-repeat;
background-size: cover;
}
#main-banner-h3-intelligence{
padding-left: 48%;
margin-bottom: 36px;
}
/*-----------CARDS------------*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon,
#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
padding-bottom: 24%;
}
#model-card-intelligence-sectorial{
padding-bottom:  40%;
}





/*---fin de @media---*/
}
@media(min-width:1100px){
/*--------BENNER-----------*/


/*---fin de @media---*/
}
@media(min-width:1280px){
/*--------BANNER-----------*/

#main-banner-intelligence{
padding-top: 24px;
}
#main-banner-title-container-intelligence h2{
font-size: 48px;
}
#main-banner-h3-intelligence{
padding-left: 30%;
margin-bottom: 70px;
}

/*-----------CARDS------------*/
#model-card-intelligence-arrow{
display: block;
position: relative;
background: transparent;
background-color: transparent !important;
box-shadow: none !important;
}
.img-arrow-intelligence{
position: absolute;
left: 24px;
bottom: 24px;
}
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon
{
width: 32%;
padding-bottom: 24%;
}
#model-card-intelligence-sectorial,#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
width: 32%;
padding-bottom: 43%;
}
#model-card-intelligence-machine h3, #model-card-intelligence-lenguaje h3,
#model-card-intelligence-recon h3,
#model-card-intelligence-sectorial h3,#model-card-intelligence-dashboards h3,#model-card-intelligence-nexai h3{
font-size: 28px;
margin-bottom: 42px;
}
#model-card-intelligence-machine p, #model-card-intelligence-lenguaje p,
#model-card-intelligence-recon p,
#model-card-intelligence-sectorial p,#model-card-intelligence-dashboards p,#model-card-intelligence-nexai p{
font-size: 16px;
line-height: 21px;
}
#standar-button-intelligence{
right: 48px;
bottom: 36px;
}

/*---fin de @media---*/
}
@media(min-width:1360px){
/*--------BANNER-----------*/
#main-banner-intelligence{
height: 580px;
padding: 48px 48px 0 48px;
}
#main-banner-h2-intelligence{
font-size: 63px !important;
margin-bottom: 48px;
}
#main-banner-title-container-intelligence img{
height: 90px;
}
#main-banner-h3-intelligence{
padding-left: 30%;
margin-bottom: 100px;
}

/*--------INTRO-----------*/
.page-intro p{
margin-bottom: 48px;
}
 /*---fin de @media---*/
}
@media(min-width:1440px){
/*-----------CARDS------------*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon
{
padding-bottom: 24%;
}
#model-card-intelligence-sectorial,#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
padding-bottom: 40%;
}



/*---fin de @media---*/
}
@media(min-width:1600px){
/*--------BANNER-----------*/

#main-banner-intelligence{
height: 686px;
padding: 84px 56px 0 56px;
}
#main-banner-h2-intelligence{
font-size: 72px !important;
margin-bottom: 56px;
}
#main-banner-h3-intelligence{
margin-bottom:148px;
}
/*--------INTRO-----------*/
.page-intro h3{
font-size: 36px;
line-height: 42px;
}
.page-intro p{
    font-size: 18px;
    line-height: 24px;
margin-bottom: 48px;
}
/*--------CARDS-----------*/
/*-----------CARDS------------*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon
{
padding-bottom: 24%;
}
#model-card-intelligence-sectorial,#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
padding-bottom: 42%;
}
#model-card-intelligence-machine h3, #model-card-intelligence-lenguaje h3,
#model-card-intelligence-recon h3,
#model-card-intelligence-sectorial h3,#model-card-intelligence-dashboards h3,#model-card-intelligence-nexai h3{
font-size: 36px;
margin-bottom: 42px;
padding-top: 24px;
line-height:48px ;
}
#model-card-intelligence-machine p, #model-card-intelligence-lenguaje p,
#model-card-intelligence-recon p,
#model-card-intelligence-sectorial p,#model-card-intelligence-dashboards p,#model-card-intelligence-nexai p{
font-size: 18px;
line-height: 24px;
}
#standar-button-intelligence{
right: 48px;
bottom: 36px;
}
/*---fin de @media---*/
}
@media(min-width:1920px){
/*--------BANNER-----------*/
#main-banner-intelligence{
height: 823px;
padding: 84px 63px 0 63px;
}
#main-banner-h3-intelligence{
margin-bottom:260px;
}
/*--------INTRO-----------*/
.page-intro h3, .page-intro p{
margin-bottom: 65px;
}
/*-----------CARDS------------*/
#model-card-intelligence-machine, #model-card-intelligence-lenguaje,
#model-card-intelligence-recon
{
padding-bottom: 22%;
}
#model-card-intelligence-sectorial,#model-card-intelligence-dashboards,#model-card-intelligence-nexai{
padding-bottom: 38%;
}
#model-card-intelligence-machine h3, #model-card-intelligence-lenguaje h3,
#model-card-intelligence-recon h3,
#model-card-intelligence-sectorial h3,#model-card-intelligence-dashboards h3,#model-card-intelligence-nexai h3{
font-size: 42px;
margin-bottom: 42px;
padding-top: 24px;
}
#model-card-intelligence-machine p, #model-card-intelligence-lenguaje p,
#model-card-intelligence-recon p,
#model-card-intelligence-sectorial p,#model-card-intelligence-dashboards p,#model-card-intelligence-nexai p{
font-size: 21px;
line-height: 28px;
}
#standar-button-intelligence{
right: 48px;
bottom: 36px;
}
#standar-button-intelligence a{
font-size: 28px;
}
/*---fin de @media---*/
}