@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed');

html, body{
	margin: 0px;
	padding: 0px;
	overflow-x: hidden;
	font-family: 'Roboto Condensed', sans-serif;
}


.aboutpage h1{
	text-align: center;
	margin: 30px 0 0 0;
	font-weight: 700;
    color: #2426b3;
}
.aboutpage hr{
	width: 72px;
    margin: 6px 0 100px 646px;
    border: 1px solid #2526B3;
}
/* VISION */

#vision{
	height: 350px;
	background-color: #2526B4;
}
#vision h3{
	margin: 25px 0 0 25px;
    color: #fff;
	font-weight: 500;
}
#vision img{
	width: 106%;
    height: 312px;
    margin: -40px 0 0 0;
}
#vision p{
	font-size: 1.2em;
    color: #fff;
	padding:  10px 0 0 25px;
}
#vision ul{
	margin: -10px 0 0 20px;
	list-style: none;
    font-size: 1em;
    color: #fff;
	padding: 0 0 0 0;
}
#vision li:before{ 
    color: #fff;
	content: "-  ";
	padding: 0 0 0 0;
}
/* VISION */

/* MISSION*/
#mission{
	height: 350px;
}
#mission h3{
	margin: 40px 0 0 0;
	font-weight: 500;
}
#mission p{
	font-size: 1.1em;
    padding: 10px 96px 0 0;
    color: #000;
}
#mission img{
	width: 106%;
    height: 312px;
    margin: -40px 0 0 -15px;
}
/* MISSION*/

/* PROFILE*/
#profile{
	height: 360px;
	background-color: #ECE6E6;
    margin-bottom: 430px;

}
#profile h3{
	margin: 30px 0 10px 0px;
	font-weight: 500;
}
#profile p{
	font-size: 1.2em;
	padding: 0 0 0 0px;
	color: #000;
}
#profile .profileimg img{
	width: 100%;
    margin: 30px 0 0px 0px;
}
/* PROFILE*/







/* RESPONSIVE */
@media(max-width: 1280px){
    .aboutpage hr{
        margin: 6px 0 100px 46%;
    }     
}
@media(max-width: 1080px){
    #mission p {
        padding: 10px 90px 0 0;
    }
    #profile {
        height: 400px;
    }    
}

@media(max-width: 960px){
    #mission p {
        font-size: 1.1em;
        padding: 10px 21px 0 0;
    }
    #profile {
        margin-bottom: 320px;
        height: 430px;
    }   
}


@media(max-width: 736px){
    .aboutpage h1 {
        margin: 0 0 0 0;
    }
    #vision img {
        width: 100%;
    }
    #vision {
        height: 484px;
    }
    #mission {
        height: 535px;
    }
    #mission img {
        width: 100%;
        margin: 15px 0 0 0;
    } 
    #profile {
    height: 460px;
}     
}

@media(max-width: 640px){
    #profile {
        height: 500px;
    }   
}

@media(max-width: 568px){
    #profile {
        height: 515px;
        margin-bottom: 225px;
    } 
}
@media(max-width: 533px){
    #profile .profileimg img{
        margin: 20px 0 0 0;
    }
}
@media(max-width: 480px){
    .aboutpage hr {
        margin: 6px 0 100px 43%;
    }
    #profile {
        height: 540px;
    }
}

@media(max-width: 414px){
    .aboutpage hr {
        margin: 6px 0 100px 41%;
    }
    #mission {
        height: 570px;
    }
    #profile p {
        font-size: 1.1em; 
    }
    #profile .profileimg img {
        height: 180px;
        margin: 15px 0 0 0;
    }
}
@media(max-width: 384px){
    #vision {
        height: 520px;
    }
    #profile {
        height: 590px;
        margin-bottom: 205px;
    } 
}
@media(max-width: 375px){
    #vision {
        height: 540px;
    }
    #mission {
        height: 590px;
    }
}
@media(max-width: 360px){
    #profile {
        height: 650px;
    } 

}
@media(max-width: 320px){
    #profile {
        height: 700px;
    }

}

/* RESPONSIVE */