#box-pen { float:left; width:100%; padding:80px 0; margin:0px; background:#f2f2f2; text-align:center;}
.box-pen { float:left; width:100%;}
.box-pen li {position:relative; list-style:none; float:left; width:19%; margin:0 10px 0 0;}
.box-pen h2 { padding:0 0 40px; margin:0px; font:normal; font-family:'Montserrat Light';}
.box-pen li:last-child { margin:0px;}
.box-pen li a {padding:110px 0; margin:0; display:block;}
.box-pen li#icon1 a{background:url('../images/home-icon1.png'); background-position:top 0 center; background-repeat:no-repeat;}
.box-pen li#icon2 a{background:url('../images/home-icon2.png'); background-position:top 0 center; background-repeat:no-repeat;}
.box-pen li#icon3 a{background:url('../images/home-icon3.png'); background-position:top 0 center; background-repeat:no-repeat;}
.box-pen li#icon4 a{background:url('../images/home-icon4.png'); background-position:top 0 center; background-repeat:no-repeat;}
.box-pen li#icon5 a{background:url('../images/home-icon5.png'); background-position:top 0 center; background-repeat:no-repeat;}

.box-pen li#icon1 a:hover{background:url('../images/home-icon1-hover.png'); background-position:top 0 center; background-repeat:no-repeat;}
.box-pen li#icon2 a:hover{background:url('../images/home-icon2-hover.png'); background-position:top 0 center; background-repeat:no-repeat;}
.box-pen li#icon3 a:hover{background:url('../images/home-icon3-hover.png'); background-position:top 0 center; background-repeat:no-repeat;}
.box-pen li#icon4 a:hover{background:url('../images/home-icon4-hover.png'); background-position:top 0 center; background-repeat:no-repeat;}
.box-pen li#icon5 a:hover{background:url('../images/home-icon5-hover.png'); background-position:top 0 center; background-repeat:no-repeat;}


@media only screen and ( max-width:1620px) {

}

@media only screen and ( max-width:1200px) {
.box-pen li { width:22%; float:none; display:inline-block;}
}


@media only screen and ( max-width:1100px) {
.box-pen li { width:30%; margin:0 30px 0 0;}
}

@media only screen and ( max-width:767px) {
.box-pen li { width:36%; margin:0 30px 0 0;}
}

@media only screen and ( max-width:640px) {
.box-pen li { width:42%; margin:0 20px 0 0;}
}

@media only screen and ( max-width:560px) {
.box-pen li { width:60%; margin:0 0 20px;}
}

@media only screen and ( max-width:420px) {
.box-pen li { width:100%; margin:0 0 20px;}
}