/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */

/* #Page Styles
================================================== */

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/

body {
	font-size: 16px;
	font-family: 'Open Sans', sans-serif;
	color:#3A3A3A;
}
h3 {
	font-family: 'Open Sans', sans-serif;
	font-weight: 800;
	color:#EC1280;
}
h3 span {
	color:#3A3A3A;
}

header {
	height: 80px;
}
.header-elements {
	margin-top: 16px;
}
.background {
	background-image: url('/images/products/dating/common/ui/background.jpg');
	height:700px;
	background-color: black
	width: 100%;
}

.picture-home {
	display: block;
	height: 300px;
	width: 300px;
}
.top-60 {
	margin-top: 60px;
}

.right {
	margin-top: -38px;
	display: inline-block;
	float: right;
	clear: both;
}
.action {
	float:left;
	text-align: right;

}
.login{
	display:inline-block;
	float:right;
	margin-left:10px;


}
.login button {
	background-color: #EC1280;
	border: none;
	text-shadow: none;
	color: white;
	font-weight: 400;
	font-size:14px;
}
.slogan {
	font-weight: bold;
	position: absolute;
	margin-left: 80px;
	margin-top:80px;
	width: 416px;
}
.slogan .find {
	font-weight: 800;
	padding:20px 40px;
	margin-right:40px;
	background-color: #EC1280;
	color: #ffffff;
	text-transform: uppercase;
	/*font-size:46px;*/
	font-size:42px;
	line-height: 50px;
}
.slogan .any {
	margin-left: 44px;
	margin-top:-4px;
	font-weight: bold;
	padding:20px 40px;
	background-color: #000000;
	color: #ffffff;
	font-size:28px;
	line-height: 32px;
}

/*FORM*/

.facebook button {
	background-color: #3B5998;
	border: none;
	text-shadow: none;
	color: white;
	font-weight: 400;
	font-size:14px;
	width: 400px;
	margin-left: 20px;
	margin-top: 20px;

}
.facebook button:hover {
	background-color: #224270;
}
#login_form {
	right:0;
	position: absolute;
	margin-top: 70px;
	background-color: #FFFFFF;
	width: 440px;
	/*height:550px;*/
	background:url('/images/products/dating/common/ui/bg-white-70.png');
}
/*#page-signin form, #page-forgot_password form {
    height:285px;
}*/
#page-signin #forgot_password_link, #page-forgot_password #signin_link {
    text-decoration:none;
    font-size:14px;
}
.left-hr {
	margin-left: 20px;
	position: absolute;

}
.right-hr {
	margin-right: 20px;
	position: absolute;
	right: 0;
	
}

.input-form {
	float:right;
}
.inline {
	display:inline-block;
}
.left-10 {
	margin-left: 20px;
}
.right-10 {
	margin-right: 20px;
}

.firstname  {
	display:inline-block;
	left: 0;
}


fieldset { overflow:hidden }
.some-class { float:left; clear:none; }
label { float:left; clear:none; display:block; padding: 0 0 0 0; }
input[type=radio], input.radio-btn { float:left; clear:none; margin: 0 0 0 0; }



.formtitle {
	text-align: center!important;
	margin-bottom: 20px;
	float:none;
}

label, legend {
	font-family: 'Open Sans', sans-serif;
	color:#3A3A3A;
	font-weight: 400;
	font-size: 14px;
}
hr {
border: solid rgba(0, 0, 0, 0.2);
border-width: 1px 0 0;
clear: both;
margin: 10px 0 30px;
height: 0;
}
.google-store {
position: absolute;
margin-top: -50px;
margin-left:162px;
display: block!important;
width:155px!important;
height:50px!important;
background:url('/images/products/dating/common/ui/store_google.png') 0 0 no-repeat;
}
.google-store:hover,.google-store:active,.google-store:focus{
  background-position:0px -50px;
}
.apple-store {
margin-left:10px;
display: block!important;
width:144px!important;
height:50px!important;
background:url('/images/products/dating/common/ui/store_apple.png') 0 0 no-repeat;
}
.apple-store:hover,.apple-store:active,.apple-store:focus{
  background-position:0px -50px;
}
.stores {
float:left;
cursor: pointer;

}
.stores img{
height:50px;
}

/*STYCKY FOOTER*/


* {margin:0;padding:0;} 

/* must declare 0 margins on everything, also for main layout components use padding, not 
vertical margins (top and bottom) to add spacing, else those margins get added to total height 
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body {
	font-family: "Open Sans",sans-serif;
	height: 100%;
}
#footer a {
	color:#EC1280!important;
	text-decoration: none;
}

#wrap {min-height: 100%;}

#main {
	overflow:auto;
	padding-bottom: 180px;}  /* must be same height as the footer */

#footer {
	/*position: relative;*/
	/*margin-top: -70px;*/ /* negative value of footer height */
	/*height: 70px;*/
	/*clear:both;*/
	background-color: #F4F4F4;
} 
#footer .container {
    
}
#footer .container:after {
    
}
/*Opera Fix*/
body:before {/
	content:"";
	height:100%;
	float:left;
	width:0;
	margin-top:-32767px;/* negate effect of float*/
}
#footer-social {
    float: right;
    /*margin-left: 10px;
    margin-top: 28px;*/
}

#footer-txt {
	font-size: 14px;
	/*display:block;
	position: absolute;
	margin-top: 28px;*/
}
#footer #footer_container {
    clear:both;
    padding-top:28px;
}

.left-column {
	width:120px;
	float:left;
}
.right-column {
	width:310px;
	float:right;
}
.right-column input{
	width:268px;
	padding:10px!important;
}
.label-height {
	height:54px;
	vertical-align: middle;
}
.input-height {
	vertical-align: middle;
}

.input-form input{
	width:272px;
}

.date-form {
	border: 1px solid #ccc;
	outline: none;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	float:right;
	position: absolute;
	right:20px;
	display:inline-block;
}
.year {
}
.month {
	margin-right: 98px;
}
.day {
	margin-right: 196px;
}
.day .sbHolder{
	z-index: 2;
}
.year .sbHolder{
	z-index: 2;
}
.month .sbHolder{
	z-index: 2;
}
.radio {
	margin-top:50px;
	margin-bottom:30px;
	z-index: 2;
	display:inline-block!important;
	padding-top: 10px;
	margin-right: 70px;
}
.radio-man{
	float:left;
	margin-right:20px;
}

.radio-man label {
	line-height: 24px;
	margin-right:10px;

}
.radio-woman{
	float:right!important;
}

.radio-woman label {
	line-height: 24px;
	margin-right:10px;
}
.margin-mail {
	display: block;
	height:28px;
}
.radio2 {
	z-index: 2;
	display:inline-block!important;
	margin-top: 0px;
}
.radius {
	-moz-border-radius: 3px;
	border-radius: 3px;
}
.pink-button {
	margin-right: 20px;
	background-color: #ec1280;
	text-shadow: none;
	border: none;
	color: #FFFFFF;
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size:14px;
	margin-top:0!important;
}
.pink-button:hover {
	background-color: #BF1070;
	text-shadow: none;
	border: none;
	color: #FFFFFF;
}
#birthday {
	margin-top: -4px;
}
.alpha {
	float:left!important;
}
.omega {
	float:right!important;
}
.alpha p, .omega p {
	margin-top: 20px;
	font-size: 21px;
	line-height: 24px;

}
.alpha h3, .omega h3 {
	margin-top: 20px;
	font-size: 36px;
	line-height: 38px;
}
.txt-home {
	margin-top: 50px;
}

.on-the-go {
	margin-top: 140px;
}
#couple-img img {
	margin-left:-300px;
	width:700px;
	position: absolute;
	overflow: none!important;
	padding-top: 123px;
}
	}
.Logo img {
	display: inline-block;
}
@media only screen and (max-width: 1400px) {


#couple-img img {
	margin-left:-160px;
	width:660px;
	position: absolute;
	overflow: none!important;
	padding-top: 157px;
}
}

@media only screen and (max-width: 960px) {
	#couple-img img {
		margin-left:-90px;
		width:60%!important;
		padding-top: 320px;
	}
.slogan {
	position: absolute;
	margin-left: -10px;
	margin-top:160px;
	width: 328px;

}
.slogan .find {
	font-weight: 800;
	padding:15px 30px;
	margin-right:40px;
	background-color: #EC1280;
	color: #ffffff;
	text-transform: uppercase;
	font-size:36px;
}
.slogan .any {
	margin-left: 44px;
	margin-top:-4px;
	font-weight: bold;
	padding:15px 30px;
	background-color: #000000;
	color: #ffffff;
	font-size:21px;

}
	.phones img{
		width: 90%!important;
		padding-top:70px;
	}
}
@media only screen and (max-width: 767px) {

#couple-img img {
		display: none;
	}
	.slogan {
	display: none;
}
}

@media only screen and (max-width: 768px) {

 	.anywhere-txt-position {}
	.anywhere-img-position {}
	.alpha {
		width: 80%!important;
		margin-left: 10%!important;
		margin-right: 10%!important;
		float:none!important;
	}
	.omega {
		width: 80%!important;
		margin-left: 10%!important;
		margin-right: 10%!important;
		float:none!important;
	}
	.alpha img, .omega img {
		margin:0!important;
		padding:0!important;
		margin-left:60px!important;
	}
	.phones img{
		width: 80%!important;
		margin-left: 10%!important;
		margin-right: 10%!important;
		margin-left: 0px!important;
	}

	.anywhere-txt-position{}
	.anywhere-timg-position{}
 }

@media only screen and (max-width: 479px) {

 	.anywhere-txt-position {}
	.anywhere-img-position {}
	.alpha {
		width: 90%!important;
		margin-left: 5%!important;
		margin-right: 5%!important;
		float:none!important;
	}
	.omega {
		width: 90%!important;
		margin-left: 5%!important;
		margin-right: 5%!important;
		float:none!important;
	}
	.alpha img, .omega img {
		margin:0!important;
		padding:0!important;
		margin-left:0px!important;
	}
		.phones{
	
		margin: 0px!important;
	}
	#login_form {
		margin-right: -23%;
	}
	.logo img{
		margin-top: 6px;
		width:110px!important;
	}
	.right {
	margin-top: -36px;
	}
	.phones img {
		width:98%;
		padding-left:20px!important;
		margin: 0px!important;
	}
	.stores .apple-store, .stores  .google-store {
		float: none!important;
	
	}
	.stores .apple-store {
		margin-left:-4px!important;
	}
	.stores .google-store {
		margin-top:-50px;
		margin-left:148px!important;

	}
	#footer p{
		font-size: 12px!important;
	}
 }
@media only screen and (min-width: 478px) and (max-width: 479px) {

 	.anywhere-txt-position {}
	.anywhere-img-position {}
	.alpha {
		width: 90%!important;
		margin-left: 5%!important;
		margin-right: 5%!important;
		float:none!important;
	}
	.omega {
		width: 90%!important;
		margin-left: 5%!important;
		margin-right: 5%!important;
		float:none!important;
	}
	.alpha img, .omega img {
		margin:0!important;
		padding:0!important;
		margin-left:0px!important;
	}
	.phones img{
		padding-left:20px!important;
		margin: 0px!important;
	}
	#form {
	
	}
 }
.facebook-btn-txt {
    color: #FFFFFF;
    text-decoration:none;
}
 /************************
  *  POPUP LOGIN-SIGNUP  *
  ************************/

#blanket {
    background-color: #FFFFFF;
    left: 0;
    opacity: 0.65;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 9001;
}

#login-popup-photo {
    background-color: white;
    box-shadow: 0 0 5px 5px #AAAAAA;
    height: 500px;
    position: absolute;
    text-align: center;
    width: 500px;
    z-index: 9002;
}

#login-popup-preview {
    background-color: white;
    box-shadow: 0 0 5px 5px #AAAAAA;
   /* height: 600px; */
    position: absolute;
    text-align: center;
    width: 500px;
    z-index: 9002;
}

.popup #popup-photo-close {
    position:relative;
    float:right;
    top: 5px;
    right: 5px;
    cursor: pointer;
}

.popup #popup-photo-title {
    margin-top: 20px;
    margin-bottom: 5px;
    font-size: 20px;
}

.popup table {
    width: 90%;
    margin: auto;
}


.popup-buttom-message {
    margin-left: 26px;
    margin-right: 26px;
    margin-top: 0px;
    margin-bottom: 10px;
    text-align: left;
}
#popup-buttom-message span {
    margin-left: 10px;
}

#conteneurFile {
    border: 0 none;
}

#conteneurFile .inputText {
    border: 1px solid #999999;
    padding: 6px;
    width: 65%;
}

#conteneurFile .inputFile {
    cursor: pointer;
    opacity: 0;
    position: relative;
    top: -50px;
    width: 100%;
}

#uploadphotoform #conteneurFile .inputFile {
    position: absolute;
    top:0px;
    left:0px;
}

.gray-button {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b3adb3), color-stop(1, #706e70) );
    background:-moz-linear-gradient( center top, #b3adb3 5%, #706e70 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3adb3', endColorstr='#706e70');
    background-color:#b3adb3;
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:2px;
    border:1px solid #dcdcdc;
    display:inline-block;
    color:#ffffff;
    font-weight: bold;
    font-family:Arial;
    font-size:15px;
    padding:8px 24px;
    text-decoration:none;
    text-shadow:0px 0px 0px #adadad;
}

.gray-button:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #706e70), color-stop(1, #b3adb3) );
    background:-moz-linear-gradient( center top, #706e70 5%, #b3adb3 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#706e70', endColorstr='#b3adb3');
    background-color:#706e70;
    text-decoration:none;
    cursor: pointer;
}
#popup-photo-preview {
    margin-bottom: 5px;
    margin-top: 5px;
    /*height:500px;
    /*max-height: 550px;
    width:450px; 
    /* width: 90%; */
}

/********************
 *    END POPUP     *
 ********************/

#photoform .pink-button {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff5bb0), color-stop(1, #ef027d) );
    background:-moz-linear-gradient( center top, #ff5bb0 5%, #ef027d 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bb0', endColorstr='#ef027d');
    background-color:#ff5bb0;
    -moz-border-radius:2px;
    -webkit-border-radius:2px;
    border-radius:2px;
    border: 1px solid #EE1EB5;
    color: #FFFFFF;
    display: inline-block;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    padding: 8px 24px;
    text-decoration: none;
    text-shadow: 1px 1px 0 #C70067;
}

#photoform .pink-button:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ef027d), color-stop(1, #ff5bb0) );
    background:-moz-linear-gradient( center top, #ef027d 5%, #ff5bb0 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ef027d', endColorstr='#ff5bb0');
    background-color:#ef027d;
    text-decoration:none;
    cursor: pointer;
}

#photoform .large80 {
    width: 80%;
}
#photoform span {
    font-size:13px;
    font-weight:normal;
}

#photoform span b {
    font-weight:bold;
}

#photoform fieldset {
    display:inline;
}

#photoform #previewPath {
    display:inline;
}
#page-signin #forgot_password_link {
    position:relative;
    top:10px;
}
.facebook-bottom {
    border: medium none;
    display: inline;
    height: 20px;
    margin-right: 10px;
    overflow: hidden;
    width: 80px;
}
.twitter-share-button {
    width: 85px !important;
}
.right .action .sbHolder {
    padding-right: 110px;
    margin-right: 30px;
    width: 76px;
}

.facebook-button {
    background-color: #3B5998;
    border: none;
    text-shadow: none;
    color: white;
    font-weight: 400;
    font-size:14px;
    width: 380px;
    margin-left: 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    line-height: normal;
    border-radius: 3px 3px 3px 3px;
    cursor: pointer;
    display: inline-block;
    padding: 10px;
    text-decoration: none;
    text-align:center;
    font-family: "HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif;
}
.facebook-button:hover {
    background-color: #224270;
}

.action .sbOptions{
	width: 154px;
	text-align: left!important;
	margin-left: 74px
}
.action .sbToggle{
	display: block;
	height: 34px;
	outline: none;
	position: absolute;
	right: 0;
	top: 1px;
	width: 30px;
	margin-right: -30px;
}
.action .sbOptions{
	width: 154px;
	text-align: left!important;
}