@media only screen and (min-width: 992px){
	.hidden nav{
		width:80%;
		right:-19%;
	}
	#showTop{
		display:none;
	}
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
	.hidden nav{
		width:85%;
		right:-10%;
	}
	#showTop{
		display:none;
	}
	.wrapper{
		width:750px;
		margin:0 auto;
	}
	#introText{
		padding-left:50px;
	}
	.mockup-content{
		width:49.2%;
		height:14.3em;
	}
	.morph-button-fixed, .morph-button-fixed .morph-content{
		width:22.9375em;
		height:14.3125em;
	}
	figure img{
		min-height:76%;
		width:100%;
	}
	figure figcaption{
		height:76.3%;
	}
	.cycle-slideshow{
	    width:660px;
	    height:460px;
	    margin:0 auto;
	}
	.cycle-slideshow img{
		max-width:660px;
		padding-top:20px;
	}
	.content-style-text{
		max-width:768px;
	}
	.morph-button-modal.open .morph-content {
		margin: -18em 0 0 -24em;
		width: 48em;
		height: 36em;
	}
	#printXbox img, #printVs img {
		max-height:430px;
		padding-left:20px;
	}
	#printEpa img{
		max-height:440px;
		padding-left:40px;
	}
	.prev{
		left:0.25em;
	}
	.next{
		right:0.25em;
	}
	.detailCopy h3{
		padding-left:2em;
	}
	.detailCopy p{
		padding-right:2.5em;
	}
	#web{
		height:1050px;
	}
	#web .desc{
		width:45%;
		height:13.55em;
		padding-top:0;
		margin-top:-20px;
	}
	.left{
		padding-left:7px;
	}
	.right{
		padding-right:7px;
	}
	#print{
		height:1250px;
	}
	#print .desc{
		width:45%;
		height:14em;
		padding-top:0;		
	}
	#logo{
		height:1050px;
	}
	#logo .artwork{
		width:49.1%;
	}
	#logo .desc{
		width:45%;
	}
	.divider2{
		top:120px;
	}
	#logo .divider2, #about .divider2{
		left:348px;
	}
	.divider3{
		left:365px;
	}
	#logo .divider3{

	}
	.divider5{
		top:95px;
	}
	.divider6{
		top:95px;
		left:365px;
	}
	#about .desc{
		width:45%;
	}
	#about .artwork{
		width:49.1%;
	}
	#copyright .connect{
		width:97%;
		padding-left:10px;
	}
	
}

@media only screen and (min-width: 481px) and (max-width: 767px){
	
	header{
		height:60px;
	}
	.nav-up{
		top:-296px;
	}
	.page{
		padding-left:5px;
	}
	.cube-bg{
		position:relative;
        top:-236px;
        z-index:100;
		height:70px;
        background-color:#fff;
	}
	.cube-wrap{
		float:none;
		margin:0 auto;
		padding-top:20px;		
	}
    .hidden .cube{
        width:16px;
    }    
	.hidden .cube div{
        width:16px;
        height:16px;
    }
    .hidden .cube-wrap .depth div.back-pane {
    	background-image: url('../images/cis16.gif');
	    -webkit-transform: translateZ(-8px) rotateY(180deg) rotate(270deg);
	    -moz-transform: translateZ(-8px) rotateY(180deg) rotate(270deg);
	    -ms-transform: translateZ(-8px) rotateY(180deg) rotate(270deg);
	    transform: translateZ(-8px) rotateY(180deg) rotate(270deg);
    }
     .hidden .cube-wrap .depth div.right-pane {
     	background-image: url('../images/cis16.gif');
	    -webkit-transform: rotateY(-270deg) translateX(8px);
	    -moz-transform:rotateY(-270deg) translateX(8px);
	    -ms-transform: rotateY(-270deg) translateX(8px);
	    transform: rotateY(-270deg) translateX(8px);
    } 
    .hidden .cube-wrap .depth div.left-pane {
    	background-image: url('../images/cis16.gif');
	    -webkit-transform: rotateY(270deg) translateX(8px) rotate(180deg);
	    -moz-transform: rotateY(270deg) translateX(8px) rotate(180deg);
	    -ms-transform: rotateY(270deg) translateX(8px) rotate(180deg);
	    transform: rotateY(270deg) translateX(8px) rotate(180deg);
    }
    .hidden .cube-wrap .depth div.top-pane {
    	background-image: url('../images/cis16.gif');
	    -webkit-transform: rotateX(90deg) translateY(-8px);
	    -moz-transform: rotateX(90deg) translateY(-8px);
	    -ms-transform: rotateX(90deg) translateY(-8px);
	    transform: rotateX(90deg) translateY(-8px);
    }
    .hidden .cube-wrap .depth div.bottom-pane {
    	background-image:url('../images/in16.png');
	    top:16px;
	    -webkit-transform: rotateX(90deg) translateY(8px);
	    -moz-transform: rotateX(90deg) translateY(8px);
	    -ms-transform: rotateX(90deg) translateY(8px);
	    transform: rotateX(90deg) translateY(8px);
    }
    .hidden .cube-wrap .depth div.front-pane {
    	background-image: url('../images/cis16.gif');
	    -webkit-transform: rotate(90deg) translateZ(8px);
	    -moz-transform: rotate(90deg) translateZ(8px);
	    -ms-transform: rotate(90deg) translateZ(8px);
	    transform: rotate(90deg) translateZ(8px);
    }
	header p{
		margin:0 auto;
		top:20px;
		left:40px;
		font-size:16px;
	}
	#showTop{
		position:relative;
		top:-290px;
		right:-90%;
		z-index:101;
	}
	.menu{
		text-align:center;
        background-color:#fff;
        position:relative;
    }
    .menu a:first-child{
    	border-top:1px solid #2A3542;
    }
    .menu a:first-child:hover{
    	border-top:1px solid #902b20;
    }
    .menu a{
    	font-size:1.5em;
        display: block;
        border:none;
        border-bottom:1px solid #2A3542;
    }
    .menu a:hover{
    	border:none;
    	border-bottom:1px solid #902B20;
    }
    .menu-horizontal{
        width: 100%;
        height: 226px;
        left: 0;
        z-index: 1;
        overflow: hidden;
    }
    .menu-top{
        top:-283px;
        -webkit-transition: all 0.15s;
		-moz-transition: all 0.15s;
		transition: all 0.15s;	
    }
    .menu-top.menu-open{
        top:60px;
        -webkit-transition: all 0.35s;
		-moz-transition: all 0.35s;
		transition: all 0.35s;	
    }
    .wrapper{
		width:455px;
		margin:0 auto;
		padding:0 5px;
	}
	#intro{
		padding-top:100px;
	}
	#introText{
		padding:20px 0 0 20px;
	}
	#im{
		font-size:3.5em;
	}
	#web{
		height:2220px;
	}
	.mockup-content{
		width:97.5%;
	}
	.morph-button-fixed, .morph-button-fixed .morph-content{
		width:28.575em;
		height:18.725em;
	}
	.cycle-slideshow{
	    width:420px;
	    height:300px;
	}
	.cycle-slideshow img{
		max-width:420px;
		padding-top:100px;
		padding-left:30px;
	}
	.content-style-text{
		max-width:420px;
	}
	#printXbox img, #printVs img{
		max-height:400px;
		padding-top:0;
		padding-left:70px;
	}
	#printEpa img{
		padding-top:60px;
	}
	.morph-button-modal.open .morph-content {
		margin: -17.5em 0 0 -15em;
		width: 30em;
		height: 35em;
	}
	.prev{background-color:rgba(20,27,34, 0.5);left:0em;}
	.next{background-color:rgba(20,27,34, 0.5);right:0em;}
	.detailCopy h3, .detailCopy p{
		text-align:center;
	}
	.detailCopy h3{
		padding-top:70px;
		padding-left:60px;
	}
	.detailCopy p{
		padding:60px 0 0 70px;
	}
	#print .detailCopy h3{
		padding-top:105px;
	}
	#print .detailCopy p{
		padding-top:45px;
	}
	.left{
		text-align:center;
	}
	.right{
		text-align:center;
		float:left;
	}
	.divider2, .divider3, .divider5, .divider6{
		display:none;
	}
	#web .desc{
		height:220px;
		padding-top:10px;
	}
	#print {
		height:2520px;
	}
	#print .desc {
		height:180px;
		padding-top:10px;
	}
	#logo{
		height:1620px;
	}
	#logo .artwork{
		width:100%;
	}
	#logo .desc{
		height:90px;
		padding-top:10px;
	}
	#about{
		height:1100px;
	}
	#about .desc.first,
	#about .desc{
		width:97.5%;
		height:75px;
	}
	#about .title.first,
	#about .title{
		padding-top:25px;
	}
	#about .artwork{
		width:100%;
	}
	#copyright .cLinks{
		width:40%;
		height:60px;
		margin:0 auto;
		position:relative;
		top:0;
		left:10px;
	}
	#copyright .btn{
		margin-top:50px;
	}
	#copyright .copy{
		text-align:center;
		padding-top:45px;
	}
}

/********************************** 480px *************************************/	

@media only screen and (max-width: 480px){ 
	header{
		height:60px;
	}
	.nav-up{
		top:-296px;
	}
	.cube-bg{
		position:relative;
        top:-236px;
        z-index:100;
		height:70px;
        background-color:#fff;
	}
	.cube-wrap{
		margin-left:auto;
		margin-right:auto;
		float:none;
		padding-top:20px;
	}
	.hidden .cube{
        width:16px;
    }    
	.hidden .cube div{
        width:16px;
        height:16px;
    }
    .hidden .cube-wrap .depth div.back-pane {
    	background-image: url('../images/cis16.gif');
	    -webkit-transform: translateZ(-8px) rotateY(180deg) rotate(270deg);
	    -moz-transform: translateZ(-8px) rotateY(180deg) rotate(270deg);
	    -ms-transform: translateZ(-8px) rotateY(180deg) rotate(270deg);
	    transform: translateZ(-8px) rotateY(180deg) rotate(270deg);
    }
     .hidden .cube-wrap .depth div.right-pane {
     	background-image: url('../images/cis16.gif');
	    -webkit-transform: rotateY(-270deg) translateX(8px);
	    -moz-transform:rotateY(-270deg) translateX(8px);
	    -ms-transform: rotateY(-270deg) translateX(8px);
	    transform: rotateY(-270deg) translateX(8px);
    } 
    .hidden .cube-wrap .depth div.left-pane {
    	background-image: url('../images/cis16.gif');
	    -webkit-transform: rotateY(270deg) translateX(8px) rotate(180deg);
	    -moz-transform: rotateY(270deg) translateX(8px) rotate(180deg);
	    -ms-transform: rotateY(270deg) translateX(8px) rotate(180deg);
	    transform: rotateY(270deg) translateX(8px) rotate(180deg);
    }
    .hidden .cube-wrap .depth div.top-pane {
    	background-image: url('../images/cis16.gif');
	    -webkit-transform: rotateX(90deg) translateY(-8px);
	    -moz-transform: rotateX(90deg) translateY(-8px);
	    -ms-transform: rotateX(90deg) translateY(-8px);
	    transform: rotateX(90deg) translateY(-8px);
    }
    .hidden .cube-wrap .depth div.bottom-pane {
    	background-image:url('../images/in16.png');
	    top:16px;
	    -webkit-transform: rotateX(90deg) translateY(8px);
	    -moz-transform: rotateX(90deg) translateY(8px);
	    -ms-transform: rotateX(90deg) translateY(8px);
	    transform: rotateX(90deg) translateY(8px);
    }
    .hidden .cube-wrap .depth div.front-pane {
    	background-image: url('../images/cis16.gif');
	    -webkit-transform: rotate(90deg) translateZ(8px);
	    -moz-transform: rotate(90deg) translateZ(8px);
	    -ms-transform: rotate(90deg) translateZ(8px);
	    transform: rotate(90deg) translateZ(8px);
    }
	header p{
		margin:0 auto;
		top:20px;
		left:39px;
		font-size:16px;
	}
	#showTop{
		position:relative;
		top:-290px;
		right:-87%;
		z-index:101;
	}
	.menu{
		text-align:center;
        background-color:#fff;
        position:relative;
    }
    .menu a{
    	font-size:1.5em;
        display: block;
        border:none;
        border-bottom:1px solid #2A3542;
    }
    .menu a:hover{
    	border:none;
    	border-bottom:1px solid #902B20;
    }
    .menu a:first-child{
    	border-top:1px solid #2A3542;
    }
    .menu a:first-child:hover{
    	border-top:1px solid #902b20;
    }
    .menu-horizontal{
        width: 100%;
        height: 226px;
        left: 0;
        z-index: 1;
        overflow: hidden;
    }
    .menu-top{
        top:-283px;
        -webkit-transition: all 0.15s;
		-moz-transition: all 0.15s;
		transition: all 0.15s;
    }
    .menu-top.menu-open{
        top:60px;
        -webkit-transition: all 0.35s;
		-moz-transition: all 0.35s;
		transition: all 0.35s;
    }
    .wrapper{
    	width:100%;
    }
    #introText{
    	padding:30px 0 0 10px;
    }
    #hi{
    	font-size:12em;
    }
    #im{
    	font-size:3.5em;
    }
    .mockup-content{
		width:18.75em;
		height:12.5em;
		margin:0 auto;
		float:none!important;
	}
	.rec h2{
		padding-top:14%!important;
	}
	.morph-button-fixed, .morph-button-fixed .morph-content{
		width:18.75em;
		height:12.5em;
	}
	.cycle-slideshow{
	    max-width:480px;
	    max-height:300px;
	}
	.cycle-slideshow img{
		max-width:280px;
		padding-top:100px;
		padding-left:22px;
	}
	.content-style-text{
		max-width:480px;
	}
	.icon-close{
		top:20px;
		z-index:1200;
	}
	#printXbox img, #printVs img{
		max-height:320px;
		padding-top:30px;
		padding-left:37px;
	}
	#printEpa img{
		padding-top:80px;
	}
	#copyXbox h3, #copyVs h3{
		padding-top:55px!important;
	}
	#copyEpa h3{
		padding-top:30px!important;
	}
	.morph-button-modal.open .morph-content {
		margin: -15em 0 0 -10em;
		width: 20em;
		height: 30em;
	}
	.prev{background-color:rgba(20,27,34, 0.5);left:0em;}
	.next{background-color:rgba(20,27,34, 0.5);right:0em;}
	.detailCopy h3, .detailCopy p{
		text-align:center;
	}
	.detailCopy h3{
		padding-top:0px;
		padding-left:0;
	}
	.detailCopy p{
		padding:60px 0 0 0;
	}
	#print .detailCopy h3{
		padding-top:30px;
	}
	#print .detailCopy p{
		padding-top:45px;
	}
	figure{
		height:200px;
	}
	.left{
		text-align:center;
	}
	.right{
		text-align:center;
		float:left;
	}
	.divider2, .divider3, .divider5, .divider6{
		display:none;
	}
	#intro{
		padding-top:100px;
	}
	#web{
		height:1840px;
	}
	.page{
		text-align:center;
		font-size:3.25em;
	}
	#web .desc{
		width:100%;
		height:220px;
		padding-top:10px;
	}
	#print {
		height:2040px;
	}

	#print .desc {
		width:100%;
		height:180px;
		padding-top:10px;
	}
	#logo{
		height:1600px;
	}
	#logo .artwork{
		width:95%;
		margin-left:8px;
		background-size:400px 130px;
		background-repeat:no-repeat;
	}
	#logo .desc{
		width:100%;
		height:90px;
		padding-top:10px;
	}
	#about{
		height:1100px;
	}
	#about .desc.first,
	#about .desc{
		width:95%;
		height:75px;
	}
	#about .title.first,
	#about .title{
		padding-top:25px;
	}
	#about .artwork{
		width:95%;
		margin-left:8px;
	}
	#about .artwork.first {
    height: 280px;
	}
	#exp, #edu{
		padding-top:15px!important;
	}
	#copyright{
		padding-right:10px;
	}
	#copyright .connect{
		width:100%;
		padding-top:50px;
	}
	#copyright .cLinks{
		width:170px;
		margin:0 auto;
		padding-left:20px;
	}
	#copyright .btn{
		margin:0 10px 0 0;
	}
	#copyright .copy{
		text-align:center;
		padding:60px 60px 0;
	}
}