File manager - Edit - /home/missmand/public_html/sass/_content.scss
Back
.section1{ background-image: url(../img/accueil/backgroundSection1.jpg); background-repeat:no-repeat; background-position: center center; @include background-size(cover); .inner{ padding:200px 0px 60px 0px; } } .section1Left{ width: 37%; float: left; padding-right: 3%; margin-right: 3%; h2{ color: $orange; padding:30px 0px 10px 0px; font-weight: 100; font-size: 27px; } p{ font-size: 16px; line-height:28px; color: $bleuText; } } .section1Right{ width: 60%; float: left; } .section1VideoImg{ position: relative; margin-top: 45px; img{ width: 100%; } iframe{ position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; width: 100%; height: 100%; z-index:5; } } .section1Logo{ width: 100%; } .section1Fleche{ width: 100%; padding:60px 0px 0px 0px; text-align: center; span{ display: inline-block; height: 55px; width: 55px; background-color: rgba($blanc, 0.5); @include border-radius(50%); line-height:70px; text-align: center; border: 1px solid $gris; .fa{ color: $gris; font-size:35px; } } } .section2{ @include background-image(linear-gradient(to right, darken($orangeFonce,5%), lighten($orange,5%))); .inner{ padding:80px 0px 180px 0px; } p{ color: $blanc; font-size: 35px; font-weight: 100; line-height:45px; @include single-text-shadow; } } .section3{ .inner{ padding:0px 0px 50px 0px; } } .section3Bloc{ float: left; padding: 70px 90px; width: 50%; img{ margin-bottom: 20px; } h2{ line-height:30px; margin-bottom: 20px; } p{ line-height:26px; } } .section3Left{ background-color: $bleu; margin-top: -85px; h2{ color: $blanc; &:after{ background-color: $blanc; } } p{ color: $blanc; } } .section3Right{ background-color: $blanc; } .section3Btn{ width: 100%; text-align: center; padding:50px 0px; } .section3Startup{ width: 100%; @include transition-property(opacity, transform); @include transition-duration(0.3s); @include transition-timing-function(ease); @include transform(scale(1)); &:hover{ opacity:0.9; @include transform(scale(0.98)); } img{ width: 100%; } } .section4{ padding: 0px 0px 50px 0px; .inner{ background-color: $bleuFonce; max-width:1600px; padding:80px 0px; } h2{ text-align: center; margin-bottom: 30px; font-size: 30px; color: $blanc; } } .section4Projets{ max-width: 1170px; margin:0px auto; } .projetListe{ width: 32%; float: left; margin: 0px 2% 40px 0px; cursor: pointer; @include transition-property(opacity, transform); @include transition-duration(0.3s); @include transition-timing-function(ease); @include transform(scale(1)); &:hover{ opacity:0.5; @include transform(scale(0.95)); } &:nth-child(3n+0){ margin: 0px 0px 40px 0px; } &.noir{ .projetListeDate, .projetListeNom{ color: $blanc; } } } .projetListeLogo{ img{ max-width: 100%; border: 1px solid rgba($gris,0.4); } } .projetListeDate{ color: $bleuText; margin-bottom: 8px; } .projetListeContenu{ padding: 20px 3% 0px 0px; } .projetListeNom{ margin-bottom: 10px; line-height:25px; } .projetListeResume{ color: $bleuText; margin-bottom: 10px; } .projetListeTag{ margin-bottom: 10px; } .projetListePlus{ display: block; padding-top: 5px; color: $orange; text-decoration: underline; font-size: 14px; } .section4Btn{ width: 100%; text-align: center; padding:10px 0px 0px 0px; } .section5{ background-color: $blanc; .inner{ padding:80px 0px; } h2{ text-align: center; margin-bottom: 30px; font-size: 30px; } } .section5Btn{ width: 100%; text-align: center; padding:10px 0px 0px 0px; } .actualiteListe{ width: 32%; float: left; margin: 0px 2% 40px 0px; cursor: pointer; @include transition-property(opacity, transform); @include transition-duration(0.3s); @include transition-timing-function(ease); @include transform(scale(1)); &:hover{ opacity:0.5; @include transform(scale(0.95)); } &:nth-child(3n+0){ margin: 0px 0px 40px 0px; } } .actualiteListeImage{ position: relative; img{ width: 100%; } } .actualiteListeCategorie{ margin-bottom: 10px; } .actualiteListeContenu{ padding:20px 6% 0px 6%; } .actualiteListeTitre{ margin-bottom: 10px; line-height:25px; } .actualiteListeResume{ color: $bleuText; margin-bottom: 10px; } .actualiteListePlus{ display: block; padding-top: 5px; color: $bleuFonce; text-decoration: underline; font-size: 14px; } .actualiteListeGradient{ position: absolute; left: 0px; top: 50%; right: 0px; bottom: 0px; @include background-image(linear-gradient(rgba($bleu,0), rgba($bleuFonce,0.8))); z-index:2; } .actualiteListeDate{ position: absolute; left: 20px; bottom: 10px; z-index:3; p{ color:$blanc; span{ color: $orange; font-weight: 500; font-size: 45px; @include single-text-shadow; } } } .section6{ padding:50px 0px 0px 0px; .inner{ background-color: $bleuFonce; max-width: 1600px; padding:80px 0px; } } .projetAvant{ max-width: 1170px; margin:0px auto; cursor: pointer; @include transition-property(opacity, transform); @include transition-duration(0.3s); @include transition-timing-function(ease); @include transform(scale(1)); &:hover{ opacity:0.5; @include transform(scale(0.98)); } h2{ color: $blanc; margin-bottom: 10px; line-height:31px; } p{ color: $bleuText; margin-bottom: 10px; } } .projetAvantLogo{ float: left; width: 20%; max-width: 100%; margin-right: 5%; img{ width: 100%; } } .projetAvantContenu{ float: left; width: 75%; } .projetAvantDate{ padding-top: 20px; p{ color: $blanc; line-height:20px; text-transform: uppercase; font-size: 13px; span{ color: $orange; text-transform: none; } } } .section7{ .inner{ padding:50px 0px 0px 0px; } } .section7Citation{ padding:10px 0px 50px 0px; width: 100%; text-align: center; p{ font-size: 26px; font-style: italic; font-family: 'Merriweather', serif; } } .section7Startup{ width: 100%; padding-top: 50px; @include transition-property(opacity, transform); @include transition-duration(0.3s); @include transition-timing-function(ease); @include transform(scale(1)); &:hover{ opacity:0.9; @include transform(scale(0.98)); } img{ width: 100%; } } .managerProjets{ .contenuTop{ .inner{ padding: 135px 0px 50px 0px; } } } .contentTopRecherche{ background-color: $blanc; width: 100%; @include border-radius(8px); padding: 20px; .form-elem{ background-color: $blancMarron; } .form-group{ float: left; &.first{ width: 30%; margin-right: 2%; } &.last{ width: 68%; } label{ color: $orange; text-transform: none; font-size: 13px; } } .form-bouton{ width: 100%; text-align: right; } } .section8{ padding:50px 0px 0px 0px; .inner{ background-color: $bleuFonce; max-width: 1600px; padding:110px 0px 80px 0px; } } .actualiteAvant{ max-width: 1170px; margin:0px auto; cursor: pointer; @include transition-property(opacity, transform); @include transition-duration(0.3s); @include transition-timing-function(ease); @include transform(scale(1)); &:hover{ opacity:0.5; @include transform(scale(0.98)); } h2{ color: $blanc; margin-bottom: 10px; line-height:31px; padding-top: 35px; } } .actualiteAvantImage{ width: 40%; margin-right: 5%; float: left; position: relative; img{ width: 100%; } } .actualiteAvantContenu{ width: 55%; float: left; p{ color: $bleuText; margin-bottom: 10px; } } .actualiteAvantCategorie{ position: absolute; left: 0px; top: -32px; } .actualiteAvantGradient{ position: absolute; left: 0px; top: 50%; right: 0px; bottom: 0px; @include background-image(linear-gradient(rgba($bleu,0), rgba($bleuFonce,0.8))); z-index:2; } .actualiteAvantDate{ position: absolute; left: 20px; bottom: 10px; z-index:3; p{ color:$blanc; span{ color: $orange; font-weight: 500; font-size: 45px; @include single-text-shadow; } } } .section9{ .inner{ padding: 50px 0px 0px 0px; } } .section9Actualites{ padding: 0px 0px 10px 0px; } .contact{ .contenuTop{ background: $blanc; .inner{ min-height: auto; } } } .projet{ .contenuTop{ .inner{ min-height: auto; } } .contenuSidebar{ padding:50px 0px; } } .projetLogo{ margin-bottom: 20px; img{ max-width: 100%; border: 1px solid rgba($gris,0.4); } } .projetInfos{ text-transform: uppercase; font-size: 12px; font-weight: bold; line-height:15px; margin: 0px 0px 8px 15px; span{ color: $orange; text-transform: none; font-weight: normal; } } .projetElements{ padding: 10px; p{ text-align: center; font-style: italic; font-family: 'Merriweather', serif; font-size: 16px; } } .projetVideo{ position: relative; margin-bottom: 50px; img{ width: 100%; } iframe{ position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px; width: 100%; height: 100%; z-index:5; } } .projetImages{ width: 100%; margin-bottom: 50px; a{ float: left; margin-right: 2%; width: 32%; @include transition-property(opacity, transform); @include transition-duration(0.3s); @include transition-timing-function(ease); @include transform(scale(1)); &:hover{ opacity:0.5; @include transform(scale(0.95)); } &:nth-child(3n+0){ margin-right: 0px; } } img{ width: 100%; } } .projetContenu{ margin-bottom: 35px; h3{ margin-bottom: 8px; } h4{ background-color: $bleu; color: $blanc; padding:13px 30px; font-weight: 600; margin-bottom: 20px; } } .projetReseaux{ margin-bottom: 35px; padding: 0px 0px 35px 0px; border-bottom:1px solid $gris; a{ display: inline-block; height: 55px; width: 55px; background-color: $orange; @include border-radius(50%); text-align: center; line-height:55px; color: $blanc; margin-right: 10px; font-size: 22px; @include transition-property(background-color); @include transition-duration(0.3s); @include transition-timing-function(ease); &:hover{ background-color: $bleu; } } } .projetTag{ margin-bottom: 35px; padding: 0px 0px 35px 0px; border-bottom:1px solid $gris; h4{ text-transform: uppercase; } } .projetPartage{ position: relative; height: 30px; .fb-share-button{ position: absolute; left: 0px; top: 0px; } #twitter-widget-0{ position: absolute !important; top: 0px !important; left: 100px !important; } } .commentaires{ background-color: $blancMarronClair; .inner{ padding:80px 0px; max-width: 960px; } } .commentairesListe{ padding:0px 8%; margin-bottom: 50px; } .commentaireForm{ background-color: $blanc; padding:40px 8%; input{ background-color: $blanc; border:none; border-bottom:1px solid rgba($bleuText,0.6); width: 100%; padding: 10px 10px 10px 0px; color: $bleuText; @include input-placeholder { color: $bleuText; } } textarea{ border:1px solid rgba($bleuText,0.6); height: 100px; width: 100%; padding: 10px; color: $bleuText; } h2{ color: $bleuText; font-weight: 100; font-size: 25px; margin-bottom: 20px; } input[name=utilisateurNom] { float: left; width: 48%; margin-right: 4%; } input[name=utilisateurPrenom] { float: left; width: 48%; } label{ font-weight: normal; text-transform: none; font-size: 14px; } .form-group{ margin-bottom: 25px; } .form-button{ width: 100%; text-align: right; } } .commentaireListeCount{ text-transform: uppercase; font-weight: 600; margin-bottom: 20px; font-size: 16px; } .commentaireListe{ border-bottom:1px solid $gris; margin-bottom: 30px; padding-bottom: 30px; &:last-child{ margin: 0px; padding: 0px; border:none; } h3{ color: $orange; text-transform: uppercase; margin-bottom: 10px; font-weight: 600; font-size: 13px; } p{ font-size: 12px; line-height:16px; } } .commentaireContenu{ width: 100%; float: left; } .actualite{ .contenuTop{ .inner{ min-height: auto; max-width: 960px; } } } .section10{ .inner{ padding:50px 0px 0px 0px; } } .section10Left{ width: 48%; margin-right: 4%; float: left; } .section10Right{ width: 48%; float: left; } .section12{ background-color: $blanc; .inner{ padding:50px 0px; max-width: 840px; } } .actualiteCreated{ padding:15px 0px 10px 0px; p{ color: darken($gris,8%); font-size: 12px; } } .section13{ background-color: lighten($gris,20%); .inner{ padding:50px 0px; } } .section13Btn{ width: 100%; text-align: center; padding:10px 0px 0px 0px; } .actualitePartage{ position: relative; height: 30px; .fb-share-button{ position: absolute; left: 0px; top: 0px; } #twitter-widget-0{ position: absolute !important; top: 0px !important; left: 100px !important; } } .section14{ background-color: $bleuFonce; .inner{ padding:50px 0px; } } .section14Btn{ width: 100%; text-align: center; padding:10px 0px 0px 0px; } .presentation{ .contenuTop{ .inner{ min-height: auto; } h1,p{ color: $blanc; } } .contenuTopLeft{ width: 40%; } .contenuTopRight{ width: 55%; } } .section15{ background-image: url(../img/presentation/backgroundSection15.jpg); background-repeat:no-repeat; background-position: center center; @include background-size(cover); .inner{ padding:50px 0px; } } .section15Contenu{ background-color: $bleu; max-width: 360px; padding: 60px 30px; img{ width: 100%; margin-bottom: 30px; } p{ color: $blanc; font-size: 16px; line-height:31px; } } .section16{ .inner{ padding:80px 0px; p{ color: $bleuText; font-size: 16px; line-height:31px; max-width: 1000px; margin: 0px auto; } } } .section17{ background: $bleu url(../img/presentation/backgroundSection17.png) no-repeat left bottom; .inner{ padding:100px 0px 130px 0px; p{ color: $blanc; font-size: 15px; line-height:31px; position: relative; } } } .section17Left{ width: 40%; float: left; } .section17Right{ padding-left: 180px; width: 60%; float: left; p{ margin-bottom: 20px; &:after{ content: ''; height: 1px; width: 80px; position: absolute; left: -100px; top: 15px; background-color: $orange; } } } .section18{ padding: 50px 0px 0px 0px; .inner{ @include background-image(linear-gradient(to right, darken($orangeFonce,5%), lighten($orange,5%))); max-width: 1600px; padding: 100px 0px; } } .section18Zone{ max-width: 1200px; margin: 0px auto; padding:0px 0px 50px 0px; &:last-child{ padding:0px 0px 0px 0px } } .section18ZoneLeft{ width: 35%; margin-right: 5%; float: left; img{ float: left; width: 60px; } h4{ float: left; color: $blanc; position: relative; font-weight: 400; font-size: 18px; width: calc(100% - 60px); padding: 25px 0px 0px 60px; &:after{ content:''; position: absolute; left: 27px; top: 38px; width: 20px; height: 1px; background-color: $blanc; } } } .section18ZoneRight{ width: 60%; float: left; p{ color: $blanc; line-height:26px; strong{ text-transform: uppercase; } } } .section19{ background-color: $blanc; .inner{ padding:80px 0px; h2{ padding-bottom: 20px; font-size: 32px; text-align: center; } p{ max-width: 900px; margin: 0px auto; color: $bleuText; font-size: 16px; line-height:31px; } } } .section20{ .inner{ padding:80px 0px; h2{ margin-bottom: 65px; font-size: 32px; text-align: center; color: $orange; } } } .section20Slider{ max-width: 1000px; margin: 0px auto; .owl-dots{ text-align: center; width: 100%; div{ height: 5px; width: 5px; background-color: $gris; @include border-radius(50%); display: inline-block; margin: 0px 4px; &.active{ background-color: $orange; } } } .owl-nav{ padding-top: 50px; width: 100%; text-align: center; div{ display: inline-block; margin: 0px 8px; .fa { color: $orange; } } } } .sliderContenu{ width: 50%; float: left; padding: 50px 50px 25px 0px; position: relative; &:after{ content:''; position: absolute; bottom: 0px; left: 0px; width: 40px; height: 3px; background-color: $orange; } h3{ font-size: 30px; } p{ font-size: 23px; line-height:35px; } } .sliderImage{ width: 50%; float: left; } .section21{ background-color: $blanc; .inner{ padding: 70px 0px; h2{ margin-bottom: 30px; font-size: 32px; text-align: center; } p{ color: $bleuText; line-height:30px; } } } .section21Col{ width: calc(100% / 3); float: left; text-align: center; padding:0px 20px; h3{ color: $orange; font-weight: 100; font-size: 38px; position: relative; margin-bottom: 20px; padding-bottom: 8px; &:after{ content:''; position: absolute; left: 50%; margin-left: -15px; bottom: 1px; width: 30px; height: 2px; background-color:$orange; } } } .section21Texte1{ padding: 0px 0px 80px 0px; } .section22{ background-image: url(../img/presentation/backgroundSection22.jpg); background-repeat:no-repeat; background-position: center center; @include background-size(cover); .inner{ padding: 135px 0px 50px 0px; max-width: 1000px; } } .section22Bloc{ float: left; padding: 70px 90px; width: 50%; h2{ color: $orange; font-size: 28px; font-weight: 100; line-height:38px; margin-bottom: 20px; } p{ color: $blanc; line-height:30px; } } .section22Left{ background-color: $bleu; margin-top: -85px; } .section22Right{ padding: 130px 90px; background-color: $blanc; p{ color: $bleuText; } } .section23{ background-color: $blanc; .inner{ padding:60px 0px; h2{ margin-bottom: 30px; font-size: 32px; color: $orange; text-align: center; } p{ font-size: 16px; &:first-of-type{ margin-bottom: 15px; text-transform: uppercase; text-align: center; } } } } .section24{ .inner{ padding: 60px 0px; .owl-dots{ text-align: center; div{ height: 10px; width: 10px; background-color: $gris; @include border-radius(50%); display: inline-block; margin: 0px 4px; &.active{ background-color: $orange; } } } .owl-nav{ padding-top: 30px; width: 100%; text-align: center; div{ display: inline-block; margin: 0px 8px; .fa { color: $orange; } } } } } .temoignageInner{ background-color: $blanc; padding:25px; min-height: 375px; img{ max-width: 90px; margin-bottom: 15px; } h3{ font-size: 17px; margin-bottom: 10px; } } .temoignagePoste{ font-size: 12px; color: darken($blancMarron,30%); margin-bottom: 10px; } .temoignageContenu{ color: darken($gris,20%); font-size: 13px; line-height:21px; } .section25{ background-color: $violet; .inner{ padding:70px 0px 120px 0px; h2{ margin-bottom: 30px; font-size: 32px; text-align: center; color: $blanc; } } } .section25Left{ width: 45%; margin-right: 5%; float: left; text-align: center; p{ color: $orange; font-size: 16px; strong{ text-transform: uppercase; } } img{ display: inline-block; margin-bottom: 6px; } } .section25Right{ width: 50%; float: left; p{ color: $violetText; line-height:26px; strong{ color: $blanc; font-weight: normal; } } } .section26{ background-color: $violetFonce; .inner{ padding:60px 0px; } } .comiteListeCategorie{ text-align: center; h2{ margin-bottom:45px; font-size: 27px; text-align: center; color: $bleuText; display: inline-block; position: relative; &:after{ content:''; position: absolute; left: -115px; top: 15px; width: 89px; height: 12px; background-image: url(../img/presentation/backTitre.png); } &:before{ content:''; position: absolute; right: -110px; top: 15px; width: 89px; height: 12px; background-image: url(../img/presentation/backTitre.png); } } } .comiteListe{ width:calc(100% / 3); float: left; margin-bottom: 50px; img{ width: 35%; float: left; @include border-radius(5px); } } .comiteListeContenu{ float: left; padding:0px 20px; width: 65%; h3{ font-size: 27px; line-height:32px; color: $orange; font-weight: normal; margin-bottom: 10px; } p{ color:$gris; font-size: 13px; } } .comiteListePresident{ text-transform: uppercase; font-weight: bold; margin-bottom: 5px; } .section27{ .inner{ padding: 80px 0px 35px 0px; h2{ margin-bottom: 29px; color: $orange; } } } .presseCategorie{ float: left; width: 50%; &:nth-child(2n+0) { margin-right: 0px; } } .presseListe{ width: calc(100% / 3); float: left; padding: 0px 25px 25px 0px; img{ @include border-radius(5px); width: 100%; } } .addProjet{ .contenuTop{ @include background-image(linear-gradient(to right, darken($orangeFonce,5%), lighten($orange,5%))); } .contenuTopLeft{ width: 45%; h1{ color: $blanc; padding-bottom: 15px; font-size: 40px; line-height:45px; } p{ color: $blanc; font-size: 16px; line-height: 27px; } } .contenuTopRight{ width: 50%; h2{ color: $blanc; font-size: 20px; padding-bottom: 20px; } } } .section28{ .inner{ padding:50px 0px 0px 0px; } } .section28Left{ width: 48%; margin-right: 4%; float: left; } .section28Right{ width: 48%; float: left; } .section28Header{ width: 100%; text-align: center; margin-bottom: 40px; h2{ font-size: 25px; line-height: 30px; } p{ color: $orange; } } .section29{ .inner{ padding:50px 0px; } }
| ver. 1.4 |
Github
|
.
| PHP 7.4.33 | Generation time: 0 |
proxy
|
phpinfo
|
Settings