| Current Path : /home/happyrenas/old/devis-huissier.fr/old/components/scss/ |
Linux webd005.cluster105.gra.hosting.ovh.net 5.15.206-ovh-vps-grsec-zfs-classid #1 SMP Fri May 15 02:41:25 UTC 2026 x86_64 |
| Current File : /home/happyrenas/old/devis-huissier.fr/old/components/scss/_index.scss |
#txt-home {
position:relative;
.col-xs-12 {
padding:10rem 8rem 10rem 15px;
}
}
#actualites {
background:url('../images/bg-actualites.jpg') no-repeat top center;
background-size:cover;
.row.center {
padding:6rem 0;
p {
font-size:3rem;
letter-spacing:.1em;
.icon-arrow {
@include icon(22px);
margin-left:30px;
&:before {
transform:rotate(90deg);
}
}
}
}
#slider-actus {
margin-bottom:9rem;
div.col-xs-10 {
>div {
height:45rem;
}
p.visuel {
position:relative;
height:16rem;
overflow:hidden;
.date {
@include dsp-ib(top);
@include position(absolute,5,0,auto,auto,0);
color:$blanc;
font:14px $font-i;
padding:1rem 2rem;
letter-spacing:.1em;
}
img {
@include position(absolute,1,0,0,0,0);
margin:auto;
width:100%;
height:auto;
}
}
p.txt {
padding:3rem;
font-size:14px;
line-height:20px;
strong, a {
@include dsp-ib(top);
font-size:24px;
line-height:24px;
font-family:$font-alt-b;
}
a {
font-size:18px;
line-height:18px;
font-family:$font-i;
letter-spacing:.1em;
.icon-arrow {
@include icon(16px);
margin-left:15px;
}
&:hover {
color:$bleu-hover;
}
}
}
}
}
#bt-prev, #bt-next {
@include icon(20px);
height:60px;
width:60px;
border:solid 1px $gris;
@include position(absolute,5,0,auto,0,-60px);
margin:auto;
font-size:20px;
color:$gris;
transform:rotate(90deg);
&#bt-next {
left:auto;
right:-60px;
transform:rotate(-90deg);
}
&:hover {
background:rgba(255,255,255,.2);
}
}
}
#accelerateurs {
padding:15px 7px 15px 8px;
display:flex; align-items: center;
a {
display:block;
width:25%;
padding:0 8px 0 7px;
position:relative;
overflow:hidden;
&:after {
content:'';
display:block;
@include position(absolute,1,0,8px,0,7px);
background:$violet;
}
img {
width:100%;
height:auto;
@include position(relative,5);
}
span.intitule {
font:5.5rem $font-alt-b;
line-height:5rem;
@include position(absolute,10,5rem,auto,auto,5rem);
}
em.savoir-plus {
font-size:2.6rem;
font-family:$font-bi;
line-height:2.6rem;
@include dsp-ib(top);
@include position(absolute,10,auto,auto,-3rem,5rem);
.icon-arrow {
@include icon(22px);
margin-left:15px;
}
}
&:hover {
img {
opacity:.1;
transition:all .7s ease;
}
em.savoir-plus {
bottom:3rem;
transition-delay:.5s;
}
}
}
}
#liens-home {
padding:6rem 0px;
p {
em {
font-size:3.5rem;
line-height:3.5rem;
@include dsp-ib(top);
}
span[class*="icon-"] {
color:#5c5c55;
}
.icon-guide-piscicole {
@include icon(10rem);
margin:2rem 0;
}
.icon-carte-piscicole {
@include icon(9rem);
margin:2.5rem 0;
}
.icon-cliquez-imprimez-pechez {
@include icon(18rem);
margin:-2rem 0;
}
}
}
/* --------------------------------------------
-----------------------------------------------
-----------------------------------------------
!----------- BREAKPOINTS
-----------------------------------------------
-----------------------------------------------
---------------------------------------------*/
@media (max-width: 1600px) {
#accelerateurs {
a {
span.intitule {
font:3.6rem $font-alt-b;
line-height:3.6rem;
@include position(absolute,10,4rem,auto,auto,4rem);
}
em.savoir-plus {
font-size:22px;
line-height:22px;
@include position(absolute,10,auto,auto,-3rem,4rem);
.icon-arrow {
@include icon(20px);
}
}
&:hover {
em.savoir-plus {
bottom:3rem;
}
}
}
}
}
/* --------------------
---------------- 1200PX
-------------------- */
@media (max-width: 1200px) {
#actualites {
.row.center {
p {
.icon-arrow {
@include icon(20px);
margin-left:25px;
}
}
}
#slider-actus {
div.col-xs-10 {
>div {
height:48rem;
}
p.visuel {
height:18rem;
}
p.txt {
strong, a {
@include dsp-ib(top);
font-size:22px;
line-height:22px;
}
}
}
}
#bt-prev, #bt-next {
@include icon(18px);
height:50px;
width:50px;
@include position(absolute,5,0,auto,0,-50px);
&#bt-next {
left:auto;
right:-50px;
}
}
}
#accelerateurs {
a {
span.intitule {
@include position(absolute,10,3rem,auto,auto,3rem);
}
em.savoir-plus {
font-size:20px;
line-height:20px;
@include position(absolute,10,auto,auto,-3rem,3rem);
.icon-arrow {
@include icon(18px);
}
}
&:hover {
em.savoir-plus {
bottom:3rem;
}
}
}
}
}
/* --------------------
----------------- 992PX
-------------------- */
@media (max-width: 992px) {
#txt-home {
.col-xs-12 {
padding:8rem 15px 8rem 15px;
}
}
#actualites {
.row.center {
p {
font-size:24px;
.icon-arrow {
margin-left:20px;
}
}
}
#slider-actus {
div.col-xs-10 {
>div {
height:55rem;
}
p.visuel {
height:25rem;
}
p.txt {
strong, a {
font-size:20px;
line-height:20px;
}
a {
font-size:16px;
line-height:16px;
.icon-arrow {
margin-left:10px;
}
}
}
}
}
}
#accelerateurs {
a {
span.intitule {
@include position(absolute,10,3rem,auto,auto,3rem);
}
em.savoir-plus {
font-size:18px;
line-height:18px;
@include position(absolute,10,auto,auto,-3rem,3rem);
.icon-arrow {
@include icon(16px);
}
}
&:hover {
em.savoir-plus {
bottom:3rem;
}
}
}
}
}
/* --------------------
----------------- 760PX
-------------------- */
@media (max-width: 760px) {
#actualites {
.row.center {
p {
font-size:22px;
.icon-arrow {
margin-left:15px;
}
}
}
#slider-actus {
div.col-xs-10 {
padding:0 45px;
>div {
height:70rem;
}
p.visuel {
height:25rem;
}
p.txt {
strong, a {
font-size:20px;
line-height:20px;
}
}
}
}
#bt-prev, #bt-next {
@include icon(16px);
height:40px;
width:40px;
@include position(absolute,5,0,auto,80px,15px);
background:$gris;
color:$blanc;
&#bt-next {
left:auto;
right:15px;
}
&:hover {
background:$noir;
}
}
}
#accelerateurs {
display:block;
&:before,
&:after {
content: " ";
display: table;
}
&:after {
clear:both;
}
a {
width:50%;
float:left;
&:nth-child(1),&:nth-child(2) {
margin-bottom:15px;
}
span.intitule {
@include position(absolute,10,5rem,auto,auto,5rem);
font-size:5rem;
line-height:5rem;
}
em.savoir-plus {
font-size:20px;
line-height:20px;
@include position(absolute,10,auto,auto,-4rem,5rem);
.icon-arrow {
@include icon(18px);
}
}
&:hover {
em.savoir-plus {
bottom:3rem;
}
}
}
}
#liens-home {
p {
margin-bottom:7rem;
&:after {
display:block; content:'';
border-bottom:solid 1px rgba(0,0,0,.1);
width:80%;
height:1px;
@include position(absolute,1,auto,0,-3.5rem,0);
margin:auto;
}
&:last-child {
margin:0;
&:after {
display:none;
}
}
em {
font-size:4rem;
line-height:4rem;
}
.icon-guide-piscicole {
@include icon(12rem);
margin:2rem 0;
}
.icon-carte-piscicole {
@include icon(11rem);
margin:2.5rem 0;
}
.icon-cliquez-imprimez-pechez {
@include icon(20rem);
margin:-2rem 0;
}
}
}
}
@media (max-width:480px) {
#accelerateurs {
display:block;
&:before,
&:after {
content: " ";
display: table;
}
&:after {
clear:both;
}
a {
width:100%;
float:left;
margin-bottom:15px;
&:last-child {
margin:0;
}
span.intitule {
@include position(absolute,10,5rem,auto,auto,5rem);
font-size:5rem;
line-height:5rem;
}
em.savoir-plus {
font-size:20px;
line-height:20px;
@include position(absolute,10,auto,auto,-4rem,5rem);
.icon-arrow {
@include icon(18px);
}
}
&:hover {
em.savoir-plus {
bottom:3rem;
}
}
}
}
}