* {
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
    color: #16b1e9;
    font-weight: bold;
}

body {
    font-family: Helvetica, Arial, sans-serif;
	background-color: #156b8b;
}

img.download-button {
    width: 206px;
    height: 60px;
}

fieldset {
    border: none;
    padding: 10px 0 10px 0;
}

input:focus {
    outline-width: 0;
}

input.textfield {
    width: 280px;
    font-size: 16px;
    border-style: solid;
    border-width: 4px 4px 4px 4px;
    border-color: #16b1e9;
	background-color: #fff;
	font-color:#fff;
    padding: 5px 5px 5px 5px;
}

input.password {
    padding-left: 10px;
    width: 280px;
}

.v-center-container {
    display: table;
}

.v-center {
    display: table-cell;
    vertical-align: middle;
}

.action-button {
	font-family: Helvetica, Arial, sans-serif;
    cursor: pointer;
    margin-top: 10px;
    color: white;
    font-weight: bold;
    font-size: 21px;
    text-align: center;
    text-decoration: none;
    background-color: #ed217c;
    display: inline-block;
    padding: 10px 25px;
    border-width: 4px;
	width: 200px;
    border-style: solid;
    border-color: #231f20;
    behavior: url(PIE.htc);
}

.action-button:hover {
    border-color: #fff;
}

.action-button:active {
    background-color: #231f20;
    border-width: 4px;
}

.www-page {
    border-top: 10px solid #123644;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 14px;
    color: #3333332;
}

.www-page address {
    margin: 20px 0 0 0;
}

.www-page .container {
    width: 780px;
    margin: 0 auto;
}

.www-page .legal {
    padding-bottom: 15px;
}

.www-page .legal h1,
.www-page .legal h2,
.www-page .legal h3 {
    margin-top: 20px;
}

.www-page .legal ul {
    padding: 20px 0 0 20px; 
        margin-bottom: 20px;
}

.www-page .legal ul {
}

.www-page .legal li.major {
        padding-left: 5px;
        margin-bottom: 20px;
}


.www-page h1, .www-page h2, .www-page h3 {
    font-family: Helvetica, Arial, sans-serif;
    font-weight: bold;
}

.www-page h1 {
    font-size: 32px;
    margin: 0 0 10px 0;
}

.www-page h2 {
    font-size: 24px;
    margin: 30px 0 30px 0;
}

.www-page h2.separator {
    border-top: 1px solid #eeeeed;
    margin: 30px 0 0 0;
    padding: 15px 0 0 0;
}

.www-page p {
    margin: 20px 0 0 0;
    line-height: 24px;
}

.www-page nav {
    width: 160px;
    padding: 20px 0 0 0;
    float: left;
}

.www-page nav .logo {
    display: block;
    margin: 20px 0 20px 0;
}

.www-page nav ul {
    list-style: none;
}

.www-page nav ul li {
    margin: 0;
}

.www-page nav ul li a {
    padding: 0 0 14px 20px;
    font-weight: normal;
    display: block;
    color: #999996;
    width: 70px;
}

.www-page nav ul li a:hover {
    color: #333332;
}

.www-page nav.blog ul li a.blog, .www-page nav.help ul li a.help, .www-page nav.jobs ul li a.jobs {
    color: #333332;
    font-weight: bold;
}

.www-page #content {
    padding: 40px 0 40px 0;
    width: 620px;
    float: left
}

footer {
    clear: left;
    display: block;
    text-align: center;
    padding: 20px 0 20px 0;
    height: 20px;
}

.teaser-page footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    background: #fff;
    outline: 5px solid #123644;
}

.www-page footer p, .teaser-page footer p {
    float: left;
    margin: 0;
    position: relative;
    top: -3px;
    color: #999996;
}

.teaser-page footer p {
    top: 0;
    padding-left: 20px;
}

footer ul {
    float: right;
    list-style: none;
}

.teaser-page footer ul {
    padding-right: 20px;
}

footer ul li {
    float: left;
    padding: 0 0 0 20px;
}

footer ul li a {
    font-weight: normal;
    color: #999996;
}

footer ul li a:hover {
    color: #333332;
}

/* Password reset page */

.reset-page {
    background: #F1F1EC;
    font-size: 14px;
    color: #878585;
}

.reset-page .outer {
    display: table; 
    position: absolute; 
    height: 100%; 
    width: 100%;
}

.reset-page .middle {
    display: table-cell; 
    vertical-align: middle;
}

.reset-page .inner {
    width: 660px;
    vertical-align: middle;
    margin: 0 auto 0 auto;
}

.reset-page .logo {
    width: 300px;
    float: left;
    border-right: 1px solid #D7D6D1;
    height: 100px;
    vertical-align: middle;
}

.reset-page .logo img {
    width: 220px;
    height: auto;
    position: relative;
}

.reset-page .form {
    width: 300px;
    float: left;
    border-left: 1px solid #fff;
    height: 350px;
    padding: 0 0 0 65px;
    display: table;
}

.reset-page .submit-reset-password {
    width: 200px;
    padding: 5px 25px;
}

.reset-page h1 {
    font-weight: 600;
    font-size: 24px;
    color: #878585;
}

.reset-page h1.success {
    background: url('/images/confirmed-checkmark.png') no-repeat 0 50%;
	background-size: 75px 75px;
	font-size: 16px;
    padding: 20px 50px 20px 90px;
}

.reset-page form {
    margin-top: 10px;
}

.reset-page .error {
    color: #ed2182;
}

/* Teaser page */

.teaser-page {
    margin: 0;
    text-align: center;
}

    .teaser-page .inner {
        font-size:24px;
        text-align: center;
        color: #fff;
        font-weight: 300;
        -webkit-font-smoothing: antialiased;
    }

.teaser-page .outer {
    display: table; 
    position: absolute; 
    height: 100%; 
    width: 100%;
}

.teaser-page .middle {
    display: table-cell; 
    vertical-align: middle;
}

.teaser-page .inner {
	margin-top:-100px;
}

.teaser-page .inner p {
    padding: 0px 20px 0 20px;
	
    margin: 30px 15px 0 15px;
	
}

/* Photo page */

.photo-page {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 16px;
    color: #3333332;
}

.photo-page .outer {
	text-align:center;
	width: 100%;
	float:center;
}

.photo-page .middle {
	width: 100%;
	text-align:center;
}

.photo-page div #imageContainer {
	background: url('/images/spinner.gif') no-repeat 50% 50%;
	position: relative;
	margin: 10px auto;
	width:280px;
	height:280px;
	border: 4px solid #231f20;
	background-color: #000;
}

.photo-page #sourceImage {
	width:280px;
	height:280px;
	opacity:0;
	-webkit-transition: opacity 0.35s ease-in;
	-moz-transition: opacity 0.35s ease-in;
	-o-transition: opacity 0.35s ease-in;
}

.photo-page #copyImage {
	position:absolute;
	top:0;
	left:0;
	width:280px;
	height:280px;
	opacity:0;
	-webkit-transition: opacity 0.35s ease-in;
	-moz-transition: opacity 0.35s ease-in;
	-o-transition: opacity 0.35s ease-in;
}

.photo-page #copyClose {
	position:absolute;
	top:-4px;
	right:-4px;
	width:40px;
	height:40px;
	opacity:0;
	-webkit-transition: opacity 0.35s ease-in;
	-moz-transition: opacity 0.35s ease-in;
	-o-transition: opacity 0.35s ease-in;
}

.photo-page #sourceImage.fade-out, .photo-page #copyImage.fade-out, .photo-page #copyClose.fade-out { opacity:0; }
        
.photo-page #sourceImage.fade-in, .photo-page #copyImage.fade-in, .photo-page #copyClose.fade-in { opacity:1; }

.photo-page #sourceImage.fade-dim, .photo-page #copyImage.fade-dim, .photo-page #copyClose.fade-dim { opacity:0.5; }


.photo-page img.thumb {
	margin-top:0;
	margin-left:9px;
	margin-right:0;
	margin-bottom:9px;
	width:82px;
	height:82px;
	border: 4px solid #231f20;
	display:inline-block;
	float:left;
}

.photo-page div.thumbs {
	width:305px;
	margin: 10px auto;
	margin-bottom:250px;
	padding-bottom:100px;
}

.photo-page footer {
	clear: left;
    display: block;
    position: fixed;
    bottom: 0;
    width: 100%;
    background: #231f20;
    outline: 5px solid #ed2182;
	font-size:12px;
    text-align: center;
    padding: 8px 0 4px 0;
    height: 20px;
}

.photo-page footer div {
    top: 0;
	color: #999996;
	display:inline-block;
}

.photo-page footer div img {
    margin-top: -4px;
	margin-right: 3px;
}

.photo-page p {
    top-margin: 10px;
	color: #999996;
	line-height:20px;
}

.photo-page span.username {
	color: #231f20;
	font-weight:bold;
}
.photo-page span.points {
	color: #ed2182;
	font-weight:bold;
}
.photo-page span.pointsLabel {
	color: #ed2182;
	font-size:12px;
	font-weight:normal;
}
.photo-page span.date {
	color: #878585;
	font-size:12px;
	font-weight:normal;
}
.photo-page span.divider {
	color: #878585;
	font-weight:bold;
}

/* High resolution displays */
@media only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
  
    input.password {
        background: #fff;
        background-size: 11px 15px;
    }

    .reset-page h1.success {
	    background: url('/images/confirmed-checkmark.png') no-repeat 0 50%;
        background-size: 100px 100px;
    }

}   

/* Mobile devices */
@media screen and (max-width: 767px) {

	.photo-page p {
	    top-margin: 2px;
	}

	.photo-page div #imageContainer {
		background: url('/images/spinner.gif') no-repeat 50% 50%;
		left:50%;
		margin-left:-90px;
		width:180px;
		height:180px;
		border: 4px solid #231f20;
		background-color: #000;
	}
	
	.photo-page #sourceImage {
		width:180px;
		height:180px;
		opacity:0;
	}

	.photo-page #copyImage {
		position:absolute;
		top:0;
		left:0;
		width:180px;
		height:180px;
		opacity:0;
	}
	
	.photo-page div.thumbs {
		width:180px;
		margin-bottom:80px;
	}
	
	.photo-page img.thumb {
		width:42px;
		height:42px;
	}

    .hide-mobile {
        display: none;
    }

    .www-page .container {
        width: auto;
        margin: 0 auto;
        padding: 0 15px 0 15px;
    }

    .www-page h1 {
        font-size: 32px;
        margin: 0 0 10px 0;
    }

    .www-page h2 {
        font-size: 24px;
        margin: 30px 0 30px 0;
    }

    .www-page p {
        margin: 20px 0 0 0;
    }

    .www-page nav {
        width: auto;
        padding: 20px 0 0 0;
        float: none;
    }

    .www-page nav .logo {
        display: block;
        margin: 0;
        float: left;
    }

    .www-page nav .logo img {
        width: 80px;
        height: 80px;
    }

    .www-page nav ul {
        display: block;
        padding: 30px 0 0 0;
        float: right;
    }

    .www-page nav ul li {
        float: left;
        padding: 0 0 0 15px;
        margin: 0;
    }

    .www-page nav ul li a {
        padding: 0;
        display: block;
        width: auto;
    }

    .www-page #content {
        padding: 60px 0 40px 0;
        clear: right;
        width: auto;
        float: none;
    }

    .www-page footer p {
        float: center;
        margin: 0 0 3px 0;
    }

    .teaser-page footer {
		height:50px;
		font-size:14px;
    }

    .teaser-page footer p {
		margin: 15px 0 0 0;
        text-align:center;
		float:center;
    }

    .www-page footer {
        height: 44px;
    }

    footer ul {
        float: none;
        list-style: none;
        display: inline-block;
    }

    footer ul li {
        float: left;
        padding: 0 8px 0 8px;
    }

    .teaser-page .outer {
        background-position:center;
        background-size: cover;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
    }

    .teaser-page footer p {
        top: 0;
        padding-left: 0;
    }


    .teaser-page footer ul {
        padding-right: 0;
    }

    .v-center-container {
        display: block;
    }

    .v-center {
        display: block;
        vertical-align: auto;
    }

    .reset-page {
        background: #F1F1EC;
        font-size: 14px;
        color: #807F7D;
    }

    .reset-page .outer {
        display: block;
        width: 100%;
        height: auto;
    }

    .reset-page .middle {
        display: block;
        width: 100%;
        height: auto;
    }

    .reset-page .inner {
        display: block;
        width: 100%;
        height: auto;
    }

    .reset-page .logo {
        width: auto;
        float: none;
        border-right: none;
        border-bottom: 1px solid #D7D6D1;
        height: auto;
        display: block;
        text-align: center;
        padding: 20px 0 20px 0;
    }

    .reset-page .logo img {
        display: inline-block;
        width: 100px;
        height: auto;
        position: auto;
        top: auto;
    }

    .reset-page .form {
        width: auto;
        height: auto;
        float: none;
        border-left: none;
        border-top: 1px solid #fff;
        padding: 20px;
        display: block;
        text-align: center;
    }

    .reset-page h1.success {
	    background: url('/images/confirmed-checkmark.png') no-repeat 50% 0;
		background-size:40px 40px;
        padding: 50px 0px 20px 0px;
		top-margin:100px;
		text-align:center;
        position: relative;
    }
    
    .teaser-page .inner {
        text-align: center;
        font-size: 24px;
        color: #fff;
        font-weight: 300;
        -webkit-font-smoothing: antialiased;
    }

    .not-found-page .inner {
        width: auto;
    }

    .teaser-page img {
        width: 300px;
        height: 100px;
    }

    .not-found-page img {
        width: 240px;
        height: 240px;
    }

    .not-found-page.card img {
        height: 200px;
        width: 200px;
    }

    .teaser-page .inner p {
        padding: 0;
        margin: 15px 15px 0 15px;
        font-size: 24px;
    }

    .not-found-page {
        background-image: none;
        background-color: #e3e3df;
        background-size: 100%;
    }

    .not-found-page.card {}

    .not-found-page .outer {
        background-image:none;
    }

    .not-found-page .inner {
        color: #b0b0ab;
        font-size: 3em;
        font-weight: 400;
    }

    .not-found-page.card .inner {
        padding-bottom: 0;
    }

	input.password {
	    text-align:center;
	}
	
    .action-button {
        font-size: 14px;
        padding: 5px 22px 6px 22px;
    }

    img.download-button {
        width: 146px;
        height: 43px;
    }
}

html { 
  background: url(/images/dd-bg.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}