@charset "UTF-8";
/* CSS Document */


@font-face {
	font-family:"DIN Condensed Bold";
	src:url(DIN%20Condensed%20Bold.ttf);
	font-weight:normal;
}


@font-face {
	font-family:"Arciform";
	src:url(Arciform.otf);
	font-weight:normal;
}





::-webkit-scrollbar
{
	width: 6px;  /* for vertical scrollbars */
	height: 6px; /* for horizontal scrollbars */
}

::-webkit-scrollbar-track
{
	background: rgba(255, 255, 255, 0);	
	border-radius:3px;
}

::-webkit-scrollbar-thumb
{
opacity: 1;
border-radius:3px;	
background:rgba(0,0,0,0.6);
background: -webkit-linear-gradient(top,red,orange,yellow,green,blue,indigo,violet);   /* For Opera 11.1 to 12.0 */
background: -o-linear-gradient(top,red,orange,yellow,green,blue,indigo,violet);   /* For Fx 3.6 to 15 */
background: -moz-linear-gradient(top,red,orange,yellow,green,blue,indigo,violet);   /* Standard syntax */
background: linear-gradient(to bottom, red,orange,yellow,green,blue,indigo,violet);
}





*{
	margin:0;
}



html {
	width: 100vw!important;
}


#loader {
	display: inline-block;
	position: fixed;
	background-color:#FFFFFF;
	height:100vh;
	width:100vw;
	overflow:hidden;
	text-align: center;
	z-index: 151;
	margin-top:90px;
}


.spinner {
display:inline-block;
margin-top:30vh;
margin-left:-0px;
height:70px;
width:70px;
left: 50%;
padding:30px;

animation-name: spin;

animation: spin 800ms ease-in-out infinite;
}

@keyframes spin {
    0% { transform: rotate(20deg);
	}
	
    50% { transform: rotate(280deg);
	}
	
 	100% { transform: rotate(360deg);
	}
}


.pageloaded {
	transition: ease-out 800ms;
	opacity:0;
	visibility:hidden;
}

.locked {
	overflow:hidden;
}



body{
	display:block;
	width:100vw;
	height:auto;
	overflow-x: hidden;
}

section {	
position:absolute;
min-height: 100vh;
}


#backgroundimage {
	display:block;
	width:100%;
	height:100%;
}

#header {
	display: block;
	float: left;
	clear: both;
	position: fixed;
	margin-top: 0px;
	width:100vw;
	height:40px;
	padding-top:10px;
	padding-bottom:20px;
	background-color: rgba(255,255,255,1);
	transition:400ms;
	z-index: 10;
}

#headerlogo{
	position:absolute;
	display:block;
	float:left;
	width:55px;
	height:55px;
	margin-left:48%;
	cursor: pointer;
	z-index: 150;
	transition:ease-out 400ms;
	background-image:url("images/pageimages/rwlogo1.png");
	background-size: 100%;
	background-repeat: no-repeat;
	opacity: 1;
	visibility: visible;
}

#headerlogo:hover {
	background-image: url("images/pageimages/rwlogo2.png");
	transition:ease-out 400ms;
}



nav{
	display: block;
	float:left;
	visibility: hidden;
	opacity:0;
	transition: 600ms ease-in-out;
	transition-delay: 600ms;
	margin-top:0px;
	padding-left: 0px;
	width:100%;
	height:50px;
	text-align: center;
	z-index: 1;
}




#li1 {
	float:left;
	margin-right: 0px;
	margin-left: 0px;
	color: white;
	cursor: pointer;
	transition: 400ms ease-out;
}

#li2 {
	float:left;
	margin-right: 0px;
	margin-left: 0px;
	color: white;
	cursor: pointer;
	transition: 400ms ease-out;
}

#li3 {
	float:left;
	margin-right: 0px;
	margin-left: 0px;
	color: white;
	cursor: pointer;
	transition: 400ms ease-out;
}

#li4 {
	float:left;
	margin-right: 0px;
	margin-left: 0px;
	color: white;
	cursor: pointer;
	transition: 400ms ease-out;
}



.navopen {
	margin-top: 0vh;
}

.navclosed {
	margin-top: -100vh;
	opacity:0;
	visibility: 0;
}


#navpage {
	display: block;
	position: fixed;
	float:left;
	width:400vw;
	height:100vh;
	overflow-x:hidden;
	text-align:center;
	opacity:1;
	transition: 600ms ease-in-out;
	margin-left: 0vw;
	z-index: 2;
}



#navpage1 {
	display:inline-block;
	float:left;
	width:100vw;
	height:100%;
	background-color: #00afec;
}

#navpage2 {
	display:inline-block;
	float:left;
	width:100vw;
	height:100%;
	background-color: #ea1c62;
}

#navpage3 {
	display:inline-block;
	float:left;
	width:100vw;
	height:100%;
	background-color: #fff02a;
}

#navpage4 {
	display:inline-block;
	float:left;
	width:100vw;
	height:100%;
	background-color:rgba(64,64,64,1.00);
}



#navpage:hover #headerlogo {
	transition:ease-out 400ms;
	opacity:0;
	visibility: 0;
}

#navpage:hover #hamburger {
	transition:ease-out 400ms;
	opacity:1;
	visibility: 1;
}

a{
	transition: 400ms ease-out;
}

a:hover {
	color: white;
	transition: 400ms ease-out;
}

.fa {
	transition: 400ms;
	color: rgba(255, 255, 255, 0);
}

.white {
	color: rgba(255, 255, 255, 1);
}

.navicon{
	height: 30px;
	width:30px;
	margin-top:-5px;
	opacity:0;
	visibility: hidden;
	transition: 400ms ease-out;
}

.navicon2 {
	display:none;
}

.naviconvisible {
	opacity:1;
	visibility: visible;
	transition: 400ms ease-out;
}



.navheader {
	display:block;
	float:left;
	font-size: 2.5vw;
	font-family:"Arciform";
	font-weight: normal;
	color:white;
	width:100%;
	margin-top:170px;
	margin-bottom:20px;
	text-align:center;
}

.sectionicon {
	height: 60px;
	width:auto;
	margin-bottom:-17px;
}


#colornav {
	display:block;
	width:100vw;
	height:15px;
	float:left;
	margin-top:60px;
}

.spanbutton {
	transition: 400ms ease-out;
}

.navbutton {
	height: 35px;
	width:25%;
	padding-top:15px;
	transition: 400ms ease-out;
}

.navexpand {
	height: 50px;
	width:0%;
	transition: 400ms ease-out;
	opacity:0.4;
}

.navmin {
	width: 3.125vw;
	height:20px;
	transition: 400ms ease-out;
	opacity:1;
}



span {
	display:inline-block;
	float:left;
	text-align: center;
	width: 3.125vw;
	height:20px;
	transition: 400ms ease-out;
}



/*HOMEPAGE SLIDESHOW STYLES*/


#navpage:hover .swiper-button-next, #navpage:hover .swiper-button-prev, #navpage:hover .swiper-pagination {
	display:none;
}

#clientsserved {
	height:35vh !important;
	padding-top:0px !important;
	padding-bottom:40px !important;
	background-color: #f4f4f4;
}

#clientsnext, #clientsprev {
	border-color: #c8c8c8;
	color: #c8c8c8;
}

#clientsnext:hover, #clientsprev:hover {
	background: #c8c8c8 !important;
}

#clientsnext:hover, #clientsprev:hover {
	color: #ffffff !important;
}


.clientsblock{
	padding-left:5vw !important;
	padding-right:5vw !important;
	padding-top: 60px !important;
	padding-bottom: 0px !important;
	margin: 0 !important;
	width:90vw;
	overflow-x:hidden;
	background-color: #f4f4f4;
}

#slidepage1, #slidepage2, #slidepage3, #clients1, #clients2 {
	background-size:cover !important;
	background-position:center;
}

.sliderlink {
	display:block;
	width:inherit;
	height:inherit;
	text-decoration:none;
	margin-top:0px !important;
	text-align:right;
	letter-spacing:0.1em;
	text-shadow: 0px 0px 5px rgba(0,0,0,0.35);
}



.swiper-button-next, .swiper-button-prev {
	opacity:0;
	width:40px;
	height:50px;
	padding: 15px;
	padding-right: 15px;
	padding-top: 13px;
	padding-bottom: 7px;
	margin-top: 50px;
	border: solid 2px white;
	border-radius: 40px;
	color: white;
	transition:400ms ease-in-out;
}

.swiper-button-next {
	margin-right:30px !important;
}
.swiper-button-prev {
	margin-left:30px !important;
}

.swiper-button-next::after {
margin-top:-5px !important;
margin-right:-3px !important;
}

.swiper-button-prev::after {
margin-top:-5px !important;
margin-left:-3px !important;
}

.swiper-button-next:hover, .swiper-button-prev:hover {
	background: #ffffff !important;
	color:#d1d2d4 !important;
	opacity:1 !important;
}

.swiper-button-next:hover .swiper-button-next::after polyline, .swiper-button-prev:hover .swiper-button-prev::after polyline {
	background:#d1d2d4 !important;
}


.swiper-container:hover .swiper-button-next, .swiper-container:hover .swiper-button-prev {
	opacity:1;
	transition:400ms ease-in-out;
}


.slidertitle {
	display:none;
	font-family:"Arciform";
	font-weight: normal;
	font-size: 2vw;	
	clear:left;
	color:#ffffff;
	margin-bottom:5px;
}

.slidersubtitle {
	display:none;
	font-family:"DIN Condensed Bold";
	font-weight: normal;
	font-size: 1vw;
	clear:left;
	color:#ffffff;
}


#slidepage1 {
	background-image: url("images/pageimages/slideshowimages/slideshow1.jpg");
}
#slidepage2 {
	background-image: url("images/pageimages/slideshowimages/slideshow2.jpg");
}
#slidepage3 {
	background-image: url("images/pageimages/slideshowimages/slideshow3.jpg");
}

#clients1 {
	background: url("images/pageimages/clientslides/clients-slide-1.jpg");
}

#clients2 {
	background: url("images/pageimages/clientslides/clients-slide-2.jpg");
}

#clients1, #clients2 {
	background-size:80vw !important;
	background-position: center;
	background-repeat: no-repeat;
}

#clientspagination{
	display:none !important;
}

.swiper-pagination {
	margin-left:48%;
	z-index: 1 !important;
}

#clientsnext, #clientsprev {
	top:35%;
}



/*BRAND COLOR PALETTE*/

.red {
	background-color: #d02630;
}
.redorange {
	background-color: #ed402e;
}
.orange {
	background-color: #f06d2f;
}
.orangeyellow {
	background-color: #f8a331;
}
.yellow {
	background-color: #fff02a;
}
.yellowlime {
	background-color: #e4e337;
}
.lime {
	background-color: #bfd540;
}
.green {
	background-color: #45ad4e;
}
.teal {
	background-color: #1eb1a7;
}
.cyan {
	background-color: #00afec;
}
.blue {
	background-color: #0072b1;
}
.indigo {
	background-color: #184593;
}
.violet {
	background-color: #574a9b;
}
.purple {
	background-color: #9f2486;
}
.purplepink {
	background-color: #d21c8b;
}
.pink {
	background-color: #ea1c62;
}

.black{
	background-color:rgba(64,64,64,1.00);
}



.redtext {
	color: #d02630;
}
.redorangetext {
	color: #ed402e;
}
.orangetext {
	color: #f06d2f;
}
.orangeyellowtext {
	color: #f8a331;
}
.yellowtext {
	color: #fff02a;
}
.yellowlimetext {
	color: #e4e337;
}
.limetext {
	color: #bfd540;
}
.greentext {
	color: #45ad4e;
}
.tealtext {
	color: #1eb1a7;
}
.cyantext {
	color: #00afec;
}
.bluetext {
	color: #0072b1;
}
.indigotext {
	color: #184593;
}
.violettext {
	color: #574a9b;
}
.purpletext {
	color: #9f2486;
}
.purplepinktext {
	color: #d21c8b;
}
.pinktext {
	color: #ea1c62;
}
.blacktext {
	color:#404040;
}



.navblock {
	display:block;
	margin-left:5%;
	margin-top: 150px;
	width: 95%;
	background-color:white;
}


.navimage {
	display:inline-block;
	float:left;
	width:30.5%;
	height:200px;
	margin:0.5%;
	background-color: white;
	background-position: center;
	background-size: 150%;
	transition: ease-out 300ms;
	cursor: pointer;
	background-repeat: no-repeat;
	border-radius: 5px;
}

.navimage:hover {
	transition: ease-out 300ms;
	opacity:1;
}

.blank {
	visibility:hidden;
}


/*about images*/


#about {
	background-image: url('images/projectimages/about/about_placeholder.jpg');
	background-position: center;
	background-size: 100%;
}

#about:hover{
}

#resume {
	background-image: url('images/projectimages/about/resume_placeholder.jpg');
	background-position:top middle;
	background-size: 100%;
}

#resume:hover{
}

#contact {
	background-image: url('images/projectimages/about/contact_placeholder.jpg');
	background-position:top right;
	background-size: 100%;
}

#contact:hover {
}


/*print images*/

#bookproject {
	background-image: url('images/projectimages/onesandzeros/image1_placeholder.jpg');
	background-position: 60% 40%;
}

#bookproject:hover{
}


#papanicholasproject {
	background-image: url('images/projectimages/papanicholas/image1_placeholder.jpg');
	background-position: center;
	background-size: 100%;
}

.papanicholascolor {
	background-color:#e8e2d5;
}

#magproject {
	background-image: url('images/projectimages/jazzfestival/image1_placeholder.jpg');
	background-size: 100%;
	background-position: 30% 100%;
}
#magproject:hover{
}

#helveticaproject {
	background-image: url('images/projectimages/helvetica/image1_placeholder.jpg');
	background-position: 60% 70%;
}

#helveticaproject:hover{
}

#eamesproject {
	background-image: url('images/projectimages/eames/image1_placeholder.jpg');
	background-position: center;
}

#eamesproject:hover{
}

/*digital images*/

#americansliceproject {
	background-image: url('images/projectimages/americanslice/image1_placeholder.jpg');
	background-size: cover;
	background-position: center;	
}

#americansliceproject:hover{
}

#sealyproject {
	background-image: url('images/projectimages/sealy/image1_placeholder.jpg');
	background-size: cover;
	background-position: bottom;	
}

#sealyproject:hover{
}

#janusproject {
	background-image: url('images/projectimages/janus/image1_placeholder.jpg');
	background-size: 100%;
	background-position: center;
}

#janusproject:hover{
}

/*brand images*/

#cheznousproject {
	background-image: url('images/projectimages/cheznous/image1_placeholder.jpg');
	background-position: center;
}

#cheznousproject:hover{
}

#whitewolfproject {
	background-image: url('images/projectimages/whitewolf/image1_placeholder.jpg');
	background-size: 100%;
	background-position: top left;
}

#whitewolfproject:hover{
}

#audiotechnicaproject {
	background-image: url('images/projectimages/audiotechnica/image1_placeholder.jpg');
	background-size: 100%;
	background-position: bottom right;
}

#audiotechnicaproject:hover {
}

#aanaproject {
	background-image: url('images/projectimages/aana/image1_placeholder.jpg');
	background-position: 0% 90%;
	background-size: 100%;
}

.aanacolor {
	background-color:#e8e2d4;
}

#wickedrootproject {
	background-image: url('images/projectimages/wickedroot/image1_placeholder.jpg');
	background-size: 100%;
	background-position: top left;
}

.wickedrootcolor {
	background-color:#07b0a9;
}

#wickedrootproject:hover {
}

#unicefproject {
	background-image: url('images/projectimages/unicef/image1_placeholder.jpg');
	background-size: 100%;
	background-position: 0% 30%;
}

#saltysaloonproject {
	background-image: url('images/projectimages/saltysaloon/image1_placeholder.jpg');
	background-size: 100%;
	background-position: top left;
}

#saltysaloonproject:hover{
}



.blackoverlay {
	font-family:"DIN Condensed Bold";
	font-weight: normal;
	font-size: 1.5vw;
	width:100%;
	height: 105px;
	padding-top: 95px;
	color:white;
	text-align: center;
	opacity:0;
	background:rgba(0,0,0,0.5);
	text-shadow: 0px 0px 12px rgba(0,0,0,0.5);
	transition: ease-out 400ms;
	border-radius: 5px;
}

.navimage:hover .blackoverlay {
	opacity:1;
	transition: ease-out 400ms;
}

.s1, .s2, .s3, .s4, .s5 {
	color:white;
}

.s5{
	background-color:rgb(0,0,0, 0.5);
}


#s1{
	background-color: rgb(0,175,236);
}

#s2{
	background-color: rgb(234,28,98);
	
}

#s3{
	background-color: rgb(255,240,42);
}

#s4{
	background-color:rgb(64,64,64);
}

.n1, .n2, .n3, .n4 {
	background: rgba(0,0,0,0.5);
	color:white;
}

.nred{
	background-color: rgba(208,38,48,1) !important;
}

.nredorange {
	background-color: rgba(237,64,46,1) !important;
}

.nmaroon {
	background-color: rgba(114,10,6,1) !important;
}

.ncyan {
	background-color: rgba(0,175,236,1) !important;
}

.nteal {
	background-color: rgba(30,177,167,1) !important;
}

.npurple{
	background-color: rgba(159,36,134,1) !important;
}

.nlime{
	background-color: rgba(191,213,64,1) !important;
}

.nblue{
	background-color: rgba(0,114,177,1) !important;
}

.nblack{
	background-color: rgba(64,64,64,1) !important;
}

.nindigo {
	background-color: rgba(24,69,147,1) !important;
}

.naana {
	background-color: rgba(232,226,212,1) !important;
}



#topblock{
	display: block;
	height: 40px;
	width: 100vw;
	margin-top:0px;
	padding-bottom:50px;
	text-align: center;
}

#topblock2{
	display: inline-block;
	height: 40px;
	width: 100vw;
	margin-top:-100px;
	padding-bottom: 50px;
	text-align: center;
}


#fixedtop {
	display:none;
}

#gototop {
	display:inline-block;
	width:40px;
	height:50px;
	padding: 15px;
	padding-right: 15px;
	padding-top: 13px;
	padding-bottom: 7px;
	margin-top: 50px;
	border: solid 2px white;
	border-radius: 40px;
	color: white;
	text-decoration: none;
	transition: ease-out 400ms;
	cursor:pointer;
}

#gototop:hover {
	background-color: white;
	transition: ease-out 400ms;
}

#goback {
	display:inline-block;
	width:40px;
	height:50px;
	padding: 15px;
	padding-right: 15px;
	padding-top: 13px;
	padding-bottom: 7px;
	margin-top: 50px;
	margin-left: calc(-5% - 150px);
	border: solid 2px rgb(200,200,200);
	border-radius: 40px;
	color: black;
	text-decoration: none;
	transform:rotate(-90deg);
	transition: ease-out 400ms;
	cursor:pointer;
}

#goback:hover {
	background-color: rgb(200,200,200);
	transition: ease-out 400ms;
}

.goback2 {
	margin-left: 0px !important;
}

#dropdown {
	display:block;
	float:left;
	cursor:pointer;
	width:auto !important;
	padding-bottom:10px;
	margin-left: calc(50vw - 100px) !important;
	margin-bottom: 50px;
	margin-top: -40px !important;
	padding-right: 8px !important;
}

#dropdownblock {
	display:none;
	clear:left;
	background-color: rgba(0,0,0,0.4);
	width:100vw;
	margin-left:0;
	padding-top: 50px;
	padding-bottom: 50px;
}

#dropdownblock .descriptiontext {
	margin-bottom: 0px !important;
}

.audiotechnicadropdown {
	background-color:#0065a3 !important;
}


.topicon {
	display: block;
	height: 40px;
	width: auto;
	margin-bottom:-10px;
	margin-right: 0px;
	margin-left: 0px;
	border:none;
	transition: ease-out 400ms;
}

.dropdownicon {
	display: block;
	height: 40px;
	width: auto;
	margin-bottom:-12px !important;
	margin-right: 0px;
	margin-left: 0px;
	transform:rotate(90deg);
	border:none;
	transition: ease-out 400ms;
}

.rotatearrow {
transform:rotate(180deg);	
}

.opendropdown {
	display:block !important;
}


.buttonlink {
	font-family:"DIN Condensed Bold";
	font-weight: normal;
	font-size: 1.5em;	
	display:block;
	float: left;
	padding: 20px;
	padding-top: 8px;
	padding-bottom: 13px;
	margin-top: 200px;
	border: solid 2px white;
	border-radius: 40px;
	color: white;
	text-decoration: none;
	transition: ease-out 400ms;
	cursor: pointer;
}

.buttonicon {
	display: inline-block;
	height: 40px;
	width: auto;
	margin-bottom:-10px;
	margin-right: -2.5px;
	margin-left: -2.5px;
	border:none;
	transition: ease-out 400ms;
}

#bi1 {
	display:inline-block;
	opacity:1;
	cursor: pointer;
}

#bi2 {
	display:none;
	opacity:0;
	cursor: pointer;
}

.bl1, .bl2 , .bl3{
	color:white;
	padding-top:12px;
}

.bl1 {
	margin-left: 25vw;
}

.bl2 {
	margin-left:38vw;
}

.bl3 {
	margin-left:2vw;
}

.bl4 {
	margin-top:20px;
	margin-left:25%;
}	

.bl10 {
	margin-top:20px;
	margin-left:42vw;
}

.bl10:hover {
	color:#404040;
}

.bl2, .bl3 {
	margin-top: 0px;
}

.bl2:hover, .bl3:hover {
	color: #1eb1a7;
}

#blackbuttonlink {
	color:#C8C8C8;
	border-color:#C8C8C8 !important;
	transition: ease-out 400ms;
}

#blackbuttonlink:hover {
	color:white;
	background-color:#C8C8C8 !important;
	transition: ease-out 400ms;
}

.buttonlink:hover {
	background-color:white;
	transition: ease-out 400ms;
}

.buttonlink:hover #bi1 {
	display:none;
	opacity:0;
}

.buttonlink:hover #bi2 {
	display:inline-block;
	opacity:1;
}

#bi3 {
	display:block;
	opacity:1;
}

#bi4 {
	display:none;
	opacity:0;
}


#gototop:hover #bi3 {
	display:none;
	opacity:0;
}

#gototop:hover #bi4 {
	display: block;
	opacity:1;
}

#goback:hover #bi3 {
	display:none;
	opacity:0;
}

#goback:hover #bi4 {
	display: block;
	opacity:1;
}

#projectsblock {
	display:inline-block;
	float: left;
	width: 90vw;
	padding-top:30px;
	margin-top:0vh;
	margin-left:7.5vw;
	padding-bottom:10vw;
}

.sectionheader {
	display:block;
	float:left;
	font-size: 2.5vw;
	font-family:"Arciform";
	font-weight: normal;
	width:90vw;
	text-align:center;
	margin-top: 30px;
	margin-bottom: 30px;
	margin-left:-2.5vw;
	color:rgb(200,200,200);
}

.copyrightpolicy {
	margin-top: 150px;
}



.arrow {
	display:none;
	position:fixed;
	z-index: 1;
	transition-delay:ease-out 800ms;
	transition:ease-out 800ms;
}

body:hover .arrow {
	transition-delay:ease-out 0ms;
	transition:ease-out 200ms;
}


.sectionbox {
	display:inline-block;
	position:absolute;
	clear:both;
	width: 95vw;
	height:auto;
	min-height:auto !important;
	margin-top:0px;
	padding-top: 0px;
	padding-bottom: 0px;
	text-align: center;
	z-index:0;
}




.descriptionbox {
	display:inline-block;
	position:absolute;
	clear:both;
	width: 100vw;
	height:auto;
	margin-top:0px;
	padding-top: 140px;
	padding-bottom: 100px;
	text-align: center;
	z-index:0;
}

.cmsframe::-webkit-scrollbar {
    width: 0px;
    height: 0px;
}

.cmsframe {
	diplay:block;
	float:left;
	position:absolute;
	overflow:scroll !important;
	padding-top:40px !important;
	width:100% !important;
	height:100% !important;
	padding:0;
	margin:0;
	left:0;
	border:none  !important;
}

.largeimage {
	width:100vw;
	height:auto;
	margin-left:0vw;
	margin-bottom:-3px !important;
	margin-top: -1px !important;
	border-radius: 0px;
}

@-moz-document url-prefix() {
.largeimage {
    margin-top: -3px !important;
	margin-bottom: -3px;
}
}

.mediumimage {
	width:50vw;
	border-radius: 0px;
	margin-top: 20px;
	margin-bottom: 70px;
	padding:0px;
}

.headshot {
	padding-top:0px !important;
	margin-bottom:0px !important;
	width:30vw !important;
}

.smallimage {
	width:35vw;
	margin-left:0vw;
	border-radius: 0px;
	margin-bottom: 30px;
}

.largevideo {
	display: inline-block;
	width: 1200px;
	height:675px;
}

.smallvideo {
	display:inline-block;
	width: 580px;
    height: 321px;
	padding:20px;
	
}

.video-block {
	padding: 70px 0px;
	text-align:center;
}

.small-video-block {
	width:100vw;
	padding: 70px 0px;
	text-align:center;
	background-color:#126DC3;
}

.watch-series {
	width:100%;
	text-align:center !important;
	padding-bottom: 30px;
}

#largerollover {
	width:100vw;
	margin-left:0vw;
	border-radius: 0px;
	margin-bottom: 30px;
}

.imageleft {
	margin-right:2%;
}

h1 {
	font-family:"Arciform";
	font-weight: normal;
	font-size: 8vw;	
	clear:left;
	color:rgba(255,255,255,1.00);
	margin-bottom:-10px;
}


h3 {
	font-family:"DIN Condensed Bold";
	font-weight: normal;
	font-size: 2.5vw;	
	margin-top:20px;
	margin-bottom:20px;
	clear:left;
	color:rgba(0,0,0,0.4);
}

h4 {
	font-family:"DIN Condensed Bold";
	font-weight: normal;
	font-size: 2.5vw;	
	text-align: left;
	width:50%;
	clear:left;
	color:rgba(0,0,0,0.4);
	margin-left: 25%;
	margin-top: 5vw;
}

h5 {
	clear:left;
	width:50%;
	margin-left: 25%;
	margin-top: -20px;
	margin-bottom: 50px;
	font-family: 'Helvetica Neue', Arial, 'sans-serif';
	font-weight:300;
	font-size:1.5em;
	line-height: 1em;
	text-align: center;
	color:#93959A;
}

hr {
	width:75px;
	margin-left: 47.5%;
	margin-top: 10px;
	border-top: 3px solid #FFFFFF;
	border-radius: 5px;
}

sup {
	font-variant-position: super !important;
	font-size:0.5em;
	padding-left:1px;
}


.resumeheader {
	font-family:"Arciform";
	font-weight: normal;
	font-size: 3vw;	
	float:left;
	color:rgba(255,255,255,1);
	margin-left: 25%;
	margin-top: 60px;
	margin-bottom: 12px;
}

.resumesubheader {
	font-size: 1.7em !important;
	margin-top: 25px;
	margin-bottom: -6px;
}


.resumetext {
	display:block;
	clear:left;
	width:50%;
	margin-left: 25%;
	margin-top: 0px;
	margin-bottom: 0px;
	font-family: 'Helvetica Neue', Arial, 'sans-serif';
	font-weight:300;
	font-size:1.5vw;
	line-height: 1.4em;
	text-align: left;
	color:white;
}



.descriptiontext {
	display:block;
	width:50%;
	margin-left: 25%;
	margin-bottom: 50px;
	font-family: 'Helvetica Neue', Arial, 'sans-serif';
	font-weight:300;
	font-size:1.3vw;
	line-height: 1.5em;
	text-align: left;
	color:white;
}

.nogap {
	margin-bottom: 0px !important;
}


.centeredtext {
	display:inline-block;
	clear:both;
	font-family: "Arciform";
	font-size:1.5vw;
	letter-spacing: 0.05em;
	line-height: 20px;
	text-align: center;
	color:white;
	width:100vw;
	margin-top: 100px;
	margin-bottom: 50px;
}

.contacttext {
	display:block;
	float:left;
	text-align: left;
	font-family: "Arciform";
	font-size:2vw;
	letter-spacing: 0.1em;
	line-height: 1.5vw;
	color:white;
	width:auto;
	margin-bottom: 50px;
	margin-left: 32.5vw;
}

.navtextbox {
	display:inline-block;
	float: left;
	font-family:  'Helvetica Neue', Arial, 'sans-serif';
	font-weight:300;
	font-size:1vw;
	line-height: 20px;
	text-align: left;
	color:white;
	width: 95%;
	height: 185px;
	margin-left:1.5%;
}



.projectimage {
	display:block;
	position:absolute;
	float:left;
	width: auto;
	height:40vw;
	margin-left: 29vw;
	cursor:pointer;
}


#dropdown {
	display:block;
	width:100%;
	margin-top: 50px;
	cursor:pointer;
	height:40px;
	color:white;
	padding-top:12px;
	margin-left: 25vw;
}

.bl5:hover {
	color:#ed402e !important;
}
.bl6:hover {
	color:#404040 !important;
}
.bl7:hover {
	color: #0072b1 !important;
}
.bl8:hover {
	color: #bfd540 !important;
}

.bl9:hover {
	color: #07b0a9 !important;
}



button {
-webkit-appearance: none;
  background: transparent;
  border: 0;
  outline:0;
}


#formicon {
	display:inline-block;
	float: right;
	font-size: 10px;
}

svg {
  padding: 5px;
}

.arrow {
  cursor: pointer;
  position: absolute;
  top: 52%;
  margin-top: -45px;
  margin-left: -35px;
  width: 70px;
  height: 90px;
}

.left {
  left: 10vw;
}

.right {
  left: 90vw;
}

.down {
  left: 52%;
  transform:rotate(-90deg);
}

#toparrow {
	top: 87%;
}

#bottomarrow {
	top: 89%;
}



.left:hover polyline,
.left:focus polyline {
  stroke-width: 2;
}

.left:active polyline {
  stroke-width: 5;
  transition: all 100ms ease-in-out;
}

.right:hover polyline,
.right:focus polyline {
  stroke-width: 2;
}

.right:active polyline {
  stroke-width: 5;
  transition: all 100ms ease-in-out;
}

polyline {
  transition: all 250ms ease-in-out;
}




#relatedprojects {
	display: block;
	float:left;
	width: 100vw;
	background-color: rgba(255,255,255,1);
	height:inherit;
	margin-top: 100px;
	margin-bottom: -100px;
	padding-top: 100px;
	padding-bottom: 100px;
}

.relatedheader {
	display:block;
	float:left;
	font-size: 2.5vw;
	font-family:"Arciform";
	font-weight: normal;
	width:100vw;
	text-align:center;
	margin-top: 0px;
	margin-bottom: 20px;
	color:rgb(200,200,200);
}

.relatedblock {
	display:inline-block;
	margin-left:5%;
	width: 90%;
}




/*Contact form CSS*/
#contactform {
display:block;
float:left;
width: 50vw;
margin-left: 23vw !important;
margin-left: 5vw;
margin-top: 0px;
margin-bottom:100px;
}

form{
	width: 90%;
	padding: 30px;
	padding-top:0px;
	display:block;
	border-radius: 12px;
}

label{
	font-family:  'Helvetica Neue', Arial, 'sans-serif';
	font-weight: normal;
	font-size:0.9em;
	letter-spacing: 0.05em;
	color:#ffffff;
	display:inline-block;
	float:left;
	margin-top:10px;
	margin-bottom: 5px;
	margin-right: 20px;
	margin-left: 5px;
}



input{
	font-family:  'Helvetica Neue', Arial, 'sans-serif';
	font-size:16px;
	display:block;
	clear:left;
	width: 50vw;
	height:20px;
	color:#404040;
	background-color: rgba(255,255,255,0.7);
	border: 1px solid rgba(255,255,255,0.7) !important;
	border-radius: 20px;
	padding: 10px;
	padding-right: 15px;
	margin-top: 10px;
	
	transition: background-color 1s;  
    -webkit-transition: background-color 1s; 
    -o-transition: background-color 1s; 

}

input:focus{
	color:#404040;
	outline:none;
	background-color:#ffffff;
	border: 1px solid white !important;
}

#submit{
	-webkit-appearance: none;
	font-family:"DIN Condensed Bold";
	font-weight: normal;
	font-size:1.5em;
	letter-spacing: 0.05em;
	display:block;
	float:left;
	width: 10vw;
	height:40px;
	border-radius: 40px;
	padding: 20px;
	padding-bottom: 40px !important;
	margin-top: 50px;
	margin-left: 45%;
	color: white;
	background-color:#404040;
	border: solid 2px white;
	cursor:pointer;
	transition: ease-out 400ms;
}

#submit:hover{
	background-color:#ffffff;
	color:#404040;
	transition: ease-out 400ms;
}

select {
	font-family:  'Helvetica Neue', Arial, 'sans-serif';
	display:block;
	clear:left;
	width: 51.45vw;
	height: 40px;
	border-radius: 20px;
	padding: 10px;
	padding-top: 8px;
	padding-bottom: 7px;
	padding-right: 15px;
	margin-top: 20px;
	font-size:16px;
	background:url(images/pageimages/rwicons/rwicon_down-black.png);
	background-size: 30px;
	background-position:98.5% 50%;
	background-repeat: no-repeat;
	background-color: rgba(255,255,255,0.7);
	border: 1px solid rgba(255,255,255,0.7) !important;
	color: rgba(0,0,0,0.4);
	outline: none;
	cursor:pointer;
	-webkit-appearance:none;
	-moz-appearance: none;
	appearance: none;
	transition: background-color 1s; 
    -moz-transition: background-color 1s; 
    -webkit-transition: background-color 1s; 
    -o-transition: background-color 1s;
	
}

select:focus{
	outline:none;
	background-color:#ffffff;
	color:#404040;
	border: 1px solid white !important;
	transition: background-color 0s;
	-moz-transition: background-color 0s; 
    -webkit-transition: background-color 0s; 
    -o-transition: background-color 0s;
}


textarea{
	font-family:  'Helvetica Neue', Arial, 'sans-serif';
	display:block;
	clear:left;
	font-size: 16px;
	width: 50.3vw;
	min-height: 320px;
	max-height: 500px;
	padding: 10px;
	margin-top: 20px;
	overflow:auto;
	border:none;
	border-radius: 20px;
	resize: none;
	color:#404040;
	background-color: rgba(255,255,255,0.7);
	border: 1px solid rgba(255,255,255,0.7) !important;
	transition: background-color 1s; 
    -moz-transition: background-color 1s; 
    -webkit-transition: background-color 1s; 
    -o-transition: background-color 1s; 
}

textarea:focus{
	outline:none;
	background-color: #ffffff;
	color:#404040;
	border: 1px solid white !important;
}

.rightcolumn {
	float: right;
	width: 45%;
}
.leftcolumn {
	float: left;
	width: 45%;
}

.confirmedblock {
	display:block;
	width:100vw;
}
.messagesent {
	display:inline-block;
	text-align:center;
	height: 75px;
	width: 75px;	
}

.companyname {
	width:49.9vw;
}

/*VALIDITY STYLES*/
input:invalid, select:invalid, textarea:invalid {
	border: 0px solid red !important;
	box-shadow: none !important;
	transition: 300ms ease-in-out;
	}

input:focus:invalid, select:focus:invalid, textarea:focus:invalid {
	border: 1px solid red !important;
	border-radius: 20px;
	box-shadow: none !important;
	transition: 300ms ease-in-out;
}


#credit {
	display:block;
	clear:left;
	color:rgba(255,255,255,0.5);
	margin-left:5vw;
	margin-top:0px;
	padding-top:0px;
	padding-bottom:75px;
	text-align:left;
	width:90vw;
	font-size: 0.6em;	
	font-family:  'Helvetica Neue', Arial, 'sans-serif';
}






#sm1{
	margin-left:4vw;
}

#sm2{
}

.sm {
	display: inline-block;
	float:left;
	font-size: 24px;
	color:rgba(0,0,0,0.2);
	margin: 7px;
	margin-top:14px;
	transition: 400ms ease-out;
	cursor: pointer;
}

.sm:hover {
	color:rgba(0,0,0,0.65);
	transition: 400ms ease-out;
}

.copyright{
	font-family:  'Helvetica Neue', Arial, 'sans-serif';
	font-size: 0.6em;
	color:rgba(0,0,0,0.4);
	margin-top: 20px;
	margin-left:45%;
}

#notice{
	font-family:  'Helvetica Neue', Arial, 'sans-serif';
	font-size: 0.6em;
	display:inline-block;
	float:left;
	color:rgba(0,0,0,0.4);
	margin-top: -12px;
	margin-left:82%;
}

#noticetext {
	color:rgb(200,200,200);
}
#mobilefooter {
	display:none;
}


footer {
	display:block;
	position:fixed;
	height:50px;
	width:100vw;
	margin-top:calc(100vh - 50px);
	bottom: 0px;
	background-color: rgba(255,255,255,1);
	z-index: 100;
}





/* Sweep To Bottom */
.hvr-sweep-to-bottom {
	display: inline-block;
	vertical-align: middle;
	-webkit-transform: perspective(1px) translateZ(0);
	transform: perspective(1px) translateZ(0);
	box-shadow: 0 0 1px transparent;
	position: relative;
	-webkit-transition-property: color;
	transition-property: color;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
}
.hvr-sweep-to-bottom:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: white;
	-webkit-transform: scaleY(0);
	transform: scaleY(0);
	-webkit-transform-origin: 50% 0;
	transform-origin: 50% 0;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
}
.hvr-sweep-to-bottom:hover, .hvr-sweep-to-bottom:focus, .hvr-sweep-to-bottom:active {
	color: white;
}

.hvr-sweep-to-bottom:hover:before, .hvr-sweep-to-bottom:focus:before, .hvr-sweep-to-bottom:active:before {
	-webkit-transform: scaleY(1);
	transform: scaleY(1);
}





/*FADE PAGE*/
.fade{
	 animation: fadein 3s;
    -moz-animation: fadein 3s; /* Firefox */
    -webkit-animation: fadein 3s; /* Safari and Chrome */
    -o-animation: fadein 3s; /* Opera */
}

@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}