@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500');

html, body{ overflow-x: hidden;
font-family: 'Roboto', sans-serif; }

/*-------Header-------------*/

.bg-color1{ 
        background-color:#006c9d;
		font-family: 'Roboto', sans-serif;
    }
.block1 .left-top ul li{
                    list-style: none;
                    display: inline;
                }
.block1 .social-box{
                padding-top: 10px;
            }
.block1 .social-box i{
                    padding-left:15px;
                    font-size: 20px;
                    color: white;
                   
                }
.block1 .phone-box{
            padding-top: 15px;
        }
.block1 .phone-box a{
                float: right;padding-right: 50px;
                color: white;
            }   
@media(max-width:700px){
.block1 {display:none}  
}

.block2{
    text-align: center;
	font-family: 'Roboto', sans-serif;
}  

.block2 .col-md-9{
	text-align:right;
	padding-right:100px}
.block2 .row{
        margin: 15px 0;
    }
.block2 h3{
        color: #006c9d;
    }
@media(max-width:1100px){
.block2 .col-md-9{width: 100%;}
.block2 h2{font-size: 26px;}
.block2 h3{font-size: 22px;}
}

@media(max-width:700px){
.block2 {display:none}  
}


/*------------Navbar-----------*/
.main-nav{
	z-index:99;
}

@media(max-width:950px){
	.nav-wrapper{
	margin-bottom:55px;
}
}

.main-nav a{
	font-size:17px;
	font-weight:bold;
}


/*--------------------------Block2-----------------------*/
#section2a{
             background-image: url("../image/bio.jpg");
			 box-shadow:0px 1px 5px grey;
        }
.bg-color2a{
                background-color:rgba(28,73,114,0.95);
            }
.block2a .bg1 p{
                 text-align: center;
                 color: white;
                 font-size: 24px;
                 padding: 70px 0 50px 0;
                }
.block2a .bg2 p{
                    text-align: center;
                    color: white;
                    font-size: 15px;
                    padding: 70px 0 50px 0;
                }
.block2a .bg2 a{
                    color: white;
                }
.block2a .bg2 a:hover{
                    color: orange;
                }
@media(max-width:1000px){
    .block2a .bg1 p{
        text-align: center;
        color: white;
        font-size: 24px;
        padding:10px 0;
       }
.block2a .bg2 p{
           text-align: center;
           color: white;
           font-size: 16px;
           padding: 10px 0;
       }
}

@media(max-width:700px){
	.block2a .bg1 p{
                 font-size: 20px;
                }
	
	.block2a .bg2 p{
         display:none;
       }
}

/*--------------------------Block3-----------------------*/

.block3{
	padding:80px 50px;
}

.block3 button{
					background-color: #006C9E;
					border:none;
					color: white;
					font-size: 16px;
					padding: 10px 20px;
					cursor:pointer;
				}
.block3 button:hover{
						background-color:#006C9E
						;opacity: 0.7; 
					}
.block3 .bg1{
				background-color:#eee;
				border-top: 3px solid orange;
				margin-top: 20px;

			}
.block3 .bg1 p{
					color: #006C9E;
					font-size: 16px;
					padding-left: 20px;
					padding-bottom:5px;
				}
.block3 .fas{
				padding-right: 10px;
				font-size: 18px;
			}

.block3 .bg1 h4{
					padding-left: 20px;
					font-size: 22px;
					padding-top: 20px;
					color: gray;
				}
				
.block3 .col-md-5{
	padding-left:80px;
}
.block3 h3{
			
				font-size: 28px;
			}
.block3 hr{
			margin-left: 30px;
		}
@media(max-width:1000px){
	.block3 .bg1{margin: 10px 20px;}
	.block3{
	padding:80px 20px;
}

.block3 .col-md-5{
	padding-left:0px;
	padding-top:30px;
}

.block3 .bg1 p{
	font-size:14px;
}

}

/*------------------------Block6------------------------*/

.block6{
	text-align: center;
	margin: 20px auto;
}
.block6 .row{margin-top: 30px;display:flex}
.block6 .div1 .fas{
		font-size: 30px;
		color:#EB7337;
		background-color: transparent;
		padding-top: 30px;
	}
.block6 .div1{
			border: 1px solid black;
			margin-bottom: 10px;
			height:250px;
			padding:10px;
		}


@media(max-width:1000px){
.block6 .bg1{padding-bottom:20px;}
.block6 .bg2{padding-bottom:20px;}
.block6 h4{
		font-size:21px;
	}
	
	.block6 .div1{
			padding:20px;
			height:300px;
		}
		
		.block6 .div1 p{
			font-size:14px;
		}
}

@media(max-width:700px){
	.block6 .div1{
			padding:20px;
			height:220px;
		}
}

/*---------------------Block13-------------------------*/

.block13{
	background-color:#ddd;
	text-align:center;
}

.block13 .a1{
	text-align:center;
	color:black;
	background-color:#EB7337;
	margin:0px 5px;
	padding:5px;
	font-weight:bold;
	font-size:55px;
}

.block13 .col-md-1 i{
color:#EB7337;
}

@media(max-width:700px){
	.block13 .a1{
		font-size:30px;
	}
	
	.block13 .col-md-1 i{
		display:none;
	}
}
			
/*--------------------Footer Block14----------------------*/

.block14{
            color: white;
        }
.block14 .col-md-4 .row{
                            margin-top: 30px;
                            margin-bottom: 20px;
                        }
.block14 .col-md-12{
                     background-color: #1c4b81;
            }       
.block14 .col-md-12 p{
                        text-align: center;
                        font-size: 30px;
                        padding: 8px 24px;
                    }
.block14 .bg1 .active{
                        color: orange;
                     }
.block14 .bg1{
                background-color: #01669c;
            }
.block14 .bg1 ul li{
                        list-style-type: none;
                        color: white;
                        padding-top: 10px;
                    }
.block14 .bg1 li a{ 
                        color: white;font-size: 17px;
                    }
.block14 .bg1 li a:hover{ 
                            color: orange;
                        }
.block14 .col-md-3 .fas{
                            color:white;
                            font-size: 20px;
                            text-align:right;
                            padding: 10px 5px;
                        }
.block14 .col-md-3 button{
                            border-radius: 50%;
                            background-color: orange;
                            float: right;
                        }
.block14 .bg2{
                    background-color: #0072a8; 
            }
.block14 .bg3{
                background-color:#007bb1;
                }
.block14 .col-md-9 p{
                        padding-top: 5px;
                        text-align: left;
                        line-height: 30px;
                        font-size: 15px;
                    }
.block14 hr{
                width: 50%;
                background-color: white;
                margin-top: -10px;
                margin-bottom: -10px;
            }
.block14 .col-md-11 .fab{
                            color:white;
                            font-size: 25px;
                            text-align:right;
                        }
.block14 .col-md-11 button{
                                background-color: transparent;
                                float: right;
                                border: none;
								margin-right:20px;
                            }
@media(max-width:920px){
.block14 .col-md-3 button{float: left;margin-left: 20px;}
.block14 .col-md-9 p{padding-left: 20px;}
.block14 .bg1 ul{margin-left: -15px;}
}

@media(max-width:700px){
	.block14 .col-md-12 p{
                        font-size: 20px;
                    }
	
	.block14 .bg1 li a{ 
                        color: white;font-size: 15px;
                    }
					
	                }
.block14 .col-md-9 p{
                        
                        font-size: 14px;
                    }
}

/*---------------------Footer END---------------------*/




/* -------------------SLIDE ANIMATION ----------------------------*/

.slideanim {visibility:hidden;}
.slide1 {
    /* The name of the animation */
    animation-name: slide1;
    -webkit-animation-name: slide1; 
    /* The duration of the animation */
    animation-duration: 1s; 
    -webkit-animation-duration: 1s;
    /* Make the element visible */
    visibility: visible; 
}

/* Go from 0% to 100% opacity (see-through) and specify the percentage from when to slide in the element along the Y-axis */
@keyframes slide1 {
    0% {
        opacity: 0;
        transform: translateY(40%);
    } 
    100% {
        opacity: 1;
        transform: translateY(0%);
    } 
}
@-webkit-keyframes slide1 {
    0% {
        opacity: 0;
        -webkit-transform: translateY(40%);
    } 
    100% {
        opacity: 1;
        -webkit-transform: translateY(0%);
    }
}


/*-----------------------SLIDEANIMATION 2----------------------*/

.slideanim2 {visibility:hidden;}
.slide2 {
    /* The name of the animation */
    animation-name: slide2;
    -webkit-animation-name: slide2; 
    /* The duration of the animation */
    animation-duration: 1s; 
    -webkit-animation-duration: 1s;
    /* Make the element visible */
    visibility: visible; 
}

/* Go from 0% to 100% opacity (see-through) and specify the percentage from when to slide in the element along the Y-axis */
@keyframes slide2 {
    0% {
        opacity: 0;
  
    } 
    100% {
        opacity: 1;
    } 
}
@-webkit-keyframes slide2 {
    0% {
        opacity: 0;
    } 
    100% {
        opacity: 1;
       
    }
}

/*-----------------------SLIDEANIMATION 3----------------------*/

.slideanim3 {visibility:hidden;}
.slide3 {
    /* The name of the animation */
    animation-name: slide3;
    -webkit-animation-name: slide3; 
    /* The duration of the animation */
    animation-duration: 1s; 
    -webkit-animation-duration: 1s;
    /* Make the element visible */
    visibility: visible; 
}

/* Go from 0% to 100% opacity (see-through) and specify the percentage from when to slide in the element along the Y-axis */
@keyframes slide3 {
    0% {
        opacity: 0;
        transform: translateY(-70%);
    } 
    100% {
        opacity: 1;
        transform: translateY(0%);
    } 
}
@-webkit-keyframes slide3 {
    0% {
        opacity: 0;
        transform: translateY(-70%);
    } 
    100% {
        opacity: 1;
       transform: translateY(0%);
    }
}


/*-----------------------SLIDEANIMATION 4----------------------*/

.slideanim4 {visibility:hidden;}
.slide4 {
    /* The name of the animation */
    animation-name: slide4;
    -webkit-animation-name: slide4; 
    /* The duration of the animation */
    animation-duration: 500ms; 
    -webkit-animation-duration: 500ms;
    /* Make the element visible */
    visibility: visible; 
}

/* Go from 0% to 100% opacity (see-through) and specify the percentage from when to slide in the element along the Y-axis */
@keyframes slide4 {
    0% {
        opacity: 0;
        transform: translateX(-20%);
    } 
    100% {
        opacity: 1;
        transform: translateX(0%);
    } 
}
@-webkit-keyframes slide4 {
    0% {
        opacity: 0;
        transform: translateX(-20%);
    } 
    100% {
        opacity: 1;
       transform: translateX(0%);
    }
}

/*-----------------------SLIDEANIMATION 5----------------------*/

.slideanim5 {visibility:hidden;}
.slide5 {
    /* The name of the animation */
    animation-name: slide5;
    -webkit-animation-name: slide5; 
    /* The duration of the animation */
    animation-duration: 500ms; 
    -webkit-animation-duration: 500ms;
    /* Make the element visible */
    visibility: visible; 
}

/* Go from 0% to 100% opacity (see-through) and specify the percentage from when to slide in the element along the Y-axis */
@keyframes slide5 {
    0% {
        opacity: 0;
        transform: translateX(20%);
    } 
    100% {
        opacity: 1;
        transform: translateX(0%);
    } 
}
@-webkit-keyframes slide5 {
    0% {
        opacity: 0;
        transform: translateX(20%);
    } 
    100% {
        opacity: 1;
       transform: translateX(0%);
    }
}