2014-11-12 14:11:15 +01:00

381 lines
4.1 KiB
SCSS

@import "shared/formtastic";
// Core variables and mixins
@import "bootstrap/bootstrap";
@import "superslides";
.info{
padding:1em;
background:#e10716;
color:white;
p{
max-width:1000px;
text-align:left;
}
a{
color:white;
}
}
a{
color:rgba(0,136,204,1);
}
.slider{
width:2000px;
height:300px;
overflow:hidden;
position:relative;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
li{
position:relative;
h3{
position:absolute;
bottom:110px;
right:30px;
font-weight:400;
font-size:2em;
text-transform:uppercase;
color:black;
padding:10px 20px;
background:rgba(250,250,250,0.95);
margin:0;
}
p{
position:absolute;
bottom:50px;
right:30px;
font-weight:400;
font-size:1.3em;
margin:0;
color:rgba(128,128,128,1);
padding:10px 20px;
background:rgba(250,250,250,0.95);
}
}
#logo-miele{
position:absolute;
bottom:25px;
left:40px;
width:100px;
z-index:2;
margin:0;
}
}
#logo-miele{
width:100px;
float:right;
margin:30px 50px;
}
.wide-container {
width: 100%;
height: 100%;
margin: 0 auto;
position:absolute;
.slides-pagination{
position:absolute;
right:40px;
bottom:20px;
width:auto;
a{
&.current{background:rgba(250,250,250,0.95);}
border-color:rgba(250,250,250,0.95);
}
}
}
#logo-home{
position:absolute;
top:0;
right:0;
width:400px;
z-index:2;
}
#slider-bottom{
position:absolute;
bottom:0;
left:0;
width:300px;
z-index:2;
}
#logo{
height:90px;
margin-top:10px;
float:left;
margin-left:10px;
}
#nav-container{
background:rgba(10,10,10,1);
//box-shadow: 0px 0px 6px rgba(0,0,0,0.7);
position:relative;
clear:both;
#nav{
padding-left:12px;
text-align:right;
a{
color:rgba(250,250,250,0.7);
padding:13px 12px;
display:inline-block;
font-size:16px;
//text-transform : uppercase;
}
}
&.accueil{
height:20px;
#nav{
text-align:right;
padding-right:12px;
a{
}
}
}
}
.header{
padding:1px 0;
height:150px;
background:rgba(30,30,30,1)
}
body{
width:100%;
font-weight:300;
height:100%;
margin : 0px;
padding : 0px;
font-family:"Lato";
font-size:16px;
color:rgba(62,62,62,1);
//background:rgba(230,230,230,1);
}
img{
max-width:100%;
}
h1, h2, h3, h4, h5{
font-weight:400;
text-align:left;
line-height:1em;
margin: 10px 0;
}
$ratio : 1.4;
h6{
font-size: 1em;
}
h5{
font-size: 1em;
}
h4{
font-size: 1em;
}
h3{
font-size: 1.4em;
text-align:center;
max-width:720px;
margin:auto;
}
h2{
font-size: 1.7em;
text-align:center;
margin-bottom:0.62em;
}
h1{
font-size: 2em;
}
p{
max-width:700px;
margin:auto;
text-align:center;
margin-bottom:1em;
}
h2{
text-align:center;
}
#miele{
background:white;
text-align:center;
padding:2em 1em;
img{
width:150px;
}
}
.clear{
clear:both;
}
#perfect{
background:url('/miele-background.jpg') no-repeat ;
background-size:cover;
padding:8em 1em;
text-align:center;
h2{
background:rgba(250,250,250,0.9);
display:inline-block;
padding:0.5em 1em;
}
span{
background:rgba(250,250,250,0.9);
line-height:2.7em;
padding:0.5em;
}
}
#environement,#fournisseur, #societe, #design, #contact, #miele{
padding:4em 1em;
}
#environement{
background:url('/environement.jpg') no-repeat;
background-size:cover;
padding:8em 1em;
text-align:center;
h2{
background:rgba(250,250,250,0.9);
display:inline-block;
padding:0.5em 1em;
}
span{
background:rgba(250,250,250,0.9);
line-height:2.7em;
padding:0.5em;
}
}
#design{
background:url('/design.jpg') no-repeat 0px ;
background-size:cover;
padding:8em 1em;
text-align:center;
h2{
background:rgba(250,250,250,0.9);
display:inline-block;
padding:0.5em 1em;
}
span{
background:rgba(250,250,250,0.9);
line-height:2.7em;
padding:0.5em;
}
}
#societe, #contact{
h3{
margin-bottom:1em;
line-height:1.62em;
}
}
#legals{
background:rgba(55,55,54,1);
color:white;
p{
max-width:3000px !important;
padding:1em;
}
}
.contact_form{
width:900px;
margin:auto;
margin:1em auto;
padding:2em 0;
#form{
h3, p{
text-align:left;
}
}
.label{
width:120px;
float:left;
}
input{
width:450px;
float: right;
}
.btn{
width:auto;
background:rgba(225,7,22,1);
color:white;
float:left;
}
}