.page__title, .identity__content{
    opacity: 0;
    filter: blur(50px);
    transform: scale(.1);
}
.identity__content{
    animation: delayInContent 1.5s ease-in-out forwards;
}
.identity__content{
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap ;
    margin: 0 auto;
    max-width: 1140px;
    width: 100%;
    padding-bottom: 80px;;
}
.identity__item {
    width: 100%;
    aspect-ratio: 1 / 1;
    margin: 20px;
    position: relative;
    background-size: 100%;
    margin-top: 1.5vh;
    background-position: center;
    transition: all .5s ease;
}
.id1{
    background-image: url(../img/cacomarin1.jpg);
}
.id1:hover{
    border-radius: 50% 10% 10% 10% / 50% 10% 10% 10% ;   
    background-size: 120%;
}
.id2{
    background-image: url(../img/cacomarin3.jpg);
}
.id2:hover{
    border-radius:20% 20% 20% 20% / 20% 20% 20% 20%  ;   
    background-size: 120%;
}
.id3{
    background-image: url(../img/cacomarin4.jpg);
}
.id3:hover{
    border-radius: 10% 50% 10% 10% / 10% 50% 10% 10%  ;   
    background-size: 120%;
}
.id4{
    background-image: url(../img/cacomarin5.jpg);
}
.id4:hover{
    border-radius: 10% 50% 10% 10% / 10% 50% 10% 10%  ;   
    background-size: 120%;
}
.id5{
    background-image: url(../img/cacomarin6.jpg);
}
.id5:hover{
    border-radius: 50% 10% 10% 10% / 50% 10% 10% 10%  ;   
    background-size: 120%;
}
.id6{
    background-image: url(../img/zeel2.jpg);
}
.id6:hover{
    border-radius: 10% 10% 10% 50% / 10% 10% 10% 50%  ;   
    background-size: 120%;
}
.id7{
    background-image: url(../img/zeel3.jpg);
}
.id7:hover{
    border-radius: 10% 10% 50% 10% / 10% 10% 50% 10%  ;   
    background-size: 120%;
}
.id8{
    background-image: url(../img/zeel4.jpg);
}
.id8:hover{
    border-radius: 10% 50% 10% 50% / 10% 50% 10% 50%  ;   
    background-size: 120%;
}
.id9{
    background-image: url(../img/zeel5.jpg);
}
.id9:hover{
    border-radius: 10% 10% 10% 50% / 10% 10% 10% 50%  ;   
    background-size: 120%;
}
.id10{
    background-image: url(../img/canid1.jpg);
}
.id10:hover{
    border-radius: 50% 10% 10% 10% / 50% 10% 10% 10%  ;
    background-size: 120%;
}
.id11{
    background-image: url(../img/canid2.jpg);
}
.id11:hover{
    border-radius: 10% 50% 10% 10% / 10% 50% 10% 10%  ;   
}
.id12{
    background-image: url(../img/canid3.jpg);
}
.id12:hover{
    border-radius: 50% 10% 10% 10% / 50% 10% 10% 10%  ;
    background-size: 120%;
}
.id13{
    background-image: url(../img/securieon1.jpg);
}
.id13:hover{
    border-radius:20% 20% 20% 20% / 20% 20% 20% 20%  ;   
    background-size: 120%;
}
.id14{
    background-image: url(../img/securieon2.jpg);
}
.id14:hover{
    border-radius: 10% 50% 10% 10% / 10% 50% 10% 10%  ;   
    background-size: 120%;
}
.id15{
    background-image: url(../img/securieon3.jpg);
}
.id15:hover{
    border-radius: 10% 50% 10% 10% / 10% 50% 10% 10%  ;  
    background-size: 120%;
}
.id16{
    background-image: url(../img/securieon4.jpg);
}
.id16:hover{
    border-radius: 10% 10% 10% 50% / 10% 10% 10% 50%  ;   
    background-size: 120%;
}
.id17{
    background-image: url(../img/netdata1.jpg);
}
.id17:hover{
    border-radius:20% 20% 20% 20% / 20% 20% 20% 20%  ; 
    background-size: 120%;
}
.id18{
    background-image: url(../img/netdata2.jpg);
}
.id18:hover{
    border-radius: 10% 10% 50% 10% / 10% 10% 50% 10%  ;   
    background-size: 120%;
}

@media only screen and (min-width:480px){
    .identity__item {
        margin: 2vh 0 0;
    }
}
@media only screen and (min-width:480px) and (max-width:1024px){
    .identity__content{
        width: 80%;
    }
    .identity__item {
        width: 45%;
    }
    .identity__item:nth-child(odd){
        margin-right: 7%;
    }
}
@media only screen 
and (min-width:768px) 
and (max-width:1024px) 
and (orientation:portrait){
    .identity h1{
        font-size: 13rem;
    }
    .identity__content{
        width:90%;
        padding: 20px 3% 80px;
    }
    .identity__item {
        width: 47%;
        height:260px;
    }
    .identity__item:nth-child(odd)
    {
        margin-right: 6%;
    }
}
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) 
and (orientation: landscape) 
and (-webkit-min-device-pixel-ratio: 1){
    .identity__content {
        padding: 2%;
    }
    .identity__item {
        width: 31%;
        height: 240px;
    }
    .identity__item:nth-child(odd) {
        margin-right: 0;
    }
    .identity__item:nth-child(2), 
    .identity__item:nth-child(5),
    .identity__item:nth-child(8), 
    .identity__item:nth-child(11), 
    .identity__item:nth-child(14), 
    .identity__item:nth-child(17){
        margin: 2vh 3%;
    }
}
@media only screen and (min-width: 1025px){
    .identity__content {
        padding: 2%;
    }
    .identity__item {
        width: 31%;
        height: 300px;
    }
    .identity__item:nth-child(2), 
    .identity__item:nth-child(5),
    .identity__item:nth-child(8), 
    .identity__item:nth-child(11), 
    .identity__item:nth-child(14), 
    .identity__item:nth-child(17){
        margin: 2vh 3%;
    }
}
@media only screen and (min-width: 1140px){
    .identity__item {
        width: 31%;
        height: 300px;
    }
}