@charset "UTF-8";
/* CSS Document */

body{ background-color: #F4F4F4;
	}

header{	position: relative;
		padding: 6px;
		}

li{
	list-style: none;
}

header img{
	margin: 0 auto;
	width: 340px;
	}

.utility li{
	display: inline-block;
	color: #010103;
	background-color: #64A439;

	width: 50px;
    height: 30px;

    border-radius: 15px;

    padding: 15px; 

    text-align: center;
    font-family: "supria-sans", sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size: 18px;
	}
	
.main a{ display: block;	
   color:#010103;
   text-decoration: none;	
   background-color: #7F58A2;
   width: 250px;
   height: 45px;
   border-radius: 15px;
   margin-bottom: 10px;
   padding-top: 16px;
	}

.main {  text-align: center;
    font-family: ff-more-web-pro-wide, serif;
	font-style: normal;
	font-weight: 900;
	font-size: 22px;
	}

a:active{color: #010103;}

a:hover{color: #D6D99E;}

a:visited{color: #D6D99E;}

a{ text-decoration: none;
    color: #010103;}

article{
	margin: 0 auto;
	padding: 15px;
}

h1{
	text-align: center;
    font-family: "ff-more-web-pro-wide", serif;
	font-style: normal;
	font-weight: 900;
	color: #64A439;
	font-size: 35px;
	padding-top: 10px;
	padding-bottom: 10px;
}

h2{
	text-align: center;
    font-family: "ff-more-web-pro", serif;
	font-style: normal;
	font-weight: 900;
	color: #7F58A2;
	font-size:20px;
	padding-top: 30px;
}
h3{
	text-align: center;
    font-family: "ff-more-web-pro", serif;
	font-style: normal;
	font-weight: 900;
	color: #7F58A2;
	font-size:30px;
	padding-top: 30px;
}


p{
	text-align: center;
	font-family: "supria-sans", sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size: 18px;
 	color: black;
 }

 h4{
 	text-align: center;
	font-family: "supria-sans", sans-serif;
	font-style: normal;
	font-weight: 300;
	font-size: 18px;
 	color: black;
 }

@media screen and (min-width:1200px){
	
	.main li{	display: inline-block;
		vertical-align: middle;
		width: 180px;
		font-size: 20px;
		}

	.main a{	display: inline-block;
		width: 180px;
		height: 45px;
		}

	.utility li{
		margin: 0 auto;
		width:180px;
		font-size: 24px;
		}

	header img{
		width: 500px;
		}

	h1{
	font-size: 60px;
		}

	h2{
	font-size:28px;
	}

	h3{
	font-size: 33px;
	}

	p{
		font-size: 25px;
		}
	h4 {
		font-size: 25px;
	}
	

} /**need this end tag for media for browser**/