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

/* font face settings */
@font-face {font-family: 'DesignosaurRegular';src: url('designosaur-regular-webfont.eot');src: local('☺'), url('designosaur-regular-webfont.woff') format('woff'), url('designosaur-regular-webfont.ttf') format('truetype');font-weight: normal;font-style: normal;}

h1, h2, h3, h4, h5, h6, .button {
	font-family:Arial, Helvetica, sans-serif;
}
/* -- */

/* default elements */
body, html {
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	background:url(../images/bg-body.jpg) repeat;
	color:#FFF;
}
a:link {
	color: #FFF;
}
a:visited {
	color: #FFF;
}
}
strong {
	font-weight:bold;
	color: #FFF;
}
em {font-style:italic;}
.align-center {text-align:center;}
.float-left {float:left;}
.float-right {float:right;}
h1, h1 a, h2, h2 a, h4, h4 a, h5, h5 a, {font-size:17px;color:#cecece;}
h6, h6 a {
	font-size:18px;
	color:#FFF;
	float: right;
	line-height: 120px;
}
h3, h3 a {
	font-size:18px;
	color:#FFF;
	float: none;
	line-height: 20px;
}
p {
	font-size:16px;
	line-height:18px;
	padding:20px 0 20px 0;
	color:#cecece;
}
/* -- */

/* additional elements */
#page {width:980px;margin:10px auto;background:#414141;border:1px solid #232323;}

.frame {padding:35px;}

.separator {border-top:1px solid #4e4e4e;}
/* -- */

/* rounding of elements */
.rounded {border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;position:relative;}
/* -- */

/* buttons */
.button {display:inline-block;height:39px;line-height:39px;font-size:18px;padding:0 28px;border:5px solid #595a5b;}
.button.grey {background:url(../images/buttons/grey.png) repeat-x 0 0;color:#838383;}
.button.dark-grey {background:url(../images/buttons/dark-grey.png) repeat-x 0 0;color:#838383;}
.button.black {background:url(../images/buttons/black.png) repeat-x 0 0;color:#fff;}
.button.yellow {background:url(../images/buttons/yellow.png) repeat-x 0 0;color:#d67e00;}
.button.green {background:url(../images/buttons/green.png) repeat-x 0 0;color:#658332;}
.button.steel {background:url(../images/buttons/steel.png) repeat-x 0 0;color:#6e808e;}
.button.dark-steel {background:url(../images/buttons/dark-steel.png) repeat-x 0 0;color:#4e5b65;}
.button.blue {background:url(../images/buttons/blue.png) repeat-x 0 0;color:#43a1c5;}
.button.red {background:url(../images/buttons/red.png) repeat-x 0 0;color:#fff;}
.button.orange {background:url(../images/buttons/orange.png) repeat-x 0 0;color:#d65100;}

.button:hover {background-position:0 -39px;}
.button.rounded {border-radius:25px;-moz-border-radius:25px;-webkit-border-radius:25px;}
/* -- */

/* top structure */
#top {background:#414141;border-bottom:7px solid #5b5b5b;}
#top .frame {padding:20px;}
#top h1 {float:left;font-size:12px;color:#bebebe;}
#top h1 a {color:#bebebe;}
#top h1 img {margin:0 20px 3px 0;}
#top h3 {
	float:right;
	line-height:120px;
	color:#cecece;
}
#top h3 a {color:#cecece;}
/* -- */

/* middle structure and rotators */
#middle {background:#4a4a4a;border-bottom:1px solid #414141;border-top:1px solid #6d6d6d;}
#middle .frame {padding:35px 35px 15px 35px;}
#middle h2 {font-size:32px;padding:10px 0 20px 0;line-height:40px;}
#rotator {background:url(../images/rotator-bg.png) no-repeat bottom center;padding:0 0 40px 0;position:relative;}
#rotator .inner {background:#525252;padding:5px;border-bottom:1px solid #3e3e3e;}

#rotator.iphone {background:url(../images/iphone.png) no-repeat top left;width:528px;height:397px;padding:0;margin:0 0 -50px 35px;}
#rotator.iphone .inner {background:none;border:0;padding:0;position:absolute;top:65px;left:180px;z-index:100;}
#rotator.iphone .glare {background:url(../images/iphone-glare.png) no-repeat top left;width:66px;height:177px;position:absolute;top:0;right:0;z-index:200;}

#rotator.ipad {background:url(../images/ipad.png) no-repeat top left;width:547px;height:404px;margin:-25px 0 -85px -15px;}
#rotator.ipad .inner {background:none;border:0;padding:0;position:absolute;top:42px;left:84px;z-index:100;}
#rotator.ipad .glare {background:url(../images/ipad-glare.png) no-repeat top left;width:165px;height:356px;position:absolute;top:-32px;right:-29px;z-index:200;}
/* -- */

#container {border-top:1px solid #4d4d4d;}
#container h3 {
	padding:0 0 0 180px;
}

/* column system structure */
.column-140 {width:140px;}
.column-160 {width:160px;}
.column-200 {width:200px;}
.column-280 {width:280px;}
.column-350 {width:350px;}
.column-380 {width:380px;}
.column-460 {width:460px;}
.column-500 {width:500px;}
.column-530 {width:530px;}
/* -- */

/* list elements with icons */
.list-elements-icons {}
.list-elements-icons li {
	width:600px;
	height:120px;
	padding:20px 0 20px 70px;
	position:relative;
	float:left;
	margin:0 50px 0 0;
}
.list-elements-icons li img {
	position:absolute;
	top:20px;
	left:20px;
	width: 200px;
	height: 123px;
}
.list-elements-icons li:nth-child(3n) {margin-right:0;}
.list-elements-icons li p {
	padding:0 0 0 180px;
}
.list-elements-icons .remove {margin-right:0;}
/* -- */

/* list elements with arrows */
.list-elements-arrows {margin-top:-10px;}
.list-elements-arrows li {line-height:34px;background:url(../images/arrow.png) no-repeat 0 10px;padding:0 0 0 20px;border-top:1px solid #4d4d4d;}
.list-elements-arrows li:first-child {border-top:0;}
.list-elements-arrows li.remove {border-top:0;}
.list-elements-arrows li a {color:#dd8c5c;}
/* -- */

/* list of screenshots */
.list-screenshots {}
.list-screenshots li {float:left;margin:0 15px 15px 0;background:url(../images/screenshot-shadow.png) no-repeat bottom center;padding:0 0 20px 0;}
.list-screenshots li:nth-child(4n) {margin-right:0;}
.list-screenshots li.remove {margin-right:0;}
.list-screenshots li a {display:block;position:relative;background:#515151;padding:4px;border-bottom:1px solid #373737;}
.list-screenshots li .hover {background:url(../images/screenshot-hover.png) no-repeat top left;height:127px;width:207px;z-index:50;position:absolute;top:4px;left:4px;display:none;}
/* -- */

/* testimonials */
blockquote {padding:5px 0 20px 0;}
blockquote p.quote {font-size:18px;line-height:25px;text-align:center;padding:30px;background:#525252;border:1px solid #5e5e5e;color:#8c8c8c;}
blockquote p.author {background:url(../images/quote-author.png) no-repeat top left;padding:10px 0 0 28px;margin:-1px 0 0 15px;position:relative;}
blockquote p.author em {color:#bebebe;}
/* -- */

/* bottom */
#bottom {background:url(../images/bottom-bg.jpg) repeat;border-top:1px solid #303030;}
#bottom .frame {padding:25px 20px 15px 20px;background:url(../images/bottom-frame.png) no-repeat top center;}
#bottom .box p {padding:20px 0;color:#8c8c8c;}
#bottom .box.float-left {padding:0 30px 0 0;}
/* -- */

/* footer */
#footer {padding:0 20px;background:#222;}
#footer p {line-height:54px;padding:0;float:left;}
#footer p a {color:#dd8c5c;}
#footer .social {float:right;line-height:50px;}
#footer .social li {display:inline;padding:0 0 0 2px;}
#footer .social a {opacity:0.7;}
#footer .social a:hover {opacity:1;}
/* -- */