From 3811c9fc2a1281279ac8c3e1532f6c6f8c44e1dc Mon Sep 17 00:00:00 2001
From: devartes <anacavalcante731@gmail.com>
Date: Tue, 7 Feb 2023 07:55:26 -0300
Subject: [PATCH] feat: adicionando styles.css dos componentes PaymentMethods e
 Social

---
 react/components/PaymentMethods/styles.css | 92 ++++++++++++++++++++++
 react/components/Social/styles.css         | 59 ++++++++++++++
 2 files changed, 151 insertions(+)
 create mode 100644 react/components/PaymentMethods/styles.css
 create mode 100644 react/components/Social/styles.css

diff --git a/react/components/PaymentMethods/styles.css b/react/components/PaymentMethods/styles.css
new file mode 100644
index 0000000..b81aaf1
--- /dev/null
+++ b/react/components/PaymentMethods/styles.css
@@ -0,0 +1,92 @@
+.FooterRightBlock {
+  margin-bottom: 16px;
+}
+
+@media (max-width: 1025px) and (min-width: 768px) {
+  .FooterRightBlock {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 0;
+  }
+}
+
+@media (max-width: 768px) and (min-width: 375px) {
+  .FooterRightBlock {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 0;
+  }
+}
+
+.SpanTitle {
+  color: #ffffff;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 38px;
+}
+
+.SpanTitleBig {
+  color: #ffffff;
+  font-weight: 400;
+  font-size: 18px;
+  line-height: 38px;
+
+
+}
+
+@media (max-width: 1025px) and (min-width: 768px) {
+  .SpanTitleBig {
+    font-size: 14px;
+  }
+}
+
+@media (max-width: 768px) and (min-width: 375px) {
+  .SpanTitleBig {
+    font-size: 14px;
+  }
+}
+
+.UlGroup {
+  display: flex;
+  flex-direction: column;
+  padding: 0;
+  margin: 0;
+  row-gap: 4px;
+}
+
+@media (max-width: 1025px) and (min-width: 768px) {
+  .UlGroup {
+    align-items: center;
+  }
+}
+
+@media (max-width: 768px) and (min-width: 375px) {
+  .UlGroup {
+    justify-content: center;
+    align-items: center;
+  }
+}
+
+.UlSecondary {
+  display: flex;
+  padding: 0;
+  margin: 0;
+  column-gap: 8px;
+  list-style: none;
+}
+
+@media (max-width: 1025px) and (min-width: 768px) {
+  .ImgCard {
+    width: 42px;
+  }
+}
+
+@media (max-width: 768px) and (min-width: 375px) {
+  .ImgCard {
+    width: 42px;
+  }
+}
diff --git a/react/components/Social/styles.css b/react/components/Social/styles.css
new file mode 100644
index 0000000..c66eb75
--- /dev/null
+++ b/react/components/Social/styles.css
@@ -0,0 +1,59 @@
+.FooterRightBlockSocial {
+  margin-bottom: 16px;
+}
+
+@media (max-width: 1025px) and (min-width: 768px) {
+  .FooterRightBlockSocial {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 0;
+  }
+}
+
+@media (max-width: 768px) and (min-width: 375px) {
+  .FooterRightBlockSocial {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    margin-bottom: 0;
+  }
+}
+
+.SpanTitleSocial {
+  color: #ffffff;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 38px;
+}
+
+.UlGroupSocial {
+  display: flex;
+  flex-direction: column;
+  padding: 0;
+  margin: 0;
+  row-gap: 4px;
+}
+
+@media (max-width: 1025px) and (min-width: 768px) {
+  .UlGroupSocial {
+    align-items: center;
+  }
+}
+
+@media (max-width: 768px) and (min-width: 375px) {
+  .UlGroupSocial {
+    justify-content: center;
+    align-items: center;
+  }
+}
+
+.UlSecondarySocial {
+  display: flex;
+  padding: 0;
+  margin: 0;
+  column-gap: 8px;
+  list-style: none;
+}