.member-center div.custom {
    display: inline-block;
    margin: 0 1em;
}
.member-center .landing-header {
    background-color: #006580;
}
.member-center .landing-header .content {
    padding: 2.5em;
    margin: 1em;
    width: 66%;
}
.member-center .landing-header .content h1, .member-center .landing-header .content p {
    color: #ffffff;
}
.member-center .landing-header .content p {
    font-size: 1.5em;
}
.member-center .landing-header .image {
    min-height: 300px;
    width: 33%;
    background-image: url("../img/member-center/header.svg");
    background-repeat: no-repeat;
    background-position: right top;
    float: right;
    opacity: .5;
}
@media screen\0 {
    .member-center .landing-header .image { 
        background-image: url("../img/member-center/header2.svg");
    }
}
_:-ms-lang(x), .member-center .landing-header .image {
	background-image: url("../img/member-center/header2.svg");
}
.member-center div.box {
    background-color: #e2e2e2;
    padding: 1em;
    text-align: center;
}
.member-center div.shadow {
    background-color: #ebebeb;
    padding: .5em;
    margin: 1em 0;
}
.member-center h3 {
    text-align: center;
    text-transform: uppercase;
}
.member-center .grid-item {
    position: relative;
    height: 250px;
    width: 250px;
    margin: .25em;
    box-shadow: 3px 3px 10px #cecece;
    background-color: #ffffff;
    display: inline-block;
    border: 1px solid #cecece;
    border-radius: 50%;
    transition: .3s all ease-in-out;
}
.member-center .grid-itemContent {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 15px;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.member-center .grid-item i.icon {
    width: 120px;
    height: 120px;
    background-position: center;
    background-repeat: no-repeat;
    transition: .3s all ease-in-out;
}
.member-center .grid-item .icon.first {
    background-image: url("../img/member-center/01-green.svg");
}
.member-center .custom:hover .grid-item .first {
    background-image: url("../img/member-center/01-white.svg");
}
.member-center .grid-item .icon.second {
    background-image: url("../img/member-center/02-green.svg");
}
.member-center .custom:hover .grid-item .second {
    background-image: url("../img/member-center/02-white.svg");
}
.member-center .grid-item .icon.third {
    background-image: url("../img/member-center/03-green.svg");
}
.member-center .custom:hover .grid-item .third {
    background-image: url("../img/member-center/03-white.svg");
}
.member-center .grid-item .icon.forth {
    background-image: url("../img/member-center/04-green.svg");
}
.member-center .custom:hover .grid-item .forth {
    background-image: url("../img/member-center/04-white.svg");
}
.member-center .grid-item .icon.fifth {
    background-image: url("../img/member-center/05-green.svg");
}
.member-center .custom:hover .grid-item .fifth {
    background-image: url("../img/member-center/05-white.svg");
}
.member-center .grid-item .icon.sixth {
    background-image: url("../img/member-center/06-green.svg");
}
.member-center .custom:hover .grid-item .sixth {
    background-image: url("../img/member-center/06-white.svg");
}
.member-center .grid-item .icon.seventh {
    background-image: url("../img/member-center/07-green.svg");
}
.member-center .custom:hover .grid-item .seventh {
    background-image: url("../img/member-center/07-white.svg");
}
.member-center .grid-item .icon.eigth {
    background-image: url("../img/member-center/08-green.svg");
}
.member-center .custom:hover .grid-item .eigth {
    background-image: url("../img/member-center/08-white.svg");
}
.member-center .grid-item .icon.ninth {
    background-image: url("../img/member-center/09-green.svg");
}
.member-center .custom:hover .grid-item .ninth {
    background-image: url("../img/member-center/09-white.svg");
}
.member-center .grid-item .icon.tenth {
    background-image: url("../img/member-center/10-green.svg");
}
.member-center .custom:hover .grid-item .tenth {
    background-image: url("../img/member-center/10-white.svg");
}
.member-center .grid-item .icon.eleventh {
    background-image: url("../img/member-center/11-green.svg");
}
.member-center .custom:hover .grid-item .eleventh {
    background-image: url("../img/member-center/11-white.svg");
}
.member-center .grid-item .icon.twelfth {
    background-image: url("../img/member-center/12-green.svg");
}
.member-center .custom:hover .grid-item .twelfth {
    background-image: url("../img/member-center/12-white.svg");
}
.member-center .custom:hover .grid-item .icon {
    transform: scale(1.2);
    transition: .3s all ease-in-out;
}
.member-center .custom:hover a {
    text-decoration: none;
}
.member-center .custom:hover .grid-item {
    background-color: #60b329;
    box-shadow: none;
    transition: .3s all ease-in-out;
}
.member-center .custom p {
    color: #535353;
    font-weight: bold;
    font-size: 1.25em;
}
.member-center .custom:hover p {
    text-decoration: none;
}

@media all and (max-width: 1340px) and (min-width: 1047px) {
.member-center div.custom {
    margin: 0 5em;
}
}

@media all and (max-width: 840px) and (min-width: 200px) {
.member-center .landing-header .content p {
    font-size: 1em;
}
}
@media all and (max-width: 572px) and (min-width: 1px) {
	.member-center .landing-header .image {
		display: none;
	}
	.member-center .landing-header .content {
		padding: 1em;
		margin: .5em;
		width: 100%;
	}
}
@media all and (max-width: 398px) and (min-width: 200px) {
.member-center .grid-item {
    height: 150px;
    width: 150px;
}
.member-center .grid-item i.icon {
    width: 90px;
    height: 90px;
}
}