/*

My Custom CSS
=============

Author:  Aleksander Gora

*/


/* --------------------------------------
   Layout
   -------------------------------------- */
@import url(https://fonts.googleapis.com/css?family=Oswald:400,300,700);
html, body {
        height: 100%;
        width: 100%;
        padding: 0;
        margin: 0;
		background-color:#cacaca;
      }
body{
	/*overflow-y: scroll!important;*/
}

#wrapper {
	width:100%;
	height:100%;
	overflow-y: scroll!important;
}

#container {
	width:950px;
	background-color:#FFF;
	margin:auto
}

#product {
	background-color:#fff;
	margin:auto;
	float:left;
}

#register_form {
	background-color:#fff;
	margin:auto;
	margin-top:52px;
}

#form_gray {
	background-color:#f5f5f5;
	width:326px;
	height:442px;
	margin:auto;
	margin-top:-10px;
}
#form_white {
	background-color:#fff;
	width:311px;
	height:372px;
	margin:auto;
	
}

.form_reg {
	padding: 0px 20px 0px 20px;
}

.footer_cell {
	text-align:center;
	padding:20px;
	background-color:#cacaca;
	color:#7b7b7b;
}

#loadingp, #loading {margin-left: 5px; visibility:hidden;}
#error, #errorp{
	font-size: 12px!important;
	width: 100%!important;
	background-color: #FFEBE8;
    border: 1px solid #DD3C10;
	padding:5px;
    margin-top: 2px;
	margin-bottom: 10px;
	text-align:center;
	position:relative;
	visibility:hidden;
	}

/* --------------------------------------
   Typography
   -------------------------------------- */

body {
	-webkit-font-smothing: antialiased;
	text-rendering: optimizelegibility;
	height:100%;
}

h2 {
	font-family:'Oswald';
	color:#f79d08;
	margin-top:0px;
	padding:5px;
}

.footer {
	font-size:13px;
}

p {
	margin-top:-10px;
	font-size:12px;
	color:#666;
	text-align:center;
}


/* --------------------------------------
   Navbar
   -------------------------------------- */
#searchInput {
	width: 200px;
}
.navbar-brand {
		padding: 13px 15px;
}
   
   
/* --------------------------------------
   Carousel
   -------------------------------------- */
#myCarousel .item { height: 328px; }

#slide1 {
	background: url('../../images/carousel_large_01.jpg') top center no-repeat;
}

#slide2 {
	background: url('../../images/carousel_large_02.jpg') top center no-repeat;
}

#slide3 {
	background: url('../../images/carousel_large_03.jpg') top center no-repeat;
}

#slide4 {
	background: url('../../images/carousel_large_04.jpg') top center no-repeat;
}



/* --------------------------------------
   Global Styles
   -------------------------------------- */
.well {
	margin: 20px 0;
}
.alert {
	margin-top: 20px;	
	display:none;
}


.tabbable img.thumbnail {
	margin: 0 20px 10px 0;
}

.sticker {
	position: relative; 
	left: 264px; 
	top: 0px; 
	z-index: 1;
	width: 95px;
}

.logo {
	margin-top:10px;
}

#button {
	background-color:#e620a9;
	border:0px;
	margin: auto;
    display: block;
}

#button:hover {
	background-color:#b00b7d;
	border:0px;
}

input#button 
{
	padding:20px 25px;
	font-size:24px;
}

#button2 {
	margin-left:75px;
	background-color:#e620a9;
	border:0px;
}

#button2:hover {
	margin-left:75px;
	background-color:#b00b7d;
	border:0px;
}

input#button2 
{
	padding:20px 25px;
	font-size:24px;
}

#button3 {
	margin-left:75px;
	background-color:#e620a9;
	border:0px;
}

#button3:hover {
	margin-left:75px;
	background-color:#b00b7d;
	border:0px;
}

input#button3 
{
	padding:20px 25px;
	font-size:24px;
}

#sex {
	display:inline-block;
	margin-top:2px;
	margin-left:45px;	
}

.radio2 {
	position: relative; 
	height:30px;
}

/* --------------------------------------
   Media Queries
   -------------------------------------- */

/* Portrait & landscape phone */
@media (max-width: 650px) {
	
	
#wrapper {
	width:100%;
	height:100%;
	background-color:#cacaca;
	margin:auto;
}

#container {
	width:400px!important;
	background-color:#FFF;
	margin:auto;
}

#product {
	background-color:#fff;
	margin:auto;
	float:none!important; 
}

#register_form {
	background-color:#fff;
	margin:auto;
	margin-top:0px;
	
		
}

#form_gray {
	background-color:#f5f5f5;
	width:326px;
	height:442px;
	margin:auto;
	margin-top:-85px;
	margin-bottom:30px;

}
#form_white {
	background-color:#fff;
	width:311px;
	height:372px;
	margin:auto;
	text-align: center;
}

.top_icone {
	display:none;
}


.logo {
	margin-top:20px;
	width:330px;
	height:62px;
}

.steps {
	display:none;
}
	
#myCarousel .item { height: 220px; }

#slide1 {
	background: url('../../images/carousel_small_01.jpg') top center no-repeat;
}

#slide2 {
	background: url('../../images/carousel_small_02.jpg') top center no-repeat;
}

#slide3 {
	background: url('../../images/carousel_small_03.jpg') top center no-repeat;
}

#slide4 {
	background: url('../../images/carousel_small_04.jpg') top center no-repeat;
}

.carousel-caption {
	font-size:14px;
}

.carousel-caption h4 {
	font-size:24px;
}

#button {
	margin-left:0px;
	background-color:#e620a9;
	border:0px;
}

#button:hover {
	margin-left:0px;
	background-color:#b00b7d;
	border:0px;
}

input#button 
{
	padding:20px 25px;
	font-size:24px;
}

#button2 {
	margin-left:0px;
	background-color:#e620a9;
	border:0px;
}

#button2:hover {
	margin-left:0px;
	background-color:#b00b7d;
	border:0px;
}

input#button2 
{
	padding:20px 25px;
	font-size:24px;
}

#button3 {
	margin-left:0px;
	background-color:#e620a9;
	border:0px;
}

#button3:hover {
	margin-left:0px;
	background-color:#b00b7d;
	border:0px;
}

input#button3 
{
	padding:20px 25px;
	font-size:24px;
}

#sex {
	display:inline-block;
	margin-top:2px;
	margin-left:5px;	
}

.step {
	display:none;
}

	

}

/* Landscape phone to portrait tablet */
@media (max-width: 949px) {
	
#wrapper {
	width:100%;
	height:100%;
	background-color:#cacaca;
	margin:auto;
}

#container {
	width:768px;
	background-color:#FFF;
	margin:auto;
}

#product {
	background-color:#fff;
	margin:auto;
	float:left; 
}

#register_form {
	background-color:#fff;
	margin:auto;
	margin-top:0px;
	
		
}

#form_gray {
	background-color:#f5f5f5;
	width:326px;
	height:442px;
	margin:auto;
	margin-top:0px;
	margin-bottom:30px;

}
#form_white {
	background-color:#fff;
	width:311px;
	height:372px;
	margin:auto;
}

.top_icone {
	display:none;
}


.logo {
	margin-top:20px;
	width:330px;
	height:62px;
}

.steps {
	display:none;
}
	
#myCarousel .item { height: 220px; }

#slide1 {
	background: url('../../images/carousel_small_01.jpg') top center no-repeat;
}

#slide2 {
	background: url('../../images/carousel_small_02.jpg') top center no-repeat;
}

#slide3 {
	background: url('../../images/carousel_small_03.jpg') top center no-repeat;
}

#slide4 {
	background: url('../../images/carousel_small_04.jpg') top center no-repeat;
}

.carousel-caption {
	font-size:14px;
}

.carousel-caption h4 {
	font-size:24px;
}

.step {
	display:none;
}
	
}

/* Large desktop */
@media (min-width: 1200px) {	
}

/***********/
/* loading */
/***********/

div#loading {
	display:none;
	position: fixed;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
	z-index: 1000;
	background-color: rgb(255, 255, 255);
	zoom: 1;
	filter: alpha(opacity=65);
	opacity: 0.65;
}

div#loading .container{	
	width:100px;
    height:100px;
    position:absolute;
    top:50%;
    left:50%;
    margin:-50px 0 0 -50px; /* [-(height/2)px 0 0 -(width/2)px] */
    padding:0;
    text-align:center;
}

div#loading .container img{
	width:90px;
	height:90px;
}

iframe{
	border: none;
}

label {
display: block !important;
text-align: left !important;
}
.fb-login-button {
    display: inline-block;
    border-radius: 4px;
    padding: 5px 20px;
    color: #FFF;
    background: #4c69ba;
    background: -webkit-gradient(linear, center top, center bottom, from(#4c69ba), to(#3b55a0));
    background: -webkit-linear-gradient(#4c69ba, #3b55a0);
    border-color: #4c69ba;
    cursor: pointer;
}

.fb-login-button img{
    width: 24px;
    margin-right: 5px;
}
.line-wrapper {
	margin-top: 16px;
	text-align: center;
	line-height: 0.5;
}

.line-wrapper  span.line-text{
	color: #676767;
    font-size: 16px;
    text-transform: uppercase;
    display: inline-block;
    position: relative;
}

.line-wrapper span.line-text:before, .line-wrapper span.line-text:after {
    content: "";
    position: absolute;
    height: 5px;
    border-top: 1px solid #d3d4d2;
    top: 5px;
    width: 105px;
}

.line-wrapper span.line-text:before {
    right: 100%;
    margin-right: 20px;
}

.line-wrapper span.line-text:after {
    left: 100%;
    margin-left: 20px;
}