@font-face
{
font-family: ubuntu-regular;
src: url(fonts/Ubuntu-Regular.ttf);
}

{margin:0;padding:0;} 

html,body {
	margin: 0;
	padding: 0;
	height: 100%;
	color: #000000;
}

body {
	text-align: center;
	font-family: Helvetica, Verdana, Tahoma, Arial;
	background-color: #ffffff;
}

#wrap {
	min-height: 100%;
}


#container {
/*	min-width: 880px;*/
	min-height: 100%;
	position: relative;	
}

/* *********************************************************
 *
 *  HEADER
 *
 ******************************************************** */
#headerContainer{
	text-align:center;
}

#header {
	padding-top: 20pt;
	width: 550pt;
	margin-left: auto;
	margin-right: auto;
	
	color: #000000;
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
      font-weight: 300;
}

#logoImg {
	height:115px;
	vertical-align: middle;
}

h1, h2, h3 {
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
    font-weight: 300;
	padding: 0;
	margin: 0;
}

#header h1 {
	font-family: "ubuntu-regular";
}

#header h1 a {
	color: #d5254e;
}

#header h3 {
	color: #d5254e;
}

h3 {
	font-size: 1.4em;
	font-style: italic;
	text-align: center;
}

h2 {
	font-size: 2.5em;
}

#headerTitle {
	cursor: pointer;
	text-decoration: none;
}


/* *********************************************************
 *
 *  CONTENT
 *
 ******************************************************** */

#content {
	overflow:auto;
	height: auto;
	margin-top: 40pt;
	padding-bottom: 30pt; /*Height of Footer for stickyness*/
	font-family: Helvetica, Verdana, Arial;
	width: 650pt;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}

#video {
	padding-top: 20pt;
	padding-bottom: 40pt;
	text-align:center;
	height: 350px;
	width: 600px;
	background-color:#1c1c1c;
}

.feature {
	clear:both;
	height: 550px;
	overflow: auto;
	margin-bottom:40pt;
}

.featureImage {
	height: 100%;
	vertical-align: middle;
}

.featureText h4 {
	margin-bottom:-10px;
}

.featureText {
	vertical-align: middle;
    display: inline-block;
	width:320pt;
	text-align:left;
}

.featureR h2 {
	text-align:right;
}

.featureText ul {
	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
	font-weight: 300;
	list-style: none;
	padding-left: 0;
}

.featureL .featureText {
	padding-left:30pt;
}

.featureR .featureText {
	padding-right: 30pt;
	text-align:right;
}

.featureCenter {
	height:300px;
	text-align:center;
}

#goToTop {
	clear:both;
	text-align:right;
	padding-top:0pt;
}

#clearAll {
	clear:both;
	padding-top:10pt;
}

.bottomInfo {
	text-align:center;
}

#appStore {
	background: transparent;
	width: 450pt;
	margin-left: auto;
	margin-right: auto;
	padding-top:70pt;
	color: #000000;
}


#appStoreBadge {
	text-align:center;
	line-height:2em;
	padding-left:40pt;
}


.inlineVerticalCentered {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

/* *********************************************************
 *
 *  FOOTER
 *
 ******************************************************** */
#footerContainer{
	/*sticky footer support*/
	position:relative;
	height:64pt;
	margin-top:-30pt;
	clear:both;
	
	background-color:#d5254e;
	border-top-style:solid;
	border-width:1pt;
	border-color: #3e3e3e;
	text-align:left;
}

#footer {
	width: 550pt;
	margin-left: auto;
	margin-right: auto;	
	color: #ffffff;
}

#footer ul {
	margin: 0;
	padding: 15pt 0pt 10pt 0pt;
	list-style-type: none;
	text-align: center;
}

#footer ul li {
	display: inline-block;
}

#footer ul li a {
	padding: .2em 0.8em;
	text-decoration: none;
}

#footer li a:hover {
	text-decoration: underline;
}

#copyr {
	font-size: 0.8em;
	text-align:center;
	clear:both;
}

#footer .emailee {
	color:#000000;
}


/* *********************************************************
 *
 *  MISC
 *
 ******************************************************** */

.alignleft      { float: left; }
.aligncenter    { display: block; margin: 0 auto; }
.alignright     { float: right; }

a:visited {
	color: #ffffff;
}

a {
	color: #ffffff;
}

a:hover {
	text-decoration: none;
}

p > a {
	color: #000000;
}

p {
	color: #000000;
}

img{
  width:100%
  max-width:100%;
}


.emailee {
	color:#ffffff;
}

#imprintContent {
	text-align:left;
}

.smallText {
	font-size: 0.8em;
	padding-top: 10pt;
}

/* *********************************************************
 *
 *  FEATURE SLIDESHOW
 *
 ******************************************************** */

#feature-slideshow {
	height:600px;
}

div#slideshow-fetaureText.featureText {
	padding-top:40pt;
}

#slideshow-wrap {
    display: inline-block;
    height: 550px;
    width: 260px;#homenav li a {background-size:57px 57px;}
    margin: auto;
    position: relative;
	background-image: url(images/iPhone-frame.png);
	float:left;	
}

#slideshow-inner {
    width: 221px;
    height: 393px;
    background-color: rgb(0,0,0);
    overflow: hidden;
    position: absolute;
	margin: 76px 0px 0px 21px;
}

#slideshow-inner>ul {
    list-style: none;
    height: 100%;
    width: 600%;
    overflow: hidden;
    position: relative;
    left: 0px;				
    -webkit-transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
    -moz-transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
    transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);

	-webkit-margin-before:0em;
	-webkit-padding-start:0em;
	-moz-padding-start:0em;
	-moz-margin-before:0em;
	-moz-margin-after: 0em;
}

#slideshow-inner>ul>li {
    width: 221px;
    height: 393px;
    float: left;
    position: relative;
}

#slideshow-inner>ul>li>img {
    margin: auto;
    height: 100%;
}

#slideshow-wrap input[type=radio] {
    position: absolute;
    left: 50%;
    bottom: 15px;
    z-index: 100;
    visibility: hidden;
}

#slideshow-wrap label {
    position: absolute;
    left: 50%;
    bottom: -30px;
    z-index: 100;
    width: 12px;
    height: 12px;
    background-color: rgba(200,200,200,1);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    cursor: pointer;
    -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,.8);
    -moz-box-shadow: 0px 0px 3px rgba(0,0,0,.8);
    box-shadow: 0px 0px 3px rgba(0,0,0,.8);
    -webkit-transition: background-color .2s;
    -moz-transition: background-color .2s;
    -o-transition: background-color .2s;
    transition: background-color .2s;
}

#slideshow-wrap input[type=radio]#button-1:checked~label[for=button-1] { background-color: rgba(100,100,100,1) }

#slideshow-wrap input[type=radio]#button-2:checked~label[for=button-2] { background-color: rgba(100,100,100,1) }

#slideshow-wrap input[type=radio]#button-3:checked~label[for=button-3] { background-color: rgba(100,100,100,1) }

#slideshow-wrap input[type=radio]#button-4:checked~label[for=button-4] { background-color: rgba(100,100,100,1) }

#slideshow-wrap input[type=radio]#button-5:checked~label[for=button-5] { background-color: rgba(100,100,100,1) }

#slideshow-wrap input[type=radio]#button-6:checked~label[for=button-6] { background-color: rgba(100,100,100,1) }

#slideshow-wrap label[for=button-1] { margin-left: -45px }

#slideshow-wrap label[for=button-2] { margin-left: -27px }

#slideshow-wrap label[for=button-3] { margin-left: -9px }

#slideshow-wrap label[for=button-4] { margin-left: 9px }

#slideshow-wrap label[for=button-5] { margin-left: 27px }

#slideshow-wrap label[for=button-6] { margin-left: 45px }

#slideshow-wrap input[type=radio]#button-1:checked~#slideshow-inner>ul { left: 0 }

#slideshow-wrap input[type=radio]#button-2:checked~#slideshow-inner>ul { left: -100% }

#slideshow-wrap input[type=radio]#button-3:checked~#slideshow-inner>ul { left: -200% }

#slideshow-wrap input[type=radio]#button-4:checked~#slideshow-inner>ul { left: -300% }

#slideshow-wrap input[type=radio]#button-5:checked~#slideshow-inner>ul { left: -400% }

#slideshow-wrap input[type=radio]#button-6:checked~#slideshow-inner>ul { left: -500% }

@media all and (-webkit-min-device-pixel-ratio: 2) {
    #slideshow-wrap {
		background-image:url(images/iPhone-frame@2x.png);
		background-size:260px 550px;
	}
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
    only screen and (-o-min-device-pixel-ratio: 3/2),
    only screen and (min--moz-device-pixel-ratio: 1.5),
    only screen and (min-device-pixel-ratio: 1.5) {
        #slideshow-wrap {
			background-image:url(images/iPhone-frame@2x.png);
			background-size:260px 550px;
		}
}