/* STYLE CSS BY 7CIEL AGENCY */
@font-face {
	font-family: "Futura";
	src: url('/font/Futura.otf');
}

@media (orientation: portrait) {
	body {
		background-color: #000000;
	}
}
/*
h1 {
	margin-top: 350px;
	color: #ffffff;
	text-shadow: 2px 2px #8d8d8d;
}*/

input[type="submit"] {
    width: 425px;
    margin-bottom: 35px;
    height: 75px;
    background-color: #ffffff;
    font-family: Futura;
    font-size: 30px;
    opacity: 0.7;
}

input[type="submit"]:hover {
	background-color: #000000;
	color: #ffffff;
}

a {
	color: #ffffff;
}

input.submit-Q2 {
    width: 425px;
    margin-bottom: 35px;
    height: 70px;
    background-color: #876f4c;
    font-family: Futura;
    font-size: 30px;
    opacity: 0.7;	
    margin-left: 50px;
    border: none;
    color: #ffffff;
}

input.submit-Q3 {
    width: 425px;
    margin-bottom: 35px;
    height: 70px;
    background-color: #3c3c3b;
    font-family: Futura;
    font-size: 22px;
    opacity: 0.7;	
    margin-left: 25px;
    color: #ffffff;
}

input.submit-Q4 {
    width: 425px;
    margin-bottom: 35px;
    height: 70px;
    background-color: #3c3c3b;
    font-family: Futura;
    font-size: 22px;
    opacity: 0.7;	
    margin-left: 75px;
    color: #ffffff;
}

.accueil {
	font-family:Futura;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back1.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.home-title {
	margin-top: 42%;
	font-size: 55px;
	text-shadow: 2px 2px #696969;
    letter-spacing: 3px;
    margin-bottom: 5%;
    font-weight: lighter;
    font-variant: small-caps;
}

.btn-home {
    border: solid 2px #ffffff;
    padding: 20px;
    font-size: 26px;
    text-decoration: none;
}

/*QUESTION ONE*/

.Q1 {
	font-family:Futura;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back-Q1.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.h1-Q1 {
    margin-top: 4%;
    margin-bottom: 10%;
    color: #ffffff;
    letter-spacing: 3px;
    font-weight: lighter;
    font-size: 34px;
    font-variant: small-caps;
}

a.a-Q1 {
    color: #000000;
    text-decoration: none;

}
/*
.a-btn-Q1 {
    width: 425px;
    margin-bottom: 35px;
    height: 75px;
    background-color: #ffffff;
    font-family: Futura;
    font-size: 30px;
    opacity: 0.7;
}*/

.p-btn-Q1 {
    width: 375px;
    background-color: #ffffff;
    font-family: Futura;
    font-variant: small-caps;
    font-size: 30px;
    opacity: 0.7;
    color: #000000;
    margin-right: auto;
    margin-left: auto;
    padding: 20px;
    font-weight: lighter;
}
/*QUESTION TWO*/

.Q2 {
	font-family:Futura;
    font-variant: small-caps;
	background-color: #000000;
	background-image:url(../img/back-Q2.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.h1-Q2 {
    text-align: center;
    margin-top: 0%;
    margin-bottom: 12%;
    color: #ffffff;
    /*letter-spacing: 1px;*/
    font-weight: lighter;
    font-variant: small-caps;
    font-size: 34px;
}

.a-btn-Q2 {
	text-decoration: none;
}

.p-btn-Q2 {
	padding: 20px;
    width: 330px;
    background-color: #876f4c;
    font-family: Futura;
    font-size: 30px;
    opacity: 0.7;	
    margin-left: 7%;
    border: none;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
}
/*QUESTION TREE*/

.Q3 {
	font-family:Futura;
    font-variant: small-caps;
	background-color: #000000;
	background-image:url(../img/back-Q3.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.h1-Q3 {
    text-align: center;
    margin-top: -1%;
    margin-bottom: 13%;
    color: #000000;
    font-weight: lighter;
    font-variant: small-caps;
    font-size: 34px;
    /*letter-spacing: 1px;*/
}

.a-btn-Q3 {
	text-decoration: none;
}

.p-btn-Q3 {
	padding: 20px;
    width: 310px;
    background-color: #3c3c3b;
    font-family: Futura;
    font-size: 30px;
    opacity: 0.7;	
    margin-left: 8%;
    color: #ffffff;
    text-align: center;
    color: #ffffff;
}
/*QUESTION FOR*/

.Q4 {
	font-family:Futura;
    font-variant: small-caps;
	background-color: #000000;
	background-image:url(../img/back-Q4.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
	color: #ffffff;
}

.h1-Q4 {
	text-align: center;
    margin-top: 0%;
    margin-bottom: 11%;
    font-weight: lighter;
    font-size: 34px;
}

.a-btn-Q4 {
	text-decoration: none;
}

.p-btn-Q4 {
	padding: 20px;
	text-align: center;
    width: 310px;
    margin-bottom: 35px;
    background-color: #3c3c3b;
    font-family: Futura;
    font-size: 30px;
    opacity: 0.7;	
    margin-left: 8%;
    color: #ffffff;
}

.p-btn-Q4-b {
    padding: 20px;
    text-align: center;
    width: 310px;
    margin-bottom: 35px;
    background-color: #3c3c3b;
    font-family: Futura;
    font-size: 26px;
    opacity: 0.7;   
    margin-left: 8%;
    color: #ffffff;
}
/*RESPONSE ICON*/

.icon {
	font-family:Futura;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back-R1.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.icon-info {
	font-family:Futura;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back-R1-info.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.icon-info-b {
	font-family:Futura;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back-R1-info-b.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.div-R1 {
	float: right;
	margin-right: 7%;
	margin-top: 0;
}

.h1-r1 {
	margin: 0;
}

.div-R1-info {
    float: left;
    margin-top: -1%;
    margin-left: -2%;
    margin-right: 40%;
}

.R1-next {
	margin-top: 3%;
	margin-bottom: 4%;
}

a.next-page {
    color: black;
    border: solid 1px #000000;
    font-size: 20px;
    text-decoration: none;
    padding: 10px;
    margin-top: 10%;
}

.div2-R1-info {
	float: right;
	margin-top: 1%;
    margin-right: 3%;
}

.div2-R2-info {
    float: right;
    margin-top: 6%;
    margin-right: 3%;
}

.div3-R1-info {
	float: right;
	margin-right: 1%;
	margin-top: -3%;
}

.div3-R2-info {
    float: right;
    margin-right: 1%;
    margin-top: -3%;
}



.div-icon-info-b {
    text-align: left;
    background-color: #ffffff;
    width: 33%;
    padding: 35px;
    float: right;
    font-size:18px;
    margin-right: 5%;
    margin-top: 20%;
}
/*RESPONSE ICON ABSOLUTE*/

.absolute {
	font-family:Futura;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back-R2.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.absolute-info {
	font-family:Futura;
    font-weight: lighter;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back-R2-info.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.absolute-info-b {
	font-family:Futura;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back-R2-info-b.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.div-absolute-info-b {
    text-align: left;
    background-color: #ffffff;
    width: 36%;
    padding: 35px;
    float: right;
    margin-right: 8%;
    margin-top: 4%;
}

.div-R2 {
	float: right;
	margin-right: 6%;
	margin-top: 2%;
	line-height: 25px;
}

.div-R2-info {
    float: left;
    margin-top: -1%;
    margin-left: -2%;
    margin-right: 40%;
}

.R2-next {
    margin-top: 4%;
}

.h1-R2 {
	margin-top: 0;
}

.a-btn-R2 {
	text-decoration: none;
}

p.btn-R2 {
    margin-top: 145%;
    border: solid 1px #000000;
    text-align: center;
    padding: 15px;
    width: 210px;
    margin-left: auto;
    margin-right: auto;
    color: #000000;
}
/*RESPONSE ICON ELITE*/

.elite {
	font-family:Futura;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back-R3.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.elite-info {
	font-family:Futura;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back-R3-info.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.elite-info-b {
	font-family:Futura;
	text-align: center;
	background-color: #000000;
	background-image:url(../img/back-R3-info-b.jpg);
	background-attachment:fixed;
	background-repeat: no-repeat;
	background-size: cover;
}

.div-elite-info-b {
    text-align: left;
    background-color: #ffffff;
    width: 35%;
    padding: 35px;
    float: right;
    margin-right: 5%;
    margin-top: 20%;
}

.div-R3 {
	float: right;
	margin-right: 2%;
	margin-top: 4%;
	line-height: 25px;
}

.div-R3-info {
    float: left;
    margin-top: -2%;
    margin-left: -2%;
    margin-right: 40%;
}

.div2-R3-info {
    float: right;
    margin-top: 7%;
    margin-right: 3%;
}

.div3-R3-info {
    float: right;
    margin-right: 1%;
    margin-top: -1%;
}

.R3-next {
    margin-top: 4%;
}

.a-btn-R3 {
	text-decoration: none;
}


.info-section-1 {
	text-align: left;
	margin-bottom: 48%;
}

.info-section-2 {
    text-align: left;
    margin-bottom: 30%;
}

.info-section-3 {
    text-align: left;
    margin-bottom: 32%;
}
/*
.info-section-3 {
	text-align: left;
	margin-bottom: 30%;
}*/

.info-section-absolute-1 {
	text-align: left;
	margin-bottom: 65%;
}

.info-section-absolute-2 {
    text-align: left;
    margin-bottom: 65%;
}

.info-section-absolute-3 {
    text-align: left;
    margin-bottom: 106px;
}

.info-elite-section-1 {
    text-align: left;
    margin-bottom: 60%;
}

.info-elite-section-2 {
    text-align: left;
    margin-bottom: 60%;
}

.info-elite-section-3 {
    text-align: left;
    margin-bottom: 0%;
}

p.p-info {
    line-height: 3px;
    font-size: 18px;
    /*margin-top: 15%;*/
}

p.p-info-absolute {
    line-height: 3px;
    font-size: 18px;
    margin-top: 15%;
}

p.p-title-info1 {
	border: solid 2px #a3a3a2;
	font-weight: lighter;
	font-size: 24px;
    padding: 10px;
    margin-top: 35%;
    width: 160px;
}

p.p-title-info2 {
	border: solid 2px #a3a3a2;
	font-size: 24px;
    padding: 10px;
    margin-top: 50%;
}

p.p-title-info3 {
	border: solid 2px #a3a3a2;
	font-size: 24px;
    padding: 10px;
    margin-top: 50%;
}

h1.h1-info {
    margin-top: -20px;
    margin-bottom: 0px;
    font-size: 45px;
    font-weight: lighter;
}

h2.h2-info {
    /*border: solid 1px #575756;*/
    width: 390px;
    margin-left: auto;
    padding: 15px;
    margin-top: -6%;
    margin-right: auto;
    font-weight: lighter;
}

footer {
    position: absolute;
    bottom: 0;
    line-height: 8px;
    color: #ffffff;
    width: 100%;
}

footer.middle {
	margin-bottom: 25px;
}

.h1-r {
    margin-top: 0;
    font-weight: lighter;
}

.h2-r {
    margin-bottom: 0;
    font-weight: lighter;
}

.p-r {
    margin: 0;
}

.btn-r {
    margin-top: 131%;
    border: solid 1px #000000;
    text-align: center;
    padding: 15px;
    width: 200px;
    margin-left: auto;
    margin-right: auto;
    color: #000000;
}

.btn-r3 {
    margin-top: 105%;
    border: solid 1px #000000;
    text-align: center;
    padding: 15px;
    width: 200px;
    margin-left: auto;
    margin-right: auto;
    color: #000000;
}