body,html{
    margin: 0px;
    padding: 0px;
    overflow-x: hidden;
    font-family: 'Roboto', sans-serif!important;
    scroll-behavior: smooth;
}
.header{
    position: fixed;
    background-color: #fff;
    width: 100%;
    z-index: 99;
}
.line1{
    background-color: #3E5BA1;
    height: 7px;
    margin-bottom: 5px;
}
.icon1 ul{
    list-style-type: none;
    color:#005EBE;
    font-weight: bold;
}
.icon1 li{
    display: inline-block;
}
.icon1 i{
    color: black;
    font-weight: bold;
    padding: 5px;
    margin-left: 5px;
}
.nav a{
    color: black;
    font-weight: bold;
}
.nav a:hover{
    color: #005EBE;
}
.slider{
    margin-top: 8%;
}
/*=================== media query =================*/

@media only screen and (max-width: 600px) {
    .logo img{
        width: 150px;
    }
    .icon1 li{
        padding-bottom: 8px;
        padding-left: 12px;
    }
    .icon1 ul{
        padding-top: 5px;
    }
    .navigation{
        background-color: #667AB3;
    }
    .mobimenu{
        background-color: #667AB3!important;
    }
    #btn1{
        position: relative;
        top: 5px!important;
        margin-bottom: 20px;
    }
    #para{
        margin-top: 55px;
    }
    .name2 a{
        margin-left: 90px!important;
        position: relative;
        top: 30px;
    }
    .name1 a{
        margin-left: 75px!important;
        position: relative;
        top: 30px;
        /* bottom: 20px; */
    }
    .vision{
        margin-top: 40px;
    }
    .slider {
        margin-top: 60%;
    }
  }

  /* ////////////////////////// */


 
        /*jssor slider loading skin spin css*/
        .jssorl-009-spin img {
            animation-name: jssorl-009-spin;
            animation-duration: 1.6s;
            animation-iteration-count: infinite;
            animation-timing-function: linear;
        }

        @keyframes jssorl-009-spin {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        /*jssor slider bullet skin 053 css*/
        .jssorb053 .i {position:absolute;cursor:pointer;}
        .jssorb053 .i .b {fill:#fff;fill-opacity:0.3;}
        .jssorb053 .i:hover .b {fill-opacity:.7;}
        .jssorb053 .iav .b {fill-opacity: 1;}
        .jssorb053 .i.idn {opacity:.3;}

        /*jssor slider arrow skin 093 css*/
        .jssora093 {display:block;position:absolute;cursor:pointer;}
        .jssora093 .c {fill:none;stroke:#fff;stroke-width:400;stroke-miterlimit:10;}
        .jssora093 .a {fill:none;stroke:#fff;stroke-width:400;stroke-miterlimit:10;}
        .jssora093:hover {opacity:.8;}
        .jssora093.jssora093dn {opacity:.6;}
        .jssora093.jssora093ds {opacity:.3;pointer-events:none;}

        /*===========  about  =============*/

        .about h4{
            color: #001F5F;
            padding-top: 20px;
        }
        .about h3{
            color: #0841A4;
            font-weight: 600;
        }
        .about p{
            color: #8B8B8B;
            font-size: 14px;
            line-height: 1.8;
            text-align: justify;
        }
        .about h4{
            color: #0841A4;
            font-weight: 600;

        }
        #btn1{
            background: linear-gradient(to top right, #016AA9 38%, #009ACE 63%);
            color: white;
            padding: 5px 25px;
            border: none;
            border-radius: 4px;
            position: relative;
            top: -50px;
            left: 10px;
            cursor: pointer;
        }
        #phone{
            margin-top: -20px;
        }
        .about input{
               margin: 10px; 
               border: 1px solid lightgrey;
               width: 235px;
        }
        .about textarea{
            margin: 10px; 
            border: 1px solid lightgrey;
            
         }
         

         /*=============  service  ==============*/
         .services{
            padding: 1% 0;
            background: url('../images/BG.png');
        }
        .services h3{
            text-align: center;
            color: #0841A4;
            font-weight: 600;
            font-size: 35px;
        }
        .services p{
            color:#4F5252;
            font-weight: 600;
            text-align: center;
            font-size: 14px;
        }
        .serv-img{
            padding: 24px;
            background-color: #fff;
            border-radius: 5px;
        }
        
        .serv-img h3{
            background-color: #232E5B;
            color: white;
            /* width: 106%; */
            margin: 5px -3%;
            padding: 6px 3px
        }
        /* side tab */
        body {background:#7cbac1; margin: 0;}
        /* Vertical Tabs */
         .vertical-tabs{
            font-size:15px;
            padding:10px;
            color:#000
        }
         .vertical-tabs .nav-tabs .nav-link{
            border-radius: 0;
            background: #3f5ca2;
            text-align:center;
            font-size: 16px;
            border:1px solid white;
            color:#fff;
            height:40px;
            width: 275px
        }
         .vertical-tabs .nav-tabs .nav-link.active{
            background-color:#232E5B!important;
            color:#fff;
        }
         .vertical-tabs .tab-content.active{
            background:#fff;
            display:block;
        }
         .vertical-tabs .nav.nav-tabs{
            border-bottom:0;
            display:block;
            float:left;
            margin-right:20px;
            padding-right:15px;
        }
         .vertical-tabs .sv-tab-panel{
            background:#fff;
            height:274px;
            padding-top:10px;
        }
        .vertical-tabs .nav-tabs1 .nav-link{
            border-radius: 0;
            background: #3f5ca2;
            text-align:center;
            font-size: 16px;
            border:1px solid white;
            color:#fff;
            height:40px;
            width: 275px
        }
         .vertical-tabs .nav-tabs .nav-link.active{
            background-color:#232E5B!important;
            color:#fff;
        }
        .services h4{
            background-color: #232E5B;
            color: #fff;
            padding: 10px;
            text-align: center;
        }
        
        @media only screen and (max-width: 420px){
          .titulo{font-size: 22px}
          #tab-img{
            padding-left: 0!important;
            margin: 20px;
            margin-bottom: 0;
          }
          .vertical-tabs .sv-tab-panel{
            width: 275px;
            height: 225px;
          }
        }
        @media only screen and (max-width: 325px){
          .vertical-tabs{ padding:8px;}
        }
        footer1{
            position: absolute;
            bottom: 0;
            width: 100%;
            text-align: center;
            color:#fff;
            font-size: 9px;
        }
         /* =============  service ============== */
         

         /*===================  partner  ============*/
         #partner1 h3{
            text-align: center;
            color:#3862B4 ;
            font-weight: 600;
            padding-top: 25px;
            margin-bottom: 35px;
         }
         .name1 a{
            background-color: #0954B1;
            color: white;
            padding: 10px 75px;
            border-radius: 6px;
            margin-left: 110px;
            position: relative;
            top: 30px;
         }
         .name1 a:hover{
            color: white;
         }
         .name2 a{
            background-color: #0954B1;
            color: white;
            padding: 10px 78px;
            border-radius: 6px;
            margin-left: 40px;
            position: relative;
            top: 30px;
         }
         .name2 a:hover{
            color: white;
         }
         #para{
            color: #8B8B8B;
            text-align: center;
         }

         /* ===========  footer========== */
         *{
            font-family: 'Source Sans Pro', sans-serif;
        }
        .gallery-main{
            padding: 3% 0;
        }
        .gallery{
            text-align: center;
            color: #083DA2;
        }
        .gallery h3{
            margin-top: -20px;
            font-weight: 600;
        }
        
        .footer{
            padding: 3% 0;
            text-align: center;
            width: 100vw;
            background-color: #212429;
            margin-top: 29px;
           
        }
        .footer h2{
            color: #B1D5FF;
            font-size: 25px;
            font-weight: 600;
        }
        
        .footer h4{
            color:#FFFFFF;
            font-size: 20px;
            font-weight: 600;
            margin-bottom: 30px;
            margin-top: 20px;
        }
        
        .footer{
            /* height: 473px; */
        }
        
        #address h6{
            color: #A7CAF2;
        }
        #address p{
            color: white;
        }
        #address a{
            color: white;
        }
        .bottom-line p{
            /* padding-left: 480px; */
            color: white;
            padding-top: 20px;
        }
        #left-arrow{
            content: "\f100";
            position: relative;
            bottom: -150px;
            right: -443px;
            /* color: #0D4087; */
            color: blue;
            background-color: #8FC0FE;
            /* width: 2%; */
            padding: 4px;
            padding-left: 15px;
            padding-right: 17px;
            border-radius: 5px;
        }
        #right-arrow{
            content: "\f101";
            position: relative;
            bottom: -150px;
            left: -443px;
            /* color:#0D4087; */
            color: blue;
            background-color: #8FC0FE;
            padding: -16px;
            padding-left: 14px;
            padding-right: 14px;
            border-radius: 5px;
        }
        
        
        @media only screen and (max-width: 600px) {
            .footer {
                width: 100vw;
            }
          }
          
        
        @media (min-width: 768px) {
            .carousel-control-prev span{
                color: red;
            }
            .carousel-control-prev i{
                font-size: 30px;
                color: red;
                font-weight: 600;
            }
            .carousel-control-next i{
                font-size: 30px;
                color: red;
                font-weight: 600;
            }
            .border_up{
                background-color: blue;
                height: 3px;
            }
            .bottom-line p{
                /* position: relative; */
                /* top: -41px; */
                font-size: 13px;
            }
            #line{
                width: 16%;
                height: 3px;
            }
        
        
            /* show 3 items */
            .carousel-inner .active,
            .carousel-inner .active + .carousel-item,
            .carousel-inner .active + .carousel-item + .carousel-item,
            .carousel-inner .active + .carousel-item + .carousel-item + .carousel-item  {
                display: block;
            }
            
            .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left),
            .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item,
            .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item,
            .carousel-inner .carousel-item.active:not(.carousel-item-right):not(.carousel-item-left) + .carousel-item + .carousel-item + .carousel-item {
                transition: none;
            }
            
            .carousel-inner .carousel-item-next,
            .carousel-inner .carousel-item-prev {
              position: relative;
              transform: translate3d(0, 0, 0);
            }
            
            .carousel-inner .active.carousel-item + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
                position: absolute;
                top: 0;
                right: -25%;
                z-index: -1;
                display: block;
                visibility: visible;
            }
            
            /* left or forward direction */
            .active.carousel-item-left + .carousel-item-next.carousel-item-left,
            .carousel-item-next.carousel-item-left + .carousel-item,
            .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item,
            .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item,
            .carousel-item-next.carousel-item-left + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
                position: relative;
                transform: translate3d(-100%, 0, 0);
                visibility: visible;
            }
            
            /* farthest right hidden item must be abso position for animations */
            .carousel-inner .carousel-item-prev.carousel-item-right {
                position: absolute;
                top: 0;
                left: 0;
                z-index: -1;
                display: block;
                visibility: visible;
            }
            
            /* right or prev direction */
            .active.carousel-item-right + .carousel-item-prev.carousel-item-right,
            .carousel-item-prev.carousel-item-right + .carousel-item,
            .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item,
            .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item,
            .carousel-item-prev.carousel-item-right + .carousel-item + .carousel-item + .carousel-item + .carousel-item {
                position: relative;
                transform: translate3d(100%, 0, 0);
                visibility: visible;
                display: block;
                visibility: visible;
            }
        
        }
        
         /* Bootstrap Lightbox using Modal */
        
        #profile-grid { overflow: auto; white-space: normal; } 
        #profile-grid .profile { padding-bottom: 40px; }
        #profile-grid .panel { padding: 0 }
        #profile-grid .panel-body { padding: 15px }
        #profile-grid .profile-name { font-weight: bold; }
        #profile-grid .thumbnail {margin-bottom:6px;}
        #profile-grid .panel-thumbnail { overflow: hidden; }
        #profile-grid .img-rounded { border-radius: 4px 4px 0 0;}