diff --git a/contact-form-handler.php b/contact-form-handler.php
new file mode 100644
index 0000000..205f4de
--- /dev/null
+++ b/contact-form-handler.php
@@ -0,0 +1,30 @@
+
\ No newline at end of file
diff --git a/css/PRICING/_mixins.scss b/css/PRICING/_mixins.scss
index 0e745de..4e4baac 100644
--- a/css/PRICING/_mixins.scss
+++ b/css/PRICING/_mixins.scss
@@ -8,15 +8,14 @@
margin: 2.5rem 0rem;
box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
transition-duration: 0.3s;
+ background-color: white;
+
&:hover{
- transform: scale(1.1);
+ transform:scale(1.1) ;
.prix{
- background-color: #658da7;
- }
- .detail{
- background-color: #658da7;
-
+ background-color: #658DA7;
}
+
}
.heading{
font-size: 24px;
@@ -32,41 +31,56 @@
width: 100%;
transition-duration: 0.6s;
}
- .ul{
- line-height: 36px;
- hr{
- width: 120%;
- margin-left: -3rem;
- }
- li{
- list-style-type: none;
- }
- }
- .detail{
- width: 90px;
- background-color: #f0f0f0;
- height: 42px;
- border-radius: 13px;
- margin-bottom: 1.5rem;
- padding: 1rem 0rem 0rem 2rem;
- transition-duration: 0.5s;
- &:hover{
- transform: scale(1.1);
- a{
- color: white;
-
- }
- }
+ .ul{
+ line-height: 36px;
+ padding: 1rem 0rem;
+ li{
+ list-style-type: none;
+ border-bottom: 1px solid black;
+ }
+ }
+ .btn{
+
+ width: 90px;
+ background-color: #f0f0f0;
+ height: 42px;
+ border-radius: 13px;
+ margin: auto;
+ padding: 1rem 0rem 0.2rem 2rem;
+ transition-duration: 0.5s;
+ margin-bottom: 1rem;
+ &:hover{
+ transform: scale(1.1);
+ background-color: #658da7;
- a{
- text-decoration: none;
- color: black;
- font-size: 20px;
+ a{
+ color: white;
+ }
}
+
+
+ a{
+ text-decoration: none;
+ color: black;
+ font-size: 20px;
}
+ }
+}
+@mixin details {
+ z-index: -1;
+ justify-self: center;
+ border:none;
+ border-radius: 20px;
+ margin: 2.5rem 0rem;
+ transition-duration: 0.3s;
+ background-color: white;
+ width: 360px;
+ text-align: center;
+
+
}
diff --git a/css/PRICING/style.css b/css/PRICING/style.css
index cf68adc..fc26281 100644
--- a/css/PRICING/style.css
+++ b/css/PRICING/style.css
@@ -12,6 +12,18 @@ body {
.testemoinial .title {
text-align: center;
+ font-size: 24px;
+ font-weight: bold;
+ padding-bottom: 40px;
+ color: #658DA7;
+}
+
+.testemoinial .title hr {
+ width: 270px;
+ margin: auto;
+ height: 3px;
+ background: #658DA7;
+ border-radius: 1rem;
}
.testemoinial .person {
@@ -42,11 +54,14 @@ body {
.testemoinial .commentaire {
margin: 1rem;
- padding: 1rem;
- background-color: lightgray;
+ background-color: #f0f0f0;
border-radius: 20px;
}
+.testemoinial .commentaire p {
+ padding: 2rem;
+}
+
@media only screen and (min-width: 768px) {
.testemoinial {
-ms-grid-columns: 1fr 1.5fr;
@@ -81,7 +96,7 @@ body {
.testemoinial {
-ms-grid-columns: 30% 60% 10%;
grid-template-columns: 30% 60% 10%;
- font-size: 22px;
+ font-size: 16px;
margin-right: 3rem;
}
.testemoinial .title {
@@ -105,6 +120,18 @@ body {
.pricing .title {
text-align: center;
+ font-size: 24px;
+ font-weight: bold;
+ padding-bottom: 40px;
+ color: #658DA7;
+}
+
+.pricing .title hr {
+ width: 192px;
+ margin: auto;
+ height: 3px;
+ background: #658DA7;
+ border-radius: 1rem;
}
@media only screen and (min-width: 1440px) {
@@ -113,9 +140,7 @@ body {
}
}
-.pricing .s1,
-.pricing .s2,
-.pricing .s3 {
+.pricing .s1 {
-ms-grid-column-align: center;
justify-self: center;
width: 360px;
@@ -129,37 +154,204 @@ body {
box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
+ background-color: white;
+ -ms-grid-row: 2;
+ -ms-grid-row-span: 1;
+ grid-row: 2/3;
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 1;
+ grid-column: 1/2;
}
-.pricing .s1:hover,
-.pricing .s2:hover,
-.pricing .s3:hover {
+.pricing .s1:hover {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
-.pricing .s1:hover .prix,
-.pricing .s2:hover .prix,
-.pricing .s3:hover .prix {
+.pricing .s1:hover .prix {
+ background-color: #658DA7;
+}
+
+.pricing .s1 .heading {
+ font-size: 24px;
+ padding: 2rem 0rem;
+ font-weight: bold;
+}
+
+.pricing .s1 .prix {
+ font-size: 28px;
+ padding: 1rem 0rem;
+ font-weight: bold;
+ text-align: center;
+ background-color: #f0f0f0;
+ width: 100%;
+ -webkit-transition-duration: 0.6s;
+ transition-duration: 0.6s;
+}
+
+.pricing .s1 .ul {
+ line-height: 36px;
+ padding: 1rem 0rem;
+}
+
+.pricing .s1 .ul li {
+ list-style-type: none;
+ border-bottom: 1px solid black;
+}
+
+.pricing .s1 .btn {
+ width: 90px;
+ background-color: #f0f0f0;
+ height: 42px;
+ border-radius: 13px;
+ margin: auto;
+ padding: 1rem 0rem 0.2rem 2rem;
+ -webkit-transition-duration: 0.5s;
+ transition-duration: 0.5s;
+ margin-bottom: 1rem;
+}
+
+.pricing .s1 .btn:hover {
+ -webkit-transform: scale(1.1);
+ transform: scale(1.1);
background-color: #658da7;
}
-.pricing .s1:hover .detail,
-.pricing .s2:hover .detail,
-.pricing .s3:hover .detail {
+.pricing .s1 .btn:hover a {
+ color: white;
+}
+
+.pricing .s1 .btn a {
+ text-decoration: none;
+ color: black;
+ font-size: 20px;
+}
+
+.pricing .s2 {
+ -ms-grid-column-align: center;
+ justify-self: center;
+ width: 360px;
+ border: none;
+ display: -ms-grid;
+ display: grid;
+ justify-items: center;
+ border-radius: 20px;
+ margin: 2.5rem 0rem;
+ -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
+ box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
+ -webkit-transition-duration: 0.3s;
+ transition-duration: 0.3s;
+ background-color: white;
+ -ms-grid-row: 3;
+ -ms-grid-row-span: 1;
+ grid-row: 3/4;
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 1;
+ grid-column: 1/2;
+}
+
+.pricing .s2:hover {
+ -webkit-transform: scale(1.1);
+ transform: scale(1.1);
+}
+
+.pricing .s2:hover .prix {
+ background-color: #658DA7;
+}
+
+.pricing .s2 .heading {
+ font-size: 24px;
+ padding: 2rem 0rem;
+ font-weight: bold;
+}
+
+.pricing .s2 .prix {
+ font-size: 28px;
+ padding: 1rem 0rem;
+ font-weight: bold;
+ text-align: center;
+ background-color: #f0f0f0;
+ width: 100%;
+ -webkit-transition-duration: 0.6s;
+ transition-duration: 0.6s;
+}
+
+.pricing .s2 .ul {
+ line-height: 36px;
+ padding: 1rem 0rem;
+}
+
+.pricing .s2 .ul li {
+ list-style-type: none;
+ border-bottom: 1px solid black;
+}
+
+.pricing .s2 .btn {
+ width: 90px;
+ background-color: #f0f0f0;
+ height: 42px;
+ border-radius: 13px;
+ margin: auto;
+ padding: 1rem 0rem 0.2rem 2rem;
+ -webkit-transition-duration: 0.5s;
+ transition-duration: 0.5s;
+ margin-bottom: 1rem;
+}
+
+.pricing .s2 .btn:hover {
+ -webkit-transform: scale(1.1);
+ transform: scale(1.1);
background-color: #658da7;
}
-.pricing .s1 .heading,
-.pricing .s2 .heading,
+.pricing .s2 .btn:hover a {
+ color: white;
+}
+
+.pricing .s2 .btn a {
+ text-decoration: none;
+ color: black;
+ font-size: 20px;
+}
+
+.pricing .s3 {
+ -ms-grid-column-align: center;
+ justify-self: center;
+ width: 360px;
+ border: none;
+ display: -ms-grid;
+ display: grid;
+ justify-items: center;
+ border-radius: 20px;
+ margin: 2.5rem 0rem;
+ -webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
+ box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
+ -webkit-transition-duration: 0.3s;
+ transition-duration: 0.3s;
+ background-color: white;
+ -ms-grid-row: 4;
+ -ms-grid-row-span: 1;
+ grid-row: 4/5;
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 1;
+ grid-column: 1/2;
+}
+
+.pricing .s3:hover {
+ -webkit-transform: scale(1.1);
+ transform: scale(1.1);
+}
+
+.pricing .s3:hover .prix {
+ background-color: #658DA7;
+}
+
.pricing .s3 .heading {
font-size: 24px;
padding: 2rem 0rem;
font-weight: bold;
}
-.pricing .s1 .prix,
-.pricing .s2 .prix,
.pricing .s3 .prix {
font-size: 28px;
padding: 1rem 0rem;
@@ -171,59 +363,137 @@ body {
transition-duration: 0.6s;
}
-.pricing .s1 .ul,
-.pricing .s2 .ul,
.pricing .s3 .ul {
line-height: 36px;
+ padding: 1rem 0rem;
}
-.pricing .s1 .ul hr,
-.pricing .s2 .ul hr,
-.pricing .s3 .ul hr {
- width: 120%;
- margin-left: -3rem;
-}
-
-.pricing .s1 .ul li,
-.pricing .s2 .ul li,
.pricing .s3 .ul li {
list-style-type: none;
+ border-bottom: 1px solid black;
}
-.pricing .s1 .detail,
-.pricing .s2 .detail,
-.pricing .s3 .detail {
+.pricing .s3 .btn {
width: 90px;
background-color: #f0f0f0;
height: 42px;
border-radius: 13px;
- margin-bottom: 1.5rem;
- padding: 1rem 0rem 0rem 2rem;
+ margin: auto;
+ padding: 1rem 0rem 0.2rem 2rem;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
+ margin-bottom: 1rem;
}
-.pricing .s1 .detail:hover,
-.pricing .s2 .detail:hover,
-.pricing .s3 .detail:hover {
+.pricing .s3 .btn:hover {
-webkit-transform: scale(1.1);
transform: scale(1.1);
+ background-color: #658da7;
}
-.pricing .s1 .detail:hover a,
-.pricing .s2 .detail:hover a,
-.pricing .s3 .detail:hover a {
+.pricing .s3 .btn:hover a {
color: white;
}
-.pricing .s1 .detail a,
-.pricing .s2 .detail a,
-.pricing .s3 .detail a {
+.pricing .s3 .btn a {
text-decoration: none;
color: black;
font-size: 20px;
}
+.pricing .detail-s1 {
+ z-index: -1;
+ -ms-grid-column-align: center;
+ justify-self: center;
+ border: none;
+ border-radius: 20px;
+ margin: 2.5rem 0rem;
+ -webkit-transition-duration: 0.3s;
+ transition-duration: 0.3s;
+ background-color: white;
+ width: 360px;
+ text-align: center;
+ -ms-grid-row: 2;
+ -ms-grid-row-span: 1;
+ grid-row: 2/3;
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 1;
+ grid-column: 1/2;
+}
+
+.pricing .detail-s2 {
+ z-index: -1;
+ -ms-grid-column-align: center;
+ justify-self: center;
+ border: none;
+ border-radius: 20px;
+ margin: 2.5rem 0rem;
+ -webkit-transition-duration: 0.3s;
+ transition-duration: 0.3s;
+ background-color: white;
+ width: 360px;
+ text-align: center;
+ -ms-grid-row: 3;
+ -ms-grid-row-span: 1;
+ grid-row: 3/4;
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 1;
+ grid-column: 1/2;
+}
+
+@media only screen and (min-width: 768px) {
+ .pricing .detail-s2 {
+ -ms-grid-row: 2;
+ -ms-grid-row-span: 1;
+ grid-row: 2/3;
+ -ms-grid-column: 2;
+ -ms-grid-column-span: 1;
+ grid-column: 2/3;
+ }
+}
+
+.pricing .detail-s3 {
+ z-index: -1;
+ -ms-grid-column-align: center;
+ justify-self: center;
+ border: none;
+ border-radius: 20px;
+ margin: 2.5rem 0rem;
+ -webkit-transition-duration: 0.3s;
+ transition-duration: 0.3s;
+ background-color: white;
+ width: 360px;
+ text-align: center;
+ -ms-grid-row: 4;
+ -ms-grid-row-span: 1;
+ grid-row: 4/5;
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 1;
+ grid-column: 1/2;
+}
+
+@media only screen and (min-width: 768px) {
+ .pricing .detail-s3 {
+ -ms-grid-row: 3;
+ -ms-grid-row-span: 1;
+ grid-row: 3/4;
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 2;
+ grid-column: 1/3;
+ }
+}
+
+@media only screen and (min-width: 1440px) {
+ .pricing .detail-s3 {
+ -ms-grid-row: 2;
+ -ms-grid-row-span: 1;
+ grid-row: 2/3;
+ -ms-grid-column: 3;
+ -ms-grid-column-span: 1;
+ grid-column: 3/4;
+ }
+}
+
@media only screen and (min-width: 768px) {
.pricing {
-ms-grid-columns: 1fr 1fr;
diff --git a/css/PRICING/style.css.map b/css/PRICING/style.css.map
index 0365bb3..b6070ae 100644
--- a/css/PRICING/style.css.map
+++ b/css/PRICING/style.css.map
@@ -1,6 +1,6 @@
{
"version": 3,
- "mappings": "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",
+ "mappings": "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",
"sources": [
"style.scss",
"_mixins.scss"
diff --git a/css/PRICING/style.scss b/css/PRICING/style.scss
index 1d032cc..7e47182 100644
--- a/css/PRICING/style.scss
+++ b/css/PRICING/style.scss
@@ -13,7 +13,20 @@ body {
.title {
text-align: center;
+ font-size: 24px;
+ font-weight: bold;
+ padding-bottom: 40px;
+ color: #658DA7;
+ hr{
+ width: 270px;
+ margin: auto;
+ height: 3px;
+ background: #658DA7;
+ border-radius: 1rem;
+
+ }
}
+
.person {
display: grid;
@@ -40,10 +53,12 @@ body {
.commentaire {
margin: 1rem;
- padding: 1rem;
- background-color: lightgray;
+ background-color: #f0f0f0;
border-radius: 20px;
+ p{
+ padding: 2rem;
+ }
}
@@ -73,7 +88,7 @@ body {
// RESPONSIVE-desktop
@include desktop {
grid-template-columns: 30% 60% 10%;
- font-size: 22px;
+ font-size: 16px;
margin-right: 3rem;
.title {
@@ -96,15 +111,71 @@ body {
.title {
text-align: center;
+ font-size: 24px;
+ font-weight: bold;
+ padding-bottom: 40px;
+ color: #658DA7;
+ hr{
+ width: 192px;
+ margin: auto;
+ height: 3px;
+ background: #658DA7;
+ border-radius: 1rem;
+
+ }
@include desktop{
font-size: 32px;
}
}
+
+
+ .s1{
+ @include pricings();
+ grid-row: 2/3;
+ grid-column: 1/2;
+ }
+ .s2{
+ @include pricings();
+ grid-row: 3/4;
+ grid-column: 1/2;
- .s1,
- .s2,
- .s3 {
+ }
+ .s3{
@include pricings();
+ grid-row: 4/5;
+ grid-column: 1/2;
+
+ }
+ .detail-s1{
+ @include details();
+ grid-row: 2/3;
+ grid-column: 1/2;
+
+
+ }
+ .detail-s2{
+ @include details();
+ grid-row: 3/4;
+ grid-column: 1/2;
+ @include TAB{
+ grid-row: 2/3;
+ grid-column: 2/3;
+ }
+
+
+ }
+ .detail-s3{
+ @include details();
+ grid-row: 4/5;
+ grid-column: 1/2;
+ @include TAB{
+ grid-row: 3/4;
+ grid-column: 1/3;
+ }
+ @include desktop{
+ grid-row: 2/3;
+ grid-column: 3/4;
+ }
}
@include TAB {
diff --git a/css/header/hejjami.css b/css/header/hejjami.css
index 88d7e52..daa5b01 100644
--- a/css/header/hejjami.css
+++ b/css/header/hejjami.css
@@ -4,42 +4,63 @@ header {
display: grid;
justify-items: center;
background-image: url(../../img/testbg.jpg);
- background-repeat: no-repeat;
- background-size: cover;
- -webkit-animation: slider 15s infinite;
- animation: slider 15s infinite;
+ background-repeat: no-repeat;
+ background-size: cover;
+ -webkit-animation: slider 70s infinite;
+ animation: slider 70s infinite;
}
@-webkit-keyframes slider {
- 25% {
- background-image: url(../../img/teastbg2.jpg);
+ 15% {
+ background-image: url(../../img/testbg2.ppg);
}
- 50% {
- background-image: url(../../img/bg-header4.jpg);
+ 30% {
+ background-image: url(../../img/testbg3.png);
+ }
+ 45% {
+ background-image: url(../../img/testbg4.png);
+ }
+ 60% {
+ background-image: url(../../img/testbg5.png);
}
75% {
- background-image: url(../../img/testbg3.jpg);
+ background-image: url(../../img/testbg6.png);
}
+ 90% {
+ background-image: url(../../img/testbg7.png);
+ }
100% {
background-image: url(../../img/testbg.jpg);
}
}
@keyframes slider {
- 25% {
- background-image: url(../../img/teastbg2.jpg);
+ 15% {
+ background-image: url(../../img/testbg2.png);
+ }
+ 30% {
+ background-image: url(../../img/testbg3.png);
+ }
+ 45% {
+ background-image: url(../../img/testbg4.png);
}
- 50% {
- background-image: url(../../img/bg-header4.jpg);
+ 60% {
+ background-image: url(../../img/testbg5.png);
}
75% {
- background-image: url(../../img/testbg3.jpg);
+ background-image: url(../../img/testbg6.png);
}
+ 90% {
+ background-image: url(../../img/testbg7.png);
+ }
100% {
background-image: url(../../img/testbg.jpg);
}
}
+header a {
+ color: white;
+}
header nav {
width: 90%;
display: -ms-grid;
@@ -146,6 +167,8 @@ header nav .humberger .line {
header .title {
text-align: center;
+ -ms-grid-column-align: center;
+ justify-self: center;
color: white;
}
@@ -166,10 +189,62 @@ header .title {
header .paragraphe {
text-align: center;
+ -ms-grid-column-align: center;
+ justify-self: center;
color: white;
padding: 1rem;
}
+
+.dropdown {
+ float: left;
+ overflow: hidden;
+}
+
+.dropdown .dropbtn {
+ font-size: 16px;
+ border: none;
+ outline: none;
+ color: white;
+ font-weight: bold;
+ background-color: inherit;
+ font-family: inherit;
+ margin-left: 25px;
+}
+
+.navbar a:hover, .dropdown:hover .dropbtn {
+ background-color: #658da7;
+}
+
+.dropdown-content {
+ display: none;
+ position: absolute;
+ background-color: #f9f9f9;
+ min-width: 160px;
+ box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+ z-index: 1;
+}
+
+.dropdown-content a {
+ float: none;
+ color: black;
+ padding: 12px 16px;
+ text-decoration: none;
+ display: block;
+ text-align: left;
+}
+
+.dropdown-content a:hover {
+ background-color: #ddd;
+}
+
+.dropdown:hover .dropdown-content {
+ display: block;
+}
+
+
+
+
@media only screen and (min-width: 768px) {
header .paragraphe {
font-size: 24px;
diff --git a/css/header/hejjami.css.map b/css/header/hejjami.css.map
index 4ae3438..263d1aa 100644
--- a/css/header/hejjami.css.map
+++ b/css/header/hejjami.css.map
@@ -1,6 +1,6 @@
{
"version": 3,
- "mappings": "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",
+ "mappings": "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",
"sources": [
"hejjami.scss"
],
diff --git a/css/header/hejjami.scss b/css/header/hejjami.scss
index 3da97a2..a00b7b9 100644
--- a/css/header/hejjami.scss
+++ b/css/header/hejjami.scss
@@ -1,100 +1,184 @@
@mixin TAB {
- @media only screen and (min-width:768px){
+ @media only screen and (min-width: 768px) {
@content;
-
}
}
-@mixin desktop {
- @media only screen and (min-width:1440px){
+
+@mixin desktop {
+ @media only screen and (min-width: 1440px) {
@content;
-
}
+}
-
+@mixin mobile {
+ @media only screen and (min-width: 375px) {
+ @content;
+ }
+}
+a {
+ color:white;
}
-header{
+header {
font-family: 'Poppins', sans-serif;
display: grid;
- justify-self: center;
background-image: url(../../img/testbg.jpg);
+ justify-self: center;
background-repeat: no-repeat;
background-size: cover;
- animation: slider 15s infinite;
+ animation: slider 60s infinite;
@keyframes slider {
- 25%{
- background-image: url(../../img/teastbg2.jpg);
- }
- 50%{
- background-image: url(../../img/bg-header4.jpg);
- }
- 75%{
- background-image: url(../../img/testbg3.jpg);
- }
- 100%{
+ 15% {
+ background-image: url(../../img/testbg2.png);
+ }
+ 30% {
+ background-image: url(../../img/testbg3.png);
+ }
+ 45% {
+ background-image: url(../../img/testbg4.png);
+ }
+ 60% {
+ background-image: url(../../img/testbg5.png);
+ }
+ 75% {
+ background-image: url(../../img/testbg6.png);
+ }
+ 90% {
+ background-image: url(../../img/testbg7.png);
+ }
+ 100% {
background-image: url(../../img/testbg.jpg);
- }
-
+ }
}
-
- nav{
+ nav {
width: 90%;
display: grid;
padding: 1rem;
align-items: center;
justify-items: center;
- grid-template-columns: 1fr 1fr 1fr;
- @include desktop(){
- grid-template-columns: 1fr 3fr;
+ grid-template-columns: 1fr 1fr 1fr 1fr;
+ @include desktop() {
+ grid-template-columns: 1fr 1fr 1fr 1fr;
}
- .logo{
- img{
- @include desktop(){
+ .logo {
+ img {
+ @include desktop() {
height: 100px;
width: 100px;
- }
+ }
}
}
- .menu{
+ .navbar {
width: 100%;
justify-content: space-between;
display: flex;
- .ul{
- display: none;
- color: white;
- font-weight: bold;
- ul{
- .il{
- margin: 2rem;
- }
- }
- @include desktop(){
+
+ @include desktop() {
display: flex;
}
+ @include TAB() {
+ display: none;
+ }
}
- .search{
+ .search {
display: flex;
align-items: center;
- margin-left: 2rem;
- justify-self: end;
- input{
- border: none;
- border-radius: 30px;
- width: 30vw;
- font-size: 14px;
- padding: 0.3rem;
- @include desktop(){
- width: 10vw;
- }
+ //margin-left: 2rem;
+ //justify-self: end;
+ input {
+ border: none;
+ border-radius: 30px;
+ width: 30vw;
+ font-size: 14px;
+ padding: 0.3rem;
+ @include desktop() {
+ width: 10vw;
+ }
+
}
}
}
- .humberger{
+
+
+
+
+.navbar{
+ .dropdown {
+ float: left;
+ overflow: hidden;
+ }
+
+ .dropdown .dropbtn {
+ font-size: 16px;
+ border: none;
+ outline: none;
+ color: white;
+
+ background-color: inherit;
+ font-family: inherit;
+ margin: 0;
+ }
+
+ .navbar a:hover, .dropdown:hover .dropbtn {
+ background-color: red;
+ }
+
+ .dropdown-content {
+ display: none;
+ position: absolute;
+ background-color: #f9f9f9;
+ min-width: 160px;
+ box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+ z-index: 1;
+ }
+
+ .dropdown-content a {
+ float: none;
+ color: black;
+ padding: 12px 16px;
+ text-decoration: none;
+ display: block;
+ text-align: left;
+ }
+
+ .dropdown-content a:hover {
+ background-color: #ddd;
+ }
+
+ .dropdown:hover .dropdown-content {
+ display: block;
+ }
+ @include TAB() {
+ display: none;
+ }
+ @include mobile() {
+ display: none;
+ }
+ @include desktop() {
+ display: flex;
+ }
+}
+.search {
+ @include TAB()
+ {
+ grid-column: 2/3;
+ display: flex;
+ }
+ @include desktop(()
+ {
+ grid-column: 3;
+ display: grid;
+ }
+}
+
+
+
+ .humberger {
margin-top: 10px;
width: 40px;
height: 40px;
border-radius: 20%;
cursor: pointer;
- .line{
+ .line {
cursor: pointer;
width: 70%;
height: 15%;
@@ -103,42 +187,44 @@ header{
border-radius: 20%;
margin: 3px;
}
- @include desktop(){
+ @include desktop() {
display: none;
}
}
}
- .title{
+ .title {
text-align: center;
+ justify-self: center;
color: white;
- @include TAB(){
+ justify-self: center;
+ @include TAB() {
font-size: 24px;
max-width: 70%;
}
- @include desktop(){
+ @include desktop() {
font-size: 28px;
align-self: flex-end;
}
-
}
- .paragraphe{
+ .paragraphe {
text-align: center;
+ justify-self: center;
color: white;
padding: 1rem;
- @include TAB(){
+justify-self: center;
+ @include TAB() {
font-size: 24px;
-
max-width: 50%;
}
- @include desktop(){
+ @include desktop() {
font-size: 24px;
-
max-width: 50%;
}
}
- .button{
- margin-bottom:2rem;
- button{
+ .button {
+ margin-bottom: 2rem;
+ justify-self: center;
+ button {
font-family: 'Poppins', sans-serif;
background-color: #658da7;
border: none;
@@ -147,27 +233,23 @@ header{
font-weight: bold;
width: 30vw;
height: 35px;
- @include TAB(){
+ @include TAB() {
font-size: 24px;
width: 20vw;
height: 45px;
-
}
- @include desktop(){
+ @include desktop() {
font-size: 24px;
width: 20vw;
height: 45px;
-
}
}
-
}
- @include TAB(){
+ @include TAB() {
width: 100%;
}
- @include desktop(){
+ @include desktop() {
width: 100%;
height: 100vh;
}
-
}
\ No newline at end of file
diff --git a/css/oumaima.css b/css/oumaima.css
deleted file mode 100644
index eb5df9d..0000000
--- a/css/oumaima.css
+++ /dev/null
@@ -1,127 +0,0 @@
-*{
- margin: 0px;
- padding: 0px;
-}
- .containers{
- font-family: poppins, sans-serif;
- text-align: center;
- margin-top: 3rem;
- margin-bottom: 3rem;
- font-size: 1rem;
- font-weight: bold;
- color: rgb(10, 10, 10);
- }
- .line{
- background: rgb(10, 10, 10);
- width: 20rem;
- height: 3px;
- border-radius: 1rem;
- margin: auto;
- }
- .titre{
- font-size: 24px;
- text-align: center;
- }
- .Disp{
- font-size: 16px;
- text-align: center;
- margin-left: 2rem;
- margin-right: 2REM;
- margin-top: 3rem;
- color: rgb(10, 10, 10)
- }
- .box1 img{
- border-radius: 50%;
- height:20vh;
- margin: 3rem 0rem 0rem;
- }
- .box2 img {
- border-radius: 50%;
- height:20vh;
- margin: 3rem 0rem 0rem;
- }
- .box3 img {
- border-radius: 50%;
- height:20vh;
- margin: 3rem 0rem 0rem;
- }
-
- .box4 img {
- border-radius: 50%;
- height:20vh;
- margin: 3rem 0rem 0rem;
- }
- .box5 img{
- border-radius: 50%;
- height:20vh;
- margin: 3rem 0rem 0rem;
- }
- .box6 img {
- border-radius: 50%;
- height:20vh;
- margin: 3rem 0rem 0rem;
- }
- .profil{
- color: lightslategrey;
- }
- .name{
- font-size: 32px;
-
- }
- .nos-clients{
- background-color: lightgray;
- margin-top: 2rem;
- }
- @media only screen and (min-width: 768px){
- .article{
-
- display: grid;
- grid-template-columns: 1fr 1fr;
- grid-template-rows: 1fr 1fr 1fr;
-
- }
- .clients{
- display: grid;
- grid-template-columns: 1fr 1fr 1fr;
- grid-template-rows: 1fr 1fr;
-
- }
- .img4{
- grid-column: 1/3;
- grid-row: 2/3;
- }
- .img5{
- grid-column: 2/4;
- grid-row: 2/3;
- }
-
- }
- @media only screen and (min-width: 1440px) {
- .article{
- display: grid;
- grid-template-columns: 1fr 1fr 1fr;
- grid-template-rows: 1fr 1fr;
- }
- .clients{
- display: grid;
- grid-template-columns: 1fr 1fr 1fr ;
- grid-template-rows: 1fr;
- }
- .img4{
- grid-column: 4/5;
- grid-row: 1/2;
- }
- .img5{
- grid-column: 5/6;
- grid-row: 1/2;
- }
-
- }
-
-
-
-
-
-
-
-
diff --git a/css/portefolio/porte.css b/css/portefolio/porte.css
new file mode 100644
index 0000000..cd6979a
--- /dev/null
+++ b/css/portefolio/porte.css
@@ -0,0 +1,167 @@
+.Portfolio {
+ text-align: center;
+ margin-top: 5%;
+ font-family: 'Poppins', sans-serif;
+}
+
+.Portfolio .portefolio-text {
+ color: #c1d5db;
+ font-style: normal;
+ font-weight: bold;
+ margin-top: 5%;
+}
+
+.Portfolio .portefolio-title {
+ text-transform: uppercase;
+ font-size: 24px;
+ font-weight: bold;
+ color: #658da7;
+}
+
+.Portfolio .portefolio-ligne {
+ background-color: #c1d5db;
+ margin: 20px auto;
+ width: 25%;
+ height: 3px;
+ border: none;
+}
+
+.Portfolio .portefolio-text1 {
+ font-family: 'Poppins', sans-serif;
+ font-size: 24px;
+ color: #6F6E6E;
+ text-align: center;
+ font-style: normal;
+ font-weight: lighter;
+}
+
+@media only screen and (max-width: 768px) {
+ .Portfolio .portefolio-text1 {
+ max-width: 80%;
+ margin-left: 10%;
+ font-size: 16px;
+ }
+}
+
+@media only screen and (max-width: 560px) {
+ .Portfolio .portefolio-text1 {
+ width: 80%;
+ margin-left: 40px;
+ font-size: 14px;
+ }
+}
+
+.Portfolio div .portefolio-liste {
+ list-style-type: none;
+ text-decoration: none;
+ margin: 2% auto;
+ display: inline-block;
+}
+
+.Portfolio div .list1 {
+ float: left;
+}
+
+.Portfolio div .list1 a {
+ padding: 2rem;
+ margin-top: 3%;
+ text-decoration: none;
+ color: #658da7;
+ font-family: 'Poppins', sans-serif;
+ font-size: 16px;
+ font-weight: bold;
+}
+
+@media only screen and (max-width: 768px) {
+ .Portfolio div .list1 a {
+ font-size: 20px;
+ padding: 1rem;
+ }
+}
+
+@media only screen and (max-width: 560px) {
+ .Portfolio div .list1 a {
+ font-size: 8px;
+ padding: 0.1rem;
+ margin-left: 20px;
+ }
+}
+
+.Portfolio div .lien:focus {
+ background: #c1d5db;
+ color: white;
+ border-radius: 20px;
+}
+
+.Portfolio div .lien:hover {
+ color: red;
+ -webkit-text-decoration: red;
+ text-decoration: red;
+}
+
+.portefolio-flex {
+ display: -webkit-box;
+ display: -ms-flexbox;
+ display: flex;
+ margin: 2% auto;
+ -webkit-box-orient: horizontal;
+ -webkit-box-direction: normal;
+ -ms-flex-flow: row wrap;
+ flex-flow: row wrap;
+ -ms-flex-pack: distribute;
+ justify-content: space-around;
+ width: 90%;
+}
+
+@media only screen and (max-width: 560px) {
+ .portefolio-flex {
+ width: 80%;
+ display: -ms-grid;
+ display: grid;
+ -ms-grid-columns: 1fr 1fr;
+ grid-template-columns: 1fr 1fr;
+ grid-gap: 20px;
+ margin: 10%;
+ padding: 0;
+ }
+}
+
+.portefolio-flex .inp {
+ text-align: center;
+ width: 28%;
+ border-radius: 3px;
+ margin: 1%;
+ -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
+ box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
+}
+
+@media only screen and (max-width: 560px) {
+ .portefolio-flex .inp {
+ max-width: 150px;
+ width: 100%;
+ -ms-grid-column-align: center;
+ justify-self: center;
+ }
+}
+
+@media only screen and (max-width: 560px) {
+ .portefolio-flex .port-9 {
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 2;
+ grid-column: 1/3;
+ -ms-grid-column-align: center;
+ justify-self: center;
+ }
+}
+
+.portefolio-flex .b {
+ width: 100%;
+ margin-top: 5%;
+}
+
+.portefolio-flex .b:hover {
+ opacity: 0.3;
+ -webkit-transition: all 1s ease;
+ transition: all 1s ease;
+}
+/*# sourceMappingURL=porte.css.map */
\ No newline at end of file
diff --git a/css/portefolio/porte.css.map b/css/portefolio/porte.css.map
new file mode 100644
index 0000000..a976b29
--- /dev/null
+++ b/css/portefolio/porte.css.map
@@ -0,0 +1,9 @@
+{
+ "version": 3,
+ "mappings": "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",
+ "sources": [
+ "porte.scss"
+ ],
+ "names": [],
+ "file": "porte.css"
+}
\ No newline at end of file
diff --git a/css/portefolio/porte.scss b/css/portefolio/porte.scss
new file mode 100644
index 0000000..de0fb0d
--- /dev/null
+++ b/css/portefolio/porte.scss
@@ -0,0 +1,171 @@
+@mixin tab {
+ @media only screen and (max-width:768px) {
+ @content;
+ }
+
+}
+
+@mixin phone {
+ @media only screen and (max-width:560px) {
+ @content;
+ }
+}
+
+
+
+.Portfolio {
+ text-align: center;
+ margin-top: 5%;
+ font-family: 'Poppins', sans-serif;
+
+
+ .portefolio-text {
+ color: #c1d5db;
+ font-style: normal;
+ font-weight: bold;
+ margin-top: 5%;
+
+ }
+
+ .portefolio-title {
+ text-transform: uppercase;
+ font-size: 24px;
+ font-weight: bold;
+ color: #658da7;
+ }
+
+ .portefolio-ligne {
+ background-color: #c1d5db;
+ margin: 20px auto;
+ width: 25%;
+ height: 3px;
+ border: none;
+ }
+
+ .portefolio-text1 {
+ font-family: 'Poppins', sans-serif;
+ font-size: 24px;
+ color: #6F6E6E;
+ text-align: center;
+ font-style: normal;
+ font-weight: lighter;
+
+ @include tab() {
+ max-width: 80%;
+ margin-left: 10%;
+ font-size: 16px;
+ }
+
+ @include phone() {
+ width: 80%;
+ margin-left: 40px;
+ font-size: 14px;
+ }
+
+
+ }
+
+ div {
+ .portefolio-liste {
+
+ list-style-type: none;
+ text-decoration: none;
+ margin: 2% auto;
+ display: inline-block;
+ }
+
+ .list1 {
+ float: left;
+
+ a {
+
+ padding: 2rem;
+ margin-top: 3%;
+ text-decoration: none;
+ color: #658da7;
+ font-family:'Poppins', sans-serif;
+ font-size: 16px;
+ font-weight: bold;
+
+
+ @include tab {
+ font-size: 20px;
+ padding: 1rem;
+ }
+
+ @include phone() {
+ font-size: 8px;
+ padding: 0.1rem;
+ margin-left: 20px;
+ }
+
+
+
+ }
+
+
+ }
+
+ .lien:focus {
+ background: #c1d5db;
+ color: white;
+ border-radius: 20px;
+ }
+
+ .lien:hover {
+ color: red;
+ text-decoration: red;
+ }
+ }
+}
+
+.portefolio-flex {
+ display: flex;
+ margin: 2% auto;
+ flex-flow: row wrap;
+ justify-content: space-around;
+ width: 90%;
+
+ @include phone() {
+ width: 80%;
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ grid-gap: 20px;
+ margin: 10%;
+ padding: 0;
+
+ }
+
+ .inp {
+ text-align: center;
+ width: 28%;
+ border-radius: 3px;
+ margin: 1%;
+ -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
+ box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
+
+ @include phone() {
+ max-width: 150px;
+ width: 100%;
+ justify-self: center;
+ }
+
+ }
+ .port-9{
+ @include phone{
+ grid-column: 1/3;
+ justify-self: center;
+ }
+ }
+
+
+ .b {
+ width: 100%;
+ margin-top: 5%;
+ }
+
+ .b:hover {
+ opacity: 0.3;
+ transition: all 1s ease;
+ }
+}
\ No newline at end of file
diff --git a/css/service/_mixin.scss b/css/service/_mixin.scss
index a2b9b0e..46e7676 100644
--- a/css/service/_mixin.scss
+++ b/css/service/_mixin.scss
@@ -1,42 +1,41 @@
//Start media mobile et tablet//
@mixin mobile {
- @media (max-width: 767px) {
+ @media (max-width: 900px) {
.container1 {
+ width: 100%;
article:first-child {
h2 {
+ font-size: 1.5em;
margin-top: 10%;
}
.service-sous-titre {
- padding: 0.5em;
+ margin: 2% auto;
+ width: 80%;
}
}
.service-flex-cards {
- display: grid;
- grid-template-columns: 1fr;
+ display: block;
.service-cards {
- display: grid;
- grid-template-columns: 1fr;
- grid-template-rows: 1fr 1fr;
- width: 70%;
+ display: block;
+ background-image: url(../../img/service-back-mobile.jpg);
+ background-size: cover;
+ width: 80%;
+ margin: 10% auto;
.service-image {
- display: grid;
- grid-column: 1/2;
- grid-row: 1/2;
- width: 100%;
- height: 100px;
+ display: none;
}
.service-cards-part2 {
- grid-column: 1/2;
- grid-row: 2/3;
.service-titel {
- margin: 5% 0 3%;
- font-size: 1em;
+ font-size: 3em;
+ margin-top: 10%;
}
.service-info {
- padding: 0;
- grid-column: 1/2;
+ width: 40%;
}
}
+ .service-description {
+ transform: rotateX(180deg);
+ }
}
}
.service-presentation {
@@ -56,8 +55,9 @@
}
.service-pre-btn {
margin: 5%;
- width: 80%;
- font-size: .7em;
+ width: 40%;
+ height: 3em;
+ font-size: 1.4em;
color: #ffffff;
float: none;
}
@@ -77,7 +77,7 @@
//End media query mobile et tablet//
//Start media query medium //
@mixin medium {
- @media (min-width: 768px) and (max-width: 1440px) {
+ @media (min-width: 767px) and (max-width: 1527px) {
.container1 {
article:first-child {
.service-sous-titre {
@@ -102,6 +102,28 @@
width: 100%;
height: 200px;
}
+ .flip-card {
+ .service-cards-part2 {
+ .service-titel {
+ font-size: 1em;
+ padding: 1.8em .1em 0;
+ }
+ .service-info {
+ width: 50%;
+ font-size: .6em;
+ border-radius: 7px;
+ padding: 2em 1em;
+ a {}
+ }
+ }
+ .service-description {
+ transform: rotateX(180deg);
+ }
+ }
+ .flip-card:hover {
+ transform: rotateX(180deg);
+ z-index: 9;
+ }
}
}
.service-presentation {
diff --git a/css/service/style.css b/css/service/style.css
index 5e2ffdf..c30dfdd 100644
--- a/css/service/style.css
+++ b/css/service/style.css
@@ -1,7 +1,7 @@
body {
margin: 0;
padding: 0;
- font-family: 'Poppins', sans-serif;
+ font-family: 'poppins', sans-serif;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
@@ -24,15 +24,15 @@ a {
.container1 article:first-child .service-line {
background-color: #c1d5db;
- margin: 20px auto;
+ margin: 3% auto 0;
width: 10%;
height: 5px;
border: none;
}
.container1 article:first-child .service-sous-titre {
- color: #6f6E6E;
- padding: 2em;
+ color: #6e6E6E;
+ padding: 1em 0em 1em;
font-weight: 400;
font-variant: small-caps;
font-size: 2em;
@@ -52,68 +52,161 @@ a {
}
.container1 .service-flex-cards .service-cards {
+ display: -ms-grid;
+ display: grid;
+ -ms-grid-columns: 50% 50%;
+ grid-template-columns: 50% 50%;
+ -ms-grid-rows: 100%;
+ grid-template-rows: 100%;
+ padding: 10px;
+ margin: 2% 0;
background-color: #ffffff;
border: transparent;
border-radius: 10px;
- margin: 3% auto;
- display: inline-block;
width: 28%;
height: 200px;
+ -webkit-box-shadow: 0 0 20px black;
+ box-shadow: 0 0 20px black;
}
.container1 .service-flex-cards .service-cards .service-image {
- float: left;
- width: 50%;
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 1;
+ grid-column: 1/2;
+ -ms-grid-row: 1;
+ -ms-grid-row-span: 1;
+ grid-row: 1/2;
+ -webkit-transition: all 1S ease-in-out;
+ transition: all 1S ease-in-out;
+ width: 100%;
height: 100%;
}
-.container1 .service-flex-cards .service-cards .service-cards-part2 {
+.container1 .service-flex-cards .service-cards .service-image:hover {
+ -webkit-transform: scale(-1, 1);
+ transform: scale(-1, 1);
+}
+
+.container1 .service-flex-cards .service-cards .flip-card {
+ width: 100%;
+ height: 100%;
+ position: relative;
+ -webkit-transform-style: preserve-3d;
+ transform-style: preserve-3d;
+ -webkit-transition: width 1s ease-in-out;
+ transition: width 1s ease-in-out;
+ -ms-grid-column: 2;
+ grid-column: 2/2;
+ -ms-grid-row: 1;
+ -ms-grid-row-span: 1;
+ grid-row: 1/2;
+}
+
+.container1 .service-flex-cards .service-cards .flip-card .flip-card > div {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+}
+
+.container1 .service-flex-cards .service-cards .flip-card .service-cards-part2 {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
-ms-grid-rows: 1fr 1fr;
grid-template-rows: 1fr 1fr;
- grid-gap: 1%;
+ grid-gap: 40px;
+ z-index: 2;
+ -webkit-backface-visibility: hidden;
+ backface-visibility: hidden;
+}
+
+.container1 .service-flex-cards .service-cards .flip-card .service-cards-part2 .service-titel {
+ color: #000;
+ font-weight: bold;
+ font-size: 1em;
+ text-transform: uppercase;
+ padding: .9em .2em 0;
+ margin-top: 3%;
}
-.container1 .service-flex-cards .service-cards .service-cards-part2 .service-titel {
+.container1 .service-flex-cards .service-cards .flip-card .service-cards-part2 .service-info {
+ margin: 0 auto;
+ width: 80%;
+ background-color: #658DA7;
+ padding: 1em;
+ border-radius: 20px;
+ font-family: 'Tomorrow', sans-serif;
+}
+
+.container1 .service-flex-cards .service-cards .flip-card .service-cards-part2 .service-info a {
+ color: #000;
+ font-style: bolder;
+ font-size: larger;
+ text-transform: uppercase;
+}
+
+.container1 .service-flex-cards .service-cards .flip-card .service-cards-part2 .service-info:hover {
+ background-color: #c1d5db;
+ border: #6e6E6E 1px;
+}
+
+.container1 .service-flex-cards .service-cards .flip-card .service-cards-part2 .service-info:hover a {
+ color: #000;
+}
+
+.container1 .service-flex-cards .service-cards .flip-card .service-description {
+ display: -ms-grid;
+ display: grid;
+ -ms-grid-columns: 1fr 1fr;
+ grid-template-columns: 1fr 1fr;
+ grid-row: 1fr 1fr;
+ background-color: #f2f2f2;
+ -webkit-box-shadow: 0 0 20px #f2f2f2;
+ box-shadow: 0 0 20px #f2f2f2;
+ border-radius: 10px;
+ z-index: 1;
+ -webkit-backface-visibility: hidden;
+ backface-visibility: hidden;
+ -webkit-transform: rotateX(180deg);
+ transform: rotateX(180deg);
+ padding: 1em;
+ text-align: left;
+}
+
+.container1 .service-flex-cards .service-cards .flip-card .service-description p:first-of-type {
+ font-size: 1.5em;
color: #658DA7;
font-weight: 700;
- font-size: 20px;
- text-transform: capitalize;
- width: 100%;
- margin: 15% auto;
+ text-transform: uppercase;
-ms-grid-row: 1;
-ms-grid-row-span: 1;
grid-row: 1/2;
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 2;
+ grid-column: 1/3;
+ margin: 5% auto;
}
-.container1 .service-flex-cards .service-cards .service-cards-part2 .service-info {
- display: -ms-grid;
- display: grid;
+.container1 .service-flex-cards .service-cards .flip-card .service-description p:last-child {
+ color: #000000;
+ font-size: 1.2em;
+ padding: auto;
+ font-size: 1.3em;
-ms-grid-row: 2;
-ms-grid-row-span: 1;
grid-row: 2/3;
- float: left;
- padding: 10% 0 0 40%;
-}
-
-.container1 .service-flex-cards .service-cards .service-cards-part2 .service-info a {
- color: #6f6E6E;
-}
-
-.container1 .service-flex-cards .service-cards .service-cards-part2 .service-info a:hover .service-info {
- color: #e7e7e7;
+ -ms-grid-column: 1;
+ -ms-grid-column-span: 2;
+ grid-column: 1/3;
+ text-align: center;
}
-.container1 .service-flex-cards .service-cards .service-description {
- text-align: justify;
- color: #ffffff;
- width: 28%;
- height: 200px;
- border: 10px black solid;
- background-color: coral;
+.container1 .service-flex-cards .service-cards .flip-card:hover {
+ -webkit-transform: rotateX(180deg) translateY(-200px);
+ transform: rotateX(180deg) translateY(-200px);
}
.container1 .service-presentation {
@@ -150,17 +243,18 @@ a {
.container1 .service-presentation .service-pre-part1 .service-pre-btn {
margin: 5% 0 0;
- background-color: #658da7;
- border-radius: 30px;
- border: none;
+ background-color: #658DA7;
+ border-radius: 10px;
+ border: 3px solid #000;
width: 40%;
height: 2em;
font-size: 2em;
+ font-family: 'Tomorrow', sans-serif;
float: left;
}
.container1 .service-presentation .service-pre-part1 .service-pre-btn a {
- color: #c1d5db;
+ color: #000000;
}
.container1 .service-presentation .service-pre-part1 .service-pre-btn a:hover {
@@ -204,57 +298,41 @@ a {
}
}
-@media (max-width: 767px) {
+@media (max-width: 900px) {
+ .container1 {
+ width: 100%;
+ }
.container1 article:first-child h2 {
+ font-size: 1.5em;
margin-top: 10%;
}
.container1 article:first-child .service-sous-titre {
- padding: 0.5em;
+ margin: 2% auto;
+ width: 80%;
}
.container1 .service-flex-cards {
- display: -ms-grid;
- display: grid;
- -ms-grid-columns: 1fr;
- grid-template-columns: 1fr;
+ display: block;
}
.container1 .service-flex-cards .service-cards {
- display: -ms-grid;
- display: grid;
- -ms-grid-columns: 1fr;
- grid-template-columns: 1fr;
- -ms-grid-rows: 1fr 1fr;
- grid-template-rows: 1fr 1fr;
- width: 70%;
+ display: block;
+ background-image: url(../../img/service-back-mobile.jpg);
+ background-size: cover;
+ width: 80%;
+ margin: 10% auto;
}
.container1 .service-flex-cards .service-cards .service-image {
- display: -ms-grid;
- display: grid;
- -ms-grid-column: 1;
- -ms-grid-column-span: 1;
- grid-column: 1/2;
- -ms-grid-row: 1;
- -ms-grid-row-span: 1;
- grid-row: 1/2;
- width: 100%;
- height: 100px;
- }
- .container1 .service-flex-cards .service-cards .service-cards-part2 {
- -ms-grid-column: 1;
- -ms-grid-column-span: 1;
- grid-column: 1/2;
- -ms-grid-row: 2;
- -ms-grid-row-span: 1;
- grid-row: 2/3;
+ display: none;
}
.container1 .service-flex-cards .service-cards .service-cards-part2 .service-titel {
- margin: 5% 0 3%;
- font-size: 1em;
+ font-size: 3em;
+ margin-top: 10%;
}
.container1 .service-flex-cards .service-cards .service-cards-part2 .service-info {
- padding: 0;
- -ms-grid-column: 1;
- -ms-grid-column-span: 1;
- grid-column: 1/2;
+ width: 40%;
+ }
+ .container1 .service-flex-cards .service-cards .service-description {
+ -webkit-transform: rotateX(180deg);
+ transform: rotateX(180deg);
}
.container1 .service-presentation {
-ms-grid-columns: 1fr;
@@ -279,8 +357,9 @@ a {
}
.container1 .service-presentation .service-pre-part1 .service-pre-btn {
margin: 5%;
- width: 80%;
- font-size: .7em;
+ width: 40%;
+ height: 3em;
+ font-size: 1.4em;
color: #ffffff;
float: none;
}
@@ -297,7 +376,7 @@ a {
}
}
-@media (min-width: 768px) and (max-width: 1440px) {
+@media (min-width: 767px) and (max-width: 1527px) {
.container1 article:first-child .service-sous-titre {
max-width: 90%;
margin: auto;
@@ -332,6 +411,25 @@ a {
width: 100%;
height: 200px;
}
+ .container1 .service-flex-cards .service-cards .flip-card .service-cards-part2 .service-titel {
+ font-size: 1em;
+ padding: 1.8em .1em 0;
+ }
+ .container1 .service-flex-cards .service-cards .flip-card .service-cards-part2 .service-info {
+ width: 50%;
+ font-size: .6em;
+ border-radius: 7px;
+ padding: 2em 1em;
+ }
+ .container1 .service-flex-cards .service-cards .flip-card .service-description {
+ -webkit-transform: rotateX(180deg);
+ transform: rotateX(180deg);
+ }
+ .container1 .service-flex-cards .service-cards .flip-card:hover {
+ -webkit-transform: rotateX(180deg);
+ transform: rotateX(180deg);
+ z-index: 9;
+ }
.container1 .service-presentation {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
@@ -367,12 +465,4 @@ a {
grid-row: 2/3;
}
}
-
-.hidden, .container1 .service-flex-cards .service-cards .service-description {
- display: none;
-}
-
-.visible {
- display: block;
-}
/*# sourceMappingURL=style.css.map */
\ No newline at end of file
diff --git a/css/service/style.css.map b/css/service/style.css.map
index 2604ee2..ba7da8b 100644
--- a/css/service/style.css.map
+++ b/css/service/style.css.map
@@ -1,6 +1,6 @@
{
"version": 3,
- "mappings": "AACA,AAAA,IAAI,CAAC;EACD,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,CAAC;EACV,WAAW,EAAE,qBAAqB;EAClC,UAAU,EAAE,UAAU;CACzB;;AAED,AAAA,CAAC,CAAC;EACE,eAAe,EAAE,IAAI;CACxB;;AAED,AAAA,WAAW,CAAC;EACR,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,IAAI;EACZ,UAAU,EAAE,MAAM;CAuIrB;;AA1ID,AAKQ,WALG,CAIP,OAAO,AAAA,YAAY,CACf,EAAE,CAAC;EACC,KAAK,EAAE,OAAO;EACd,WAAW,EAAE,GAAG;EAChB,MAAM,EAAE,UAAU;CACrB;;AATT,AAUQ,WAVG,CAIP,OAAO,AAAA,YAAY,CAMf,aAAa,CAAC;EACV,gBAAgB,EAAE,OAAO;EACzB,MAAM,EAAE,SAAS;EACjB,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,GAAG;EACX,MAAM,EAAE,IAAI;CACf;;AAhBT,AAiBQ,WAjBG,CAIP,OAAO,AAAA,YAAY,CAaf,mBAAmB,CAAC;EAChB,KAAK,EAAE,OAAO;EACd,OAAO,EAAE,GAAG;EACZ,WAAW,EAAE,GAAG;EAChB,YAAY,EAAE,UAAU;EACxB,SAAS,EAAE,GAAG;CACjB;;AAvBT,AAyBI,WAzBO,CAyBP,mBAAmB,CAAC;EAChB,gBAAgB,EAAE,OAAO;EACzB,OAAO,EAAE,IAAI;EACb,SAAS,EAAE,QAAQ;EACnB,eAAe,EAAE,YAAY;CAmDhC;;AAhFL,AA8BQ,WA9BG,CAyBP,mBAAmB,CAKf,cAAc,CAAC;EACX,gBAAgB,EAAE,OAAO;EACzB,MAAM,EAAE,WAAW;EACnB,aAAa,EAAE,IAAI;EACnB,MAAM,EAAE,OAAO;EACf,OAAO,EAAE,YAAY;EACrB,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,KAAK;CA0ChB;;AA/ET,AAsCY,WAtCD,CAyBP,mBAAmB,CAKf,cAAc,CAQV,cAAc,CAAC;EACX,KAAK,EAAE,IAAI;EACX,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,IAAI;CACf;;AA1Cb,AA2CY,WA3CD,CAyBP,mBAAmB,CAKf,cAAc,CAaV,oBAAoB,CAAC;EACjB,OAAO,EAAE,IAAI;EACb,qBAAqB,EAAE,GAAG;EAC1B,kBAAkB,EAAE,OAAO;EAC3B,QAAQ,EAAE,EAAE;CAsBf;;AArEb,AAgDgB,WAhDL,CAyBP,mBAAmB,CAKf,cAAc,CAaV,oBAAoB,CAKhB,cAAc,CAAC;EACX,KAAK,EAAE,OAAO;EACd,WAAW,EAAE,GAAG;EAChB,SAAS,EAAE,IAAI;EACf,cAAc,EAAE,UAAU;EAC1B,KAAK,EAAE,IAAI;EACX,MAAM,EAAE,QAAQ;EAChB,QAAQ,EAAE,GAAG;CAChB;;AAxDjB,AAyDgB,WAzDL,CAyBP,mBAAmB,CAKf,cAAc,CAaV,oBAAoB,CAchB,aAAa,CAAC;EACV,OAAO,EAAE,IAAI;EACb,QAAQ,EAAE,GAAG;EACb,KAAK,EAAE,IAAI;EACX,OAAO,EAAE,WAAW;CAOvB;;AApEjB,AA8DoB,WA9DT,CAyBP,mBAAmB,CAKf,cAAc,CAaV,oBAAoB,CAchB,aAAa,CAKT,CAAC,CAAC;EACE,KAAK,EAAE,OAAO;CACjB;;AAhErB,AAiEoB,WAjET,CAyBP,mBAAmB,CAKf,cAAc,CAaV,oBAAoB,CAchB,aAAa,CAQT,CAAC,AAAA,MAAM,CAAC,aAAa,CAAC;EAClB,KAAK,EAAE,OAAO;CACjB;;AAnErB,AAsEY,WAtED,CAyBP,mBAAmB,CAKf,cAAc,CAwCV,oBAAoB,CAAC;EACjB,UAAU,EAAE,OAAO;EACnB,KAAK,EAAE,OAAO;EACd,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,KAAK;EACb,MAAM,EAAE,gBAAgB;EACxB,gBAAgB,EAAE,KAAK;CAE1B;;AA9Eb,AAiFI,WAjFO,CAiFP,qBAAqB,CAAC;EAClB,OAAO,EAAE,IAAI;EACb,qBAAqB,EAAE,OAAO;EAC9B,kBAAkB,EAAE,GAAG;EACvB,UAAU,EAAE,IAAI;EAChB,KAAK,EAAE,IAAI;CAmDd;;AAzIL,AAuFQ,WAvFG,CAiFP,qBAAqB,CAMjB,kBAAkB,CAAC;EACf,WAAW,EAAE,GAAG;EAChB,QAAQ,EAAE,GAAG;EACb,KAAK,EAAE,IAAI;CA6Bd;;AAvHT,AA2FY,WA3FD,CAiFP,qBAAqB,CAMjB,kBAAkB,CAId,EAAE,CAAC;EACC,SAAS,EAAE,KAAK;EAChB,UAAU,EAAE,IAAI;CACnB;;AA9Fb,AA+FY,WA/FD,CAiFP,qBAAqB,CAMjB,kBAAkB,CAQd,MAAM,CAAC;EACH,MAAM,EAAE,SAAS;EACjB,SAAS,EAAE,KAAK;EAChB,UAAU,EAAE,IAAI;CACnB;;AAnGb,AAoGY,WApGD,CAiFP,qBAAqB,CAMjB,kBAAkB,CAad,gBAAgB,CAAC;EACb,MAAM,EAAE,MAAM;EACd,gBAAgB,EAAE,OAAO;EACzB,aAAa,EAAE,IAAI;EACnB,MAAM,EAAE,IAAI;EACZ,KAAK,EAAE,GAAG;EACV,MAAM,EAAE,GAAG;EACX,SAAS,EAAE,GAAG;EACd,KAAK,EAAE,IAAI;CAOd;;AAnHb,AA6GgB,WA7GL,CAiFP,qBAAqB,CAMjB,kBAAkB,CAad,gBAAgB,CASZ,CAAC,CAAC;EACE,KAAK,EAAE,OAAO;CACjB;;AA/GjB,AAgHgB,WAhHL,CAiFP,qBAAqB,CAMjB,kBAAkB,CAad,gBAAgB,CAYZ,CAAC,AAAA,MAAM,CAAC;EACJ,KAAK,EAAE,OAAO;CACjB;;AAlHjB,AAoHY,WApHD,CAiFP,qBAAqB,CAMjB,kBAAkB,CA6Bd,gBAAgB,AAAA,MAAM,CAAC;EACnB,gBAAgB,EAAE,OAAO;CAC5B;;AAtHb,AAwHQ,WAxHG,CAiFP,qBAAqB,CAuCjB,kBAAkB,CAAC;EACf,WAAW,EAAE,GAAG;EAChB,QAAQ,EAAE,GAAG;EACb,gBAAgB,EAAE,4BAA4B;EAC9C,eAAe,EAAE,KAAK;EACtB,mBAAmB,EAAE,GAAG;EACxB,iBAAiB,EAAE,QAAQ;EAC3B,SAAS,EAAE,wBAAwB;CAStC;;AARG,UAAU,CAAV,KAAU;EACN,IAAI;IACA,mBAAmB,EAAE,GAAG;;EAE5B,EAAE;IACE,mBAAmB,EAAE,MAAM;;;;AC/ItC,MAAM,EAAE,SAAS,EAAE,KAAK;EDUjC,AAKQ,WALG,CAIP,OAAO,AAAA,YAAY,CACf,EAAE,CCZc;IACC,UAAU,EAAE,GAAG;GAClB;EDKtB,AAiBQ,WAjBG,CAIP,OAAO,AAAA,YAAY,CAaf,mBAAmB,CCrBc;IAChB,OAAO,EAAE,KAAK;GACjB;EDEtB,AAyBI,WAzBO,CAyBP,mBAAmB,CCzBc;IAChB,OAAO,EAAE,IAAI;IACb,qBAAqB,EAAE,GAAG;GA0B7B;ED5BlB,AA8BQ,WA9BG,CAyBP,mBAAmB,CAKf,cAAc,CC3Bc;IACX,OAAO,EAAE,IAAI;IACb,qBAAqB,EAAE,GAAG;IAC1B,kBAAkB,EAAE,OAAO;IAC3B,KAAK,EAAE,GAAG;GAoBb;ED3BtB,AAsCY,WAtCD,CAyBP,mBAAmB,CAKf,cAAc,CAQV,cAAc,CC9Bc;IACX,OAAO,EAAE,IAAI;IACb,WAAW,EAAE,GAAG;IAChB,QAAQ,EAAE,GAAG;IACb,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,KAAK;GAChB;EDd1B,AA2CY,WA3CD,CAyBP,mBAAmB,CAKf,cAAc,CAaV,oBAAoB,CC5Bc;IACjB,WAAW,EAAE,GAAG;IAChB,QAAQ,EAAE,GAAG;GAShB;ED1B1B,AAgDgB,WAhDL,CAyBP,mBAAmB,CAKf,cAAc,CAaV,oBAAoB,CAKhB,cAAc,CC9Bc;IACX,MAAM,EAAE,OAAO;IACf,SAAS,EAAE,GAAG;GACjB;EDrB9B,AAyDgB,WAzDL,CAyBP,mBAAmB,CAKf,cAAc,CAaV,oBAAoB,CAchB,aAAa,CCnCc;IACV,OAAO,EAAE,CAAC;IACV,WAAW,EAAE,GAAG;GACnB;EDzB9B,AAiFI,WAjFO,CAiFP,qBAAqB,CCpDc;IAClB,qBAAqB,EAAE,GAAG;IAC1B,kBAAkB,EAAE,OAAO;IAC3B,MAAM,EAAE,IAAI;GA2Bf;ED3DlB,AAuFQ,WAvFG,CAiFP,qBAAqB,CAMjB,kBAAkB,CCtDc;IACf,QAAQ,EAAE,GAAG;GAoBhB;EDtDtB,AA2FY,WA3FD,CAiFP,qBAAqB,CAMjB,kBAAkB,CAId,EAAE,CCxDc;IACC,UAAU,EAAE,MAAM;IAClB,UAAU,EAAE,EAAE;GACjB;EDtC1B,AA+FY,WA/FD,CAiFP,qBAAqB,CAMjB,kBAAkB,CAQd,MAAM,CCxDc;IACH,KAAK,EAAE,GAAG;IACV,UAAU,EAAE,MAAM;IAClB,SAAS,EAAE,GAAG;GACjB;ED3C1B,AAoGY,WApGD,CAiFP,qBAAqB,CAMjB,kBAAkB,CAad,gBAAgB,CCxDc;IACb,MAAM,EAAE,EAAE;IACV,KAAK,EAAE,GAAG;IACV,SAAS,EAAE,IAAI;IACf,KAAK,EAAE,OAAO;IACd,KAAK,EAAE,IAAI;GACd;EDlD1B,AAoHY,WApHD,CAiFP,qBAAqB,CAMjB,kBAAkB,CA6Bd,gBAAgB,AAAA,MAAM,CCjEc;IACnB,KAAK,EAAE,OAAO;GACjB;EDrD1B,AAwHQ,WAxHG,CAiFP,qBAAqB,CAuCjB,kBAAkB,CCjEc;IACf,WAAW,EAAE,GAAG;IAChB,QAAQ,EAAE,GAAG;GAChB;;;AASb,MAAM,EAAE,SAAS,EAAE,KAAK,OAAO,SAAS,EAAE,MAAM;EDnEzD,AAiBQ,WAjBG,CAIP,OAAO,AAAA,YAAY,CAaf,mBAAmB,CCqDc;IAChB,SAAS,EAAE,GAAG;IACd,MAAM,EAAE,IAAI;GACf;EDzEtB,AAyBI,WAzBO,CAyBP,mBAAmB,CCkDc;IAChB,OAAO,EAAE,IAAI;IACb,qBAAqB,EAAE,OAAO;IAC9B,kBAAkB,EAAE,GAAG;GAe1B;ED7FlB,AA8BQ,WA9BG,CAyBP,mBAAmB,CAKf,cAAc,CCiDc;IACX,OAAO,EAAE,IAAI;IACb,qBAAqB,EAAE,OAAO;IAC9B,kBAAkB,EAAE,GAAG;IACvB,KAAK,EAAE,GAAG;IACV,MAAM,EAAE,OAAO;GAQlB;ED5FtB,AAsCY,WAtCD,CAyBP,mBAAmB,CAKf,cAAc,CAQV,cAAc,CC+Cc;IACX,OAAO,EAAE,IAAI;IACb,WAAW,EAAE,GAAG;IAChB,QAAQ,EAAE,GAAG;IACb,KAAK,EAAE,IAAI;IACX,MAAM,EAAE,KAAK;GAChB;ED3F1B,AAiFI,WAjFO,CAiFP,qBAAqB,CCac;IAClB,qBAAqB,EAAE,GAAG;IAC1B,kBAAkB,EAAE,OAAO;IAC3B,MAAM,EAAE,IAAI;GAoBf;EDrHlB,AAuFQ,WAvFG,CAiFP,qBAAqB,CAMjB,kBAAkB,CCWc;IACf,QAAQ,EAAE,GAAG;IACb,WAAW,EAAE,GAAG;GAYnB;EDhHtB,AA2FY,WA3FD,CAiFP,qBAAqB,CAMjB,kBAAkB,CAId,EAAE,CCUc;IACC,UAAU,EAAE,MAAM;IAClB,UAAU,EAAE,EAAE;GACjB;EDxG1B,AA+FY,WA/FD,CAiFP,qBAAqB,CAMjB,kBAAkB,CAQd,MAAM,CCUc;IACH,UAAU,EAAE,MAAM;GACrB;ED3G1B,AAoGY,WApGD,CAiFP,qBAAqB,CAMjB,kBAAkB,CAad,gBAAgB,CCQc;IACb,KAAK,EAAE,IAAI;IACX,aAAa,EAAE,EAAE;GACpB;ED/G1B,AAwHQ,WAxHG,CAiFP,qBAAqB,CAuCjB,kBAAkB,CCPc;IACf,WAAW,EAAE,GAAG;IAChB,QAAQ,EAAE,GAAG;GAChB;;;AD2BtB,AAAA,OAAO,EA/IP,WAAW,CAyBP,mBAAmB,CAKf,cAAc,CAwCV,oBAAoB,CAyExB;EACJ,OAAO,EAAE,IAAI;CAChB;;AAED,AAAA,QAAQ,CAAC;EACL,OAAO,EAAE,KAAK;CACjB",
+ "mappings": "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",
"sources": [
"style.scss",
"_mixin.scss"
diff --git a/css/service/style.scss b/css/service/style.scss
index 2d8a239..54590b5 100644
--- a/css/service/style.scss
+++ b/css/service/style.scss
@@ -1,8 +1,12 @@
+$maincolr:#658DA7;
+$childcolr:#c1d5db;
+$fontcolor:#6e6E6E;
@import"./mixin";
+
body {
margin: 0;
padding: 0;
- font-family: 'Poppins', sans-serif;
+ font-family: 'poppins', sans-serif;
box-sizing: border-box;
}
@@ -14,122 +18,211 @@ a {
width: 90%;
margin: auto;
text-align: center;
+
article:first-child {
h2 {
- color: #658DA7;
+ color: $maincolr;
font-weight: 600;
margin: 3% auto 1%;
}
+
.service-line {
- background-color: #c1d5db;
- margin: 20px auto;
+ background-color: $childcolr;
+ margin: 3% auto 0;
width: 10%;
height: 5px;
border: none;
}
+
.service-sous-titre {
- color: #6f6E6E;
- padding: 2em;
+ color: $fontcolor;
+ padding: 1em 0em 1em;
font-weight: 400;
font-variant: small-caps;
font-size: 2em;
}
}
+
.service-flex-cards {
background-color: #f2f2f2;
display: flex;
flex-flow: row wrap;
justify-content: space-around;
+
.service-cards {
+ display: grid;
+ grid-template-columns: 50% 50%;
+ grid-template-rows: 100%;
+ padding: 10px;
+ margin: 2% 0;
background-color: #ffffff;
border: transparent;
border-radius: 10px;
- margin: 3% auto;
- display: inline-block;
width: 28%;
height: 200px;
+ box-shadow: 0 0 20px black;
+
.service-image {
- float: left;
- width: 50%;
+ grid-column: 1/2;
+ grid-row: 1/2;
+ transition: all 1S ease-in-out;
+ width: 100%;
height: 100%;
}
- .service-cards-part2 {
- display: grid;
- grid-template-columns: 1fr;
- grid-template-rows: 1fr 1fr;
- grid-gap: 1%;
- .service-titel {
- color: #658DA7;
- font-weight: 700;
- font-size: 20px;
- text-transform: capitalize;
+
+ .service-image:hover {
+ transform: scale(-1, 1);
+ }
+
+ .flip-card {
+ width: 100%;
+ height: 100%;
+ position: relative;
+ transform-style: preserve-3d;
+ transition: width 1s ease-in-out;
+ grid-column: 2/2;
+ grid-row: 1/2;
+
+ .flip-card>div {
+ position: absolute;
+ top: 0;
+ left: 0;
width: 100%;
- margin: 15% auto;
- grid-row: 1/2;
+ height: 100%;
+ }
+
+ .service-cards-part2 {
+ display: grid;
+ grid-template-columns: 1fr;
+ grid-template-rows: 1fr 1fr;
+ grid-gap: 40px;
+ z-index: 2;
+ backface-visibility: hidden;
+
+ .service-titel {
+ color: #000;
+ font-weight: bold;
+ font-size: 1em;
+ text-transform: uppercase;
+ padding: .9em .2em 0;
+ margin-top: 3%;
+ }
+
+ .service-info {
+ margin: 0 auto;
+ width: 80%;
+ background-color: $maincolr;
+ padding: 1em;
+ border-radius: 20px;
+ font-family: 'Tomorrow', sans-serif;
+
+ a {
+ color: #000;
+ font-style: bolder;
+ font-size: larger;
+ text-transform: uppercase;
+ }
+ }
+
+ .service-info:hover {
+ background-color: $childcolr;
+ border: $fontcolor 1px;
+
+ a {
+ color: #000;
+ }
+ }
}
- .service-info {
+
+ .service-description {
display: grid;
- grid-row: 2/3;
- float: left;
- padding: 10% 0 0 40%;
- a {
- color: #6f6E6E;
+ grid-template-columns: 1fr 1fr;
+ grid-row: 1fr 1fr;
+ background-color: #f2f2f2;
+ box-shadow: 0 0 20px #f2f2f2;
+ border-radius: 10px;
+ z-index: 1;
+ backface-visibility: hidden;
+ transform: rotateX(180deg);
+ padding: 1em;
+ text-align: left;
+
+ p:first-of-type {
+ font-size: 1.5em;
+ color: $maincolr;
+ font-weight: 700;
+ text-transform: uppercase;
+ grid-row: 1/2;
+ grid-column: 1/3;
+ margin: 5% auto;
}
- a:hover .service-info {
- color: #e7e7e7;
+
+ p:last-child {
+ color: #000000;
+ font-size: 1.2em;
+ padding: auto;
+ font-size: 1.3em;
+ grid-row: 2/3;
+ grid-column: 1/3;
+ text-align: center;
}
}
}
- .service-description {
- text-align: justify;
- color: #ffffff;
- width: 28%;
- height: 200px;
- border: 10px black solid;
- background-color: coral;
- @extend .hidden;
+
+ .flip-card:hover {
+ transform: rotateX(180deg) translateY(-200px);
}
}
}
+
.service-presentation {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 1fr;
margin-top: 2.5%;
width: 100%;
+
.service-pre-part1 {
grid-column: 1/2;
grid-row: 1/2;
width: 100%;
+
h3 {
font-size: 2.5em;
text-align: left;
}
+
.text1 {
margin: 3% auto 0;
font-size: 1.5em;
text-align: left;
}
+
.service-pre-btn {
margin: 5% 0 0;
- background-color: #658da7;
- border-radius: 30px;
- border: none;
+ background-color: $maincolr;
+ border-radius: 10px;
+ border: 3px solid #000;
width: 40%;
height: 2em;
font-size: 2em;
+ font-family: 'Tomorrow', sans-serif;
float: left;
+
a {
- color: #c1d5db;
+ color: #000000;
}
+
a:hover {
- color: #658DA7;
+ color: $maincolr;
}
}
+
.service-pre-btn:hover {
- background-color: #c1d5db;
+ background-color: $childcolr;
}
}
+
.service-pre-part2 {
grid-column: 2/3;
grid-row: 1/2;
@@ -138,10 +231,12 @@ a {
background-position: 0 0;
background-repeat: repeat-X;
animation: image 6s linear infinite;
+
@keyframes image {
from {
background-position: 0 0;
}
+
to {
background-position: 0 100%;
}
@@ -152,12 +247,13 @@ a {
@include mobile();
@include medium();
+
// start framework
-.hidden {
+%hidden {
display: none;
}
-.visible {
+%visible {
display: block;
}
diff --git a/css/team/oumaima.css b/css/team/oumaima.css
index 977d750..8701c1f 100644
--- a/css/team/oumaima.css
+++ b/css/team/oumaima.css
@@ -1,62 +1,52 @@
-*{
+* {
margin: 0px;
padding: 0px;
}
- .containers{
- font-family: poppins, sans-serif;
+
+.containers {
+ font-family: poppins, sans-serif;
text-align: center;
margin-top: 3rem;
margin-bottom: 3rem;
font-size: 1rem;
font-weight: bold;
color: rgb(10, 10, 10);
- width: 100%;
- }
- .line{
+}
+
+.line {
background: rgb(10, 10, 10);
- width: 15rem;
+ width: 20rem;
+ background: #658DA7;
+ width: 192PX;
height: 3px;
border-radius: 1rem;
margin: auto;
- }
- .titre{
- font-size: 30px;
+ border-bottom: 2px solid #658DA7;
+}
+
+.titre {
+ font-size: 24px;
text-align: center;
- }
- .Disp{
+ font-weight: bold;
+ color: #658DA7;
+ margin-bottom: 20px;
+}
+
+.Disp {
font-size: 16px;
text-align: center;
margin-left: 2rem;
margin-right: 2REM;
margin-top: 3rem;
color: rgb(10, 10, 10)
- }
- .box1 img{
- border-radius: 50%;
- height:20vh;
- margin: 3rem 0rem 0rem;
- }
- .box3:hover,
- .box1:hover,
- .box2:hover,
- .box4:hover,
- .box5:hover,
- .box6:hover{
- transform: scale(1.2);
- }
- .box3 ,
- .box1,
- .box2,
- .box4,
- .box5,
- .box6{
- transition-duration: 0.6s;
+}
- }
+
.box2 img {
border-radius: 50%;
height:20vh;
margin: 3rem 0rem 0rem;
+
}
.box3 img {
border-radius: 50%;
@@ -78,6 +68,25 @@
height:20vh;
margin: 3rem 0rem 0rem;
}
+ .box3:hover,
+ .box1:hover,
+ .box2:hover,
+ .box4:hover,
+ .box5:hover,
+ .box6:hover{
+ transform: scale(1.1);
+ }
+ .box3 ,
+ .box1,
+ .box2,
+ .box4,
+ .box5,
+ .box6{
+ transition-duration: 0.6s;
+
+ }
+
+
.profil{
color: lightslategrey;
}
@@ -86,61 +95,107 @@
}
.nos-clients{
- background-color: lightgray;
- margin-top: 4rem;
- padding: 4rem 0rem 4rem 0rem;
+ margin-top: 4rem;
+ padding: 4rem 0rem 4rem 0rem;
}
.clients{
- margin-top: 3rem;
+
+ margin-top: 3rem;
}
- @media only screen and (min-width: 768px){
- .article{
-
- display: grid;
- grid-template-columns: 1fr 1fr;
- grid-template-rows: 1fr 1fr 1fr;
- display: grid;
- grid-template-rows: 1fr 1fr;
-
- }
- .img4{
- grid-column: 1/3;
- grid-row: 2/3;
- }
- .img5{
- grid-column: 2/4;
- grid-row: 2/3;
- }
-
- }
- @media only screen and (min-width: 1440px) {
- .article{
- display: grid;
- grid-template-columns: 1fr 1fr 1fr;
- grid-template-rows: 1fr 1fr;
- width: 90%;
- margin: auto;
- }
- .clients{
- display: grid;
- grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
- grid-template-rows: 1fr;
- }
- .img4{
- grid-column: 4/5;
- grid-row: 1/2;
- }
- .img5{
- grid-column: 5/6;
- grid-row: 1/2;
- }
+
- }
+
+.box1 img {
+ border-radius: 50%;
+ height: 20vh;
+ margin: 3rem 0rem 0rem;
+}
+.box2 img {
+ border-radius: 50%;
+ height: 20vh;
+ margin: 3rem 0rem 0rem;
+}
-
-
+.box3 img {
+ border-radius: 50%;
+ height: 20vh;
+ margin: 3rem 0rem 0rem;
+}
+.box4 img {
+ border-radius: 50%;
+ height: 20vh;
+ margin: 3rem 0rem 0rem;
+}
+
+.box5 img {
+ border-radius: 50%;
+ height: 20vh;
+ margin: 3rem 0rem 0rem;
+}
+
+.box6 img {
+ border-radius: 50%;
+ height: 20vh;
+ margin: 3rem 0rem 0rem;
+}
+
+.profil {
+ color: lightslategrey;
+}
+
+.name {
+ font-size: 32px;
+}
+
+.nos-clients {
+ background-color: #F0F0F0;
+ margin-top: 2rem;
+}
+@media only screen and (min-width: 768px) {
+ .article {
+ display: grid;
+ grid-template-columns: 1fr 1fr;
+ grid-template-rows: 1fr 1fr 1fr;
+ }
+ .clients {
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr;
+ grid-template-rows: 1fr 1fr;
+ }
+ .img4 {
+ grid-column: 1/3;
+ grid-row: 2/3;
+ }
+ .img5 {
+ grid-column: 2/4;
+ grid-row: 2/3;
+ }
+}
+
+@media only screen and (min-width: 1200px) {
+ .article {
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr ;
+ grid-template-rows: 1fr 1fr;
+ width: 80%;
+ margin-left: 10%;
+ }
+ .clients {
+ display: grid;
+ grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
+ grid-template-rows: 1fr;
+ }
+ .img4 {
+ grid-column: 4/5;
+ grid-row: 1/2;
+ }
+ .img5 {
+ grid-column: 5/6;
+ grid-row: 1/2;
+ }
+}
\ No newline at end of file
diff --git a/design/UI Style Guide.xd b/design/UI Style Guide.xd
new file mode 100644
index 0000000..aa5ebe4
Binary files /dev/null and b/design/UI Style Guide.xd differ
diff --git a/img/Service-3.jpg b/img/Service-3.jpg
deleted file mode 100644
index 943437a..0000000
Binary files a/img/Service-3.jpg and /dev/null differ
diff --git a/img/g.jpg b/img/g.jpg
new file mode 100644
index 0000000..6af8c2e
Binary files /dev/null and b/img/g.jpg differ
diff --git a/img/service-3.jpg b/img/service-3.jpg
index 943437a..a8601d5 100644
Binary files a/img/service-3.jpg and b/img/service-3.jpg differ
diff --git a/img/service-back-mobile.jpg b/img/service-back-mobile.jpg
new file mode 100644
index 0000000..475eb1e
Binary files /dev/null and b/img/service-back-mobile.jpg differ
diff --git a/img/teastbg2.jpg b/img/teastbg2.jpg
deleted file mode 100644
index 55958fa..0000000
Binary files a/img/teastbg2.jpg and /dev/null differ
diff --git a/img/header-1.jpg b/img/testbg2.jpg
similarity index 100%
rename from img/header-1.jpg
rename to img/testbg2.jpg
diff --git a/img/testbg2.png b/img/testbg2.png
new file mode 100644
index 0000000..835f3ed
Binary files /dev/null and b/img/testbg2.png differ
diff --git a/img/testbg3.png b/img/testbg3.png
new file mode 100644
index 0000000..b91737f
Binary files /dev/null and b/img/testbg3.png differ
diff --git a/img/bg-header4.jpg b/img/testbg4.jpg
similarity index 100%
rename from img/bg-header4.jpg
rename to img/testbg4.jpg
diff --git a/img/testbg4.png b/img/testbg4.png
new file mode 100644
index 0000000..79ec4c2
Binary files /dev/null and b/img/testbg4.png differ
diff --git a/img/testbg5.jpg b/img/testbg5.jpg
new file mode 100644
index 0000000..d1dbbf0
Binary files /dev/null and b/img/testbg5.jpg differ
diff --git a/img/testbg5.png b/img/testbg5.png
new file mode 100644
index 0000000..9f85c6a
Binary files /dev/null and b/img/testbg5.png differ
diff --git a/img/testbg6.jpeg b/img/testbg6.jpeg
new file mode 100644
index 0000000..1816941
Binary files /dev/null and b/img/testbg6.jpeg differ
diff --git a/img/testbg6.png b/img/testbg6.png
new file mode 100644
index 0000000..7957322
Binary files /dev/null and b/img/testbg6.png differ
diff --git a/img/testbg7.jpg b/img/testbg7.jpg
new file mode 100644
index 0000000..a79c3f8
Binary files /dev/null and b/img/testbg7.jpg differ
diff --git a/img/testbg7.png b/img/testbg7.png
new file mode 100644
index 0000000..846ddc9
Binary files /dev/null and b/img/testbg7.png differ
diff --git a/img/y.jpg b/img/y.jpg
new file mode 100644
index 0000000..cb20bc0
Binary files /dev/null and b/img/y.jpg differ
diff --git a/index.html b/index.html
index 5c319b2..6c0e3ce 100644
--- a/index.html
+++ b/index.html
@@ -4,32 +4,50 @@
+
+
-
+
-
+
Hypernova Agency
-