/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 20-May-2022, 4:55:28 pm
    Author     : abbho
*/
@media screen and  (min-device-width:1025px) and (max-device-width: 1280px)
{
   
    .service
    {
        display: flex;
        height: 400px;
        height: auto;
        
    }
    
    .banner
    {
        display: block;
        
        height: auto;
    }
    .banner img{
        width: 100%;
    }
    .info
    {
        width: 100%;
        /*font-family:  Century Gothic;*/
        
        text-align: center;
        letter-spacing: 2px;
    /* line-height: 2; */
    margin-bottom: 2%;
    }
    .info u{
        margin-top: 2%;
    }
    .info h1
    {
       width: 100%;
    font-weight: 300;
    font-size: 28px;
    color: #233B69;
    }
    
    .info-text
    {
        display: block;
        width: 60%;
        margin-left: 20%;
        color: black;
    }
    .info-text p
    {
     font-size: 15px;  
     line-height: 2;
    }
    .info-alert
    {
        display: block;
        background-color: #233b69;
        color:#f6f6f6;
        /*font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif;*/
        height: 130px;
        letter-spacing: 5px;
        text-align: center;
    }
    .info-alert h2
    {
        padding-top: 30px;
            font-size: 28px;
    }
    
    .service-head
    {
        display: block;
        /*font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif;*/
        font-size: 28px;
        color: #000000;
        text-align: center;
        margin-top: 4%;
        margin-bottom: 4%;
        letter-spacing: 2px;
    }
    .service{
        display: block;
        margin-bottom: 4%;
        /*font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif;*/
        
    }
    .serv-row
    {
        display: flex;
        
        height: auto;
    }
    .dept-sym-img a
    {
        color: #000000;
        text-decoration: none;
         margin-left: 35%;
    }
    .dept-sym-img img{
        border: 0;
        transition: 0.5s all ease-in-out;
    /* margin-left: 25%; */
    width: 30%;
    }
    
    .dept-sym-img:hover img {
            transform: scale(1.5);
        }
    .serv-col
    {
        width:19.99%;
    }
    .serv-col p
    {
        text-align: center;
        font-size: 28px;
        width: 65%;
        margin-top: 5%;
        margin-left: 17.5%;
    }
    .serv-col p a{
        color: #000000;
        text-decoration: none;
    }
    .service-info
    {
        display: block;
        background-color: #dedede;
        text-align: center;
        /*font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif;*/
        color: #233B69;
        letter-spacing: 2px;
        height:230px;
    }
    .service-info h2{
        font-size: 28px
    }
    .service-info p
    {
        width: 65%;
    margin-left: 17.5%;
    font-size: 15px;
    line-height: 2;
    font-weight: 600;
    }
    
    .review-head
    {
        display: block;
        background-color: #233b69;
        height: 130px;
        color: #f6f6f6;
        text-align: center;
        /*font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif;*/
        padding-top: 2%;
        font-size: 28px;
        letter-spacing: 5px;
    }
    .review-head-text
    {
        
       font-size: 28px;
       
    }
    .review-info{
        display: block;
        text-align: center;
        background-color: #dedede;
       margin-bottom: 2%;
        /*font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif;*/
        color: #233B69;
        letter-spacing: 2px;
        height:230px;
        
    }
    .review
    {
        display: block;
        
        height: auto;
    }
        .review-text
    {
        width: 65%;
        margin-left: 17.5%;
        font-size: 15px;
        font-weight: 600;
        line-height: 2;
        margin-top: 15px;
        
         
    }
    .review-image{
        margin-top: 5%;
    width: 45%;
    justify-content: center;
    }
    .review-image img{
        width: 45%;
        
    }
    .review-msg{
        display: flex;
        margin-left :24.99%;
        margin-bottom: 5%;
            height: 280px;
    }
    .review-msg-text
    {
        display : block;
            margin-left: -10%;
           margin-top: 10%;
    width: 43%;
       
    }
    .review-head-text1{
        display: block;
        text-align: center;
       font-size:28px;
       margin-top: 2%;
        /*font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif;*/
        color: #000000;
        letter-spacing: 2px;
        
    }
    
    
    .socials{
        display: block;
        text-align: center;
        color:white;
    }
    
    .modal-header img{
        width: 100%;
        /*margin-left: 25%;*/
    }
    .m2m_app{
        display: block;
        height: 310px;
        text-align: center;
        background-color: #233b69;
    }
    .m2m_app h3
    {
        color:#ffffff;
        font-size: 28px;
        font-weight: 100;
        letter-spacing: 2px;
    }
    .m2m_app_img1{
        display: block;
        margin-top: 3%;
    }
    .m2m_app_img2{
        display: block;
        margin-top: 2.5%;
    }
    
    .m2m_app_img1 img{
        
        width : 75%;
    }
    .m2m_app_img2 img{
        
        width : 40%;
    }
    
    .m2m_app_img3{
        display: block;
    }
    
     .m2m_app_img3 img{
        margin-top: -5%;
    width: 45%;
    }
    
    .m2m_app_img2_1{
        display: block;
    }
    .m2m_app_img2_2{
        display: block;
        margin-top: 10px;
    }
    
    .our_associates
    {
        display: block;
        
        text-align: center;
        
        /*font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif;*/
    }
    .assosiate_grp{
        display: flex;
    }
    .assosiate {
    display: block;
    height: 300px;
   
    margin-bottom: 5%;
    text-align: center;
}

.assosiate img{
    width: 20%;
    height: 30%;
     margin-top: 3%;
}

    .our_associates h3
    {
        color:#000000;
        font-size: 28px;
        font-weight: 100;
        letter-spacing: 2px;
    }
    .modal-body{
        text-align: center;
        font-weight: 800;
    }
    .blueline {
        padding-bottom: 10px;
        border-bottom: 1.5px solid #233B69;
        line-height: 70px;
    }
    .whiteline{
        padding-bottom: 10px;
        border-bottom: 2px solid #ffffff;
        line-height: 50px;
    }
    .blackline{
        padding-bottom: 10px;
        border-bottom: 2px solid #000000;
        line-height: 50px;
    }
    .suggest_me_block
    {
        display: block;
        height: 200px;
        background:none;
        margin-bottom:100px;
        
    }
    .suggest_me_block a{
        text-decoration: none;
        margin-left:30%
    }
    .button{
        margin-top: 8%;
        position: absolute;
        font-size: 28px;
        color: white;
        margin-left:10%
    }
    .suggest_me_block img
    {
        width: 40%;
        margin-top: 6%;
        cursor: pointer;
        
    }
   
    a :hover, a :active 
    {
        font-size: 28px;
        
        font-weight: 800;
    }
    
    
       .arrow{
          cursor: pointer;
    position: absolute;
    margin-top: -15%;
    width: 76%;
    margin-left: 12%;
    /* padding: 16px; */
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    }
    
    .prev, .next {
 
  
  color: black;
 
  font-size: 40px;
  
  
}

/* Position the "next button" to the right */
.next {
  float: right;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  color: grey;
}


/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 5px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  margin-bottom: 3%;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.auth_name{
    margin-top: 2%;
    font-style: italic;
    font-weight: bold;
    font-size: 13px;
    letter-spacing: 2px;
}

.assosiation{
    display: block;
}



.cover {
  padding: 0px 30px;
  
  display: block;

      margin-top: 5%;
}
.left {
  position: absolute;
  left: 0;
  top: 50%;
  font-size: 30px;
  border: none;
  background: none;
  
  transform: translateY(-50%);
}
.right {
  position: absolute;
  right: 0;
  top: 50%;
  font-size: 30px;
  border: none;
  background: none;
  transform: translateY(-50%);
}
.scroll-images{
    width:100%;
    display: flex;
    overflow-y: hidden;
    overflow-x: scroll;
    scroll-behavior: smooth;
    
}
.scroll-images::-webkit-scrollbar {
  display: none;
}
.scroll-images img{
    width: 20%;
    margin-left: 5%;
}

.review-image_mobile{
       display: none;
    width: 65%;
     margin-left: 17.5%;
    justify-content: center;
    }
    .review-image_mobile img{
        width: 100%;
        
    }
    .review-msg_mobile{
        display: none;
        
        margin-bottom: 5%;
           
    }
    .review-msg-text_mobile
    {
        display: none;
    margin-left: 7%;
    margin-top: 10%;
    letter-spacing: 1px;
    line-height: 2;
    font-size: 12px;
    width: 86%;
    }
    
     .serv-row_mob
    {
        display: none;
        text-align: center;
        height: auto;
    }
    .dept-sym-img_mobile a
    {
        color: #000000;
        text-decoration: none;
         margin-left: 35%;
    }
    .dept-sym-img_mob img{
        border: 0;
        transition: 0.5s all ease-in-out;
    /* margin-left: 25%; */
    width: 60%;
    }
    
    .dept-sym-img_mob:hover img {
            transform: scale(1.2);
        }
    .serv-col_mob
    {
        width:50%;
    }
    .serv-col_mob p
    {
        text-align: center;
        font-size: 15px;
        
        margin-top: 5%;
        
    }
    .serv-col_mob p a{
        color: #000000;
        text-decoration: none;
    }
    
    .fade 
    {
	-webkit-animation-name: fade;
	-webkit-animation-duration:6s;
	animation-name: fade;
	animation-duration: 6s;
    }
    
    @-webkit-keyframes fade 
    {
      from {opacity: .4} 
      to {opacity: 1}
    }
    
    @keyframes fade {
      from {opacity: .4} 
      to {opacity: 1}
    }

}