/* Basics
================================================== */
	body{margin: 0; padding: 0; background: #fff;}
	
	.container{width: 1100px; margin:0 auto; position: relative;} /* width:990px; */
	
	.theme-color{color:#fd147c;} /* pink */
	.theme-color-2{color:#5a8ebe;} /* blue */
	.hr{border-top: 1px solid #eeeeee; height:1px;}
	img{border:0;}
	a:focus, a:active {outline:none}

	.mobile{display: none;}
	
/* Typografies
================================================== */
	body{
		font-family: Arial, sans-serif;
		/* color:#adadad; */
		color: #555555;
		font-size: 13px;
		line-height: 150%;
	}
	.theme-font{
		font-family: 'Open Sans Condensed', sans-serif;
	}
	.theme-font-2, h1, h2, h3{
		font-family: 'Source Sans Pro', sans-serif;
		margin:0 0 20px 0;
		line-height: 120%;
	}
	
	.page-title{font-size: 45px; font-weight: 200; line-height: 150%; margin:-15px 0 0 0; color:#999999;}
	.page-sub-title{font-weight: bold; font-size: 18px; line-height: 150%; margin: 0 0 20px 0;}
	
	h1{font-weight: 200; font-size: 44px; color: #999999;}
	h2{font-weight: bold; color: #5a8ebe; font-size: 18px; margin:20px 0 10px 0;}
	h3{font-size: 18px; line-height: 120%; margin: 30px 0 0 0; color: #999999;}
	
	a, a:visited{color:#fd147c; text-decoration: none;}

/* Responsive media
================================================== */
	.responsive-media {
		position: relative;
		padding-bottom: 54%;
		padding-top: 25px;
		height: 0;
	}
	.responsive-media iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
	

/* Forms
================================================== */
	input.text, input.email{font-size: 18px; padding: 5px; border:1px solid #cccccc; background: #eeeeee; width: 70%;}
	input.button{margin:30px 0 0 0; background: #eeeeee; font-size: 16px; border: 1px solid #cccccc; padding: 5px 15px;}

/* Header
================================================== */
	.header-wrap{
		/* background: url('images/bg/brick_background.png'); */
	}
	.header{height: 120px; position: relative;}	
	a.logo-link{}
	a.logo-link img{position: absolute; top:54px;}
	.logo-overlay{position: absolute; top:54px; z-index: 9; display: none;}
	body.front .logo-overlay{display: block;}
	
	img.facebook-icon-link{border: 0; position: absolute; right:0; top:0;}

/* Header nav
================================================== */
	.header-nav{
		position: absolute; right:0; top:30px;		
	}
	
	.mobile-nav-toggle{
		display: none;		
		font-size: 16px;		
		padding: 10px 0;
		font-weight: bold;		
		text-align: center;		
	}
	.mobile-nav{display: none;}

	.mobile-nav .m-nav{padding: 0 0 10px 0; border-bottom: 1px solid #eee; border-top: 1px solid #eee;}
	.mobile-nav .m-nav ul{list-style: none; padding: 0;}
	.mobile-nav .m-nav ul li{padding: 0;}
	.mobile-nav .m-nav ul li a{display: block;; text-align: center; padding: 5px 0; font-size: 20px;}	
	.mobile-nav .m-nav ul li ul li a{font-size: 14px;}
	.mobile-nav .m-nav li.current-menu-item a{color: #000; font-weight: bold;}	

	.mobile-nav .m-quick{border-bottom: 1px solid #eee; padding: 10px 0;}
	.mobile-nav .m-quick ul{list-style: none; margin: 0; padding: 0;}
	.mobile-nav .m-quick ul li{padding: 0; margin: 0;}
	.mobile-nav .m-quick ul li a{display: block; text-align: center; font-size: 17px; font-weight: bold; padding: 10px 0; margin-bottom: 1px; text-transform: uppercase;}

	.mobile-nav .m-lang{}
	.mobile-nav .m-lang .language-select{position: relative; right: 0;}
	.mobile-nav .m-lang .language-select li{float: left; width: 20%;}
	.mobile-nav .m-lang .language-select li a{color: #000; width: 100%; text-align: center; text-transform: uppercase; font-size: 12px; padding: 10px 0;}

	.header-nav ul ul{display: none;}
	.header-nav ul.menu{
		list-style: none; padding: 0;		
	}
	.header-nav ul.menu li{
		float: left;
		padding:0 0 0 40px;
	}
	.header-nav ul.menu li a{
		display: block;
		font-family: 'Open Sans Condensed', sans-serif;
		color: #cccccc; 
		text-transform: uppercase; 
		font-weight: bold;
		font-size: 16px; 
		line-height: 40px;
		text-decoration: none;
		border-bottom: 1px solid #eeeeee;
		-webkit-transition: all .5s; transition: all 1s;
	}
	.header-nav ul.menu li a:hover{
		border-bottom: 2px solid #333333;
	}
	.header-nav ul.menu li.current-menu-item > a,
	.header-nav ul.menu li.parent-menu-item > a{
		/* color: #fd147c; */
		color: #000000;
		border-bottom: 2px solid #333333;
		/* background: -webkit-linear-gradient(#fdfdfd 0%, #f6f6f6 100%) */
	}
	
/* Quick links header
================================================== */
	.quick-links{list-style: none; margin: 0; padding: 0; position: absolute; right:0;}
	.quick-links li{float: left;}
	.quick-links li a{
		text-decoration: none; 
		padding: 0 0 0 10px; 
		color: #999999; 
		display: block; 
		font-size: 11px; 
		line-height: 30px; 
		text-transform: lowercase;
		background: url('images/quick-links-icons.png?v=8') no-repeat left top;
		padding-left:27px;
		/* width:45px; */
	}
	.quick-links li a.support{background-position: left 4px; margin-right: 15px;}
	.quick-links li a.login{background-position: left -46px; margin-right: 15px;}
	.quick-links li a.create{background-position: left -96px;}
	.quick-links li:hover a{color: #666666;}


/* Language selector
================================================== */
	.language-select{position: absolute; list-style: none; margin: 0; padding: 0; right:230px;}
	.language-select li{float: left;}
	.language-select li a{color: #999999; display: block; padding:0 10px 0 0; font-size: 11px; line-height: 30px; text-decoration: none; text-transform: lowercase;}
	.language-select li.selected a{color: #fd147c;}
	.language-select li:hover a{color: #5a8ebe;}
	

/* Main message area
================================================== */
	.main-message-wrap{
		height:155px;
		background: #f6f6f6 url('images/bg/brick_background_3.png') center top;
	}
	.main-message-wrap img.large{
		position: absolute;
		width:700px;
		top:-30px;
		left:-10px;
	}
	.main-message-wrap img.small{
		position: absolute;
		left:572px;
		top:36px;
		z-index: 9;
	}
	.main-message-wrap h1{
		margin: 0;
		position: absolute;		
		top:13px;
		font-weight: 200;
		font-size: 62px;
		color: #555555;
	}
	body.front .main-message-wrap h1{
		position: relative;
		text-align: center;
		top: 65px;
		color: #fff;
	}
	body.front.sv .main-message-wrap h1{
		font-size:68px;
	}
	body.front.en .main-message-wrap h1{
		font-size: 64px;
	}
	body.landing.de .main-message-wrap h1{
		font-size: 48px;
	}
	body.en .main-message-wrap h1{
		font-size:55px;
	}
	.main-message-wrap h2{
		position: absolute;		
		top:90px;
		font-size: 24px;
		font-weight: bold;
		color: #888888;
	}
	body.de .main-message-wrap h2{
		font-size: 21px;
	}
	body.sv .main-message-wrap h2{
		font-size: 20px;
	}
	body.no .main-message-wrap h2{
		font-size: 22px;
	}
	body.en .main-message-wrap h2{
		font-size: 22px;
	}
	body.front .main-message-wrap h2{
		position: relative;
		text-align: center;
		top:60px;
		font-size: 46px;
		color: #fff;
	}
	
	.counter{
		position: absolute;
		right: 0;
		top:115px;		
		font-size: 16px;
		color: #999999;
	}
	body.front .counter{
		left: 50%;
		width: 180px;
		text-align: center;
		margin-left: -90px;
		border-radius: 3px;
		padding: 5px 0;		
		top:280px;
		font-weight: bold;
		color: #fff; /* #fd147c */
	}
	
	a.video-trigger{
		position: absolute;
		display: block;
		width:370px;
		height: 300px;
		/* background: url('images/play-button.png?v=3') no-repeat center center; */
	}
	

/* CTA button
================================================== */
	
	/* Big */
	a.button{		
		display: block;
		text-decoration: none;		
		font-size: 28px;
		font-weight: bold;
		letter-spacing: 1px;
		text-align: center;
		text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.5);
		color: #ffffff;		
		background: url('images/button_sprite.png?v=2') no-repeat;
		width:262px;
		line-height: 50px;
		padding-bottom: 18px;
	}	
	a.button:hover{
		background-position: left -135px;
		line-height: 58px;
		padding-bottom: 10px;
		text-indent: -5px;
	}
		
	.main-message-wrap a.button{
		position: absolute;
		right:0;
		top:42px;		
		margin-right: -3px;
	}
	body.front .main-message-wrap a.button{
		position: absolute;
		left:50%;	
		margin-left: -125px;
		top: 220px;
	}
	
	/* Small */
	a.button-small{
		display: block;
		text-decoration: none;		
		font-size: 20px;
		font-weight: bold;
		text-align: center;
		text-shadow: 2px 2px 0 rgba(0, 0, 0, 0.5);
		color: #ffffff;
		background: url('images/button_sprite_small.png?v=2') no-repeat;
		width:173px;
		line-height: 35px;
		padding-bottom: 15px;
	}	
	a.button-small:hover{
		background-position: left -157px;
		line-height: 38px;
		padding-bottom: 7px;
		text-indent: -3px;
	}
	
	/* Small white/gray */
	a.button-small-white{
		display: block;
		text-decoration: none;		
		font-size: 13px;
		font-weight: bold;
		text-align: center;
		color: #bbbbbb;
		background: url('images/grey_button_sprite.png') no-repeat;
		width:130px;
		line-height: 26px;
		padding-bottom: 15px;
		text-indent: 3px;
	}	
	a.button-small-white:hover{
		background-position: left -91px;
		line-height: 33px;
		text-indent: 0px;
	}
	
	
/* Pro / white CTA button
================================================== */
	.pro-cta{position: absolute; top:138px; right:0;}
	

/* Middle
================================================== */
	.middle-wrap{}
	.middle{min-height: 300px; padding:35px 0;}
	body.front .middle{padding: 0;}
	
	.content-column{
		/* width:73%;  */
		/*width:739px;*/
		width: 70%;
		float: right; 
		border-left: 1px solid #eeeeee; 
		min-height: 250px;
	}
	.content-column > .inner{
		margin:0 0 0 40px;
	}
	
	
/* Sidebar
================================================== */
	.sidebar{
		float: left; 
		/* width:26%; */
		/*width:250px;*/
		width: 29%;
	}
	
	.sub-menu{margin: 0 20px 0 0;}
	.sub-menu ul{list-style: none; margin: 0; padding: 0;}
	.sub-menu ul li{}
	.sub-menu ul li a, .sub-menu ul li a:visited{
		display: block;
		font-family: 'Open Sans Condensed', sans-serif;
		color: #cccccc; 
		text-transform: uppercase; 
		font-weight: 700;
		font-size: 16px; 
		line-height: 30px;
		text-decoration: none;
		border-bottom: 1px solid #eeeeee;
		background: url('images/arrow-pink.png') no-repeat right -81px;
	}
	.sub-menu ul li.current-menu-item a,
	.sub-menu ul li a:hover{
		color: #333333;
	}
	
	img.sidebar-image{width:230px; margin:30px 0 0 0;}
		
	
/* Front page
================================================== */
	body.front .main-message-wrap{
		height:400px;		
	}
	
	/* Testimonials */
	.testimonials-wrap{
		border-bottom: 1px solid #eeeeee;
	}
	.testimonials-title{
		font-size: 28px;
		color: #999999;
		background: url('images/testimonials_icon.png') no-repeat left 42px;
		font-weight: 200;
		padding:40px 0 20px 50px;
		
		line-height: 150%;
	}
	.testimonials-title span{
		color: #5a8ebe;
		font-weight: 700;
		padding-left: 4px;
	}
	ul.testimonials-loop{list-style: none; padding: 0; margin: 0;}
	ul.testimonials-loop li{color: #999999; font-size: 11px; width:33%; padding: 0; float: left;}
	ul.testimonials-loop li .inner{padding: 0 0 50px 0;}
	ul.testimonials-loop li.index-0{border-right: 1px solid #eeeeee;}
	ul.testimonials-loop li.index-0 .inner{margin: 0 15px 0 0;}
	ul.testimonials-loop li.index-1{border-right: 1px solid #eeeeee;}
	ul.testimonials-loop li.index-1 .inner{margin:0 15px;}
	ul.testimonials-loop li.index-2{}
	ul.testimonials-loop li.index-2 .inner{margin:0 0 0 15px;}
	ul.testimonials-loop li .image{float: right; width:100px; height:120px; overflow: hidden; border:4px solid #dddddd; margin:4px 0 0 15px;}
	ul.testimonials-loop li .image img{width:100%; display: block;}
	ul.testimonials-loop li .title{font-size: 20px; color:#bbbbbb; line-height: 100%; margin: -3px 0 0 0;}
	ul.testimonials-loop li .description{font-weight: bold; margin:0 0 5px 0; color: #bbbbbb;}
	ul.testimonials-loop li .quote p{margin: 0;}
	
	/* Articles */
	.front-articles-wrap{}
	ul.front-articles-loop{list-style: none; margin: 0; padding: 0;}
	ul.front-articles-loop li{
		padding: 20px 0 30px 0;
		margin: 20px 0;
		border-bottom: 1px solid #eeeeee;		
		text-align: right;
		min-height: 380px;
	}
	ul.front-articles-loop li .image{
		float: left; 
		margin: 0 40px 0 0;
	}	
	ul.front-articles-loop li .title{
		/*font-size: 60px; */
		font-size: 40px; 
		font-weight: 200;
		line-height: 150%;
		margin:0;
		color: #888888;
		padding: 20px 0 0 0;
	}
	body.no ul.front-articles-loop li .title{
		font-size:50px;
	}
	body.de ul.front-articles-loop li .title{
		font-size:38px;
	}
	ul.front-articles-loop li .sub-title{
		font-size: 30px;
		font-weight: bold;
		margin-bottom: 20px;
	}
	body.en ul.front-articles-loop li .sub-title{font-size: 26px;}
	ul.front-articles-loop li .content{margin:0 0 20px 0;}
	
	ul.front-articles-loop li.index-0, ul.front-articles-loop li.index-2{
		
	}
	ul.front-articles-loop li.index-0 .button-small, ul.front-articles-loop li.index-2 .button-small{
		float: right;
	}
	ul.front-articles-loop li.index-1, ul.front-articles-loop li.index-3{
		text-align: left;
	}
	ul.front-articles-loop li.index-1 .image, ul.front-articles-loop li.index-3 .image{
		float: right;
		margin:0 0 0 40px;
	}
	
	
/* Footer examples
================================================== */
	.examples-wrap{padding:20px 0;}
	.examples-wrap .title{font-size: 30px; margin-bottom: 40px; font-weight: bold;}
	.examples-wrap .title span{color: #999999; font-weight: 200;}
	ul.examples-loop{list-style: none; margin: 0; padding: 0;}
	ul.examples-loop li{
		padding: 0; 
		float: left; 
		width:310px; 
		height:200px; 
		overflow: hidden; 
		border:5px solid #eeeeee;
		margin-bottom: 15px;
	}
	ul.examples-loop li:hover{border: 5px solid #cccccc;}
	ul.examples-loop li.index-0, 
	ul.examples-loop li.index-1,
	ul.examples-loop li.index-3,
	ul.examples-loop li.index-4,
	ul.examples-loop li.index-6,
	ul.examples-loop li.index-7{
		margin-right: 15px;
	}
	ul.examples-loop li .image{}
	ul.examples-loop li .image img{width:100%; display: block;}
	
	
/* Features page
================================================== */
	.features-wrap .features-item{display: none; padding:0 0 40px 0;}
	.features-wrap .index-0{display: block;}
	.features-wrap .features-item .content{}
	.features-wrap .features-item .image{margin:20px 0 0 0;}
	.features-wrap .features-item .image img{width:100%;}
	
	
/* Footer
================================================== */
	.footer-wrap{		
		background: #f6f6f6 url('images/bg/brick_background_3.png') center top;
	}
	.footer{
		padding:50px 0 50px 0;
		/*height:490px;*/
	}
	body.da .footer{
		/*height:600px;*/
	}
	.footer .col{
		float: left;
		width: 33.3%;
	}
	
	.footer .index-1, .footer .index-2{}
	.footer .col h4{font-size: 26px; margin: 0 0 15px 0; font-weight: 200; color: #000; line-height: 120%;}
	.footer .col h4.border-top{border-top: 1px solid white; margin-top: 10px; padding-top: 10px;}
	.footer .col ul{list-style: none; margin: 10px 0; padding: 0;}
	.footer .col ul ul{margin: 0;}
	.footer .col ul li{}
	.footer .col ul li a{
		color: #5a8ebe; text-decoration: none;
		display: block;
		background: url('images/arrow-pink.png') no-repeat left 6px;
		padding: 0 0 0 15px;;
	}
	.footer .col ul li:hover > a{color: #000000;}

	.footer .index-1 .inner{margin-right: 20px;}
	.footer .index-3 .inner{margin-left: 20px;}

	.footer .index-3 ul{margin:-5px 0 0 0;}
	.footer .index-3 ul ul{display: none;}
	.footer .index-3 ul li a{
		font-size: 30px; line-height: 180%; color: #cccccc; text-transform: uppercase; text-align: right; 
		
		font-family: 'Open Sans Condensed', sans-serif;
		background-position: left 23px;
	}
	.footer .index-3 ul li:hover a, 
	.footer .index-3 ul li.current-menu-item a,
	.footer .index-3 ul li.parent-menu-item a{color: #fd147c;}
	
	.footer a.button{
		position: absolute;		
		right: 0;
		bottom: 75px;
	}
	.footer img.beaver{
		position: absolute;
		right:245px;
		bottom: 0;
	}
	
	.misc-pages{margin-top: 20px;}
	

/* Design templates
================================================== */
	body.designs .page-sub-title{font-size: 30px; margin:20px 0 40px 0; font-weight: 200;}
	.content-column .themes-category{display: none; padding:0 0 40px 0;}
	.content-column .themes-category_0{display: block;}
	.theme-wrap{width: 33%; float: left; position: relative;}
	.theme-wrap .inner{
		margin:0 0 70px 10px; 
		border:3px solid #eeeeee;
	}
	.theme-wrap.even .inner{margin:0 10px 50px 0;}
	.theme-wrap .image{
		/* height:170px; width:100%; overflow: hidden; */
		position: relative;
	}
	.theme-wrap .image img{width:100%; display:block; height:225px;}
	.theme-wrap .image img.lazy {display: none;}
	.theme-wrap .button-wrap{position: absolute; width:100%; height:100%;}
	.theme-wrap .button-small{margin:-43px 18px 0 0; float: right;}
	
/* Help tpl
================================================== */
	body.help .sidebar .button-small, body.faq .sidebar .button-small{font-size: 13px; margin:50px 0;}
	
	.support-footer{margin:10px 0 30px 0;}
	.support-footer .button{font-size: 18px; margin:45px 0 0 0; float: left;}
	.support-footer .tagline{float: right; text-align: right;}
	.support-footer .tagline .line-1{font-weight: 200; font-size: 60px; line-height: 150%; margin: 0;}	
	.support-footer .tagline .line-2{font-size: 32px; font-weight: bold;}
		body.de .support-footer .tagline .line-2{font-size: 20px;}
		body.en .support-footer .tagline .line-2{font-size: 22px;}
	
/* FAQ
================================================== */
	.faq-list{list-style: none; margin: 0 0 50px 0; padding: 0; font-size: 20px; font-weight: normal;}
	.faq-list li{margin-bottom: 5px; padding-bottom: 5px; border-bottom: 1px solid #eeeeee;}
	.faq-list li .title{margin: 0;}
	.faq-list li .title .answer{font-size: 20px; text-transform: uppercase;}
	.faq-list li .description{display: none; font-weight: normal; font-size: 14px; padding-bottom: 20px;}
	.faq-list li a.toggle{font-size: 12px;}
	

/* Site index
================================================== */
	ul.site-index-categories{list-style: none; margin: 0 0 50px 0; padding: 0; text-align: center;}
	ul.site-index-categories li{display: inline; margin-right: 25px; font-weight: 200;}
	ul.site-index-categories li a, .site-index-categories li a:visited{
		font-size: 30px; 
		text-decoration: none; 
		color: #fd147c; 
		text-transform: uppercase;
		line-height: 150%;
	}
	ul.site-index-categories li:hover a{color: #5a8ebe;}

	.site-index-category-wrap{margin: 20px 0 30px 0; background: #eeeeee; padding:20px;}
	.site-index-category-wrap h2{margin: 0;}
	.site-index-category{list-style: none; margin: 0; padding: 0;}
	.site-index-category li{float: left; margin-right: 10px; color: #999;}
	.site-index-category li a, .site-index-category li a:visited{color: #999; line-height: 30px; text-decoration: none;}
	.site-index-category li:hover a{color: #fd147c;}
		

/* Products
================================================== */
	body.products .page-content{line-height: 150%; font-size: 30px; text-transform: uppercase; text-align: center; margin:0 0 30px 0; font-weight: 200;}
	body.products .page-content p{margin: 0;}
	body.products .page-file {text-align:center;margin:0 auto;}
	body.products .page-file img{max-width:100%;}
	body.products .products-col{float: left; width:45%; padding:0 20px 0 0;}
	.products-wrap{margin:30px 0 30px 0; background: #eee; padding: 20px 30px 30px 30px;}
	body.products .categories{list-style: none; margin: 0; padding: 0;}
	body.products .categories li{}
	body.products .categories li h2{text-transform: uppercase; font-size: 26px;}
	body.products .categories li ul{}
	body.products .categories li .product-title{font-size: 16px; line-height: 150%; text-decoration: underline; cursor: pointer;}
	body.products .categories li .product-description{display: none; color: #999; margin:0 0 20px 0;}
	body.products .categories li .product-price{font-weight: bold;}
	

/* Animations
================================================== */
.fly-in-left{
	-webkit-animation-name: flyInLeft;
	-webkit-animation-duration: 1.5s;
	-webkit-animation-timing-function: ease-out;
	animation-name: flyInLeft;
	animation-duration: 1s;
	animation-timing-function: ease-out;
}
.fly-in-left-slow{
	-webkit-animation-name: flyInLeft;
	-webkit-animation-duration: 1.5s;
	-webkit-animation-timing-function: ease-out;
	-webkit-transition-delay: 2s;    
	animation-name: flyInLeft;
	animation-duration: 1.5s;
	animation-timing-function: ease-out;
	transition-delay: 1s;
}
.fly-in-right{
	-webkit-animation-name: flyInRight;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: ease-out;
	animation-name: flyInRight;
	animation-duration: 1s;
	animation-timing-function: ease-out;
}
.fade-in{
	zoom: 1;	
	-webkit-animation-name: fadeIn;
	-webkit-animation-duration: 1.5s;	
	animation-name: fadeIn;
	animation-duration: 2s;	
}

.fade-in-slow{
	zoom: 1;	
	-webkit-animation-name: fadeIn;
	-webkit-animation-duration: 3s;	
	animation-name: fadeIn;
	animation-duration: 2s;	
}

@-webkit-keyframes flyInLeft {
	0%{margin-left:-50px;}
    100%{margin-left:0;}
}
@keyframes flyInLeft {
    0%{margin-left:-50px;}
    100%{margin-left:0;}
}

@-webkit-keyframes flyInRight {
	0%{margin-left:20px;}
    100%{margin-left:0;}
}
@keyframes flyInRight {
    0%{margin-left:20px;}
    100%{margin-left:0;}
}

@-webkit-keyframes fadeIn {
	0%{filter: alpha(opacity=0); opacity: 0;}
    100%{filter: alpha(opacity=100); opacity: 1;}
}
@keyframes fadeIn {
    0%{filter: alpha(opacity=0); opacity: 0;}
    100%{filter: alpha(opacity=100); opacity: 1;}
}


/* Note: Design for a width 1024 Desktop */
@media only screen and (min-width: 960px) and (max-width: 1099px) {
	.container{ width: 960px; }
}

/* Note: Design for a width of 768px */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    .container{ width: 768px; }    
}

/* below 960 */
@media only screen and (max-width: 959px) {

	.mobile{display: block;}

	.header{height: auto;}	
	.header-nav, .quick-links, .language-select-wrap{display: none;}	
	.mobile-nav-toggle{display: block;}

	.main-message-wrap{height: 170px;}
	.main-message-wrap a.button, .main-message-wrap .counter{display: none;}
	body.front .main-message-wrap a.button, body.front .main-message-wrap .counter{display: block;}

	.main-message-wrap h1,
	body.front.sv .main-message-wrap h1,
	body.front.en .main-message-wrap h1,
	body.landing.de .main-message-wrap h1,
	body.en .main-message-wrap h1{font-size: 40px; text-align: center; top: 30px;}

	a.logo-link{text-align: center; display: block;}
	a.logo-link img{position: relative; top: 0; margin-top: 20px;}
	a.logo-overlay img{display: none;}

	.sidebar{display: none;}
	.content-column{width:100%; float: none; border-left: none;}
	.content-column > .inner{margin: 0}

	.features-wrap .features-item{display: block;}

	.theme-wrap{width: 33%; float: left;}
	.theme-wrap .inner{margin:0 0 50px 0;}	

	body.products .products-col{float: none; width:100%; padding: 0;}
	.products-wrap{margin:30px 0 30px 0; background: #fff; padding: 0;}

	.support-footer .button{font-size: 18px; margin:45px 0 0 0; float: left;}
	.support-footer .tagline{display: none;}
		
}

/*  #Mobile  */
/* Note: Design for a width of 320px */
@media only screen and (max-width: 767px) {
	
	.container { width: 300px; }

	h1{font-size: 30px;}

	body.front .main-message-wrap{height: 230px; background-position: center -160px;}
	body.front .main-message-wrap h1{font-size: 30px; top: 25px;}
	body.front .main-message-wrap h2{display: none; /*font-size: 20px; top: 30px;*/}
	body.front .main-message-wrap a.button{top: 90px;}
	body.front .main-message-wrap .counter{color: #fff; top: 160px;}

	.page-title{font-size: 30px; margin: 0;}

	ul.testimonials-loop li{width:100%; float: none;}
	ul.testimonials-loop li.index-0, ul.testimonials-loop li.index-1{border-right: none;}
	ul.testimonials-loop li.index-0 .inner, ul.testimonials-loop li.index-1 .inner, ul.testimonials-loop li.index-2 .inner{margin: 0;}	

	ul.front-articles-loop li{text-align: left; padding: 10px 0; margin: 10px 0;}
	ul.front-articles-loop li .image{float: none; margin: 0;}
	ul.front-articles-loop li .image img{width: 100%;}		
	ul.front-articles-loop li.index-1 .image, ul.front-articles-loop li.index-3 .image{float: none;	margin:0;}
	ul.front-articles-loop li .title,
	body.no ul.front-articles-loop li .title,
	body.de ul.front-articles-loop li .title{font-size: 30px; padding: 0;}	
	ul.front-articles-loop li .sub-title,
	body.en ul.front-articles-loop li .sub-title{font-size: 20px;}		
	ul.front-articles-loop li.index-1 .button-small, ul.front-articles-loop li.index-3 .button-small{float: right;}

	.theme-wrap{width: 100%; float: none;}

	.footer .col{float: none; width: 100%; padding-bottom: 20px;}
	.footer{padding-bottom: 250px;}
	.footer .index-1 .inner{margin-right: 0;}
	.footer .index-3 .inner{margin-left: 0;}
}

/* #Mobile (Landscape) */
/* Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    .container { width: 420px; }
}