.masterHeader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

main .container {
    padding: 3em 2em 3.5em;
}

ul.homeCol2,
ul.homeCol2 > li {
    list-style: none;
    padding: 0;
    margin: 0;
}


main {
    width: 100%;
    padding: 0 3em;
    background: url(../images/bgHomeNoticeEvents.png) 115% 170% no-repeat;
}

ul.homeCol2 > li {
    position: relative;
    float: left;
    width: 50%;
    height: auto;
    min-height: 45em;
    padding-bottom: 6em;
}

main h3 {
    font: 300 1.875em/1 'Open Sans', sans-serif;
    color: rgb(0,57,90);
    text-transform: uppercase;
    border-bottom: 1px solid rgb(209,209,209);
    padding-bottom: 1.3em;
    margin-bottom:1.5em;
}
main h3 span {
    font-weight: 700;
    font-size: 1.6em;
    color: rgb(0,109,104);
    display: block;
    text-transform: none;
}

ul.homeCol2 > li:last-child h3{
    padding-left: 1.1em;
}



.empty:before {
    content: "\f05e";
    font-size: 110px;
    color: rgb(209,209,209);
    margin-left: 0;
    display: block;
}
ul.homeCol2 > li:first-child .empty {
    padding-right: 2.2em;
}
ul.homeCol2 > li:last-child .empty {
    padding-left: 2.2em;
}

.empty a,
.empty a:link {
    font-weight: 700;
}

a.iconPost,
a.iconPost:link {
    position: relative;
    font: 700 1.1em 'Open Sans', sans-serif;
    color: rgb(79,116,143);
    display: block;
    margin-bottom: 2em;
}
a.iconPost:last-of-type,
a.iconPost:link:last-of-type {
    margin-bottom: 0;
}
a.iconPost:visited {
    color: rgb(79,116,143);
} 
a.iconPost:hover {
    color: rgb(230,173,66);
}
a.iconPost:active {
    color: rgb(230,173,66);
}
a.iconPost:focus {
    color: rgb(230,173,66);
}

ul.homeCol2 > li:first-child a.iconPost,
ul.homeCol2 > li:first-child a.iconPost:link {
    padding-right: 2em;
}
ul.homeCol2 > li:last-child a.iconPost,
ul.homeCol2 > li:last-child a.iconPost:link{
    padding-left: 7em;
}

a.iconPost h4 {
    font-family: inherit;
    font-size: inherit;
    color: rgb(0,85,134);
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    margin-bottom: 0;
    margin-top: 1.2em;
}

a.iconPost time {
    font-weight: 600;
    font-size: 0.9em;
    color: rgb(0,57,90);
    display: block;
    margin: 0.2em 0;
}
a.iconPost time i {
    display: inline-block;
    margin: 0 0.3em;
}

a.iconPost p {
    font-size: 0.9em;
    text-transform: uppercase;
    color: rgb(0,109,104);
}
a.iconPost p i {
    display: inline-block;
    margin-left: 0.5em;
}

.iconCont {
    position: absolute;
    top: 54%;
    left: 1em;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 85px;
    height: 85px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: rgb(243,243,243);
}
.iconCont i {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    font-size: 1.8em;
    color: rgb(0,90,141);
}

a.iconPost img {
    float: left;
    max-width: 250px;
    height: auto;
    margin-right: 1em;
}


.bottomLinks {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    margin-bottom: 0;
    padding-right: 2.2em;
}
ul.homeCol2 > li:last-child .bottomLinks {
    padding-left: 2.2em;
    padding-right: 0;
}

.bottomLinks a,
.bottomLinks a:link {
    font: 700 1em 'Open Sans', sans-serif;
    color: rgb(255,255,255);
    text-transform: uppercase;
    display: inline-block;
    padding: 1em 1.5em;
    -webkit-transition-property: background;
    -moz-transition-property: background;
    -o-transition-property: background;
    transition-property: background;
    background: rgb(0,122,160);
}
.bottomLinks a:visited {
    color: rgb(255,255,255);
}
.bottomLinks a:hover {
    color: rgb(255,255,255);
    background: rgb(0,109,104);
}
.bottomLinks a:active {
    color: rgb(255,255,255);
    background: rgb(0,109,104);
}
.bottomLinks a:focus {
    color: rgb(255,255,255);
    background: rgb(0,109,104);
}

ul.homeCol2 > li:last-child a.iconPost,
ul.homeCol2 > li:last-child a.iconPost:link {
    margin-bottom: 0;
}


.bottomLinks a + a {
    float: right;
}


.bottomLinks i {
    display: inline-block;
    margin-right: 1em;
}


/****************************************************************
MEDIA QUERY
****************************************************************/
@media only screen and (max-width:1500px) {
    main h3 {
        font-size: 1.5em;
    }
    ul.homeCol2 > li {
        min-height: 39.7em;
    }
    a.iconPost,
    a.iconPost:link {
        font-size: 1em;
    }
    .iconCont {
        width: 75px;
        height: 75px;
    }
    a.iconPost img {
        max-width: 215px;
    }
    .bottomLinks a, 
    .bottomLinks a:link {
        font-size: 0.8em;
    }
}

@media only screen and (max-width:1300px) {
    main h3 {
        font-size: 1.4em;
    }
    ul.homeCol2 > li {
        min-height: 36.7em;
    }
    a.iconPost,
    a.iconPost:link {
        font-size: 0.9em;
    }
    .iconCont {
        width: 70px;
        height: 70px;
    }
    .empty {
        font-size: 0.9em;
    }
    .empty:before {
        font-size: 80px;
    }
    .bottomLinks a, 
    .bottomLinks a:link {
        font-size: 0.7em;
    }
}

@media only screen and (max-width:1200px) {
    #mainContent {
        padding-left:0; 
        margin-top: 0;
        background-position: center 120%;
        background-size: 500px 498px;
    }
    main .container {
        padding-top: 2rem;
    }
    ul.homeCol2 > li:last-child h3 {
        margin-bottom: 0;
    }
    ul.homeCol2 > li {
        float: none;
        width: 100%;
        min-height: 0;
        padding-bottom: 0;
    }
    ul.homeCol2 > li:last-child  {
        margin-top: 4em;
    }

    ul.homeCol2 > li:first-child a.iconPost, 
    ul.homeCol2 > li:first-child a.iconPost:link {
        padding-right: 0;
    }
    ul.homeCol2 > li:last-child a,
    ul.homeCol2 > li:last-child a:link {
        padding-bottom: 2em;
        padding-top: 2em;
        border-bottom: 1px dotted rgb(241,224,225);
    }

    .iconCont {
        top: 50%;
    }

    .bottomLinks {
        position: static;
        left: auto;
        bottom: auto;
        width: 100%;
        padding-right: 0;
        margin-top: 4em;
    }
    ul.homeCol2 > li:last-child h3,
    ul.homeCol2 > li:last-child .bottomLinks,
    ul.homeCol2 > li:last-child .empty {
        padding-left: 0;
    }
    .bottomLinks a,
    .bottomLinks a:link {
        padding: 1em 1.5em!important;
    }
}

@media only screen and (max-width:1040px) {
	.masterHeader {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
}
}

@media only screen and (max-width:900px) {
    main h3 {
        font-size: 1.2em;
    }

    ul.homeCol2 > li:last-child a, 
    ul.homeCol2 > li:last-child a:link {
        padding-bottom: 1.5em;
        padding-top: 1.5em;
    }

    a.iconPost, 
    a.iconPost:link {
        font-size: 0.85em;
    }

    a.iconPost h4 {
        margin-top: 0.6em;
    }

    .iconCont {
        width: 65px;
        height: 65px;
    }
    .iconCont i {
        font-size: 1.5em;
    }

    .bottomLinks a,
    .bottomLinks a:link {
        font-size: 0.6em;
    }
}

@media only screen and (max-width:650px) {
    main {
        padding-left: 1em;
    }
    main .container {
        padding-left: 1rem;
        padding-right: 1em;
    }
    a.iconPost img {
        max-width: 160px;
    }
}

@media only screen and (max-width:500px) {
    a.iconPost img {
        float: none;
        max-width: 100%;
        margin-right: 0;
    }
}

@media only screen and (max-width:380px) {
    .bottomLinks a, 
    .bottomLinks a:link {
        display: block;
        border-bottom: none!important;
    }
    .bottomLinks a + a {
        float: none;
        margin-top: 1px;
        
    }
}