* {
	margin: 0;
	padding: 0;
	border: none;
	font-family: 'proxima';
}
@font-face {
    font-family: 'proxima-altblack';
    src: url('../fonts/Proxima Nova Alt Black-webfont.eot');
    src: url('../fonts/Proxima Nova Alt Black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Proxima Nova Alt Black-webfont.woff2') format('woff2'),
         url('../fonts/Proxima Nova Alt Black-webfont.woff') format('woff'),
         url('../fonts/Proxima Nova Alt Black-webfont.ttf') format('truetype'),
         url('../fonts/Proxima Nova Alt Black-webfont.svg#proxima_nova_altblack') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proxima-altbold';
    src: url('../fonts/Proxima Nova Alt Bold-webfont.eot');
    src: url('../fonts/Proxima Nova Alt Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Proxima Nova Alt Bold-webfont.woff2') format('woff2'),
         url('../fonts/Proxima Nova Alt Bold-webfont.woff') format('woff'),
         url('../fonts/Proxima Nova Alt Bold-webfont.ttf') format('truetype'),
         url('../fonts/Proxima Nova Alt Bold-webfont.svg#proxima_nova_altbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proxima';
    src: url('../fonts/Proxima Nova Alt Regular-webfont.eot');
    src: url('../fonts/Proxima Nova Alt Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Proxima Nova Alt Regular-webfont.woff2') format('woff2'),
         url('../fonts/Proxima Nova Alt Regular-webfont.woff') format('woff'),
         url('../fonts/Proxima Nova Alt Regular-webfont.ttf') format('truetype'),
         url('../fonts/Proxima Nova Alt Regular-webfont.svg#proxima_nova_altregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proxima-scosfthin';
    src: url('../fonts/Proxima Nova ScOsf Thin-webfont.eot');
    src: url('../fonts/Proxima Nova ScOsf Thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Proxima Nova ScOsf Thin-webfont.woff2') format('woff2'),
         url('../fonts/Proxima Nova ScOsf Thin-webfont.woff') format('woff'),
         url('../fonts/Proxima Nova ScOsf Thin-webfont.ttf') format('truetype'),
         url('../fonts/Proxima Nova ScOsf Thin-webfont.svg#proxima_nova_scosfthin') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proxima-ltsemibold';
    src: url('../fonts/Proxima Nova Semibold-webfont.eot');
    src: url('../fonts/Proxima Nova Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Proxima Nova Semibold-webfont.woff2') format('woff2'),
         url('../fonts/Proxima Nova Semibold-webfont.woff') format('woff'),
         url('../fonts/Proxima Nova Semibold-webfont.ttf') format('truetype'),
         url('../fonts/Proxima Nova Semibold-webfont.svg#proxima_nova_ltsemibold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proxima-ltthin';
    src: url('../fonts/Proxima Nova Thin-webfont.eot');
    src: url('../fonts/Proxima Nova Thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Proxima Nova Thin-webfont.woff2') format('woff2'),
         url('../fonts/Proxima Nova Thin-webfont.woff') format('woff'),
         url('../fonts/Proxima Nova Thin-webfont.ttf') format('truetype'),
         url('../fonts/Proxima Nova Thin-webfont.svg#proxima_nova_ltthin') format('svg');
    font-weight: normal;
    font-style: normal;
}
a:hover {
    text-decoration: underline !important;
}
.bg {
    float: left;
    width: 100%;
    height: auto;
}
.contentWrap {
	width: 94%;
	/* max-width: 1000px; */
	height: auto;
	margin: 0 auto;
    padding: 0 3%;
}
.topBg {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 94%;
	height: auto;
    padding: 1% 3%;
    border-bottom: solid 1px #ccc;
    overflow: hidden;
}
.top {
	width: 100%;
	/* max-width: 1000px; */
	height: auto;
	margin: 0 auto;
}
.logo {
	float: left;
	width: 50%;
	height: 50px;
	line-height: 50px;
	font-size: 2vw;
	color: #000;
    font-family: 'proxima';
}
.logoLight {
    font-size: 1.6vw;
	color: #aaa !important;
    font-family: 'proxima' !important;
}
.nav {
	float: left;
	width: 50%;
	height: 50px;
	line-height: 50px;
	font-size: 1.6vw;
	color: #000;
	text-align: right;
}
.nav a {
    text-decoration: none;
    color: #000;
}
.nav ul {
    float: right;
	list-style: none;
}
.nav ul li {
    display: block;
	float: left;
    margin-right: 20px;
}
.nav ul li:last-child {
    margin-right: 0px;
}
.middle {
    width: 70%;
    padding: 0 15%;
    height: auto;
    margin-top: 135px;
    margin-bottom: 50px;
}
.title {
    width: 100%;
    height: auto;
    margin: 5% 0;
    float: left;
}
.title h1 {
    text-align: center;
    font-size: 5vw;
    color: #000;
}
.title h2 {
    text-align: center;
    font-size: 2vw;
    color: #000;
}
.title p {
    text-align: center;
    font-size: 1vw;
    color: #aaa;
    padding: 10px 0 0 0;
}
.content {
    width: 100%;
    height: auto;
    float: left;
}
.portfolio-logo {
    background-color: #fff;
    margin: 1%;
    width: 21.333%;
    float: left;
    height: auto;
    padding: 5%;
    text-align: center;
}
.portfolio-logo:hover {
    filter: drop-shadow(0px 4px 4px #ccc);
}
.portfolio-logo img {
    max-height: 100%;
    width: 100%;
}
.content-white-bg {
    background-color: #ffffff;
    padding: 5%;
    width: 90% !important;
}
.bottom {
    width: 100%;
    height: auto;
    margin: 40px auto;
    float: left;
}
.bottom .nav {
    width: 100%;
    height: auto;
    font-size: 18px;
    color: #000000;
    text-align: center;
    margin-bottom: 20px;
}
.bottom .nav a {
    text-decoration: none;
    color: #000;
    margin-right: 20px;
}
.bottom .nav a:last-child {
    margin-right: 0px;
}
.bottom .photoCredit {
    width: 100%;
    height: auto;
    font-size: 14px;
    color: #000;
    text-align: center;
}
.bottom .photoCredit a {
    text-decoration: none;
    color: #000;
}
.black-cat {
    position: fixed;
    bottom: 0;
    right: 0;
}
#black-cat-img {
    width: 100px;
}
@media only screen and (max-width: 768px) {
    .topBg {
        width: 90%;
        height: auto;
        padding: 2% 5% 2% 5%;
    }
    .logo {
        float: left;
        font-size: 24px;
        width: 100%;
        height: auto;
        text-align: center;
        line-height: auto;
    }
    .logoLight {
        font-size: 18px;
        width: 100%;
        height: auto;
        text-align: center;
    }
    .nav {
        font-size: 16px;
        width: 100%;
        text-align: center;
    }
    .subscribe h3 {
        font-size: 2.5vw;
    }
    .subscribe button {
        width: 60%;
        padding: 10px 0;
        margin: 15px 20%;
        font-size: 3vw;
    }
    .middle {
        margin-top: 100px;
        float: left;
        width: 90%;
        height: auto;
        padding: 5%;
    }
    .title {
        margin-bottom: 10%;
        margin-top: 5%;
    }
    .title h1 {
        font-size: 48px;
    }
    .title h2 {
        font-size: 18px;
    }
    .title p {
        font-size: 12px;
    }
    .portfolio-logo {
        height: auto;
    }
    .portfolio-logo img {
        max-height: 100%;
        max-width: 100%;
    }
    .bottom .nav {
        font-size: 18px;
    }
    .bottom .photoCredit {
        font-size: 14px;
    }
    #black-cat-img {
        width: 50px;
    }
}