/*!
 * andyCdesign.com v2
 *
 * Copyright 2012 andyCdesign.com, Inc
 *
 * Designed and built with all the love in the world by AndyC */


/*  IMPORT FONTS  ============================================================================= */

/*CUSTOM FONTS FIRST PEEEPS!!!!*/
@font-face {
    font-family: BebasNeueRegular;
    src: url('BebasNeue-webfont.eot');
    src: url('BebasNeue-webfont.eot?#iefix') format('embedded-opentype'),
         url('BebasNeue-webfont.woff') format('woff'),
         url('BebasNeue-webfont.ttf') format('truetype'),
         url('BebasNeue-webfont.svg#BebasNeueRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: Pacifico;
    src: url('Pacifico-webfont.eot');
    src: url('Pacifico-webfont.eot?#iefix') format('embedded-opentype'),
         url('Pacifico-webfont.woff') format('woff'),
         url('Pacifico-webfont.ttf') format('truetype'),
         url('Pacifico-webfont.svg#PacificoRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/*Highlight Selection Colours!*/
::selection {
	/* Safari/Chrome */
	background-color: #75ff58;
 }
::-moz-selection {
	background: #75ff58;; /* Firefox */
	}

::-o-selection {
	background: #75ff58;; /* Opera when confirmed */
}

/*====================================================================================*//*====================================================================================*/

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
  display: block;
}

audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

audio:not([controls]) {
  display: none;
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

smalltext{
	   font: 14px/9px helvetica,'helvetica neue',arial,sans-serif; 
	   color: #ffffff;
}
	
smallhed{
	   font: bold 20px/9px helvetica,'helvetica neue',arial,sans-serif; 
	   color: #ffffff;
   }
	
	
a {
	color: #ffffff;
	font: 16px/16px helvetica,'helvetica neue',arial,sans-serif; 
	display: block; 	
}
	
a:link {
	text-decoration: none;
	color: #ffffff;
	font-weight: bold;	
	vertical-align:middle;
	text-align:center;
}

a:visited {
	text-decoration: none;
	color: #ffffff;
	vertical-align:middle;
	text-align:center;
}

a:hover {
	text-decoration: none;
	color: #ffffff;vertical-align:middle;text-align:center;
		
	/*for custom mouse cursors!:	cursor: url("acdc.cur"), pointer}*/
	
}

a:active {
	text-decoration: none;
}

h2,h3,h4,h5,h6 {
	font-family: helvetica,'helvetica neue',arial,sans-serif; 
}
	
h1 {

	color:#ff4700;	letter-spacing:-6px;
	font: bold 8.571em helvetica,'helvetica neue',arial,sans-serif;
	text-transform: none;
	text-align: left;
	
}

h2 {
	color:#ff4700;	letter-spacing:-1px;
	font: bold 2.1em helvetica,'helvetica neue',arial,sans-serif;
	white-space: normal;
	text-align: left;
}

h3 {
	color: #ff4700;
	letter-spacing:-2px;
	font: 2.714em helvetica,'helvetica neue',arial,sans-serif;
	font-weight: 600;
	text-align: left;

}

h4 {
	color: #ffffff;
	font-family: helvetica,'helvetica neue',arial,sans-serif;
	font-size: 4em;
	letter-spacing: -4px;
	line-height: 62px;
	text-align: left;
	
}

h5 {
	font-size: 1.0em;
	line-height: 1.84em;
	color: #999;
	font-weight: 300;
	text-align: left;
	
}

h6 {
	font-size: 0.643em;
	color: #999;
}

ul, ol {
	font-family:	helvetica,'helvetica neue',arial,sans-serif; 
	margin-top: 20px; 
	list-style-type:none; 
	margin:0; 
	padding:0; 
	display: inline-block; 
	line-height: 2.3em;	
	text-align: center;	
}
	
li {
	float:left;
	vertical-align:middle;
	text-align: center;	
}	
	
a { 
	width:100px;
	vertical-align:middle;
	text-align: center;	
}	

/*General Body Styling*/

body{
	top: -1px;
	left:-1px;
	height:auto;
	text-align: left;
	background: url(images/studio3.png) no-repeat #404040;
	font: 1.000em/1.000em helvetica,'helvetica neue',arial,sans-serif;
	-webkit-font-smoothing: antialiased;
	/* -moz-font-smoothing: antialiased; - No longer available in FF */
	font-smoothing: antialiased;
	/*	BACKGROUND RADIAL GRADIENT*/
	background: #4c4c4c; /* Old browsers */
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM0YzRjNGMiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMTMxMzEzIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-radial-gradient(center, ellipse cover,  #4c4c4c 0%, #131313 100%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#4c4c4c), color-stop(100%,#131313)); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover,  #4c4c4c 0%,#131313 100%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover,  #4c4c4c 0%,#131313 100%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover,  #4c4c4c 0%,#131313 100%); /* IE10+ */
	background: radial-gradient(ellipse at center,  #4c4c4c 0%,#131313 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c4c4c', endColorstr='#131313',GradientType=1 ); 
		/* IE6-8 fallback on horizontal gradient */
	background-size:100%;
}

body img{
	max-width: 100%;
	}


/*END OF BODY & WRAPPER STYLES*/

/*SITE NAVIGATION*/

header{
	position: relative;
	width:100%;
	height:98px;
	background-color: #000000;
	position: fixed;
	border-bottom: 3px solid  #ff4700;
	z-index:990;
	display: block;
	-webkit-font-smoothing: antialiased;
	/* -moz-font-smoothing: antialiased; - No longer available in FF */
	font-smoothing: antialiased;
}


#navcontainer{
	width:100%;
	max-width: 980px;
	height:98px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0px;
	position: relative;
}

.navmenu{
	top:-18px;
	width: 1000px;
	height:75px;
	position: relative;
	float: left;
	clear: none;
	padding-left:  auto;
	padding-right: auto;
}

.navmenu li{
	position: relative;
	height: 80px;
	display: block;
	float: left;
	border-bottom-color: #fefe2f;
	left: 480px;
}
	
.navmenu a {
	margin-bottom:28px;
	padding-top:34px;
	position:relative;	
	top: 0px;
	height:68px;
	display: block;
	text-decoration: none;
	font-size: 1.143em;
	font-weight: bold;
	border: none;
	text-align: center;
	vertical-align:middle;
	opacity:0.2;
	-webkit-transition-property:opacity;
	transition-property:opacity;
	-o-transition-property:opacity;
	-ms-transition-property:opacity;
	-moz-transition-property:opacity;
	-webkit-transition-duration:0.85s;
	transition-duration:0.25s;
	-o-transition-duration:0.25s;
	-ms-transition-duration:0.25s;
	-moz-transition-duration:0.25s;
	-webkit-transition-timing-function:ease-in-out;
	transition-timing-function:ease-in-out;
	-o-transition-timing-function:ease-in-out;
	-ms-transition-timing-function:ease-in-out;
	-moz-transition-timing-function:ease-in-out;
	-webkit-transition-delay:initial;
	transition-delay:initial;
	-o-transition-delay:initial;
	-ms-transition-delay:initial;
	-moz-transition-delay:initial;
}
	
.navmenu ul {
	float: right;
	text-align: middle;
}

.navmenu a:hover, .navmenu .navmenu a {
	text-decoration: none;
	font-weight: bold;
	text-align: center;
	padding-top:34px;
	vertical-align:middle;
	background-color: #ff4700;
	text-shadow: -1px -1px 3px #000000;
	opacity:1;
	transition-timing-function:ease-in-out;
	-o-transition-timing-function:ease-in-out;
	-ms-transition-timing-function:ease-in-out;
	-moz-transition-timing-function:ease-in-out;
	display: block;
}

#navarrow{
	position: relative;
	top: 82px;
	width: 60px;
	height:31px;
	margin-left: auto;
	margin-right: auto;
	background-image: url(images/arrowdown.png);
	display:block;
	padding: 0px;
}


#acdclogo{
	width:299px:;
	height:65px;
	background: url(images/acdclogo.png) no-repeat;
	position:absolute;
	left:10px;
	top: 17px;
	display: block;
}

	.cssreel{
		position:fixed;
		top:0px;
		float:right;
		right:0px;
		z-index:9755;
}
.cssreel a{
		width:115px;
		height:115px;
		text-indent:-8000px;
		float: right;
		display:block;
		background:url(images/cssreel_nomineetag_yellow.png)no-repeat;
}



/*SITE NAVIGATION END*/
section{
	position: relative;
	width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	display: block;
	float: left;
	-webkit-font-smoothing: antialiased;
	/* -moz-font-smoothing: antialiased; - No longer available in FF */
	font-smoothing: antialiased;
	}


#section1{
	position: relative;
	top:-45px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 130px;
	width:100%;	
	height:auto;
	display: block;
	float: left;
	background-position: center;
	}

#section2{
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width:100%;	
	height:auto;
	background-color: #121212;
	background-position: center;
	display: block;
	float: left;
	}

#section3{
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width:100%;	
	height:auto;
	display: block;
	float: left;
	background: center #3AAFC8;
}

#section4{
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width:100%;	
	height:auto;
	display: block;
	float: left;
	background: center #3AAFC8;
}


.wrapper{
	position: relative;
	top:0;
	margin-left: auto;
	margin-right: auto;
	margin-top: 30px;
	width:100%;	
	max-width: 1030px;
	max-height: 3000px;
	height:auto;
}

.wrapper2{
	position: relative;
	top: 20px;
	margin-left: auto;
	margin-right: auto;
	width:100%;	
	max-width: 1030px;
	height:auto;
}

.wrapper3{
	position: relative;
	top: 20px;
	margin-left: auto;
	margin-right: auto;
	width:100%;	
	max-width: 1030px;
	height:auto;
}

.wrapper4{
	position: relative;
	top: 20px;
	margin-left: auto;
	margin-right: auto;
	width:100%;	
	max-width: 1030px;
	height:auto;
	border: 1px solid #f9fc09;
}



#introbox{
	position: relative;
	top: 28px;
	width: 100%;
	height: auto;
	margin-bottom: 30px;
	float: left;
	display: block;
}

#topcopy{
	position: relative;
	width: 95%;
	height: 300px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding: 30%;
	float: left;
	color: #dcd6c6;
	
}

#intro{
	position: relative;
	width: 100%;
	height: auto;
	display: block;
	float: left;
}

#introcopy{
	position: absolute;
	top:-80px;
	width:40.30612244898%;
	height: auto;
	color: #fe5a00;
	text-align: left;
	text-shadow: -1px 1px 14px #000000;
	margin-right: 20px;
	float: left;
	left: 5.5%;
	line-height: normal;
	white-space: normal;
}

.introtitle{
	position: relative;
	left: -5px;
	width:100%;
	height: auto;
	margin-bottom: 50px;
	
}

.introblock{
	position: relative;
	top: -40px;
	width:100%;
	height: auto;
	margin-bottom: 30px;
	color: #dcd6c6;
}

.andyc{
	position: relative;
	top: 10px;
	width: 85.551020408163%;
	max-width: 760px;
	height: auto;
	max-height: 602px;
	left: 20.4%;	
	display: block;
	float: left;
}

/*.can{
	position: absolute;
	width:50% ;
	height:auto ;
	max-width:377px ;
	max-height:343px ;
	z-index: 900;
	clear: none;
	top: -300px;
	margin-left: auto;
	margin-right: auto;
	
}


.cando{
	position: absolute;
	width:100% ;
	height:auto ;
}*/

/*Section 1 Start*/
#contentbox{
	position: relative;
	width: 98.571428571429%;
	top: -20px;
	max-width: 980px;
	height: auto;
	padding: 24px;
	display: block;
	float: left;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 50px;
	-moz-box-shadow: 0 0 1px #ffffff;
	-webkit-box-shadow: 0 0 1px #ffffff;
	box-shadow: 0 0 1px #ffffff;
	background: url(images/noise2.png) #252525;
	margin-bottom: 90px;
	-webkit-font-smoothing: antialiased;
	/* -moz-font-smoothing: antialiased; - No longer available in FF */
	font-smoothing: antialiased;
	z-index: 10;
}

#projectbox{
	position: relative;
	width: 100% ;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	float: left;
	clear: none;
	-moz-box-shadow: 0 0 1px #ffffff;
	-webkit-box-shadow: 0 0 1px #ffffff;
	box-shadow: 0 0 1px #ffffff;
	background: url(images/noise2.png) #525252;
}

.recent-banner{
	position: relative;
	top:25%;
	left: -1.7%;
	width:59.223300970874%;
	height: auto;
	max-height:610px ;
	min-height: 82px;
	margin-bottom: 4.2%;
	margin-top: 3%; ;
}

.projheading{
	position: relative;
	width: 100%;
	max-width: 297px;
	height: 48px;
	display: block;
	float: left;
	clear: none;
	margin: 0 auto;
	margin-bottom: 0px;
	text-align: center;
	text-shadow: 1px 1px 1px #000000;
	font: 600 20px helvetica,'helvetica neue',arial,sans-serif;
	color: #ffffff;
}

.divider{
	position: relative;
	top: -40px;
	width: 100%;
	height: 30px;
	opacity: .8;
}


.proj1{
	position: relative;
	left: 1.5%;
	width: 30%;
	height: auto;
	display: block;
	float: left;
	clear: none;
	margin: 0 auto;
	padding: 2px;
	top: -18px;
}

.proj2{
	position: relative;
	width: 30%;
	height: auto;
	display: block;
	float: left;
	clear: none;
	alignment-baseline: central;
	margin: 0 auto;
	left: 4.44444444%;
	padding: 2px;
	top: -18px;
	
}
	
.proj3{
	position: relative;
	right: 1.5%;
	width: 30%;
	height: auto;
	display: block;
	float: right;
	margin: 0 auto;
	padding: 2px;
	top: -18px;
	
}
	
.centerbox{
	position: relative;
	top: -15px;
	margin: 0 auto;
	display: box;
	width: auto;
	height: auto;
	padding: 10px;
	text-align: left;
	margin-bottom: -30px;
}

.project{
	position: relative;
	max-width: 100%;
	border: 1px solid #000000;
	display: inline-block;
	-moz-box-shadow: 0 0 8px #111111;
	-webkit-box-shadow: 0 0 8px #111111;
	box-shadow: 0 0 8px #111111;
}

.protxt{
	position: relative;
	top: -8px;
	width: 100%;
	height: auto;
	max-width: 297px;
	display: block;
	margin-right: 12px;
	float: left;	
	clear: none;
	font-size: 0.9em;
	line-height: 20px;
	font-weight: 400;
	text-align: center;
	color: #ffffff;
	text-shadow: 1px 1px 1px #000000;
	margin-left: auto;
	margin-right: auto;
	font-family: helvetica,'helvetica neue',arial,sans-serif; 
}


#projectbottom{
	position:relative;
	width: 100%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	float: left;	
	clear: none;
	display: block;
	-webkit-font-smoothing: antialiased;
	/* -moz-font-smoothing: antialiased; - No longer available in FF */
	font-smoothing: antialiased;
}

/*.sign-off{
	position:relative;
	width: 70%;
	top: -50px;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	letter-spacing: -2px;
	clear: none;
	display: block;
	color: #ffffff;
	font: bold 2em helvetica,'helvetica neue',arial,sans-serif;
	background-color:#f43022 ;
	text-align: center;
	padding-top: 3px;
	padding-bottom: 3px;
}*/

#lfttext{
	position:absolute;
	top: 0px;
	float: left;	
	clear: none;
	width: 462px;
	height:540px;
	vertical-align:top;
	text-align:left;
	font-weight: normal;
	font-style: normal;
	margin-right:50px;
	padding-bottom:20px;
	text-shadow: -1px -1px 1px #2c2c2c;
}


/*3d Flipper Effect Wrapper*/

#flip{
	position:absolute;
	width: 47.613636363636%;
	height: 32.00150526844%;
	float: left;	
	clear: none;
	top:-8px;
	left: 48.5%;
	margin: 30px;
}



/*3d Flipper Effect Transition*/

#flipcontainer {
	width:100%;
	float: left;	
	clear: none;
	position:absolute;
	width: 100%;
	height: auto;
	margin-bottom: 20px;
	-o-perspective:1000;
	-ms-perspective:1000;
	-moz-perspective:1000;
	-webkit-perspective:1000;
	alignment-baseline: baseline;
}

.insideflipcontainer {
	width:100%;
	float: left;	
	clear: none;
	position:absolute;
	transform-style:preserve-3d;
	-o-transform-style:preserve-3d;
	-ms-transform-style:preserve-3d;
	-moz-transform-style:preserve-3d;
	-webkit-transform-style:preserve-3d;
	transition:0.5s;
	-o-transition:0.5s;
	-ms-transition:0.5s;
	-moz-transition:0.5s;
	-webkit-transition:0.5s;
	}


#flipcontainer:hover {
	width:100%;
	float: left;	
	clear: none;
	position:absolute;

	-webkit-transition: 0.8s;
	-moz-transition: 0.8s;
	-o-transition: 0.8s;
	-ms-transition: 0.8s;
	transition: 0.8s; /*Safari*/

	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;

	-webkit-transition-property: -webkit-transform;
	-moz-transition-property: -moz-transform;
	-o-transition-property: -o-transform;
	-ms-transition-property: -ms-transform;
	transition-property: transform;

	-webkit-transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
	-ms-transform: rotateY(180deg);
	transform: rotateY(180deg);
	-webkit-perspective: 90; /*Opera*/
	-o-perspective: 90; /*Fire Fox*/
	-moz-perspective: 90; /*All*/

	-webkit-transition-timing-function: ease-in-out;
	-moz-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	-ms-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out;
}

#flipcontainer img{
	width:100%;
	float: left;	
	clear: none;
	position:absolute;
	backface-visibility:hidden;
		-o-backface-visibility:hidden;
		-ms-backface-visibility:hidden;
		-moz-backface-visibility:hidden;
		-webkit-backface-visibility:hidden;
}

.face {
	width:100%;
	float:left;
	position:absolute;
	backface-visibility:hidden;
	-o-backface-visibility:hidden;
	-ms-backface-visibility:hidden;
	-moz-backface-visibility:hidden;
	-webkit-backface-visibility:hidden;
}

/* Styles the front of the image */

.front {
	position:absolute;
	width:100%;
	float:left;
	height: 411px;
	/* Set the color of the suit characters on the image */
	/* Background color of this side of the image */
}

/* Styles the back of the card */

	.back {
	width:100%;
	float:left;
	position:absolute;

	transform:rotateY(180deg);
	-o-transform:rotateY(180deg);
	-ms-transform:rotateY(180deg);
	-moz-transform:rotateY(180deg);
	-webkit-transform:rotateY(180deg);
	}
	
#flipbox{
	width: 100%;
	height: auto;
	margin: 20px;
}

/* End of Flip Icon */


#chart{
	position: absolute;
	display: inline-block;
	width:45% ;
	max-width: 473px;
	left: 50%;
	height: 299px;
	top: 470px;
	padding: 15px;
	float: left;	
	clear: none;
	z-index: 500;
	background-color:rgba(0,0,0,0.3);
	border-radius: 3px;
	border: 1px solid #959ea1;
}

.graph-title{
	width: 100%;
	height: 15px;
	font-size: 36px;
	letter-spacing: -1px;
	font-family: "BebasNeueRegular";
	margin-top:10px ;
	padding-bottom: 15px;
	border-bottom: 1px solid #959ea1;
	color:#959ea1 ;
	opacity: 1;
	z-index: 800;
	
}

.responsive-container{
	position: relative;
	display: inline-block;
	float: left;	
	clear: none;
	width:30px ;
	left: 15px;
	height: 15px;
	margin-left:6px;
	margin-right: 6px;
	padding: 3px;
	z-index: 20;
	background-color: #959ea1 transparent;
	text-align: center;
	font-size: 11px;
	top: 20px;
	border-right: 2px solid #c3c3c3;
	color: #c3c3c3 ;
}

.responsive-kit{
	position: relative;
	top: 5px;
	left: -0.2%;
	width: 100%;
	min-height-height:180px ;
	height: auto;
	z-index: 800;
	}

.responsive img{
	max-width: 504px;
	width: 100%;
	height: auto;
	}

.responsiveblock{
	position: relative;
	width: 95%;
	height: auto;
	background-color:rgba(0,0,0,0.5);
	text-align: left;
	padding: 10px;
	font-size: 12px;
	text-align: center;
}

.responsiveblock-txt{
	position: relative;
	width: 90%;
	height: auto;
	text-align: left;
	line-height: 15px;
	margin-left: 10px;
	margin-right: 10px;
	color: #ffffff;
}

.headliner{
	position: relative;
	top: 10px;
	left: 1%;
	width: 44.918367346939%;
	max-width: 450px;
	height: auto;
	margin-top: -30px;
	margin-right: 20px;
	text-shadow: 1px 1px 1px #000000;
	float: left;	
	clear: none;
	font-weight: 600;
	-webkit-font-smoothing: antialiased;
	/* -moz-font-smoothing: antialiased; - No longer available in FF */
	font-smoothing: antialiased;
	}	

	
.headliner, h5 	{
	width: 100%;
	font-family: helvetica,'helvetica neue',arial,sans-serif;
	font-weight:600 ;
	font-size:16px ;
	line-height: 30px;
	color: #fffff;
}

.intropara{
	position:relative;
	width: 100%;
	height: auto;
	float: left;
	clear: none;
	display: block;
	top: -10px;
	font-family: helvetica,'helvetica neue',arial,sans-serif;
	
}
		
.p2container{
	position: relative;
	width:98.571428571429%;
	height: auto;
	max-height: 500px;
	padding: 24px;
	max-width: 966px;
	margin-top: 35px;
}

#pageContent2{
	position: relative;
	width: 100%;
	height: 1000px;
	background-color: #000000;
	margin-left: auto;
	margin-right: auto;
}


#pageContent2{
	position: relative;
	background-color: #000;
	width: 100%;
	height: auto;
}

.header-section2{
	position: relative;
	top: 150px;
	float: left;
	width: 100% ;
	height: auto;
	max-width: 504px ;
	max-height: 193px;
	margin-left: auto;
	margin-right: auto;
	display: inline-block;
	margin-bottom: 30px;
}

#macwrapper{
	position: relative;
	left: 2.5%;
	width: 100% ;
	height: 630px;
	margin-left: auto;
	margin-right: auto;
	display: block;
	float: left;	
	clear: none;
	margin-bottom: 30px;
}

#mac{
	position: relative;
	top: -100px;
	width: 100% ;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	margin-bottom: 20px;
	display: block;
	float: left;
	clear: none;
}

.macpix{
	position: relative;
	width: 100% ;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	margin-bottom: 20px;
	display: block;
	float: left;
	clear: none;
	z-index: 900;
}

#mac-img{
	position: relative;
	top: 0px;
	max-width:100%;
	z-index: 20;
	display: block;
	float: left;
	margin-left: auto;
	margin-right: auto;
	clear: none;
}

#statement{
	position: relative;
	width: 90%;
	height: auto;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 80px;
	margin-bottom: 40px;
	top: 150px; 
	color: #ffffff; 
	letter-spacing:-1px;
	display: inline-box;
	font: bold 2.1em helvetica,'helvetica neue',arial,sans-serif;
	}

/***======    START OF JQUERY SLIDE SHOW SET TO SIMPLE FADE **/

#slideshow{  
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	width: 72.65306122449% ;
	height: auto;
	top:-700px;
	left: 130px;
	bottom: 0px;
	display: block;
	float: left;
}

#slideshow img{
	position: absolute;
	width: 100% ;
	top: 0px;
	left: 0px;
	height: auto;
	display: block;
	float: left;
	margin-left: auto;
	margin-right: auto;
}

#slideshow {
    position:absolute;
	width: 72.65306122449% ;
 	height: 395px;
 	display: block;
 	float: left;
 	margin-left: auto;
 	margin-right: auto;
 	top:13%;
 	left: 14%;
}
 
#slideshow IMG {
    position:absolute;
    left:0;
    z-index:8;
    opacity:0.0;
    display: block;
    float: left;
}

#slideshow IMG.active {
    z-index:10;
    opacity:1.0;
    display: block;
    float: left;
}

#slideshow IMG.last-active {
    z-index:9;
    position: relative;
    width: 100% ;
    height: auto;
    display: block;
    float: left;
}


 /***======   END OF JQUERY SLIDE SHOW  **/




#workslider{
	position: relative;
	top:50px;
	width: 98.571428571429%;
	max-width: 980px;
	height: auto;
	display: inline-block;
	float: left;
	clear: none;
	margin-left: auto;
	margin-right: auto;
	margin-top: 40px;
	margin-bottom: 100px;
	padding: 24px;
	
}


#3dshowcase{
	position: relative;
	top: 50px;
	width: 96.938775510204%;
	max-width: 950px;
	margin-left: auto;
	margin-right: auto;
	max-height: 570px;
	float: left;
	display: inline;
}

.centerbox2{
	position: relative;
	margin-left: auto;	
	margin-right: auto;
	margin-top: 80px;
	padding-bottom: 10px;
	display: inline-block;
	width: 100%;
	height: auto;
	text-align: center;
	font-size: 7.0em;	
	font-weight: 600;
	line-height: .8em;
	letter-spacing: -3px;
	color : #ff4700;
	float: left;
	clear: none;
	border-bottom: 2px solid #959ea1;
	
}

.subhead{
	position: relative;
	top: 15px;
	width: 100%;
	height: auto;
	float: left;
	clear: none;
	font-weight: normal;
	font-size: 65px;
	line-height: 62px;
	text-align: center;
	margin-top: 20px;
	margin-bottom: 30px;
	font-family: "BebasNeueRegular";
	color: #959ea1;
	}

.subtxt-heads{
	position: relative;
	width: 100%;
	height: auto;
	max-width: 290px;
	float: left;
	clear: none;
	display:inline-block;
	text-align: center;
	letter-spacing: -1px;
	color: #ffffff;
	margin-top: 28px;
	margin-right: 55px;
	font: 800 24px/30px 'helvetica neue',arial,sans-serif;
	border-top: 2px groove #ff4700;
	padding-top: 18px;
	}

.subtxt-head-last{
	position: relative;
	width: 100%;
	height: auto;
	max-width: 290px;
	float: right;
	clear: none;
	display:inline-block;
	text-align: center;
	font-size: 24px;
	line-height: 30px;
	letter-spacing: -1px;
	font-weight: 800;
	color: #ffffff;
	margin-top: 28px;
	font-family:'helvetica neue',arial,sans-serif;
	border-top: 2px groove #ff4700;
	padding-top: 18px;
	
}

.subtxt{
	position: relative;
	width: 100%;
	height: auto;
	max-width:290px;
	float: left;
	clear: none;
	text-align: left;
	font-size: 14px;
	line-height: 24px;
	letter-spacing: 0px;
	font-weight: 500;
	color: #ffffff;
	margin-top: 20px;
	margin-bottom: 80px;
	border-top: 2px groove #ff4700;
	padding-top: 18px;
}


.icon1{
	position: relative ;
	float: left;
	clear: none;
	display: inline-block;
	width: 100%;
	height: auto;
	max-height: 469px;
	max-width: 990px;
	left: -8px;
	
}

#stage{
	position:relative;
	width: 100%;
	height:auto ;
	max-height: 900px;
	top: 30px;
	margin-top: 50px;
	margin-left: auto;
	margin-right: auto;
}

.drinkscan{
	position: relative;
	width:100% ;
	height: auto;
	float: left;
	clear: none;
	display: inline;
	max-width:980px ;
	top: -20px;
	left: 0px;
	max-height: 10000px;
	margin-left: auto;
	margin-right: auto;
	
}

.acdc-skills{
	position:relative;
	width: 100%;
	height:auto ;
	max-height: 900px;
	top: 80px;
	left: 2.8%;
	margin-top: 50px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 30px;
	}
	
iframe{
	position:relative;
	width: 100%;
	top: -148px;
	left: 8%;
	max-width: 100%;
	height:auto ;
	max-height: 1100px;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 90px;
	border: none;
	z-index: 800;
}

#contact-macbook{
	position: relative;
	top: -80px;
	width: 100%;
	height: auto;
	clear: none;
	max-width: 1000px;
	max-height:619px ;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 90px;
}

.form-container{
	position: relative;
	width: 90%;
	height: auto;
	max-width: 710px;
	max-height: 330px ;
	top: -440px;
	clear: none;
	display: block;
	margin-left: auto;
	margin-right: auto;
	}


#myform{
	position: relative;
	width: 80%;
	left: 45px;
	top: 20px;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	font: bold 12px/22px helvetica,'helvetica neue',arial,sans-serif;
	color: #ffffff;
}

input{
	width: 80%;
	height: 30px;
	margin-left: auto;
	margin-right: auto;
	top: 10px;
	background-color: #5a5a5a;
	margin-top: 40px;
	margin-bottom: 40px;
	border-color: #1d1d1d;
	border-width: 1px;
	-moz-box-shadow: inset 5px #1b1b1b;
	-webkit-box-shadow: inset 5px #1b1b1b;
	box-shadow: inset 5px #1b1b1b;
}


textarea{
	width: 80%;
	height:100px ;
	background-color: #5a5a5a;
	margin-bottom: 20px;
	border-color: #1d1d1d;
	border-width: 1px;
}



.work-button{
	position: relative;
	top: 10px;
	width: auto;
	height: 35px;
	background-color:#f43022 ;
 	padding-top: 4px;
 	padding-left:10px ;
 	padding-right:10px ;
  	color: #ffffff;
	font: 900 16px helvetica,'helvetica neue',arial,sans-serif;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px; /* future proofing */
	-khtml-border-radius: 4px; /* for old Konqueror browsers */
	border: 1px solid #393939;
	margin-left: auto;
	margin-right: 5px;
	-moz-box-shadow: inset 0 1px 1px #f77e13;
	-webkit-box-shadow: inset 0 1px 1px #f77e13;
	box-shadow: inset 0 1px 1px #f77e13;
}

.work-button:hover{
	position: relative;
	top: 10px;
	width: auto;
	height: 35px;
	background-color:#fe5a00 ;
	padding-top: 4px;
	padding-left:10px ;
	padding-right:10px ;
	color: #ffffff;
	font: 900 16px helvetica,'helvetica neue',arial,sans-serif;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px; /* future proofing */
	-khtml-border-radius: 4px; /* for old Konqueror browsers */
	border: 1px solid #393939;
	margin-left: auto;
	margin-right: 5px;}


/*Hover Effects*/

.view {
	width:100% ;
	height:auto ;
	max-width:297px;
	max-height: 192px;
	float: left;
	display: block;
	overflow: hidden;
	position: relative;
	text-align: center;
	z-index: 100;
	
	cursor: default;
	background: #fff url(images/hexagon.jpg) no-repeat center center;
	border: 0px solid #222222;
}

.view .mask,.view .content {
	width: 297px;
	height: 192px;
	top: 50px;
	left: 150px;
	position: absolute;
	overflow: hidden;
	top: 0;
	left: -3px;
}

.mask {
	color: #ffffff;
	background-color: #7e7e7e;
}

.view img {
	display: block;
	position: relative;
}

.view h2 {
	text-transform: uppercase;
	color: #fff;
	font-family: "BebasNeueRegular";
	text-align: center;
	position: relative;
	font-size: 28px;
	line-height: 26px;
	padding: 3px;
	background: rgba(0, 0, 0, 0.8);
	margin: 20px 0 0 0;
}

.view p {
	font-family: helvetica,'helvetica neue',arial,sans-serif;
	font-style: italic;
	font-size: 12px;
	position: relative;
	top: -8%;
	color: #fff;
	padding: 10px 10px 10px 10px;
	text-align: center;
}



/*Nice CSS3 Style Button!*/

.view a.info {
	position: absolute;
	top: 142px;
	left: 104px;
	display: block;
	text-decoration: none;
	padding: 7px 7px;
	color: #444444;
	text-transform: uppercase;
	font-size: 9px;
	font-weight: 600;
	vertical-align: middle;
	text-align: center;
	cursor: pointer;
	width: auto;
	height: 12px; /*   Style for button*/
	border: 1px solid #999;
	border-radius: 4px;
	background: #ccc; /* Old browsers */
	background: -webkit-linear-gradient(top, #eee 0%, #ccc 100%);

	background: -moz-linear-gradient(top, #eee 0%, #ccc 100%);
	background: -o-linear-gradient(top, #eee 0%, #ccc 100%);
	background: -ms-linear-gradient(top, #eee 0%, #ccc 100%);
	background: linear-gradient(top, #eee 0%, #ccc 100%); /* W3C */
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee',endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
}


 .view a.info: hover {
	-webkit-box-shadow: 0 0 5px #000;
	box-shadow: 0 0 5px #000;
}

/*Transition Effects*/
.view-tenth img {
	-webkit-transform: scaleY(1);
	-moz-transform: scaleY(1);
	-o-transform: scaleY(1);
	-ms-transform: scaleY(1);
	transform: scaleY(1);

	-webkit-transition: all 0.7s ease-in-out;
	-moz-transition: all 0.7s ease-in-out;
	-o-transition: all 0.7s ease-in-out;
	-ms-transition: all 0.7s ease-in-out;
	transition: all 0.7s ease-in-out;
}

.view-tenth .mask {
	background-color: rgba(255, 231, 179, 0.3);

	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear;
	transition: all 0.5s linear;
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
}

.view-tenth h2 {
	border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	margin: 20px 40px 0px 40px;

	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	color: #ffffff;

	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear;
	transition: all 0.5s linear;
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	background-color: rgba(0, 0, 0, 0);
	border-color: #ff4700 ;
}

/*text link code for hover effect*/
.view-tenth p {
	color: #ffffff;
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;

	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);

	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear;
	transition: all 0.5s linear;
}

/*Button link code for hover effect*/
.view-tenth a.info {
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;

	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);

	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear;
	transition: all 0.5s linear;
}

/*image code for hover effect*/
.view-tenth:hover img {
	-webkit-transform: scale(10);
	-moz-transform: scale(10);
	-o-transform: scale(10);
	-ms-transform: scale(10);
	transform: scale(10);
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
}

/*background colour for hover effect*/
.view-tenth:hover .mask {
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
	background-color: rgba(103, 103, 103, 0);
	vertical-align: middle;
}

/*scalling transition for hover effect*/
.view-tenth:hover h2,.view-tenth:hover p,.view-tenth:hover a.info {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}


footer{
	position: relative;
	width: 100%;
	height: auto;
	border-top: 8px solid #ff4700;
	text-align:center;
	font-size: 14px;
	float: left;
	clear: none;
	color: #ffffff;
}
	
	
.footercontent{
	width:100%;
	height: 150px;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	text-align:center;
	background-color: #000000;
}

.goodbye{
	position: relative;
	top: -50px;
	width: 100%;
	height: auto;
	text-align: center;
	color: #ffffff;
	font: 40px/40px Pacifico;
	text-shadow: 2px 2px 5px #0072c9;
	margin-bottom: 50px;
	
}

#hexcontainer{
	position: relative;
	top: -50px;
	width: 56.734693877551%;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
	
}


/* Mobile Version */

@media screen and (max-width: 480px) {


    body, h1, h2, h4, h5, h6, {
        font-size:7;
        line-height: 1em;
    }
    
    h3{
    	text-align: center;
    	font-size:2.4em;
    	line-height: 1.2em;
    	
    }
    
     
 	header{
 		position: relative;
 		width:105%;
 		height:78px;
 		background-color: #000000;
		border-bottom: 3px solid  #ff4700;
 		display: block;
 		margin-bottom: 190px;
 }


 
 
#acdclogo{
 	width:100%;
 	height:69px;
 	background: url(images/acdclogo_220px.png) no-repeat 55px 1px;
 	position:absolute;
 	top: 17px;
 	display: inline;
 	margin-left: auto;
 	margin-right: auto;
 }
 
    
    #section1, #section2, {
    position: relative;
    top:-45px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 130px;
    width:auto;	
    height:auto;
    display: block;
    float: left;
    background-position: center;
   }
    
    #section2,{
    margin-bottom: 150px;
   }
    
    #section3{
    display: none;
    }
  
   .wrapper, .wrapper2, .wrapper3{
    position: relative;
    left: -5.2%;
    top: 0px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 120px;
    width:80%;	
    height:auto;
    clear: none;
	}

	 a{  
 		text-align: center;	
 		height:auto;
 		left: -10px;
 }	

	.navmenu{
		top:65px;
		width:100%;
		height:185px;
		position: relative;
		padding: 15px;
		clear: left;
		font-size: 70%;
		z-index: 800;
		left: -20px;
		border-bottom: 3px solid #ff4700;
		background: url(images/darkcard.jpeg);
	}
		
		.navmenu li{
			position: relative;
			width: 95%;
			height:14px;
			margin: 14px;
			display: block;
			float: left;
			left: -20px;
			border-color: #e8e88f;
		}

.navmenu a {
	width: 100%;
	padding: 15px;
	position:relative;	
	top: -30px;
	height:auto;
	display: block;
	text-decoration: none;
	font-size: 1.8em;
	line-height: 0.9em;
	font-weight: bold;
	border: none;
	text-align: center;
	vertical-align:middle;
	}
	
.navmenu ul {
	float: right;
	text-align: middle;
	width: 100%;
}

.navmenu a:hover, .navmenu .navmenu a {
	text-decoration: none;
	font-weight: bold;
	text-align: center;
	padding: 15px;
	vertical-align:middle;
	background-color: #ff4700;
	display: block;
	width: 100%;
}


	  #navarrow, #introcopy, .andyc{
		visibility: hidden;
		}
   	
	       
    .projectbox-inner{
        position: relative;
        top: 0px;
        width: 100% ;
        height:auto;
        margin-left: auto;
        margin-right: auto;
	}

	.centerbox{
		position: relative;
		margin: 0 auto;
		display: inline;
		width: 95%;
		height: auto;
		padding: 0px;
		float: left;
		left: 3%;
		margin-bottom: -20px;
}

	#contentbox, #workslider{
		position: relative;
		display: inline;
		float: left;
		margin-bottom: 20px;
		font-size: 80%;
		height: auto;
}


	.projheading{
		text-align: left;
		text-shadow: 1px 1px 1px #000000;
		font: 900 110% helvetica,'helvetica neue',arial,sans-serif;
		color: #ffffff;
		margin-bottom: 5px;
		text-align: center;
}
 
.recent-banner{
		position: relative;
		top:9px;
		left: -3%;
		width:100%;
		height: auto;
		max-height:610px ;
		min-height: 82px;
		margin-bottom: 4.2%;
		margin-top: 3%; ;
}
 
    
    .proj1,.proj2,.proj3 {
    	position: relative;
    	width: 95%;
    	height: 360px;
    	display: block;
    	float: left;
    	alignment-baseline: central;
    	margin: 0 auto;
    	left: 1.9%;
    	padding: 2px;
    	font-size: 105%;
    	line-height: 9px;
    }
   
.projheading{
	width: 100%;
	max-width: 297px;
	height: 48px;
	text-align: center;
	text-shadow: 1px 1px 1px #000000;
	font: 600 20px helvetica,'helvetica neue',arial,sans-serif;
}

.protxt{
	text-align: center;
	font: 300 14px helvetica,'helvetica neue',arial,sans-serif;
	line-height: 20px;
	margin-bottom: 30px;
}
    
    #projectbox{
    	position: relative;
    	width: 100% ;
    	height: auto;
    	margin-left: auto;
    	margin-right: auto;
    	float: left;
    	margin-bottom: 30px;
    }
    
        
    #projectbottom{
    	position:relative;
    	width: 100%;
    	height: auto;
    	margin-left: auto;
    	margin-right: auto;
    	float: left;
    	display: block;
    	margin-bottom: -30px;
    }
    

.view p {
	font-family: helvetica,'helvetica neue',arial,sans-serif;
	font-style: italic;
	font-size: 11px;
	line-height: 14px;
	text-align: center;
	padding: 20px 20px 20px 20px;
	
}

    
    .headliner{
    	position: relative;
    	top: -40px;
    	left: 0%;
    	width: 100%;
    	max-width: 640px;
    	height: auto;
    	margin-top: 10px;
    	margin-right: 20px;
    	text-shadow: 1px 1px 1px #000000;
    	float: left;
    	font-size: 10%;
    	letter-spacing: normal;
    	font-weight: bold;
    }	
    
    .headliner, h5 	{
    	width: 100%;
    	font-family: helvetica,'helvetica neue',arial,sans-serif;
    	font-weight:600 ;
    	font-size: 106%;
    	line-height: 25px;
    	color: #fffff;
    	text-align: center;
    }

.responsiveblock{
	margin-top: 15px;
}
    
    
 /*3d Flipper Effect Wrapper*/
 
 #flip{
 	position:absolute;
 	width: 47.613636363636%;
 	height: 32.00150526844%;
 	float: left;	
 	clear: none;
 	top:-8px;
 	left: 48.5%;
 	margin: 30px;
 }
 
 
 
 /*3d Flipper Effect Transition*/
 
 #flipcontainer {
 	width:160%;
 	float: left;	
 	clear: none;
 	position:absolute;
 	height: auto;
 	top:-1495px ;
 	left: -130px;
 	margin-top: 30px;
 	margin-bottom: 20px;
 	-o-perspective:1000;
 	-ms-perspective:1000;
 	-moz-perspective:1000;
 	-webkit-perspective:1000;
 	alignment-baseline: baseline;
 }
 
 .insideflipcontainer {
 	width:160%;
 	float: left;	
 	clear: none;
 	position:absolute;
 	transform-style:preserve-3d;
 	-o-transform-style:preserve-3d;
 	-ms-transform-style:preserve-3d;
 	-moz-transform-style:preserve-3d;
 	-webkit-transform-style:preserve-3d;
 	transition:0.5s;
 	-o-transition:0.5s;
 	-ms-transition:0.5s;
 	-moz-transition:0.5s;
 	-webkit-transition:0.5s;
 	}
 
 
 #flipcontainer:hover {
 	width:160%;
 	float: left;	
 	clear: none;
 	position:absolute;
 
 	-webkit-transition: 0.8s;
 	-moz-transition: 0.8s;
 	-o-transition: 0.8s;
 	-ms-transition: 0.8s;
 	transition: 0.8s; /*Safari*/
 
 	-webkit-transform-style: preserve-3d;
 	-moz-transform-style: preserve-3d;
 	-ms-transform-style: preserve-3d;
 	transform-style: preserve-3d;
 
 	-webkit-transition-property: -webkit-transform;
 	-moz-transition-property: -moz-transform;
 	-o-transition-property: -o-transform;
 	-ms-transition-property: -ms-transform;
 	transition-property: transform;
 
 	-webkit-transform: rotateY(180deg);
 	-moz-transform: rotateY(180deg);
 	-o-transform: rotateY(180deg);
 	-ms-transform: rotateY(180deg);
 	transform: rotateY(180deg);
 	-webkit-perspective: 90; /*Opera*/
 	-o-perspective: 90; /*Fire Fox*/
 	-moz-perspective: 90; /*All*/
 
 	-webkit-transition-timing-function: ease-in-out;
 	-moz-transition-timing-function: ease-in-out;
 	-o-transition-timing-function: ease-in-out;
 	-ms-transition-timing-function: ease-in-out;
 	transition-timing-function: ease-in-out;
 }
 
 #flipcontainer img{
 	width:160%;
 	float: left;	
 	clear: none;
 	position:absolute;
 	backface-visibility:hidden;
 		-o-backface-visibility:hidden;
 		-ms-backface-visibility:hidden;
 		-moz-backface-visibility:hidden;
 		-webkit-backface-visibility:hidden;
 }
 
 .face {
 	width:160%;
 	float:left;
 	position:absolute;
 	backface-visibility:hidden;
 	-o-backface-visibility:hidden;
 	-ms-backface-visibility:hidden;
 	-moz-backface-visibility:hidden;
 	-webkit-backface-visibility:hidden;
 }
 
 /* Styles the front of the image */
 
 .front {
 	position:absolute;
 	width:100%;
 	float:left;
 	height: 411px;
 	/* Set the color of the suit characters on the image */
 	/* Background color of this side of the image */
 }
 
 /* Styles the back of the card */
 
 	.back {
 	width:100%;
 	float:left;
 	position:absolute;
 
 	transform:rotateY(180deg);
 	-o-transform:rotateY(180deg);
 	-ms-transform:rotateY(180deg);
 	-moz-transform:rotateY(180deg);
 	-webkit-transform:rotateY(180deg);
 	}
 	
 #flipbox{
 	width: 100%;
 	height: auto;
 	margin: 20px;
 }
 
 /* End of Flip Icon */	
	
	
#chart{
	position: relative;
	display:block;
	width:92% ;
	left: -4px;
	height: auto;
	border-style: solid;
	border-width: 1px;
	padding: 15px;
	float: left;
	margin-left: auto;
	margin-right: auto;
	top: -30px;
}
.graph-title{
	font-size: 28px;
	line-height: 22px;
	padding-bottom: 20px;
	z-index: 800;
}    


.wrapper2{
 position: relative;
 top: 0px;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 20px;
 width:70%;	
 height:auto;
 clear: none;
	}

  
#macwrapper, mac{
	position: relative;
	top: 0px;
	left: 7.5%; 
	margin-left: auto;
	margin-right: auto;
	height: 80px;
	margin-bottom: 100px;
	}
 
.macpix{
	position: relative;
	top:-14px;
	width: 100% ;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	margin-bottom: 20px;
	display: block;
	float: left;
	clear: none;
	z-index: 900;
} 
  
 #statement{
 	position: relative;
 	height: auto;
 	width: 90%;
 	display: block;
 	text-align: center;
 	margin-left: auto;
 	margin-right: auto;
 	color: #ffffff; 
 	letter-spacing:-1px;
 	font: bold 1.4em helvetica,'helvetica neue',arial,sans-serif;
 	left: 20px;
 	}   
 
 #workslider{
 	position: relative;
 	top:-110px;
 	width: 95%;
  	padding: 24px;
 }



 .nav-arrows, .sb-description, .sb-slider{
	visibility: hidden;
 	
 }
 	
 .centerbox2{
 	position: relative;
 	margin-left: auto;	
 	margin-right: auto;
 	margin-top: -50px;
 	padding-bottom: 10px;
 	display: inline-block;
 	width: 100%;
 	height: auto;
 	font-size: 5.0em;	
 	font-weight: 600;
 	line-height: .8em;
 	color : #ff4700;
 	border-bottom: 2px solid #959ea1;
 	
	 }
 
 .header-section2{
 	position: relative;
 	top: 0px;
 	float: left;
 	width: 114% ;
 	height: auto;
 	max-height: 0px;
 	margin-left: auto;
 	margin-right: auto;
 	display: inline-block;
 	margin-bottom: 20px;
 }
 
 .nav-arrows a {
 	width: 42px;
 	height: 42px;
 	background: #ff4700 url(images/nav.png) no-repeat top left;
 	position: absolute;
 	top: -20px;
 	left: 1.9%;
 	text-indent: -9000px;
 	cursor: pointer;
 	margin-top: -21px;
 	opacity: 0.8;
 	border-radius: 50%;
 }
 
 .subhead{
 	position: relative;
 	top: 15px;
 	font-size: 35px;
 	line-height: 35px;
 	text-align: center;
 	margin-top: -15px;
 	margin-bottom: 5px;
 	}	
 
 .subtxt{
 	text-align: center;
 }
 
 .subtxt-head-last{
 	position: relative;
 	width: 100%;
 	height: auto;
 	max-width: 290px;
 	float: left;
 	clear: none;
 	display:inline-block;
 	text-align: center;
 	font-size: 24px;
 	line-height: 30px;
 	letter-spacing: -1px;
 	font-weight: 800;
 	color: #ffffff;
 	margin-top: 28px;
 	margin-bottom: 00px;
 	font-family:'helvetica neue',arial,sans-serif;
 	border-top: 2px groove #ff4700;
 	padding-top: 18px;
 	
 }

footer{
	position: relative;
	width: 70%;
	height: auto;
	border-top: 8px solid #ff4700;
	text-align:center;
	font-size: 14px;
	float: left;
	clear: none;
	color: #ffffff;
	margin-left: 50px;
	margin-right: 50px;
}

	.cssreel,cssreel a{
		visibility: hidden;
	}