style.css

/*
Theme Name: 	be movement theme
Theme URI: 		http://html5blank.com
Description: 	HTML5 Blank WordPress Theme
Version: 	1.2.4
Author: 	Todd Motto (@toddmotto)
Author URI: 	http://www.toddmotto.com
Tags: 		Blank, HTML5, CSS3

License:	MIT
License URI:	http://opensource.org/licenses/mit-license.php
*/

/*
  Used Colors:
  - pink : #e6086c
 */

/* =============================================================================
   HTML5 Reset
   ========================================================================== */

	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;}
	[hidden] {display:none;}
	
	html {font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
	html, button, input, select, textarea {font-family:sans-serif;color:#222;}
	body {margin:0;font-size:1em;line-height:1;}
	p {padding:7px 0 0 0;}
	
	h1,h2,h3,h4,h5,h6 {text-decoration:none;padding:0;color:black;margin:0;font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;font-weight:700;}
	
	a {color:#266E9E;text-decoration:none;vertical-align: baseline;}
	a:focus {outline:0;}
	a:hover, a:active {outline:0;}
	
	abbr[title] {border-bottom:1px dotted;}
	b, strong {font-weight:bold;}
	/*.clear {clear:both;}*/
	.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}
	dfn {font-style:italic;}
	hr {display:block;height:1px;border:0;border-top:1px solid #CCC;margin:1em 0;padding:0;}
	ins {background:#FF9;color:#000;text-decoration:none;}
	mark {background:#FF0;color:#000;font-style:italic;font-weight:bold;}
	pre, code, kbd, samp {font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em;}
	pre {white-space:pre;white-space:pre-wrap;word-wrap:break-word;}
	q {quotes:none;}
	q:before, q:after {content:"";content:none;}
	small {font-size:90%;}
	blockquote {background-color:#EEE;border:1px solid #DDD;margin:10px 0;padding:10px 30px;border-radius:3px;}
	
	sub, sup {font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
	sup {top:-0.5em;}
	sub {bottom:-0.25em;}
	
	ul {margin:0;padding:0;list-style:none;}
	ol {margin:15px;}
	
	dd {margin:0 0 0 40px;}
	nav ul, nav ol {list-style:none;list-style-image:none;margin:0;padding:0;}
	
	img {border:0;-ms-interpolation-mode:bicubic;vertical-align:middle;max-width: 100%;}
	
	svg:not(:root) {overflow:hidden;}
	
	figure {margin:0;}
	
	form {margin:0;}
	fieldset {border:0;margin:0;padding:0;}
	label {cursor:pointer;}
	legend {border:0;*margin-left:-7px;padding:0;white-space:normal;}
	button, input, select, textarea {font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle;}
	button, input {line-height:normal;}
	button, input[type="button"], input[type="reset"], input[type="submit"] {cursor:pointer;-webkit-appearance:none;*overflow:visible;}
	button[disabled], input[disabled] { cursor: default; }
	input[type="checkbox"], input[type="radio"] {box-sizing:border-box;padding:0;*width:13px;*height:13px;}
	input[type="search"] {-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}
	input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button {-webkit-appearance:none;}
	button::-moz-focus-inner, input::-moz-focus-inner {border:0;padding:0;}
	textarea {overflow:auto;vertical-align:top;resize:vertical;}
	input:valid, textarea:valid {}
	input:invalid, textarea:invalid {background-color:#F0DDDD;}
	
	table {border-collapse:collapse;border-spacing:0;}
	td {vertical-align:top;}


/* =============================================================================
   General Styles
   ========================================================================== */
   
	@font-face {
	    font-family: 'proxima_nova_light';
	    src: url('fonts/proximanova-light-webfont.eot');
	    src: url('fonts/proximanova-light-webfont.eot?#iefix') format('embedded-opentype'),
	         url('fonts/proximanova-light-webfont.woff') format('woff'),
	         url('fonts/proximanova-light-webfont.ttf') format('truetype'),
	         url('fonts/proximanova-light-webfont.svg#proxima_nova_ltregular') format('svg');
	    font-weight: normal;
	    font-style: normal;
	}

	@font-face {
	    font-family: 'proxima_nova_regular';
	    src: url('fonts/proximanova-regular-webfont.eot');
	    src: url('fonts/proximanova-regular-webfont.eot?#iefix') format('embedded-opentype'),
	         url('fonts/proximanova-regular-webfont.woff') format('woff'),
	         url('fonts/proximanova-regular-webfont.ttf') format('truetype'),
	         url('fonts/proximanova-regular-webfont.svg#proxima_nova_rgregular') format('svg');
	    font-weight: normal;
	    font-style: normal;
	}

	@font-face {
	    font-family: 'proxima_nova_extrabold';
	    src: url('fonts/proximanova-extrabold-webfont.eot');
	    src: url('fonts/proximanova-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
	         url('fonts/proximanova-extrabold-webfont.woff') format('woff'),
	         url('fonts/proximanova-extrabold-webfont.ttf') format('truetype'),
	         url('fonts/proximanova-extrabold-webfont.svg#proxima_nova_thbold') format('svg');
	    font-weight: normal;
	    font-style: normal;
	}

	@font-face {
    font-family: 'RokkittRegular';
    src: url('fonts/Rokkitt-webfont.eot');
    src: url('fonts/Rokkitt-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Rokkitt-webfont.woff') format('woff'),
         url('fonts/Rokkitt-webfont.ttf') format('truetype'),
         url('fonts/Rokkitt-webfont.svg#RokkittRegular') format('svg');
    font-weight: normal;
    font-style: normal;
	}
	
	
   	/* Font Face Setup, add fonts to /fonts/ folder and link up below with filenames */
	@font-face {
		font-family:'Font-Name';
		src:url('fonts/font-name.eot');
		src:url('fonts/font-name.eot?#iefix') format('embedded-opentype'),
		url('fonts/font-name.woff') format('woff'),
		url('fonts/font-name.ttf') format('truetype'),
		url('fonts/font-name.svg#font-name') format('svg');
	    	font-weight:normal;
	    	font-style:normal;
  	 }
	
   	body {
		font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; /* Serve Helvetica Neue, with Helvetica fallbacks to Arial */
		font-size:11px;
		font-weight:300; /* Better supported than 'lighter' attribute */
		line-height:18px;
		-webkit-font-smoothing:antialiased; /* Antialiased font for great smoothing */
		-moz-font-smoothing:antialiased;
		-o-font-smoothing:antialiased;
		font-smoothing:antialiased;
		text-rendering:optimizeLegibility; /* Optimise legibility for some CSS3 kerning */
		color:black; /* Lighter on the eyes than #000 Black */
	}

	p {
		font-family:'proxima_nova_regular', "Helvetica Neue", Helvetica, Arial, sans-serif;
		font-size:13px;
		font-weight:300;
		line-height:18px;
	}
	section p {font-size: 14px;}
	
	p.copyright { float: left;}
	p.contact-info { float: right;}

	blockquote{ font-size: 18px; font-style: italic;  background:transparent;/*border-left:1em solid #eee;*/ border:none; margin:1.5em 1em 0.5em 1em; padding:.5em 1em;quotes:"\201C""\201D";}
   	blockquote:before{color:#e6086c;content:open-quote;font-size:4em;line-height:.1em;margin-right:.15em;vertical-align:-.4em;}
   	blockquote :first-child{/*display:inline;*/}
   	blockquote :last-child{margin-bottom:0;}
   	blockquote:after { content: close-quote; color:#e6086c;font-size:4em;line-height:.1em;margin-left:.15em;vertical-align:-.4em;}
   	blockquote cite, cite {color: #e6086c; font-size: 14px; display: block; margin-top: 5px; padding-left: 100px;}
 	blockquote cite:before, cite:before { content: "\2014 \2009";}
	.clearfix { display: block; }
	.clearfix::after { clear: both; content: ' '; display: block; font-size: 0; line-height: 0; visibility: hidden; width: 0; height: 0; }
/* =============================================================================
   Mobile First Media Queries
   ========================================================================== */

   /* 320px and greater */
   @media only screen and (min-width: 320px) {
	/* Styles here */
   }
   
   /* 480px and greater */
   @media only screen and (min-width: 480px) {
	/* Styles here */
   }
   
   /* 768px and greater */
   @media only screen and (min-width: 768px) {
	/* Styles here */
   }
   
   /* 1024px and greater */
   @media only screen and (min-width: 1024px) {
	/* Styles here */
   }
   
   /* Retina screens */
   @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) {
	/* Style adjustments for high resolution devices */
}

/* =============================================================================
   Non-Semantic Classes
   ========================================================================== */
   
   /* Custom Selection Styles */
   ::selection {background:#D31245;color:#FFF;text-shadow:none;}
   ::-webkit-selection {background:#D31245;color:#FFF;text-shadow:none;}
   ::-moz-selection {background:#D31245;color:#FFF;text-shadow:none;}
   
   /* Input focus styles */
   input:focus {outline:0;border:1px solid #0091BD;} /* Gets rid of blue glow on field focus, adds border color instead */
   
/* =============================================================================
   WordPress Core CSS Styles
   ========================================================================== */
   .centrer { text-align: center; }
   .alignnone {margin:5px 20px 20px 0;}
   .aligncenter,div.aligncenter {display:block;margin:5px auto 5px auto;}
   .alignright {float:right;margin:5px 0 20px 20px;}
   .alignleft {float:left;margin:5px 20px 20px 0;}
   .aligncenter {display:block;margin:5px auto 5px auto;}
   a img.alignright {float:right;margin:5px 0 20px 20px;}
   a img.alignnone {margin:5px 20px 20px 0;}
   a img.alignleft {float:left;margin:5px 20px 20px 0;}
   a img.aligncenter {display:block;margin-left:auto;margin-right:auto;}
   .wp-caption {background:#FFF;border:1px solid #F0F0F0;max-width:96%;padding:5px 3px 10px;text-align:center;}
   .wp-caption.alignnone {margin:5px 20px 20px 0;}
   .wp-caption.alignleft {margin:5px 20px 20px 0;}
   .wp-caption.alignright {margin:5px 0 20px 20px;}
   .wp-caption img {border:0 none;height:auto;margin:0;max-width:98.5%;padding:0;width:auto;}
   .wp-caption p.wp-caption-text,.gallery-caption {font-size:11px;line-height:17px;margin:0;padding:0 4px 5px;}
   .sticky {}
   .bypostauthor {}

/* ==========================================================================
   Print styles
   ========================================================================== */

	@media print {
		* {background:transparent !important;color:#000 !important;box-shadow:none !important;text-shadow:none !important;}
		a,a:visited {text-decoration:underline;}
		a[href]:after {content:" (" attr(href) ")";}
	    abbr[title]:after {content:" (" attr(title) ")";}
	    .ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after {content:"";}
	    pre,blockquote {border:1px solid #999;page-break-inside:avoid;}
	    thead {display:table-header-group;}
	    tr,img {page-break-inside:avoid;}
	    img {max-width:100% !important;}
	    @page {margin:0.5cm;}
	    p,h2,h3 {orphans:3;widows:3;}
	    h2,h3 {page-break-after:avoid;}
	}

/* =============================================================================
   Structure
   ========================================================================== */
   
   /* Add your site structure here */

	body {
		font-family:'proxima_nova_regular', "Helvetica Neue", Helvetica, Arial, sans-serif;
		font-size:13px;
	}
   /* general layout style */
	#wrapper {
		background-color: #ffffff;
		display: block;
		float: left;
		position: relative;
		width: 100%;
	}
	header { margin-bottom: 10px;}

	#logo { 
		position: relative;
		float: left;
		top: 35px;
		left: 0px;
		margin: 0px;
		padding: 0px;
		z-index: 446;
	}

   .container {
	   	width: 960px;
   		margin: 0 auto;
   }

   .line::after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
	}

	.unit { float: left; }
	
	.unit p, .unit h1, .unit h2, .unit h3, .unit h4 { padding: 10px; }
	.unit p { padding-top: 0px; padding-left: 0px; }
	.unit h2 {padding-bottom: 0px; padding-left: 0px}

	.one_third { width: 31.33333%; margin:0 0 0 2%;}
	.two_third { width: 66.66666%; /*margin:2% 0 0 2%;*/}
	.lastUnit { display: table-cell; float: none; _position: relative; _left: -3px; _margin-right: -3px; width: auto; }
	.lastUnit::after {
		content: " . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ";
		visibility: hidden;
		clear: both;
		height: 0 !important;
		display: block;
		line-height: 0;
		}


	h1,h2,h3,h4,h5,h6 { margin: 10px 0; }
	h3 { color: #e6086c; }

	section article { padding: 10px;}
	.element {border: 1px solid #333;}

	/* Menu */

	#primary-log { position: relative; top: 0px; right: 0px; margin: 5px 0 0 0; padding: 0; text-align: right; float: right;}
	#primary-log a { color: #333; }

	nav { float: right;}

	#nav  {list-style:none;list-style-image:none;margin:0;padding:0;}

	#nav {
		float: right;
		margin: 0px;
		padding: 0px;
		height: 193px;
	}

	#nav li {
		display: block;
		float: left;
		margin-left: 10px;				
		background-position: 0 0;
		background-repeat: no-repeat;
		position: relative;
		height: 193px;
		-webkit-transition: background-position .3s ease-out;
		-moz-transition: background-position .3s ease-out;
		-o-transition: background-position .3s ease-out;
		transition: background-position .3s ease-out;
	}
	#nav li.item-01 { background-image: url("img/bg_anim_nav_01.gif"); }
	#nav li.item-02 { background-image: url("img/bg_anim_nav_02.gif"); }
	#nav li.item-03 { background-image: url("img/bg_anim_nav_03.gif"); }
	#nav li.item-04 { background-image: url("img/bg_anim_nav_04.gif"); }
	#nav li.item-05 { background-image: url("img/bg_anim_nav_05.gif"); }
	#nav li.item-06 { background-image: url("img/bg_anim_nav_06.gif"); }
	
	#nav li:focus, #nav li:hover {	background-position: 0 -193px;	}

	#nav li.item-01 a span{ width:46px; }
	#nav li.item-02 a span{ width:115px; }
	#nav li.item-03 a span{ width:120px; }
	#nav li.item-04 a span{ width:105px; }
	#nav li.item-05 a span{ width:106px; }
	#nav li.item-06 a span{ width:104px; }


	#nav li a {
		display: block;
		text-decoration: none;
		padding: 115px 10px 33px 10px;
		color: #333333;
		font-size: 1.3em;
		height: 60px;
		text-transform: capitalize;
		font-weight: normal;
	}
	#nav li a span {
		position: absolute;
		top: 77px;
		left: 10px;
		padding: 3px 0 0 0;
		font-size: 1em;
		color: #333333;
		border-top: 1px solid #e7e5e5;
	}
	#nav li a:hover { }

	#nav li.current-menu-item a span, 
		#nav li.current_page_item a span {	
			border-top: 2px solid #e7b9cd;
			}
	
	.current-menu-item, .current_page_item, 
		.current-menu-item a, .current_page_item a {
			color: #e7b9cd; 	
			}

	/* footer styles */
	#footer-bg { background: #433; min-height: 570px;}
	#footer * {color:#e7b9cd;}
	#footer h2 {
		font-family:'proxima_nova_light', "Helvetica Neue", Helvetica, Arial, sans-serif;
		font-size: 3.4em;
		line-height: 1.0em;
		font-weight: normal;
	}
	#footer h2 span {
		font-family:'proxima_nova_extrabold', "Helvetica Neue", Helvetica, Arial, sans-serif;
	}

	/* Page styles */
	/* 2 column */
	.divup-wrap { 
	    overflow:hidden; 
	    width: 100%;
	    padding-top:50px;
	} 

	.divup-wrap .div-1 { width: 100%;}
	.divup-wrap .div-2 { width: 0%;}
	
	.divup { 
	    float:left;
	    width:64%;
	    margin-right:20px;
	} 
	.div-even { 
		margin-top: 30px;
	    margin-right:0; 
	    width:32%;
	}
	.div-odd {	
	}
	
	.divup h2 {margin-top: 50px;}
	.divup h3 {margin-top: 30px;}

	/* 4 columns styles */
	/*#cspc-column-0{ 
		-webkit-transform: rotate(-2deg);
		-moz-transform: rotate(-2deg);
		-o-transform: rotate(-2deg);
		-ms-transform: rotate(-2deg);
		transform: rotate(-2deg);  } 
	#cspc-column-2 { 
		-webkit-transform: rotate(-1deg);
		-moz-transform: rotate(-1deg);
		-o-transform: rotate(-1deg);
		-ms-transform: rotate(-1deg);
		transform: rotate(-1deg);  }   
	#cspc-column-1 { 
		-webkit-transform: rotate( 3deg);
		-moz-transform: rotate( 3deg);
		-o-transform: rotate( 3deg);
		-ms-transform: rotate( 3deg);
		transform: rotate( 3deg);  }   
	#cspc-column-3{ 
		-webkit-transform: rotate( 1deg);
		-moz-transform: rotate( 1deg);
		-o-transform: rotate( 1deg);
		-ms-transform: rotate( 1deg);
		transform: rotate( 1deg);  }   */

	/* Homepage styles */

	section.home h2 { float: left; padding-top: 30px;}
	section.home img { margin-bottom: 0px;}
	section.home article {padding-bottom: 0px;}
	section.home h2, section.home h2 span {
		/*font-family: "RokkittRegular", "Helvetica Neue", Helvetica, Arial, sans-serif;
		color: #999999;
		line-height: 1.5em;
		font-weight: 700;*/
	}
	
	section.home h2, section.home h2 span strong { color: #e6086c;	}

	
	/* Subscription page styles */
	
	h2.offer_title {color: #e6086c;} 

	.offer_abonnement {
		min-height: 230px;
		background: url("img/be-cover-website.jpg") 0px center no-repeat;
		padding-left: 395px;
		margin: 62px auto;
		background-size: 360px;
	}
	.txt_grey { color: #747B83; /*#999;*/ }
	.txt12 {line-height: 120%; font-size: 1.2rem;}
	.caps {text-transform: uppercase;}
	.block { display: block;}
	.offer_abonnement .formule:first-child { padding-top: 0; border-top: 0;}
	.offer_abonnement .formule { padding-top: 16px; margin-bottom: 16px; border-top: 1px solid #EEF1F5;	}
.offer_abonnement .formule .integrale, .offer_abonnement .formule .numerique, .offer_abonnement .formule .tous_numerique, .offer_abonnement .formule .tous_papier { background: url("img/media_supports.png") left 30px no-repeat; }
.offer_abonnement .formule .numerique { background-position: left -215px; }
.offer_abonnement .formule h3.grid_6 { width:304px; display: inline-block; min-height: 75px; letter-spacing: -0.08em; margin-left: 0; clear: left; box-sizing: border-box;
float: left;
position: relative;
margin-right: 8px;}
.offer_abonnement .formule p.grid_5 {width: 209px; margin-top: 8px;margin-right: 0; clear: right;box-sizing: border-box;
float: left;
position: relative;
margin-left: 8px;
}

.offer_abonnement .grid_2 {width: 75px;margin-right: 0; clear: right; box-sizing: border-box;
display: inline;
float: left;
position: relative;
margin-top: 8px; }

.offer_abonnement .prix {
	display: inline;
font-size: 24px;
line-height: 24px;
margin-top: -8px;
color: #e6086c;
font-weight: bold;
width: 129px;
}
.offer_abonnement .prix sup {
line-height: 10px;
font-size: 50%;
top: -1em;
}
.offer_abonnement .prix del, .offer_abonnement .prix em {
font-size: 13px;
line-height: 15px;
font-weight: normal;
font-style: normal;
}
#btn_membership_1, #btn_membership_2 { }

	/* Welcome page styles */
	/*#left-sidebar {float: left; width: 312px;margin-right: 10px; min-height: 300px; position: relative;}*/
	#left-sidebar a {color:#333;}
	#left-sidebar .widgettitle {
		padding: 0;
		margin-top: 0px;
		color: #777;
		font-size: 22px;
		font-weight: normal;
		font-style: normal;
		font-family: 'proxima_nova_light';
		}
	#bm-login-widget {}
	#bm_summary_name {font-weight: bold;font-size: 120%;}
	#bm_summary_registration_date {}
	#bm_summary_payment_date {}
	#bm_summary_logout {}
	
	#bissue_listing { margin-top: 15px;}
	.bissue-item { padding-top:5px; border-bottom: 1px dashed #777; }

	.bissue-item-subtitle {

	}


	/* homepage issue */
	#issue { position: relative; width: 190px; height: 190px; background: white;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	border-radius: 50%;
	border: 1px solid #e8e8e8;
	text-align:center;
	top: 240px;
	left: 750px;
	}

	#issue .inner { position: absolute; width: 100%; height: 100%;}
	#issue .inner p { padding-top:25px; font-family: "proxima_nova_regular", "Helvetica Neue", Helvetica, Arial, sans-serif; }
	#issue .button, .button {
	   border-top: 1px solid #000000;
	   background: #000000;
	   background: -webkit-gradient(linear, left top, left bottom, from(#000000), to(#000000));
	   background: -webkit-linear-gradient(top, #000000, #000000);
	   background: -moz-linear-gradient(top, #000000, #000000);
	   background: -ms-linear-gradient(top, #000000, #000000);
	   background: -o-linear-gradient(top, #000000, #000000);
	   margin: 5px 0;
	   padding: 5px 10px;
	   -webkit-border-radius: 8px;
	   -moz-border-radius: 8px;
	   -ms-border-radius: 8px;
	   -o-border-radius: 8px;
	   border-radius: 8px;
	   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
	   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
	   -ms-box-shadow: rgba(0,0,0,1) 0 1px 0;
	   -o-box-shadow: rgba(0,0,0,1) 0 1px 0;
	   box-shadow: rgba(0,0,0,1) 0 1px 0;
	   text-shadow: rgba(0,0,0,.4) 0 1px 0;
	   color: white;
	   font-size: 13px;
	   text-decoration: none;
	   vertical-align: middle;
   	}
	#issue .button:hover {
	   border-top-color: #000000;
	   background: #000000;
	   color: #ccc;
	}
	#issue .button:active {
	   border-top-color: #000000;
	   background: #000000;
   	}

	/* homepage bicyle animation */
	#hmpg-bicyle { position: relative; float: right; left: -180px; width: 176px; height: 391px; }
	#hmpg-bicyle-frame { position: absolute; width:176px;height:391px; z-index: 10; top:-20px;}
	.animate-wheel-rotating-normal {
		-webkit-animation: wheelrotating 8s linear infinite;
		-moz-animation: wheelrotating 8s linear infinite;
		-ms-animation: wheelrotating 8s linear infinite;
		-o-animation: wheelrotating 8s linear infinite;
		animation: wheelrotating 8s linear infinite;
	}
	.animate-wheel-rotating-fast {
		-webkit-animation: wheelrotating 4s linear infinite;
		-moz-animation: wheelrotating 4s linear infinite;
		-ms-animation: wheelrotating 4s linear infinite;
		-o-animation: wheelrotating 4s linear infinite;
		animation: wheelrotating 4s linear infinite;
	}
	.animate-translate-left {
		-webkit-animation: translateleft 4s linear infinite;
		-moz-animation: translateleft 4s linear infinite;
		-ms-animation: translateleft 4s linear infinite;
		-o-animation: translateleft 4s linear infinite;
		animation: translateleft 4s linear infinite;
	}

	#hmpg-bicyle-big { 
		position: absolute; left: -85px; top: 210px;  z-index: 9;
		
	}
	#hmpg-bicyle-small { 
		position: absolute; left: 88px;	top: 323px; z-index: 9;		
		}

	@-webkit-keyframes translateleft {
	   0% { -webkit-transform: translate(0px, 0px); opacity: 0.1; } 
	   15% { opacity: 1;}
	   85% { opacity: 0.8;}
	   100% { -webkit-transform: translate(-650px, 0px); opacity: 0.1;}
	}

	@-moz-keyframes translateleft {
	   0% { -moz-transform: translate(0px, 0px); opacity: 0.1; } 
	   15% { opacity: 1;}
	   85% { opacity: 0.8;}
	   100% { -moz-transform: translate(-650px, 0px); opacity: 0.1;}
	}

	@-ms-keyframes translateleft {
	   0% { -ms-transform: translate(0px, 0px); opacity: 0.1; } 
	   15% { opacity: 1;}
	   85% { opacity: 0.8;}
	   100% { -ms-transform: translate(-650px, 0px); opacity: 0.1;}
	}

	@-o-keyframes translateleft {
	   0% { -o-transform: translate(0px, 0px); opacity: 0.1; } 
	   15% { opacity: 1;}
	   85% { opacity: 0.8;}
	   100% { -o-transform: translate(-650px, 0px); opacity: 0.1;}
	}

	@keyframes translateleft {
	   0% { transform: translate(0px, 0px); opacity: 0.1; } 
	   15% { opacity: 1;}
	   85% { opacity: 0.8;}
	   100% { transform: translate(-650px, 0px); opacity: 0.1;}
	}


	@-webkit-keyframes bicyle {
	    0% { -webkit-transform: rotate(-2deg); }
	    50% { -webkit-transform: rotate(3deg); }
	    100% { -webkit-transform: rotate(-2deg); }	    
	}

	@-webkit-keyframes wheelrotating {
	    from{
	        -webkit-transform: rotate(360deg);
	    }
	    to{
	        -webkit-transform: rotate(0deg);
	    }
	}
	@-moz-keyframes wheelrotating {
	    from{
	        -moz-transform: rotate(360deg);
	    }
	    to{
	        -moz-transform: rotate(0deg);
	    }
	}
	@-ms-keyframes wheelrotating {
	    from{
	        -ms-transform: rotate(360deg);
	    }
	    to{
	        -ms-transform: rotate(0deg);
	    }
	}
	@-o-keyframes wheelrotating {
	    from{
	        -o-transform: rotate(360deg);
	    }
	    to{
	        -o-transform: rotate(0deg);
	    }
	}		
	@keyframes wheelrotating {
	    from{
	        transform: rotate(360deg);
	    }
	    to{
	        transform: rotate(0deg);
	    }
	}



	/* homapge text animations */
	.rw-sentence { margin: 0; text-align: left;	}
	.rw-sentence * { font-family: "Candara", "Helvetica Neue", Helvetica, Arial, sans-serif; }

	.rw-sentence > span {
		white-space: nowrap;
		font-size: 1.3em;
		line-height: 1.3em;		
		color: #999999;			
		font-weight: 700;
	}

	.rw-words {
		display: inline;
		text-indent: 0px;
		font-weight: 700;
		font-size: 1.8em;
		line-height: 1.8em;
	}

	.rw-words-no-indent { text-indent: 0px;}

	.rw-sentence .rw-words span{
		position: absolute;
		opacity: 0;
		overflow: hidden;		
		line-height: 1.7em;
		font-size: 1.3em;
		-webkit-transform-origin: 10% 75%;
		-moz-transform-origin: 10% 75%;
		-ms-transform-origin: 10% 75%;
		-o-transform-origin: 10% 75%;
		transform-origin: 10% 75%;
	}

	.rw-words-1 span{
	    -webkit-animation: rotateWordsSecond 18s linear infinite 0s;
	    -moz-animation: rotateWordsSecond 18s linear infinite 0s;
	    -o-animation: rotateWordsSecond 18s linear infinite 0s;
	    -ms-animation: rotateWordsSecond 18s linear infinite 0s;
	    animation: rotateWordsSecond 18s linear infinite 0s;
	}

	.rw-words span:nth-child(2) { 
	    -webkit-animation-delay: 5s; 
		-moz-animation-delay: 5s; 
		-o-animation-delay: 5s; 
		-ms-animation-delay: 5s; 
		animation-delay: 5s; 
		/*color: #6b889d;*/
	}
	.rw-words span:nth-child(3) { 
	    -webkit-animation-delay: 10s; 
		-moz-animation-delay: 10s; 
		-o-animation-delay: 10s; 
		-ms-animation-delay: 10s; 
		animation-delay: 10s; 
		/*color: #6b739d;	*/
	}
	.rw-words span:nth-child(4) { 
	    -webkit-animation-delay: 9s;
		-moz-animation-delay: 9s; 
		-o-animation-delay: 9s; 
		-ms-animation-delay: 9s; 
		animation-delay: 9s; 
		/*color: #7a6b9d;*/
	}
	.rw-words span:nth-child(5) { 
	    -webkit-animation-delay: 14s; 
		-moz-animation-delay: 12s; 
		-o-animation-delay: 12s; 
		-ms-animation-delay: 12s; 
		animation-delay: 12s; 
		/*color: #8d6b9d;*/
	}
	.rw-words span:nth-child(6) { 
	    -webkit-animation-delay: 15s;
		-moz-animation-delay: 15s; 
		-o-animation-delay: 15s; 
		-ms-animation-delay: 15s; 
		animation-delay: 15s; 
		/*color: #9b6b9d;*/
	}
	@-o-keyframes rotateWordsSecond {
	    0% { opacity: 1; -o-animation-timing-function: ease-in; width: 0px; }
	    10% { opacity: 0.3; width: 0px; }
	    20% { opacity: 1; width: 500px; }
	    27% { opacity: 0; width: 500px; }
	    100% { opacity: 0; }
	}
	@-webkit-keyframes rotateWordsSecond {
	    0% { opacity: 1; -webkit-animation-timing-function: ease-in; width: 0px; }
	    10% { opacity: 0.3; width: 0px; }
	    30% { opacity: 1; width: 800px; }
	    37% { opacity: 0; width: 800px; }
	    100% { opacity: 0; }
	}
	@-ms-keyframes rotateWordsSecond {
	    0% { opacity: 1; -ms-animation-timing-function: ease-in; width: 0px; }
	    10% { opacity: 0.3; width: 0px; }
	    20% { opacity: 1; width: 500px; }
	    27% { opacity: 0; width: 500px; }
	    100% { opacity: 0; }
	}
	@-moz-keyframes rotateWordsSecond {
	    0% { opacity: 1; -moz-animation-timing-function: ease-in; width: 0px; }
	    10% { opacity: 0.3; width: 0px; }
	    20% { opacity: 1; width: 500px; }
	    27% { opacity: 0; width: 500px; }
	    100% { opacity: 0; }
	}
	@keyframes rotateWordsSecond {
	    0% { opacity: 1; animation-timing-function: ease-in; width: 0px; }
	    10% { opacity: 0.3; width: 0px; }
	    20% { opacity: 1; width: 500px; }
	    27% { opacity: 0; width: 500px; }
	    100% { opacity: 0; }
	}

	@-webkit-keyframes fadeWordsSecond {
	    0% { opacity: 1;  }
	    10% { opacity: 0.3;  }
	    20% { opacity: 1;  }
	    27% { opacity: 0; }
	    100% { opacity: 0; }
	}

   @media print {
	* {background:transparent !important;color:#000 !important;box-shadow:none !important;text-shadow:none !important;}
	a,a:visited {text-decoration:underline;}
	a[href]:after {content:" (" attr(href) ")";}
	abbr[title]:after {content:" (" attr(title) ")";}
	.ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after {content:"";}
	pre,blockquote {border:1px solid #999;page-break-inside:avoid;}
	thead {display:table-header-group;}
	tr,img {page-break-inside:avoid;}
	img {max-width:100% !important;}
	@page {margin:0.5cm;}
	p,h2,h3 {orphans:3;widows:3;}
	h2,h3 {page-break-after:avoid;}
   }