/*******
*
* Added by Mustaque to design section[KeyFeature]

***/

/***section heading******/


.ftco-section .heading-section
{
    font-size: 40px;
    font-weight: 700;
    color: #000;
}

/* cards display code start*/

.ftco-section .cardrow
{
    display: flex;
    flex-direction: row;
    flex-wrap:wrap;
    justify-content: space-between;  
}




.ftco-section .cardrow .card .row 
{
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    width:100%;
    justify-content: space-between;   
}



/* cards display code end*/

/*width of inner card-body of cards */

.ftco-section .cardrow .card .card-body
{
    width:4rem;
  
}

/*width of outer cards */
.ftco-section .cardrow .card
{
    width:32.5rem;
    margin-bottom: 2rem;
}


/**********************styling cards**********************/
/*cards border*/
.ftco-section .cardrow .card
{
    border:none;
}

/*card-heading */

.ftco-section .cardrow .heading
{
    font-size: 1.3rem;
    font-weight: bold;
 
   
}

/**hover effect for cards****/
.ftco-section .cardrow .card:hover
{
    background-color: #0A3FFF;
}

.ftco-section .cardrow .card:hover .heading,
.ftco-section .cardrow .card:hover p
{
    color: white;
}


/********************************************************************************/

/**media query  for responsive start >>>>>>>>>>>>>>>>>>>>>>>>>***/

/* Custom, iPhone Retina and  Extra Small Devices, Phones   start */

@media screen and (min-width:320px) and (max-width:767px)
{
        
    .ftco-section .container .cardrow .card-reverse .row
    {
    flex-direction:row-reverse;
    }
    .ftco-section .container .cardrow .card-reverse .card-body
    {
        
        text-align: left !important;
    }
    .ftco-section .container .cardrow .card-reverse .row img
    {
        margin-left: 1rem;
    }

    
}
/* Custom, iPhone Retina  and  Extra Small Devices, Phones  end */ 


 /* Small Devices, Tablets start */

 @media screen and (min-width:768px) and (max-width:991px)
 {
     .ftco-section .cardrow .card
     {
         width:19.5rem;
       
     }
    
     .ftco-section .container .cardrow .card-right .row .firstimg-right
     {
       
         margin-top:9rem !important;
     }
 
     .ftco-section .container .cardrow .card-right .row .secondimg-right,
     .ftco-section .container .cardrow .card-right .row .fourthimg-right
     {
       
        margin-top:-7.5rem !important;
 
     }

     .ftco-section .container .cardrow .card-right .row .thirdimg-right
     {
       
         margin-top: 12.5rem  !important;
      
         
     }
 }


 /* Medium Devices, Desktops  start*/

 @media screen and (min-width:992px) and (max-width:1199px)
 {
    .ftco-section .cardrow .card
    {
        width:27rem;
      
    }
    .ftco-section .container .cardrow .card-right .row .thirdimg-right
    {
      
        margin-top: 5rem  !important;
    }
    .ftco-section .container .cardrow .card-right .row .fourthimg-right
     {
       
        margin-top:-4rem !important;
       
 
     }

 }

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< media query  for responsive end***/