*{
    margin:0;
    padding:0;
    font-family: font-family 'Noto Sans JP', sans-serif;
}
.header{
    height:50vh;
    width:100%;
    background-image:linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7)),url("img/health.jpg");
    box-shadow: 0 0 20px 0px rgba(0,0,0,0.2);
}
h1{
    font-size: 3em;
    text-align: center;
}

.navbar{
    min-height: 10vh;
    background:#fff;
    display:flex;
    justify-content: space-between;

}
.logo img{
    height:10vh;
    width:20vh;
    padding:5px 10px;
}

.nav ul li {
    display:inline-flex;
    padding:10px 20px;
    flex:1;
	text-align: right;
    transition:1s;
}
.nav ul li a{
    font-size:1.2rem;
    color:lightslategray;
    text-decoration: none;
}
.sub-menu ul li {
    display :none;
    background:rgb(90, 182, 243);
    padding:10px 0;
    text-align:left;
}
.sub-menu ul li a{
    color:#fff;
}
.nav ul li :hover{
    color:black;
    transition:1s;
}
.nav ul li:hover .sub-menu ul li{
    display:block;
}

.donate button{
    background:rgb(90, 182, 243);
    border:none;
    height:7vh;
    width:30vh;
    margin:10px 10px;
    font-size:1.3rem;
    font-family:Calibri;
    color:#fff;
    border-radius:10px;
    transition:3s;
    cursor:pointer;
}
.donate button:hover{
    background:rgb(88, 243, 88);
    color:#fff;
}

.text-box{
	width:90%;
	color:#fff;
	position:relative;
	top:25%;
	left:50%;
	transform:translate(-50%,-50%);
	text-align:center;
}
.text-box h1{
	font-size:62px;
    color:#fff;
}
@media(max-width:700px){
    .text-box h1{
		font-size:50px;
	}
    .nav ul li{
		display:block;
	}
	.nav{
		position:absolute;
		background:rgb(90, 182, 243);
		height:auto;
		width:200px;
		top:0;
		right:-200px;
		text-align:left;
		z-index:2;
		transition:1s;
	}
	.nav .fa{
		display:block;
		color:#fff;
		margin:10px;
		font-size:30px;
		cursor:pointer;
	}
	.nav ul{
		padding:30px;
	}
    .row{
       flex-direction:column;
    }
}

/*-----about-----*/

.services{
	width:80%;
	margin:auto;
	text-align:center;
	padding-top:100px;
}
h1{
	font-size:36px;
	font-weight:600;
}
p{
	color:rgb(53, 44, 44);
	font-size:1.2rem;
	font-weight:300;
	line-height:22px;
	padding:10px;
}
.row{
	margin-top:5%;
	display:flex;
	justify-content:space-between;
}
.service-col{
	flex-basis:50%;
    height:80vh;
    width:100%;
	background:#fff3f3;
	border-radius:10px;
	margin-bottom:5%;
	padding:20px 12px;
	box-sizing:border-box;
	transition:0.5s;
}
.service img{
    height:80vh;
}
h3{
	text-align:center;
	font-weight:600;
	margin:10px 0;
}
.service-col:hover{
	box-shadow: 0 0 20px 0px rgba(0,0,0,0.2);
}
.gallery img{
    height:40vh;
}
@media(max-width:700px){
	.row{
		flex-direction:column;
	}
    .gallery img:hover{
        height:40vh;
        width:auto;
    }
}

.gallery{
    display:flex;
}
.gallery-col{
    flex-basis:30%;
}
.gallery img{
    height:40vh;
    cursor:pointer;
    transition:1s;
}

/*------footer-----*/
.footer {
    width:80%;
	margin:auto;
	padding-top:100px;
	text-align:center;
}
.donate{
    background:rgb(90, 182, 243);
    border:none;
    height:7vh;
    width:30vh;
    margin:10px 10px;
    font-size:1.3rem;
    font-family:Calibri;
    color:#fff;
    border-radius:10px;
    transition:3s;
    cursor:pointer;
}
.donate:hover{
    background:rgb(88, 243, 88);
    color:#fff;
}
.footer-row{
    min-height:30vh;
    background:rgba(35, 113, 185, 0.7);
    display:flex;
    color:#fff;
}
.footer-col{
	flex-basis:44%;
	border-radius:10%;
	margin-bottom:5%;
	padding:20px;
	cursor:pointer;
	display:flex;
}
.footer-col ul{
    padding:30px 10px;

}
.footer-col ul a img{
    height:10vh;
    width:10vh;
    border-radius: 25px;
    transition:0.5s;
}
.footer-col ul img:hover{
    height:12vh;
    width:12vh;
}
.footer-col a img{
    height:15vh;
    width:15vh;
    border-radius:50px;
}
.footer-col a img:hover{
    color:blue;
}

@media(max-width:700px){
	.footer-row{
		flex-direction:column;
	}
}