*{
    box-sizing: border-box;
}

body{
    margin: 0;
	    font-family: 'Barlow', sans-serif;
}



    .image1 {
        height: 600px;
        width: 100%;
        background: url(img/IOUsmall.jpg);
        background-position: center;
        background-repeat: no-repeat; 
    }

    .background{
        background-color: rgb(66, 17, 66);
        width: 100%;
        height: auto;
    }

    .container1{
        margin-right: auto;
        margin-left: auto;
        display: block;
        width: 100%;
        height: auto;
    }

    .content1{
        margin-left: auto;
		margin-right: auto;
		width:90%;
    }

    .content1 .cI1 {
        width: 150px;
        height: auto;
    }

    .content1 
    .cI2 , .cI3 {
        width: 60%;
		max-width:150px;
        height: auto;
    }
    
    .content1 .label1 {
        font-size: 17px;
        margin-bottom: 0;
    }

    .content1 .label2 {
        font-size: 35px;
        margin-bottom: 0;
    }

    .content1 .label3 {
        font-size: 70px;
        margin-bottom: 0;
    }
    
    .content2{
        padding-top: 50px;
        margin-left: auto;
		margin-right:auto;
        width: 90%;
        height: auto;
       
    }
    
    .text{
        width: 90%;
        height: auto;
    }
    
    .qs{
        text-align: center;
        font-size: 30px;
        padding: 10px;
        background-color:rgb(85, 16, 150);
        color: white;
    }
    
    .container{
        width: 100%;
        height: auto;
        padding: 60px;
    }
    
    .row1{
        padding: 20px;
        display: flex;
    }
    
    .box{
        width: 450px;
        height: 390px;
        padding: 15px;
        border: 1px solid white;
        border-radius: 10px;
    }
    
    .box img{
        margin-left: 70px;
        width: 250px;
    }
    
    .method{
        text-align: center;
        padding: 15px;
    }
    
    .method1{
        margin-bottom: 20px;
        text-align: center;
        padding: 15px;
    }
    
    .container1 img {
        width: 250px;
        height: 260px;
    }
    
    .imgborder1 {
        height: 260px;
        border: 4px solid rgb(66, 17, 66);
        border-radius: 10px;
    }
    
    .imgborder2 {
        margin-left: 350px;
        height: 260px;
        border: 4px solid rgb(66, 17, 66);
        border-radius: 10px;
    }
    
    .imgborder3 {
        height: 260px;
        border: 4px solid rgb(66, 17, 66);
        border-radius: 10px;
    }
    
    .imgborder4 {
        margin-left: 350px;
        height: 260px;
        border: 4px solid rgb(66, 17, 66);
        border-radius: 10px;
    }

	.stepsbox {
	width: 100%; height:350px; padding: 70px 10px;	
	}
	
	.trianglearrow {
		padding-left:20px;
		padding-right:20px;
	}
	
	.trianglearrowsize {
		font-size:100px;
	}
	
	.dekstopsteps {
		display:block;
	}
	
	.mobilesteps{
		display:none;
	}
	
	
	.requirementboxleft{
		width: 200px;
		height: auto; 
		text-align:center;
		margin-left:auto;
	}
	
	.requirementboxright{
		width: 200px;
		height: auto; 
		text-align:center;
		margin-right:auto;
	}
	
	.requirementsmallbox{
		width: 200px;
		height:200px;
		border: 2px solid #641A6F;
		text-align:center;
		border-radius: 10px;
	}
	
@media only screen and (max-width: 1200px){
    .content2{
        padding-top: 50px;
        margin-left: auto;
		margin-right: auto;
        width: 90%;
        height: auto;
        font-size: 8px;
    }
    .content2 h1{
        font-size: 50px!important;
        text-align: center;

    }
    .text{
            font-size: 10px!important;
     width: 90%!important;
     height: auto;
     /* font-size: 10px; */
     float: right;
     margin-right: 100px;
    
    }
     .text3c{
        margin-top: 30px;
    }
	
	.qs{
        font-size: 25px;
    }
	
	.stepsbox {
	width: 100%; height:300px; padding: 5px 10px;	
	}
	
	.trianglearrow {
		padding-left:10px;
		padding-right:10px;
	}
	
	.trianglearrowsize {
		font-size:50px;
	}
	
	.dekstopsteps {
		display:block;
	}
	
	.mobilesteps{
		display:none;
	}
	
	.requirementboxleft{ 
		text-align:center;
		margin-left:auto;
	}
	
	.requirementboxright{ 
		text-align:center;
		margin-right:auto;
	}
    }
    

 @media only screen and (max-width: 767px){
	 .stepsbox {
	width: 100%; height:250px; padding: 10px;	
	}
	
	 .trianglearrow {
		padding-top:5px;
		padding-bottom:5px;
	}
	
	.trianglearrowsize {
		font-size:50px;
	}
	
	.dekstopsteps {
		display:none;
	}
	
	.mobilesteps{
		display:block;
	}
	
	.requirementboxleft{
		margin-left:auto;
		margin-right:auto;
	}
	
	.requirementboxright{
		margin-left:auto;
		margin-right:auto;
	}
 }