.container-fluid {
    display: contents;
}

body{
    background-color: black !important;
}
.row {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: stretch;
    align-items: stretch;
}

.row .col-md-6 {
    min-width: 200px;
    min-height: 200px;
    background: url('https://www.placehold.it/400x400');
    background-position: top center;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    flex: 2 1 auto;
    justify-content: center;
    align-items: flex-end;
    align-content: flex-end;
    display: flex;
    
}



.row .col-md-6[style*="oso1"] {
    background-position: bottom right !important;
    
}

.oso2 {
    background-position: center left !important;
     transition: all .25s linear; 
  -o-transition: all .25s linear; 
  -moz-transition: all .25s linear; 
  -webkit-transition: all .25s linear; 
}

.oso1 {
    background-position: center center !important;
     transition: all .25s linear; 
  -o-transition: all .25s linear; 
  -moz-transition: all .25s linear; 
  -webkit-transition: all .25s linear; 
}

.oso1:hover{
  transform: scale(1.1);
}

.oso2:hover{
  transform: scale(1.1);
    z-index: 1;
}


.imginteractivoytal
{
    padding: 50px;
    width: 100% !important;

}



@media only screen and (max-width: 768.98px) {
 .imginteractivoytal{
    padding: 70px;
}
}



@media only screen and (max-width: 1200px) {
 .imginteractivoytal{
    padding: 80px;
     margin-bottom: 10px;
}
}



@media only screen and (min-width: 1200.98px) {
 .imginteractivoytal{
    padding: 110px;
     margin-bottom: 10px;
}
}

@media only screen and (min-width: 1600.98px) {
 .imginteractivoytal{
    padding: 150px;
     margin-bottom: 30px;
}
}





.imginteractivoytal1
{
    padding: 10px;
    width: 100% !important;

}



@media only screen and (max-width: 768.98px) {
 .imginteractivoytal1{
    padding: 50px;
}
}



@media only screen and (max-width: 1200px) {
 .imginteractivoytal1{
    padding: 70px;
     margin-bottom: 20px;
}
}



@media only screen and (min-width: 1200.98px) {
 .imginteractivoytal1{
    padding: 90px;
     margin-bottom: 20px;
}
}

@media only screen and (min-width: 1600.98px) {
 .imginteractivoytal1{
    padding: 100px;
     margin-bottom: 60px;
}
}