﻿
.head{
   color:#061771;
  font-weight: 500;
  margin-bottom: 1em;
  text-align:center;
  padding-top:1em;
  text-transform:uppercase;
  padding-bottom:0.8em;
}
.aboutus .photo img {
    width: 100%;
}
@media (max-width: 548px) {
    .aboutus .wrap-block {
        padding: 0.5em 1em;
    }
    h5{
        font-size:1.05em;
    }
}

.abtcol{          
            -webkit-animation-duration: 3s;
            animation-duration: 3s;
            -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
         }
         
 @-webkit-keyframes fadeInRight {
            0% {
               opacity: 0;
               -webkit-transform: translateX(20px);
            }
            100% {
               opacity: 1;
               -webkit-transform: translateX(0);
            }
         }
         
         @keyframes fadeInRight {
            0% {
               opacity: 0;
               transform: translateX(20px);
            }
            100% {
               opacity: 1;
               transform: translateX(0);
            }
         }
         
         .fadeInRight {
            -webkit-animation-name: fadeInRight;
            animation-name: fadeInRight;
         }
.aboutus {
    padding:3em 3.5em 2em 3.5em;
}

.vision {
    padding:2em 3em 2em 3em;
}

@media (max-width: 548px) {
    .vision {
        padding: 1em 1em 1em 1em;
    }
    .aboutus {
        padding: 1em;
    }
    
}

.visionBox{
    padding: 2em 1.8em;
    background: #fff;
    border: 0.11em solid #0053a3;
    border-bottom-color: #0053a3;
    text-align: center;
    position: relative;
    transition: all 0.5s ease 0s;
    height:100%;
}
.visionBox:hover{ border: 0.11em solid #0053a3; }
.visionBox:before,
.visionBox:after{
    content: "";
    width: 70%;
    height: 0.32em;
    background: #0053a3;
    opacity: 0;
    position: absolute;
    top: -0.18em;
    left: 35%;
    transform: translateX(-50%);
    transition: all 0.5s ease 0s;
}
.visionBox:hover:before,
.visionBox:hover:after{
    opacity: 1;
    left: 50%;
}
.visionBox:after{
    top: auto;
    bottom: -0.18em;
}
.visionBox .vision-icon{
    width: 2.5em;
    height:2.5em;
    line-height:2.5em;
    border-radius: 50%;
    background: #0053a3;
    margin: 0 auto 1.25em;
    font-size: 1.5em;
    color: #fff;
}
.visionBox .title{
    font-size: 1.25em;
    font-weight: bold;
    color: #252525;
    margin: 0 0 0.62em 0;
    transition: all 0.5s ease 0s;
}
.visionBox:hover .title{ opacity: 0; }
.visionBox .description{
    margin: 0;
    transition: all 0.5s ease 0s;
}
.visionBox:hover .description{
    margin-top: -1.25em;
    padding-bottom: 1.25em;
}
@media only screen and (max-width:990px){
    .visionBox{ margin-bottom: 30px; }
}

.bullet { 
   padding-left:1em;
}
.bullet ul {
  list-style:none;
 text-align:justify;
}
.bullet li{
    padding-bottom:0.5em;
    text-align: justify;
   
}
.bullet ul li::before {
  content: "\2022";
  color:blue;
  font-weight: bold;
  display: inline-block; 
  width: 1em;
  margin-left: -1em;
}
.vrow{
     display: flex;
    flex-wrap: wrap;
}
.vcol{
    padding-bottom:1em;
}