/********************************************************************
IPHONE 6, 6S, 7, 8
********************************************************************/
@media (min-width: 375px) and  (max-width: 379.98px){
    .header h2, section h2 {
        font-size: 40px;
    }

    .section4 .__box-container {
        display: flex;
        flex-direction: row;
        justify-content: start;
        align-items: center;
        background-color: var(--color1);
        min-height: 100px;
        border-radius: 5px;
        padding: 5px;
        width: 410px;
        margin: auto;
    } 

    section{
        text-align: center;
    }

    .section5 .__box-container {
        border-left: 2px solid var(--color1);
        background-color: var(--color1);
    }

    .section6 .bg1 {
        position: absolute;
        right: 130px;
    }

    .section6 .bg2 {
        position: absolute;
        left: -100px;
        bottom: 60px;
    }
    .section h2{
        font-size: 30px !important;
    }
    .section4 .__box-container {
        width: 340px;
    }
  
    .section5 .__box-container .__list {
        text-align: start;
    }
    .section5 .__box-container p {
        padding-left: 20px;
        padding-right: 20px;
      }
}

@media (min-width: 380px) and  (max-width: 499.98px) {
    .header h2, section h2 {
        font-size: 40px;
    }

    .section4 .__box-container {
        display: flex;
        flex-direction: row;
        justify-content: start;
        align-items: center;
        background-color: var(--color1);
        min-height: 100px;
        border-radius: 5px;
        padding: 5px;
        width: 410px;
        margin: auto;
    } 

    section{
        text-align: center;
    }

    .section5 .__box-container {
        border-left: 2px solid var(--color1);
        background-color: var(--color1);
    }

    .section6 .bg1 {
        position: absolute;
        right: 130px;
    }

    .section6 .bg2 {
        position: absolute;
        left: -100px;
        bottom: 60px;
    }
    .section h2{
        font-size: 30px !important;
    }
    .section4 .__box-container {
        width: 340px;
    }
      
    .section5 .__box-container .__list {
        text-align: start;
    }
    .section5 .__box-container p {
        padding-left: 20px;
        padding-right: 20px;
      }
}


/********************************************************************
EXTRA SMALL DEVICES (PORTRAIT PHONES, LESS THAN 576px)
********************************************************************/
@media (min-width: 500px) and (max-width: 575.98px) {
    .header h2, section h2 {
        font-size: 40px;
    }

    .section4 .__box-container {
        display: flex;
        flex-direction: row;
        justify-content: start;
        align-items: center;
        background-color: var(--color1);
        min-height: 100px;
        border-radius: 5px;
        padding: 5px;
        width: 410px;
        margin: auto;
    } 

    section{
        text-align: center;
    }

    .section5 .__box-container {
        border-left: 2px solid var(--color1);
        background-color: var(--color1);
    }

    .section6 .bg1 {
        position: absolute;
        right: 130px;
    }

    .section6 .bg2 {
        position: absolute;
        left: -100px;
        bottom: 60px;
    }
    .section h2{
        font-size: 30px !important;
    }
    .section5 .__box-container p {
        padding-left: 20px;
        padding-right: 20px;
      }
}


/********************************************************************
SMALL DEVICES (LANDSCAPE PHONES, 576PX AND UP)
********************************************************************/
@media (min-width: 576px) and (max-width: 767.98px) { 
    .header h2 {
        font-size: 40px;
    }

    .section4 .__box-container {
        display: flex;
        flex-direction: row;
        justify-content: start;
        align-items: center;
        background-color: var(--color1);
        min-height: 100px;
        border-radius: 5px;
        padding: 5px;
        width: 410px;
        margin: auto;
    } 

    section{
        text-align: center;
    }

    .section5 .__box-container {
        border-left: 2px solid var(--color1);
        background-color: var(--color1);
    }

    .section6 .bg1 {
        position: absolute;
        right: 130px;
    }

    .section6 .bg2 {
        position: absolute;
        left: -100px;
        bottom: 60px;
    }

    .section5 .__box-container p {
        padding-left: 20px;
        padding-right: 20px;
      }
}


/********************************************************************
MEDIUM DEVICES (TABLETS, 768px and Up)
********************************************************************/
@media (min-width: 768px) and (max-width: 991.98px) { 
    .header h2 {
        font-size: 40px;
    }

    .section4 .__box-container {
        display: flex;
        flex-direction: row;
        justify-content: start;
        align-items: center;
        background-color: var(--color1);
        min-height: 100px;
        border-radius: 5px;
        padding: 5px;
        width: 410px;
        margin: auto;
    } 

    section{
        text-align: center;
    }

    .section5 .__box-container {
        border-left: 2px solid var(--color1);
        background-color: var(--color1);
    }

    .section5 .__box-container p {
        padding-left: 20px;
        padding-right: 20px;
      }
      .section5 .__box-container .__list p {
        margin: 0px;
        text-align: start;
      }
}


/********************************************************************
LARGE DEVICES (DESKTOPS, 992px and Up)
********************************************************************/
@media (min-width: 992px) and (max-width: 1000.98px) { 
    .section6 .bg2 {
        position: absolute;
    left: -260px !important;
    bottom: 160px !important;
      }
      
      .section6 .bg2{
        position: absolute;
        left: -100px;
        bottom: 20px;
      }
    
		
}


/********************************************************************
LARGE DEVICES (DESKTOP, 1001 Up)
********************************************************************/
@media (min-width: 1001px) and (max-width: 1199.98px) { 	
    .section6 .bg2 {
        position: absolute;
    left: -260px !important;
    bottom: 160px !important;
      }
      
      .section6 .bg2{
        position: absolute;
        left: -100px;
        bottom: 20px;
      }
 
}


/********************************************************************
EXTRA LARGE DEVICES (LARGE DESKTOPS, 1200px and Up)
********************************************************************/
@media (min-width: 1200px) { 
  
}