/* CSS Document */

/* CSS Document */

.signin{
	width:100%;
	height:250px;
	position:relative;
}

.signin .email{
	position:absolute;
	top:0px;
	left:50px;
	font-size:24px;
}

.signin .password{
	position:absolute;
	left:50px;
	top:70px;
	font-size:24px;
}

.signin .password input, .signin .email input{
	font-size:24px;
	left:200px;
	position:absolute;
	width:700px;
}

.signin .email input{
	top:0px;
}

.signin input[type="submit"]{
	left:390px;
	top:140px;
	position:absolute;
}

.recover{
	width:100%;
	height:150px;
	position:relative;
}

.recover .email{
	position:absolute;
	top:0px;
	left:50px;
	font-size:24px;
}

.recover .email input{
	font-size:24px;
	left:200px;
	position:absolute;
	width:700px;
}

.recover input[type="submit"]{
	left:390px;
	top:80px;
	position:absolute;
}

.forgotten{
	position:absolute;
	top:220px;
	left:50px;
}

.new{
	position:absolute;
	top:220px;
	right:50px;
}

.new a{
	color:#000;
}

.fields{
	position:relative;
	font-size:16px;
	left:0px;
	margin-top:45px;
}

.field {
	margin-bottom:15px;
}

.address{
	height:210px;
	line-height:60px;
}

.fields input[type="submit"]{
	position:absolute;
	left:650px;
	top:260px;
}

.fields input[type="submit"][disabled="disabled"]
{
	background-color:#999;
	color:#CCC;
	box-shadow: 0px 0px 1px #666;
	
}

.email{
	position:absolute;
	left:520px;

}

.passwords{
	position:absolute;
	left:520px;
	top:80px;
}

#recoverPasswordButton{
	position:absolute;
	left:400px;
	top:75px;	
}

#tick{
	position:absolute;
	height:35px;
	right:29px;
	top:118px;
	display:none;
}

#quickmessage{
	position:absolute;
	height:35px;
	right:51px;
	top:252px;
	color:#F00;
}

input{
	background-color:#FFF;
	border:thin #999 solid;
	color:#3f3f40;
	font-size:24px;
	padding:10px;
	margin-top:-5px;
}



.box, .innterBox{
	width:90%;
	margin:auto;
	border:thin solid #000;
	margin-bottom:10px;
	padding:10px;
	position:relative;
}

.box h3{
	margin:0px;
	height: 40px;
	padding: 0px;
	font-size: 24px;
	font-weight:300;
	margin-top:10px;
}

.innterBox{
	width:300px;
	float:right;
}

#emailbox, #phonebox{
	position:absolute;
	top:15px;
	right:200px;
	font-size:24px;
}

#phonebox{
	top:75px;
}

#details{
	height:115px;
}


.editBox{
	position:absolute;
	top:10px;
	right:10px;
	width:100px;
}

.box .p25{
	width:224px;
	float:left;
	margin-right:10px;
}

.box .p25 .box{
	height:200px;
}

.box .p25 button{
	font-size:12px;
	width:196px;
	height:20px;
	margin-top:6px;
}

.selectedButton{
	background-color:#6cc4e2;
	box-shadow: 1px 1px 3px #CCC;
	color:#FFF;
}

.selectedButton:hover{
	box-shadow: 1px 1px 3px #CCC;
}

.newAddress{
	font-size:36px;
	text-align:center;

}

#addAddress{
	cursor:pointer;
	color:#6cc4e2;
}

#addAddress strong{
	font-size:100;
	font-weight:300;
	line-height:90px;
}

#updateAddr{
	top:31px;
}

.order{
	margin:10px;
	border:thin #000 solid;
	text-align:left;
}

.order p{
	text-align:left;
	margin-left:15px;
	margin-top:3px;
	margin-bottom:3px;
	padding:0px;
}

a .order p{
	font-weight:300;
	color:#3f3f40;
}

.order img{
	margin:10px;
	float:right;
	max-height:93px;
	max-width:150px;
}


.required1{color:#F00; position:absolute; left:435px; top: -20px;}
.required2{color:#F00; position:absolute; left:435px; top: 35px;}
.required3{color:#F00; position:absolute; left:435px; top: 92px;}
.required4{color:#F00; position:absolute; left:435px; top: 152px;}
.required5{color:#F00; position:absolute; left:435px; top: 210px;}
.required6{color:#F00; position:absolute; left:435px; top: 336px;}
.required7{color:#F00; position:absolute; left:435px; top: 391px;}
.required8{color:#F00; position:absolute; left:957px; top: -20px;}
.required9{color:#F00; position:absolute; left:738px; top: 340px;}

#forgottenButton{
	left: 90px;
	top: 135px;
	position: absolute;
	color:#F00;
}

#newButton{
	left: 690px;
	top: 135px;
	position: absolute;
	color:#090;
}

#signinButton{
	color:#6cc4e2;	
}


/*quick acount making page*/
input{
    background-color: #FFF;
    border: thin #999 solid;
    color: #3f3f40;
    font-size: 24px;
    padding: 10px;
    margin-top: -5px;
    float:right;
    width: 380px;
}

input[type="checkbox"]{
    width: 10px;
    float: none;
}

.float_left {
    width: 49%;
    float: left;
}

.float_right {
    width: 49%;
    float: right;
}

.pd-4{
    padding: 4px;
}

.label{
    padding-top:10px;
    float: left;
    height: 50px;
}

.field{
    width: 100%;
    clear: both;
}

.clear{
    clear: both;
}

.delivery_details, .signup{
    display: none;
}

#tick{
    display: none;
    float: left;
}

@media screen and (max-width: 1200px) {
	.recover .email input, .signin .password input, .signin .email input{width:500px;}
	.recover input[type="submit"], .signin input[type="submit"]{left:270px;}
	.fields input{width:250px;}
	.fields input[type="submit"], .email, .passwords{left:420px;}
	#quickmessage {right: -3px; top: 242px; width: 250px;}
	#tick{right: 67px; top: 210px;}
	#emailbox{top:70px; right:150px;}
	#phonebox{top:130px; right:150px;}
	#details{height:180px;}	
	#recoverPasswordButton{left:270px;}
	.required1, .required2, .required3, .required4, .required5, .required6, .required7{left:385px;}
	.required8{left:804px}
	.required9{left:510px; width:200px;}
	#forgottenButton{left: 540px;top: 135px;}
	#newButton{left: 0px;top: 135px;}
}



@media screen and (max-width: 850px) {
	.signin{height:470px;}
	.recover{height:250px;}
	.signin .email, .signin .password{width:100%; text-align:center; left:0px}
	.signin .password{top:100px;}
	.signin .password input, .signin .email input{width:440px; top:40px; left:20px;}
	.signin input[type="submit"]{left:40px; top:220px; width:400px;}
	.forgotten, .new{top:300px;}
	.passwords, .email{position:relative; top:0px; left:0px;}
	#quickmessage {top: 673px; left: 170px;}
	#tick{top:558px; right:4px;}
	.fields input[type="submit"] {position:relative; top:75px; left:125px;}
	.fields input {width: 300px;}
	.recover .email {left: 0px; width: 100%; text-align: center;}
	.recover .email input {left: 50px; width: 380px; top: 45px;}
	.recover input[type="submit"]{left: 115px; top: 110px;}
	#emailbox{top:0px; right:0px; position:relative;}
	#phonebox{top:0px; right:0px; position:relative;}
	#details{height:240px;}
	#details input{margin-top:10px; margin-bottom:10px;}
	.box .p25, .box .p25 button {width: 100%;}	
	.order img{float:none;	max-height:150px; max-width:400px;}
	#recoverPasswordButton{left:114px; top:117px;}
	.required1, .required2, .required3, .required4, .required5, .required6, .required7{left:435px;}
	.required8{left:435px; top:447px;}
	.required9{display:none;}
	#forgottenButton{left: 105px; top: 373px;}
	#newButton{left: 105px;top: 300px;}
        .float_left, .float_right{
            width: 100%;
            float: none;
        }
}