changed the styling of cards in service page

Anjaliavv51 · Oct 3, 2024 · 9ac5c12 · 9ac5c12
1 parent f341ff0
commit 9ac5c12
Show file tree

Hide file tree

Showing 2 changed files with 439 additions and 358 deletions.
diff --git a/Css-files/content.css b/Css-files/content.css
@@ -1,6 +1,7 @@
 * {
   margin: 0px;
   padding: 0px;
+
 }
 p{
   color: hsl(208, 7%,46%);
@@ -36,6 +37,9 @@ body {
   z-index: -1;
 
 }
+.upper{
+  margin-top: -5rem;
+}
 
 .navbar {
   padding: 8px 10px;
@@ -254,9 +258,15 @@ input[type="submit"]:hover {
   background-color: transparent;
   background-blend-mode:lighten;
   background-repeat: no-repeat;
-  background-size: cover;
+  /* background-size: cover; */
+
 }
 
+.cards{
+  height: 480px;
+  width: 480px;
+  margin-left: 2rem;
+}
 .second_cont{
   display: flex;
   padding: 40px;
@@ -309,20 +319,30 @@ div.deals:hover{
   padding-top: 400px;
 }
 .testimonal__container{
+  width: 100%;
   display: flex;
-  padding: 3rem;
+  justify-content: center;
+  /* flex-direction: column; */
+  /* padding: 3rem; */
+  margin-top: 2rem;
 }
 .testimonal__card{
   text-align: center;
-  padding:2rem 3rem 2.5rem;
+
   border:2px solid rgba(224, 224, 252, 0.678);
-  transition:border .4s,background-color .4s;
+  transition:border .4s background-color .4s;
   background-color: white;
   box-shadow: 0 0 10px rgba(224, 224, 252, 0.678);
   border: 1px solid rgb(186, 186, 201);
   padding:40px 30px ;
   margin: 5px;
   color:rgb(107, 107, 122);
+  /* margin-left: 3rem; */
+}
+.testimonal__card:hover{
+  transform: translateY(-10px);
+  transition: 0.5s;
+  box-shadow: 2px 2px 20px black;
 }
 .testimonal__image{
   width:100px;
@@ -336,6 +356,8 @@ div.deals:hover{
 .testimonal__description{
   margin-bottom: 1.25rem;
 }
+
+
 .section__title{
   text-align: center;
   font-size: 2rem;
@@ -344,97 +366,42 @@ div.deals:hover{
 
 /* footer */
 .foot-panel2{
-  background-color: transparent;
-  color:white;
-  height: 300px;
-  display: flex;
-  justify-content: space-evenly;
+    background-color: transparent;
+    color:white;
+    height: 300px;
+    display: flex;
+    justify-content: space-evenly;
 }
 
 .footer-colums{
-  margin-top: 20px;
+    margin-top: 20px;
 }
 
 .footer-colums p{
-  font-weight: 700;
+    font-weight: 700;
 }
 
 .footer-colums a{
-  display: block;
-  font-size: 0.85rem;
-  margin-top: 10px;
-  color: #dddddd;
-}
-
-.follow-us{
-  margin-bottom: 20px;
-}
-
-.social-icons a {
-  font-size: 1.2rem;
-  padding: 8px;
-  margin: 15px;
-  text-decoration: none;
-  /* color: white; */
-}
-
-.fa-facebook{
-  color: hsl(203, 30%, 26%);
-  font-size: 1.2rem;
-  padding: 8px;
-  margin: 15px;
-}
-
-.fa-facebook:hover {
-
-  transform: scale(1.5);
-  color:#3B5998;
-  transition: transform 0.2s ease, color 0.2s ease;
+    display: block;
+    font-size: 0.85rem;
+    margin-top: 10px;
+    color: #dddddd;
 }
 
-.fa-instagram{
-  color: hsl(203, 30%, 26%);
-  font-size: 1.2rem;
-  padding: 8px;
-  margin: 15px;
-}
-.fa-instagram:hover {
-  transform: scale(1.5);
-  color:#D62976;
-  transition: transform 0.2s ease, color 0.2s ease;
-}
-.fa-x-twitter{
-  color: hsl(203, 30%, 26%);
-  font-size: 1.2rem;
-  padding: 8px;
-  margin: 15px;
-
-}
-
-.fa-x-twitter:hover {
-  color:black;
-  transform: scale(1.5);
-  transition: transform 0.2s ease, color 0.2s ease;
-}
-
-
 .foot_panel4{
-  background-color: transparent;
-  /* color:hsl(203, 30%, 26%); */
-  height: 160px;
-  /* font-size: 0.9rem; */
-  text-align: center;
-  /* margin-bottom: 8px; */
+    background-color: transparent;
+    color: white;
+    height: 160px;
+    font-size: 0.9rem;
+    text-align: center;
 }
 
-
-
 .pages{
-  padding-top: 25px;
+    padding-top: 25px;
 }
 
 .copyright{
-  padding-top: 10px;
+   padding-top: 10px;
 }
 
 form {
@@ -473,7 +440,7 @@ textarea {
     font-size: 1.2rem;
     padding: 15px;
     text-decoration: none;
-    color: hsl(203, 30%, 26%);
+    color: white;
 }
 
 .fa-facebook:hover {
@@ -577,8 +544,6 @@ textarea {
   border: none;
 }
 
-
-
 #contactForm h3 {
   height: 30px;
   color: #141414;