/* Supercraft Style Sheet - copyright 2014 moonjive Limited*/

/* GLOBAL */
body {
	border-top: 10px solid #990100;
	background-color:#fff;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	color:#333;
}

input {
	font-family: 'Open Sans', sans-serif;
	font-size:15px;
	padding: 5px 5px 5px 10px;
	margin-right: 10px;
	outline: 0;
	border:0;
	width:250px;
	height: 20px;
	background-color: #edc;
	border-radius:5px;
}

input[type=submit] {
	width:auto;
	padding: 2px 14px;
	line-height:25px;
	text-shadow:none;
	cursor:pointer;
	box-shadow: none;
	color: #def;
}

h1 {
	font-family: 'Rokkitt', cursive;
	font-size: 32px;
	font-weight: 400;
	line-height:30px;
	color: #06c;
	margin-top:5px;
	margin-bottom:10px;
}

h2 {
	font-family: 'Rokkitt', cursive;
	font-size:25px;
	font-weight: 400;
	color: #06c;
	margin-bottom:10px;	
}

h3 {
	font-family: 'Rokkitt', cursive;
	font-size: 30px;
	font-weight: 400;
	color: #06c;
}
h4 {
	font-family: 'Rokkitt', cursive;
	font-size: 25px;
	font-weight: 400;
	color: #06c;
}

p {
	margin:5px 0 10px 0;
	line-height:22px;
	font-size:15px;
	letter-spacing: 0.01em;
}
p+p {
	font-size:14px;
}
sup {
	font-size:xx-small; 
	vertical-align:top;
}
.mag-glass{
	display: inline-block;
    padding: 0 0 11px 30px;
	margin: 0 0 -10px 0;
    background: url("../img/magnifying-glass.png") no-repeat top left;
}

a {
	text-decoration:none;
	color:inherit;
	transition: color .5s ease;
}

strong {
	font-weight:bold;
}
em, i 
{
  font-style: italic;
}

table { 
	width: 100%; 
	border-collapse: collapse; 
}
/* Zebra striping */
/*tr:nth-of-type(odd) { 
	background: #eee; 
}*/
th { 
	background-color: #990100; 
	color: #edc; 
	font-weight: bold; 
}
td, th { 
	padding: 6px 15px 6px 20px; 
	border: 1px solid #ccc;
	border: none;
	text-align: left;
	vertical-align: middle; 
}

.imgfig {
	float:left;
	width: auto;
	margin: 0 20px 10px 0;
	padding: 2px;
	border: solid 6px #06c;
	border-radius: 15px;
	width: 200px;
	height: auto;
}

.imgthumb {
	float:left;
	margin: 5px 20px 0 0;
	padding-bottom: 0;
	width: 80px;
	height: auto;
	background-color: #9c3;
}

.imgfeature {
	width: 100%;
	height: auto;
	margin: 5px 0 20px 0;
	padding-bottom: 0;
	background-color: #9c3;
}

.imgfeature_full {
	width: 940px;
	display:inline-block;
	margin-bottom: 25px;
	background-color: #9c3;
}
.imgfeature_full img{
	width: 940px;
}

.imgfeature_full p {
	font-size: 13px;
	line-height: 16px;
	color: #fff;
	letter-spacing: 0.01em;
	padding-left: 20px;
}

.imgfeature_left {
	float:left;
	display:inline-block;
	width: 460px;
	height: auto;
	margin: 0 -30px 20px 0;
	margin: 0 20px 20px 0;
	background-color: #9c3;
}

.imgfeature_left p {
	font-size: 13px;
	line-height: 16px;
	color: #fff;
	letter-spacing: 0.01em;
	padding-left: 20px;
}
.imgfeature_left img {
	width: 460px;
}

.imgfeature_right {
	float:right;
	display:inline-block;
	width: 460px;
	height: auto;
	margin: 0 -30px 20px 30px;
	background-color: #9c3;
}
.imgfeature_right p {
	font-size: 13px;
	line-height: 16px;
	color: #fff;
	letter-spacing: 0.01em;
	padding-left: 20px;
}
.imgfeature_right img {
	width: 460px;
}

.imgfeature img {
	width: 450px;
}
.imgfeature iframe {
	width: 560px;
}

.imgposright{
	float:right;
	margin: 5px 0 20px 30px;
}

.imgfullwidth img{
	max-width: 930px;
	width: 100%;
}

.imgfeature p {
	font-size: 13px;
	line-height: 16px;
	color: #fff;
	margin: 0 0 0 20px;
	padding: 6px 0 10px 0;
	letter-spacing: 0.01em;
}

.imgfeature_small_left {
	float:left;	
	margin: 0 20px 20px 0;
	width: 215px;
	height: auto;
}
.imgfeature_small_right {
	float:left;
	margin: 0 0 20px 0;
	width: 215px;
	height: auto;
}

figcaption strong {
	border-bottom: 1px solid #D6D0C1;
	padding-bottom:10px;
	margin: 10px 0;
	display:block;
}

figcaption {
	line-height: 25px;
	font-size: 12px;
	width: 200px;
}

.imgleft{
	margin-top: 5px;
}

.imgright {
	float:right;
	margin: 5px 0 30px 20px;
}
.imgsmall{
	float:left;
	margin: 5px 20px 30px 0;
	padding: 0;
}

.imgsmall_last{
	float: left;
	margin: 5px -30px 30px 0;
	padding: 0;
}

.video-player {
	overflow: hidden;
	background-color: #fff;
	width: 450px;
	height: 253px;
}

.video-container {
    position: relative;
	/*padding-bottom: 75%; ...for 4:3 content*/
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}
.video-container iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}

hr {
	background-color: #D6D0C1;
	border:0;
	height:1px;
	margin:5px 0 20px 0;
}



/* APPLE STYLE NAVIGATION MENU */
#applenavbox {
	float:right;
	margin-top: -70px;
	margin-right: 20px;
	margin-left:50px;
	left: 50%;
}

#appleNav {
	position:relative;
    margin:10px 0; 
	list-style:none; 
	font-family: 'Open Sans', sans-serif;
	letter-spacing:-0.5px; 
	font-size:13px;	
    text-shadow: 0 -1px 3px #202020;
	height:34px;
    border-radius:4px;
	box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.5);
}
 
#appleNav li {
    display:block; 
	float:left; 
	border-right:1px solid #5d5d5d; 
	border-left:1px solid #929292; 
	width:105px; 
	height:34px; 
	border-bottom:1px solid #575757; 
	border-top:1px solid #797979;
    /* Gradient backgrounds for the buttons. Generated using http://gradients.glrzad.com/ */
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #0359b1), color-stop(0.5, #014992), color-stop(0.51, #0264c8), color-stop(1, #0259b2));
    background-image: -moz-linear-gradient(center bottom, #0359b1 0%, #014992 50%, #0264c8 51%, #0259b2 100%);
	background-color: #0359b1; /*Fallback */
}
 
/* Set the states when hovering, except for the last item in the list (the search bar), since it doesn't need to change */
/*#appleNav li:not(:last-child):hover {*/
#appleNav li:hover, #appleNav li.current {
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #990100), color-stop(0.5, #7b0201), color-stop(0.51, #b00200), color-stop(1, #9d0100));
    background-image: -moz-linear-gradient(center bottom, #990100 0%, #7b0201 50%, #b00200 51%, #9d0100 100% );
    background-color: #990100; /* Fallback */   
}
 
#appleNav li a {
    color:white; 
	text-decoration:none; 
	text-align:center; 
	display:block; 
	line-height:34px; 
	outline:none; 
}
 
/* Styling of the search field */
#appleNav form input {
    width:76px; height:20px; margin-left:9px; margin-top:8px; border:none; padding-left:20px; padding-right:10px; color:#eee; 
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
 
    /* We use the CSS3 multiple backgrounds for the input field: The magnifier image and the gradient background */    
    background-image: url("../images/magnifier.png"), -webkit-gradient(linear, left bottom, left top, color-stop(0, #747474), color-stop(0.5, #6E6E6E), color-stop(0.51, #7E7E7E), color-stop(1, #8D8D8D));
    background-image: url("../images/magnifier.png"), -moz-linear-gradient(center bottom, #747474 0%, #6E6E6E 50%, #7E7E7E 51%, #8D8D8D 100%);
    background-repeat: no-repeat;
    
    background-color:#6E6E6E; /* Fallback */
    
    -moz-box-shadow: inset 0 2px 1px 1px #363636;
    -webkit-box-shadow: inset 0 2px 1px 1px #363636;
    box-shadow: inset 0 2px 1px 1px #363636;
}
 
/* Rounded corner for the first in last item. Shorthand: Top left, Top right, Bottom right, Bottom left.
We also remove the borders, since they don't need them. */
#appleNav li:first-child {
    border-radius:4px 0 0 4px;   
    border-left:none;
}
 
/* The first child image - the logo - has to be centered. Because of the image dimensions, we manually need to shift it a bit. */
#appleNav li:first-child a img {
   vertical-align:middle; margin-top:-2px;
}
 
#appleNav li:last-child {
    border-radius:0 4px 4px 0;   
    border-right:none;
}




/* BUTTONS */

.button {
        padding: 6px 14px 8px 10px;	
		background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #0359b1), color-stop(0.5, #014992), color-stop(0.51, #0264c8), color-stop(1, #0259b2));
		background-image: -moz-linear-gradient(center bottom, #0359b1 0%, #014992 50%, #0264c8 51%, #0259b2 100%);
		background-color: #0359b1; /*Fallback */
		font-family: 'Open Sans', sans-serif;
		font-size: 16px;
		letter-spacing:-0.5px; 
		text-decoration: none;
		font-weight: normal;
		text-shadow: 0 -1px 3px #202020;
		color: #def;
		border-top:1px solid #797979;
		border-right:1px solid #5d5d5d; 
		border-bottom:1px solid #575757; 
		border-left:1px solid #929292;
		border-radius: 5px;
		box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.4);
}

.button:hover {
        background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #990100), color-stop(0.5, #7b0201), color-stop(0.51, #b00200), color-stop(1, #9d0100));
		background-image: -moz-linear-gradient(center bottom, #990100 0%, #7b0201 50%, #b00200 51%, #9d0100 100% );
		background-color: #990100; /* Fallback */
        text-shadow:none;
		color: #edc;
}



/* HEADER */

header {
	position:relative;
	max-width:960px;
	height:100px;
	margin: 0 auto 0 auto;
	padding-top: 20px;
	background-color:#fff;
}

header h1 {
	margin:35px 0 0 0;
	font-size:55px;
	color:#e56038;
	font-family: 'Rokkitt', cursive;
}

header p {
	font-family: 'Open Sans', sans-serif;
	font-size:16px;
	color: #4A463B;
	margin-left:132px;
}

#logo {
	position:relative;
	left:50%;
	margin-top: 5px;
    margin-left:-460px;
}



#slider_content1, #slider_content2, #slider_content3, #slider_content7, #slider_content8, #slider_content10, #slider_content11 {
	width: 550px;
	position:absolute;
	margin-top: 60px;
	left:15%;
	display:none;
	z-index:11;
}

#slider_content1 h3, #slider_content2 h3, #slider_content3 h3, #slider_content7 h3, #slider_content8 h3, #slider_content10 h3, #slider_content11 h3{
	font-family: 'Rokkitt', sans-serif;
	color: #edc;
	font-size:35px;
	font-weight: 400;
	letter-spacing: 0.02em;
	margin-bottom: 10px;
	background-color: rgba(153, 0, 0, 0.9);
	padding:5px 30px;
	border-radius: 15px 0 15px 0;
	display:inline-block;
}
#slider_content1 p, #slider_content2 p, #slider_content3 p, #slider_content7 p, #slider_content8 p, #slider_content10 p, #slider_content11 p {
	margin: 0 0 20px 0;
	max-width: 800px;
	font-size: 17px;
	line-height: 23px;
	letter-spacing: 0.01em;
	color: #06c;
	background-color: rgba(255, 255, 255, 0.85);
	padding: 15px 30px;
	border-radius: 5px;
}

#slider_content1 {
    display:block;
}

slider .button{
	margin-left: 16px;
	font-size: 16px;
	font-weight: normal;
	font-family: 'Open Sans', sans-serif;
	letter-spacing: 0.02em;
}


/* SPACER */

#spacer {
	width:auto;
	height:50px;
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #990100), color-stop(1, #b00200));
	background-image: -moz-linear-gradient(center bottom, #990100 0%, #b00200 100% );
	background-color: #990100;
	position: relative;
	font-family: 'Open Sans', sans-serif;
	color: #fff;
	font-size: 18px;
	margin-bottom: 30px;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.4);
}

#spacer p {
	font-size:20px;
	margin-top:18px;
	width:auto;
	position:absolute;
	left:50%;
	margin-left:-450px;
}
#spacer h1 {
	font-size:28px;
	color:#edc;
	margin-top:12px;
	width:auto;
	position:absolute;
	left:50%;
	margin-left:-450px;
	letter-spacing: 0.02em;
}

#spacer .search {
	margin-top:13px;
	width: auto;
	position:absolute;
	right:50%;
	margin-right:-460px;
}

#spacer .button {
	font-size: 15px;
	height: 34px;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.4);
}



/* TEXT COLUMNS */

#text_columns {
	line-height:25px;
	font-family: 'Open Sans', sans-serif;
	clear:both;
	width:auto;
	max-width:960px;
	margin:0 auto;
}
#text_columns a {
	font-style: italic;
	color: #06c;
}
#text_columns a:hover{
	color: #06c;
	color: #c00;
}
#text_columns .button:hover{
	color: #fff;
}
#text_columns h2 {
	font-style:normal;
}

#text_columns article.column1 {
	float:left;
	width:auto;
	max-width: 450px;
	margin: 0 0 20px 20px;
	padding-right: 30px;
	border-right: solid 1px #edc;
}

#text_columns .column2 {
	float:left;
	width:auto;
	max-width: 410px;
	margin: 0 0 30px 0;
}

#text_columns .column2 p{
	margin-bottom: 5px;
}
#text_columns .column2 h2{
	margin-bottom: 0;
}

#text_columns .button{
	float: left;
	font-size: 13px;
	font-style:normal;
	color: #fff;
	line-height: 13px;
	padding: 8px 14px 8px 14px;
	margin-top: 10px;
	margin-bottom: 20px;	
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.4);
}
#text_columns .column2 .button{
	margin-top: 0;
	float: right;
}



.pdfdoc{
	float:left;
	margin: 5px 20px 20px 0;
	display:inline-block;
	width: 190px;
	height: 150px;
}

.row {
	position:relative;
	margin: 0 0 0 50px;
	float:right;
	width:380px;
}

.row img {
    float:left;
}

.row .imgfeature {
	width: 80px;
	height: 80px;
	padding-right: 20px;
}

.row p {
	font-size: 13px;
	line-height: 20px;
	margin-top: 0;
    margin-left: 100px;
}


.rocket, .clock, .job {
	top:0;
	left:0;
	position:relative;
	height: 80px;
	width: auto;
	margin: 5px 20px 0 0;
}

.rocket:hover {
	opacity:0;
	transition: opacity 0.4s ease 0.2s;
	animation-name: stylie-transform-keyframes;
	animation-duration: 700ms;
	animation-delay: 0ms;
	animation-fill-mode: forwards;
	animation-timing-function: linear;
	animation-iteration-count: 1;
	transform-origin: 0 0;
}

.clock:hover {
	animation-name: stylie-transform2-keyframes;
	animation-duration: 100ms;
	animation-delay: 0ms;
	animation-fill-mode: forwards;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	transform-origin: 0 0;
}

.job:hover {
	animation-delay: 0ms;
	animation-fill-mode: forwards;
	animation-timing-function: linear;
	animation-iteration-count: 1;
	transform-origin: 50% 50%;
	transform: scale(1.1);
}


/* SINGLE COLUMN */

.single_column {
	float:left;
	width:auto;
	max-width: 910px;
	margin: 0 0 20px 20px;
}

.zoom_img img{
	width: 100%;
}
.zoom_container {
	width: auto;
	max-width: 1400px;
	margin: 0 auto;
	padding: 0 20px;
	position: relative;
}

/* 3 COLUMNS */

#boxcontent {
	width: auto;
	max-width: 930px;
	margin: 0 auto;
	padding: 10px 0 20px 0;
	background-color: #fff;
}

#boxcontent article {
	float:left;
	width:270px;
	margin-left:20px;
	margin-right:20px;
}

#boxcontent article img {
	float:left;
	margin-right:20px;
}

#boxcontent article p {
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	line-height:20px;
	margin-left:0;
}


/* FOUR COLUMNS */

#four_columns {
        line-height:25px;
        font-family: 'Open Sans', sans-serif;
        clear:both;
        width:auto;
        max-width:900px;
        margin:0 auto;
}


#four_columns .img-item {
        float:left;
        margin-right:25px;
}

#four_columns .img-item a {
        position:relative;
        display:block;
}

.thumb-screen {
        display:block;
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:150px;
        background: #000 url(img/zoom.png) center center no-repeat;
        z-index:99;
        opacity: 0;
        transition: opacity .5s ease;
}

.thumb-screen:hover {
        opacity:0.5;
}


/* FOOTER */

footer {
	position:relative;
	clear:both;
	width:auto;
	height:450px;
	background:#333;
}

footer .wrapper {
	line-height: 25px;
	margin: 0 auto;
	padding-top: 30px;
	max-width: 930px;
	font-size: 14px;
}

footer .wrapper .column {
	font-family: 'Open Sans', sans-serif;
	color:#ababab;
	float:left;
	width:280px;
	margin-left: 20px;
	margin-right: 10px;
	padding-bottom: 20px;
}

footer .wrapper .column.midlist ul li {
	display:block;
	width:auto;
	padding:0 0 10px 25px;
	margin-bottom:10px;
	border-bottom: 1px solid #444444;
	background:url(../img/arrowright2.png) left 6px no-repeat;
}

footer .wrapper .column.leftlist a {
	display:block;
	width:auto;
	padding:0 0 0 25px;
	margin-bottom:10px;
	background:url(../img/arrowright2.png) left 6px no-repeat;
}


footer .wrapper .column.rightlist ul li {
	display:inline-block;
	width:auto;
	margin-bottom:15px;
}

footer .wrapper .column.rightlist ul li a span {
	margin-left:95px;
	display:block;
}

footer .wrapper .column.rightlist ul li a img {
	transition: border .25s ease;
	float:left;
	border:3px solid #444444;
}

footer .wrapper .column.rightlist ul li a img:hover {
	border-color: #5e5e5e;
}

footer .wrapper .column h4 {
	font-size: 22px;
	color: #fff;
	border-bottom: 1px solid #444444;
	padding: 0 0 10px 0;
	margin-bottom: 10px;
}
footer .wrapper .column a:hover { 
	color:#fff; 
}
footer .wrapper .column a {
	color: #ccc;
	transition: color .5s ease;
}

#copyright {
	background: #1d1d1d;
	height:70px;
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
}

#copyright .wrapper {
	font-family: 'Open Sans', sans-serif;
	padding-top:25px;
	color: #5e5e5e;
	font-size:14px;
	position:relative;
}
#copyright .wrapper .social {
	position:absolute;
	right:0;
	top:25px;
}
#copyright .wrapper .social a {
	transition: opacity .25s ease;
	opacity: 0.3;
	margin-left: 12px;
	display:block;
	float:left;
}

#copyright .wrapper .social a:hover{
    opacity: 0.7;
}

#copyright .wrapper a {
    color: #ababab;
}

#copyright .wrapper a:hover {
    color: #fff;
}
#copyright .createdby {
	float: right;
}

/* SKIPLINK */
.go-top {
	position: fixed;
	bottom: 2em;
	right: 2em;
	text-decoration: none;
	color: white;
	background-color: rgba(0, 0, 0, 0.3);
	font-size: 12px;
	padding: 1em;
	display: none;
}

.go-top:hover {
    background-color: rgba(0, 0, 0, 0.6);
}


/* SLIDESHOW */
/* Prevent the slideshow from flashing on load */
.slidesjs-container {
    border-top: 0px #d6d0c1 solid;
}
#slides {
	display: none;
}

/* Center the slideshow */
.container {
	width:auto;
	margin: 0 auto;
	position:relative;
	box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.5);
}

/* Show active item in the pagination */
.slidesjs-pagination .active {
	color:red;
}

#slider_content1 p .responsive_button, #slider_content2 p .responsive_button, #slider_content3 p  .responsive_button {
	display:none;
	color:#000;
}

.contact_column1{
	float: left;
	width: 250px;
	margin: 0 20px 10px 15px;
	border-right: solid 1px #edc;
}
.contact_column2{
	float: right;
	width: 630px;
	margin: 0 15px 10px 0;
}
.google-maps {
  position: relative;
  /*padding-bottom: 90%;  (450 ÷ 500 = 0.9 = 90%)*/
	width: auto;
	padding-bottom: 56.25%; /* 16:9 */
  overflow: hidden;
}
.google-maps iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/* MISC */
.clear {
	clear:both;
}

.hidden {
	position: absolute;
	clip: rect(1px 1px 1px 1px); /* IE6 & 7 */
	clip: rect(1px, 1px, 1px, 1px);
}
 

/* MEDIA QUERIES FOR A RESPONSIVE LAYOUT */

@media (max-width: 1215px)
{
	#slider_content1, #slider_content2, #slider_content3, #slider_content7, #slider_content8, #slider_content10, #slider_content11 {
		margin-top: 40px;
		width:auto;
		margin-right: 10%;
	}
	
	#slider_content1 h3, #slider_content2 h3, #slider_content3 h3, #slider_content7 h3, #slider_content8 h3, #slider_content10 h3, #slider_content11 h3 {
		font-size:32px;
		margin-bottom: 8px;
		padding: 6px 30px;
	}
	
	#slider_content1 p, #slider_content2 p, #slider_content3 p, #slider_content7 p, #slider_content8 p, #slider_content10 p, #slider_content11 p {
		width: 550px;
		font-size:17px;
		line-height: 21px;
	}
	
	#slider_content1 p .responsive_button, #slider_content2 p .responsive_button, #slider_content3 p  .responsive_button {
		display:inline;
	}
	
	.container .button {
			/*display:none;*/
	}
	
}

@media (max-width: 960px)
{
	.imgfeature_full, .imgfeature_full img {
		width: 100%;
	}
	.imgfeature, .imgfeature img {
		width: 440px;
	}
	
	.contact_column2 .imgfeature, .contact_column2 .imgfeature img{
		width: 440px;
	}
	#text_columns .contact_column2{
		float: right;
		margin: 20px -170px 20px auto;
	}

	#slider_content1, #slider_content2, #slider_content3, #slider_content7, #slider_content8, #slider_content10, #slider_content11 {
		width: auto;
		margin-top: 30px;
		margin-right: 5%;
	}
	
	#slider_content1 h3, #slider_content2 h3, #slider_content3 h3, #slider_content7 h3, #slider_content8 h3, #slider_content10 h3, #slider_content11 h3 {
		font-size: 28px;
		margin: 5px 0;
	}
	
	#slider_content1 p, #slider_content2 p, #slider_content3 p, #slider_content7 p, #slider_content8 p, #slider_content10 p, #slider_content11 p {
		width: 400px;
		font-size: 16px;
		line-height: 18px
	}
	
	#logo {
		position:relative;
		left:50%;
		margin-top: 0;
		margin-bottom: 0;
		margin-left:-350px;
	}
	
	#applenavbox {
		margin-right: 20px;
	}
	
	#appleNav li {
		width: 85px; 
		height: 34px; 
	}
	
	#boxcontent article {
		float: none;
		margin: 0 auto 20px auto;
		width: 80%;
	}
	
	#spacer {
		height: 30px;
		font-size:15px;
	}
	
	#spacer .search {
		margin-top: 8px;
		right:50%;
		margin-right:-180px;				
	}

	#spacer p, #spacer h1 {
		margin-top: -1500px;
	}
	
	input {
		padding:4px;
		font-size:14px;
	}
	
	input[type="submit"] {
		padding: 2px 14px;
	}
	
	#four_columns {
		width: 500px;
	}
	
	#four_columns .img-item:nth-of-type(3), #four_columns .img-item:nth-of-type(4) {
		margin-top: 25px;
	}
	
	#text_columns article.column1, #text_columns .column2 {
/*		float: none;
		max-width: 700px;*/
		max-width: 100%;
		margin: 20px 30px 20px 40px;
	}
	#text_columns .single_column p {
		margin: 20px 30px 20px 0;
	}
	#text_columns .imgfeature_full p, #text_columns .imgfeature p, #text_columns .imgfeature_left p, #text_columns .imgfeature_right p  {
		margin: 0;
		padding: 5px 0 10px 20px;
	}
	
	.video-player {
		width: 100%;
		height: 400px;
	}

	.imgright {
		float: none;
		margin: 20px 30px 30px 0;
	}
	
	.row {
		float:none;
		margin:20px 0 50px 50px;
		width: 400px;
	}

	footer .wrapper {
		margin: 0 auto;	
		max-width:760px;	
	}
	footer .wrapper .column {
		font-size: 12px;
		width: 220px;
	}
	
	.container .button {
		display:none;
	}
	
}

@media (max-width: 765px)
{
	.container {
		height:1px;
		top: -1500px;
	}
	
	header {
		height:140px;
		max-width:760px;
		margin: 15px auto;
		background-color:#fff;
	}

	header nav {
		right: auto;
		bottom: auto;
		left: 50%;
		top:100px;
		margin-left: -184px;
	}

	#logo {
		left:50%;
		margin-top: 0;
		margin-bottom: 10px;
		margin-left: -100px;
	}
		
	#applenavbox {
		position:relative;
		float: left;
		left:50%;
		margin: 0 auto;
		margin-left: -250px;
	}

	#spacer {
		height:20px;
	}

	#spacer .search {
		margin-top:8px;
		right:50%;
		margin-right:-180px;
	}
	
	#spacer .button {
		font-size:14px;
	}
	
	.video-player {
		width: 100%;
		height: 400px;
	}

	#text_columns article.column1, #text_columns .column2, #text_columns .single_column {
		float: none;
		/*max-width: 450px;*/
		max-width: 100%;
		margin: 20px 0 20px 20px;
		border-right: none;
	}
	
	#text_columns .contact_column1, #text_columns .contact_column2{
		float: none;
		max-width: 100%;
		margin: 20px 0 20px 15px;
		border-right: none;
	}
	.imgfeature_right {
		width: 460px;
		float: left;
		margin: 0 200px 20px 0;
	}
	.imgfeature_right img{
		width: 460px;
		padding-right: 0;
	}
	.imgposright{
		float:left;
		margin: 5px 20px 10px 0;
	}
	.accordion .imgright img{
		width: 320px;
	}
	
	footer {
		padding-bottom:120px;
		height: auto;
	}
	
	footer .wrapper {
		width: 350px;
		margin: 0 auto;
	}
	
	footer .wrapper .column {
		margin-top:30px;
		float:none;
		font-size: 14px;
		width: auto;
	}
	
	footer .wrapper .social {
		display:none;
	}

	#copyright {
		height:120px;
	}
	#copyright .createdby {
		float: right;
		margin: 0 30px 20px 0;
	}

}

@media (max-width: 500px)
{
	h1 {
		font-size:28px;
	}
	h2 , accordion-head {
		font-size:24px;
	}
	p, p+p {
		font-size: 13px;
	}
	li {
		font-size: 14px;
	}
	.imgfig, .imgleft, .imgright {
		margin: 5px 200px 15px 0;
	}
	.imgfeature, .imgfeature img, .imgleft, .imgleft img, .imgright, .imgright img {
		width: 320px;
	}
	.imgfeature_right {
		width: 100%;
		margin: 10px 0 20px 0;
	}
	.imgfeature_right img {
		width: 100%;
		margin: 0;		
	}
	
	.accordion .imgright{
		margin-right: 5px;
	}
	.accordion .imgright img{
		width: 220px;		
	}
	.accordion table img{
		width: 60%;
	}
	td, th { 
	padding: 6px 15px 6px 10px; 
	}
	
	.video-player {
		width: 100%;
		height: 220px;
	}
	
	.contact_column2 .imgfeature, .contact_column2 .imgfeature img{
		width: 320px;
	}

	
	header {
		height:140px;
		background-color:#fff;
		margin: 0 auto;
	}
	
	#logo {
		position:relative;
		left:50%;
		margin-left: -100px;
	}
	
	#applenavbox {
		position:relative;
		float:left;
		left: 50%;
		margin: 0 auto;
		margin-left: -195px;
	}

	#appleNav li {
		width: 65px; 
		height: 34px;
		font-size:12px;	 
	}
	
	#spacer {
		height: 10px;
	}
	
	#spacer .search {
		margin-top:6px;
		right:50%;
		margin-right:-150px;
	}
	
	#spacer .button {
		font-size:14px;
	}
	
	#four_columns {
		width:auto;
	}
	
	#four_columns .img-item {
		width: 200px;
		float:none;
		margin: 25px auto 0 auto;
	}
	
	#four_columns h2 {
		margin: 0 30px;
	}

	
	#text_columns article.column1, #text_columns .column2 {
		float:none;
		max-width: 500px;
		margin: 20px 30px 20px 20px;
	}
	
	.row {
		float:none;
		margin:20px 0 50px 0;
		width: 300px;
	}
	
	footer .wrapper {
		width:auto;
	}
	footer .wrapper .column {
		margin: 0 auto 15px auto;
		max-width:300px;
	}

	input {
		width:auto;
	}
	
	#alternative_menu {
		display:block;
	}
	
	header nav {
		display:none;
	}
	

	
	header p {
		margin-left: 60px;
		font-size:14px;
	}
}

/* KEYFRAMES */

@keyframes stylie-transform-keyframes {
  0% {transform:translateX(30px) translateY(46px) rotate(0deg) translate(-50%, -50%);animation-timing-function: cubic-bezier(.25,.25,.75,.75);}
  100% {transform:translateX(260px) translateY(-150px) rotate(0deg) translate(-50%, -50%);}
}

@keyframes stylie-transform2-keyframes {
  0% {transform:translateX(40px) translateY(40px) rotate(0deg) translate(-50%, -50%);animation-timing-function: cubic-bezier(.25,.25,.75,.75);}
  100% {transform:translateX(50px) translateY(40px) rotate(0deg) translate(-50%, -50%);}
}