726 lines
11 KiB
SCSS
726 lines
11 KiB
SCSS
|
|
|
|
$main-color : #010101;
|
|
$font1 : "Helvetica", "Helvetica Neue", Arial, sans-serif;
|
|
$font2:"Helvetica", "Helvetica Neue", Arial, sans-serif;
|
|
|
|
$font_title : "Helvetica", "Helvetica Neue", Arial, sans-serif;
|
|
|
|
|
|
|
|
html, body, section, nav, article, aside, h1, h2, h3, h4, h5, h6, hgroup, header, footer, address, p, hr, pre, blockquote, ol, ul, li, dl, dt, dd, figure, figcaption, div, a, em, strong, small, s, cite, q, dfn, abbr, time, code, var, samp, kbd, sub, sup, i, b, mark, span, br, ins, del, img, iframe, embed, object, video audio, canvas, map, area, table, caption, colgroup, tbody, thead, tfoot, tr, td, th, form, fieldset, legend, label, input, button, select, textarea, details, summary, command, menu {
|
|
font-size: 100%;
|
|
font-style: normal;
|
|
text-align: left;
|
|
text-decoration: none;
|
|
vertical-align: baseline;
|
|
background: transparent;
|
|
margin: 0;
|
|
outline: 0;
|
|
border: 0 none;
|
|
padding: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
#wrapper {
|
|
width: 100%;
|
|
|
|
|
|
|
|
overflow: hidden;
|
|
}
|
|
#carousel img {
|
|
|
|
border: none;
|
|
display: block;
|
|
max-width:100%;
|
|
margin: 0px 10px;
|
|
float: left;
|
|
|
|
}
|
|
|
|
|
|
|
|
body {
|
|
padding:10px;
|
|
|
|
color: ($main-color*40);
|
|
font: 0.9em / 1 $font1;
|
|
-webkit-font-smoothing: antialiased;
|
|
text-rendering: optimizeLegibility; }
|
|
|
|
pre, select, input, textarea, button {
|
|
color: ($main-color*40);
|
|
font: 300 1em / 1 $font1;
|
|
-webkit-font-smoothing: antialiased;
|
|
text-rendering: optimizeLegibility; }
|
|
|
|
h1 {
|
|
color: ($main-color*30);
|
|
font: 300 2.5em / 1 $font_title;
|
|
letter-spacing: 0.05em;
|
|
word-wrap: break-word;
|
|
margin: 0.8em 0 0.6em; }
|
|
|
|
|
|
|
|
h2 {
|
|
|
|
font: 300 1.8em / 1 $font_title;
|
|
letter-spacing: 0;
|
|
margin: 1.3333em 0 0;
|
|
padding: 0.3333em 0; }
|
|
|
|
|
|
h3 {
|
|
color: ($main-color*30);
|
|
font: 400 1.125em / 1.333 $font_title;
|
|
margin: 1em 0 0;
|
|
border-top: 0 none; }
|
|
|
|
h4 {
|
|
color: ($main-color*40);
|
|
font: 600 1em / 1 $font2;
|
|
margin: 1.5em 0 0; }
|
|
|
|
h5 {
|
|
color: ($main-color*50);
|
|
font: 600 0.875em / 1.143 $font_title;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.1429em;
|
|
margin: 1.7143em 0 0; }
|
|
|
|
h6 {
|
|
color: ($main-color*60);
|
|
font: 600 0.875em / 1.143 $font_title;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.1429em;
|
|
margin: 1.7143em 0 0;
|
|
}
|
|
|
|
|
|
|
|
|
|
p, pre, blockquote, ul, ol, dl, figure, figcaption, table, fieldset {
|
|
font-size: 1em;
|
|
line-height: 1.5;
|
|
margin: 0.5em 0; }
|
|
|
|
hr {
|
|
font: 600 2em / 1 $font2;
|
|
text-align: center;
|
|
margin: 1em 0 2em;
|
|
border: 0;
|
|
padding: 0;
|
|
height: 0;
|
|
clear: both;
|
|
display: block;
|
|
&::after {
|
|
content: "···";
|
|
color: ($main-color*150);
|
|
letter-spacing: 1em;
|
|
padding-left: 1em;
|
|
height: 0; } }
|
|
|
|
pre {
|
|
margin: 0.5em 0 0.5em 1.5em;
|
|
white-space: pre;
|
|
white-space: pre-wrap;
|
|
white-space: pre-line;
|
|
word-wrap: break-word; }
|
|
|
|
blockquote {
|
|
color: ($main-color*60);
|
|
font: 300 0.938em / 1.6 $font2;
|
|
border-left: 4px solid ($main-color*235);
|
|
margin: 1.0667em 0 1.6em;
|
|
padding: 0 1.6em 0 1.334em; }
|
|
|
|
blockquote p {
|
|
line-height: 1.6;
|
|
margin: 0.5333em 0; }
|
|
|
|
|
|
|
|
ul li {
|
|
list-style-type: square;
|
|
margin-left: 1.5em; }
|
|
|
|
ul li ul li {
|
|
list-style-type: circle; }
|
|
|
|
ol li {
|
|
list-style-type: decimal;
|
|
margin-left: 1.5em; }
|
|
|
|
li {
|
|
ul li, ol li {
|
|
margin: 0 0 0 1.5em; } }
|
|
|
|
dt {
|
|
font: 600 1em / 1.5 $font2; }
|
|
|
|
dd {
|
|
padding: 0 1.5em 0; }
|
|
|
|
dd>* {
|
|
margin-top: 0; }
|
|
|
|
|
|
|
|
p+figure {
|
|
margin: 1em 0 2em; }
|
|
|
|
|
|
|
|
|
|
figure{
|
|
|
|
margin: 0 0 2em 0;
|
|
|
|
img{
|
|
max-width:100%;
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
figure br {
|
|
clear: both; }
|
|
|
|
figcaption * {
|
|
color: ($main-color*60);
|
|
font: 300 0.875em / 1.143 $font2;
|
|
margin: 0.5714em 0;
|
|
clear: left; }
|
|
|
|
figcaption * * {
|
|
font-size: 1em;
|
|
line-height: 1.1429; }
|
|
|
|
figcaption h4 {
|
|
color: ($main-color*40);
|
|
font: 600 0.875em / 1.143 $font2;
|
|
clear: left; }
|
|
|
|
|
|
|
|
a {
|
|
color: #17b;
|
|
&:hover, &:active {
|
|
color: #39e;
|
|
background-color: none;
|
|
outline: none; }
|
|
&:link, &:visited, &:hover {
|
|
-webkit-transition: all 0.3s ease;
|
|
-moz-transition: all 0.3s ease;
|
|
-o-transition: all 0.3s ease;
|
|
transition: all 0.3s ease; }
|
|
&:active {
|
|
color: #b41;
|
|
-webkit-transition: none;
|
|
-moz-transition: none;
|
|
-o-transition: none;
|
|
transition: none; } }
|
|
|
|
em {
|
|
font: italic 300 1em / 90% $font1;
|
|
a {
|
|
font: italic 300 1em / 90% $font1 } }
|
|
|
|
i, var, samp, cite, cite a {
|
|
font: italic 300 1em / 90% $font1 }
|
|
|
|
strong, b {
|
|
color: ($main-color*30);
|
|
font: normal 600 1em / 90% $font2; }
|
|
|
|
|
|
|
|
small {
|
|
font-size: 0.8125em;
|
|
line-height: 1.2308;
|
|
display: inline-block;
|
|
opacity: 0.9; }
|
|
|
|
abbr {
|
|
font-size: 0.875em;
|
|
line-height: 90%;
|
|
letter-spacing: 0.0357em;
|
|
opacity: 0.9; }
|
|
|
|
h1 abbr, h2 abbr, h3 abbr, strong abbr {
|
|
font-weight: 300;
|
|
line-height: 10%;
|
|
opacity: 1; }
|
|
|
|
abbr[title]:hover, dfn[title] {
|
|
border-bottom: 1px dotted rgba(0, 0, 0, 0.3);
|
|
cursor: help; }
|
|
|
|
|
|
code {
|
|
font: 0.875em / 90% "Monaco", "Courier New", Courier, monospace;
|
|
color: #abd37f;
|
|
&.comment {
|
|
color: #888; } }
|
|
|
|
kbd {
|
|
color: ($main-color*60);
|
|
font: normal 300 0.875em / 90% $font2;
|
|
background-color: #fcfcfc;
|
|
margin: 0 0.25em;
|
|
border: 1px solid #e6e6e6;
|
|
border-radius: 4px;
|
|
padding: 0.1429em 0.4286em; }
|
|
|
|
sub {
|
|
font-size: smaller;
|
|
line-height: 90%;
|
|
vertical-align: sub; }
|
|
|
|
sup {
|
|
font-size: smaller;
|
|
line-height: 90%;
|
|
vertical-align: super; }
|
|
|
|
mark {
|
|
background-color: #fff9dd;
|
|
line-height: 90%;
|
|
padding: 0 0.125em; }
|
|
|
|
ins {
|
|
background-color: #fff9dd;
|
|
line-height: 90%;
|
|
padding: 0 0.125em;
|
|
background-color: #f0f0f0; }
|
|
|
|
del, s {
|
|
line-height: 90%;
|
|
text-decoration: line-through; }
|
|
|
|
table {
|
|
color: ($main-color*50);
|
|
font: 300 0.938em / 1.6 $font2;
|
|
font-variant-numeric: lining-nums tabular-nums;
|
|
margin: 1.1429em 0;
|
|
border-collapse: collapse;
|
|
border-spacing: 0; }
|
|
|
|
caption {
|
|
color: ($main-color*60);
|
|
font: 300 0.933em / 1.143 $font2;
|
|
caption-side: bottom;
|
|
padding: 1.1429em 0 0.5714em; }
|
|
|
|
td {
|
|
text-align: left;
|
|
border-bottom: 1px solid #eee;
|
|
padding: 0.2667em 1.0667em 0.2em 0;
|
|
vertical-align: top;
|
|
}
|
|
|
|
th {
|
|
text-align: left;
|
|
border-bottom: 1px solid #eee;
|
|
padding: 0.2667em 1.0667em 0.2em 0;
|
|
color: ($main-color*60);
|
|
font: 600 1em / 1.6 $font2;
|
|
border-bottom-color: #ccc; }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ol {
|
|
&.code {
|
|
color: ($main-color*90);
|
|
font: 0.875em / 1.714 Menlo, Monaco, "Courier New", Courier, monospace;
|
|
margin: 1.1429em 0 1.1429em 2.8571em; }
|
|
&.code li {
|
|
list-style: decimal-leading-zero;
|
|
background: #f0f0f0;
|
|
margin: 0 0 -1px 0;
|
|
border-top: 1px solid #fff;
|
|
padding: 0 0.5em; }
|
|
&.code li code {
|
|
font-size: 1em; }
|
|
}
|
|
|
|
|
|
|
|
|
|
.center{
|
|
width:1000px;
|
|
margin:auto;
|
|
text-align:left;
|
|
|
|
}
|
|
|
|
.clear{
|
|
|
|
clear:both;
|
|
}
|
|
|
|
|
|
#header{
|
|
background:#8fca46;
|
|
img{
|
|
margin:10px 0px;
|
|
}
|
|
.menu{
|
|
|
|
float:right;
|
|
margin-top:43px;
|
|
|
|
|
|
|
|
a{
|
|
color:white;
|
|
padding:0.5em;
|
|
&:hover{
|
|
|
|
text-decoration:underline;
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
#home_ordonnance{
|
|
background:#f88e00;
|
|
text-transform:uppercase;
|
|
color:white;
|
|
font-weight:bold;
|
|
a{
|
|
color:white;
|
|
text-shadow : -1px -1px 1px rgba(82,56,22,0.46);
|
|
font-size:1.2em;
|
|
display:block;
|
|
padding:5px;
|
|
text-align:center;
|
|
}
|
|
|
|
.center{
|
|
|
|
text-align:center;
|
|
|
|
}
|
|
|
|
|
|
}
|
|
#home_folder{
|
|
width:1000px;
|
|
margin:auto;
|
|
|
|
img{
|
|
float:left;
|
|
width:370px;
|
|
margin-left:10px;
|
|
|
|
}
|
|
.readmore{
|
|
float:right;
|
|
clear:both;
|
|
position:relative;
|
|
top:-2em;
|
|
|
|
}
|
|
h3,h2,p{
|
|
margin-left:410px;
|
|
|
|
|
|
}
|
|
h3{
|
|
padding-top:20px;
|
|
}
|
|
h2{
|
|
margin-top:5px;
|
|
padding:0px;
|
|
margin-bottom:5px;
|
|
font-size:2.2em;
|
|
|
|
}
|
|
h3, .readmore{
|
|
text-transform:uppercase;
|
|
|
|
|
|
}
|
|
.description{
|
|
padding-bottom:2em;
|
|
|
|
}
|
|
}
|
|
|
|
#home_promotions{
|
|
h2{
|
|
|
|
background:#8fca46;
|
|
text-transform:uppercase;
|
|
color:white;
|
|
font-weight:bold;
|
|
font-size:1.2em;
|
|
margin-top:0px;
|
|
margin-bottom:0px;
|
|
padding:0px;
|
|
|
|
.center{
|
|
margin-top:0px;
|
|
margin-bottom:0px;
|
|
padding:0px;
|
|
}
|
|
|
|
|
|
a{
|
|
color:white;
|
|
text-shadow : -1px -1px 1px rgba(82,56,22,0.46);
|
|
|
|
display:block;
|
|
padding:5px;
|
|
text-align:center;
|
|
}
|
|
}
|
|
|
|
.column{
|
|
text-align:center;
|
|
font-size:1.1em;
|
|
*{
|
|
color:#564b4b;
|
|
text-align:center;
|
|
|
|
}
|
|
height:410px;
|
|
float:left;
|
|
border:3px solid #8fca46;
|
|
width:288px;
|
|
margin:20px 0px;
|
|
padding:10px;
|
|
margin-right:29px;
|
|
|
|
img{
|
|
height:245px;
|
|
margin:20px 0px;
|
|
}
|
|
|
|
.title{
|
|
text-transform:uppercase;
|
|
|
|
}
|
|
|
|
|
|
}
|
|
.column_3{
|
|
margin-right:0px !important;
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
#footer{
|
|
|
|
background: #9c9c9c;
|
|
color:white;
|
|
padding-bottom:2em;
|
|
a, h4{
|
|
color:white;
|
|
}
|
|
h4{
|
|
text-align:center;
|
|
text-transform:uppercase;
|
|
font-size:1.2em;
|
|
margin-bottom:1em;
|
|
}
|
|
img{
|
|
display:block;
|
|
margin:auto;
|
|
margin-top:20px;
|
|
|
|
}
|
|
|
|
.column{
|
|
|
|
float:left;
|
|
width:326px;
|
|
margin-right:10px;
|
|
|
|
&.last{
|
|
margin-right:0px;
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
#second_nav{
|
|
padding:10px;
|
|
background:#b2df7a;
|
|
margin-bottom:20px;
|
|
.center{
|
|
width:1000px;
|
|
margin:auto;
|
|
|
|
}
|
|
a{
|
|
padding:5px;
|
|
|
|
|
|
color:black;
|
|
|
|
&:hover{
|
|
|
|
text-decoration:underline;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
}
|
|
#page_main{
|
|
width:1000px;
|
|
margin:auto;
|
|
padding-bottom:100px;
|
|
min-height:50%;
|
|
|
|
}
|
|
textarea,input[type="text"]{
|
|
border:1px solid black;
|
|
padding:10px;
|
|
|
|
|
|
}
|
|
|
|
input[type="submit"]{
|
|
padding:10px;
|
|
border-radius:10px;
|
|
color:white;
|
|
font-size:1.2em;
|
|
background:#8fca46;
|
|
cursor:pointer;
|
|
font-weight:bold;
|
|
margin:20px;
|
|
|
|
}
|
|
|
|
|
|
.img_link_portlet{
|
|
border: 1px solid RGB(91, 67, 46);
|
|
padding: 10px;
|
|
margin-bottom: 10px;
|
|
h3 {
|
|
color: RGB(91, 67, 46); }
|
|
.image_file {
|
|
float: left;
|
|
margin-right: 10px; }
|
|
.title, .description {
|
|
margin-left: 130px; }
|
|
.title a, .description a {
|
|
color: #604435;
|
|
text-decoration: none; } }
|
|
|
|
|
|
.portlet {
|
|
&.table_content table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
td {
|
|
border: 1px solid black; } }
|
|
|
|
&.garde_content table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
td {
|
|
border: 1px solid black;
|
|
padding:5px; } }
|
|
|
|
&.block_content .two_column .column {
|
|
float: left;
|
|
width: 50%;
|
|
.block {
|
|
padding: 10px; } } }
|
|
|
|
.article {
|
|
border: 1px solid RGB(129, 178, 11);
|
|
padding: 10px;
|
|
margin-bottom: 10px;
|
|
h3 {
|
|
color: RGB(129, 178, 11); }
|
|
.image_file {
|
|
float: left;
|
|
margin-right: 10px; }
|
|
.title, .description {
|
|
margin-left: 130px; }
|
|
.title a, .description a {
|
|
color: #604435;
|
|
text-decoration: none; } }
|
|
.folder {
|
|
border: 1px solid RGB(91, 67, 46);
|
|
padding: 10px;
|
|
margin-bottom: 10px;
|
|
h3 {
|
|
color: RGB(91, 67, 46); }
|
|
.image_file {
|
|
float: left;
|
|
margin-right: 10px; }
|
|
.title, .description {
|
|
margin-left: 130px; }
|
|
.title a, .description a {
|
|
color: #604435;
|
|
text-decoration: none; } }
|
|
|
|
|
|
|
|
.promotion{
|
|
text-align:center;
|
|
font-size:1.1em;
|
|
*{
|
|
color:#564b4b;
|
|
text-align:center;
|
|
|
|
}
|
|
height:410px;
|
|
float:left;
|
|
border:3px solid #8fca46;
|
|
width:288px;
|
|
margin:20px 0px;
|
|
padding:10px;
|
|
margin-right:29px;
|
|
|
|
img{
|
|
height:245px;
|
|
margin:20px 0px;
|
|
}
|
|
|
|
.title{
|
|
text-transform:uppercase;
|
|
|
|
}
|
|
|
|
|
|
}
|
|
.column_3{
|
|
margin-right:0px !important;
|
|
|
|
}
|
|
|