* {
  box-sizing: border-box;
}

.backgroundcolor {

background-color: #f6f6f6;

}


@media screen and (min-width:1000px){

/* Create two equal columns that floats next to each other */
.columnsubleft {
       float: left;
    width: 50%;
    /* padding: 60px; */
    /* padding-left: 60px; */
    //: ;
    /* height: 300px; */
}


.columnsubright {
             float: left;
    width: 50%;
    padding-right: 70px;
    text-align: justify;
    //: ;
    /* height: 324px; */

}

.rowsub {
display: -webkit-inline-box;
    -webkit-box-align: center;
    height: 600px;

}



/* Clear floats after the columns */
.rowsub:after {
  content: "";
  display: table;
  clear: both;




}


 .main2 {
        
        display: -webkit-inline-box;
        -webkit-box-align: center;
        height: 600px;
        
    }


.left2 {
        position: relative;
    float: left;
    text-align: justify;
    
    text-align-last: end;
    padding-left: 70px;
    width: 50%;
    
}
.right2 {
        display: block;
    text-align: right;
    float: right;
    width: 50%;
    
    padding: 12px;
}

}




@media screen and (max-width:999px){
    .main2 {
        display: flex;
        flex-direction: column-reverse;
        
        
    }
    
    
    .left2 {
    position: relative;
    float: left;
    
    width:100%;
    text-align: justify;
    text-align-last: center;
    padding: 30px 30px 50px 30px;
    
}


 .left2 h1 {
    text-align: center;
}


.right2 {
    position: relative;
    float: left;
  
    width:100%;
    // height: 324px;
}




  .columnsubleft {
    width: 100%;
    height: auto;
    padding: 0px;
    padding-left: 0px;
  
  }
  
    .columnsubright {
       width: 100%;
    height: auto;
    margin-top: 0px;
    padding: 30px;
    text-align: justify;
    text-align-last: center;
  }
  
  
  .columnsubright h1 {
       
    text-align: center;
    
  }
  
  .row2reverse{
  
   
  
  }
  
.rowsub {
display: ;
    -webkit-box-align: center;

}
}