Quitando clase index y añadiendo elemento img para la salamandra

[salamandradevs.site/.git] / themes / droda / assets / css / main.css

diff --git a/themes/droda/assets/css/main.css b/themes/droda/assets/css/main.css
index 6c684274ac0da4eba81e40293aad1ea83c33e603..75c4ef2032bd3b50ad1b7144c3ba9f7326b3ac5c 100644 (file)
--- a/themes/droda/assets/css/main.css
+++ b/themes/droda/assets/css/main.css
@@ -212,12 +212,6 @@ main {
    grid-area: main;
    padding: 2rem;
    background-color: var(--bgColorMidDark);
-   background-image: url('../images/salamandra_margin.svg');
-   background-size: 10rem;
-   background-position-x: right;
-   background-position-y: bottom;
-   background-repeat: no-repeat;
-   overflow-y: auto;
 }
 
 /* Regla que aplica solo a firefox */
@@ -307,18 +301,18 @@ footer {
 }
 
 .greetings {
+   
    width: 80%;
-   height: 80%;
    margin: 0 auto;
 }
 
-.index {
-   background-color: var(--bgColorMidDark);
-   background-image: url('../images/salamandra_margin.svg');
-   background-position-x: center;
-   background-position-y: 2rem;
-   background-repeat: no-repeat;
-   background-size: var(--backgroundImageSize);
+.greetings img {
+   width: 8rem;
+   margin: 0 auto;
+}
+
+.greetings p {
+   padding-top: 3rem;
 }
 
 @media screen and (max-width: 480px) {
@@ -330,6 +324,8 @@ footer {
    }
 }
 
+/* Los media query aplican a partir de este temaño hacia arriba.
+   Recordemos que estamos aplicando filosofía de móviles primero */
 @media screen and (min-width: 840px) {
    :root {
       --globalScale: 1.5;
@@ -362,6 +358,10 @@ footer {
    main div > article {
       max-width: 30rem;
    }
+
+   .greetings img {
+      width:9rem;
+   }
    
 }
 
@@ -378,7 +378,7 @@ footer {
 
    main div article {
       width: calc(30% - 2rem);
-   
+      
       max-height: 15rem;
       min-height: 15rem;
       min-width: 10rem;
@@ -388,5 +388,9 @@ footer {
    main div article p, a{
       font-size: 1rem;
    }
+
+   .greetings img {
+      width:10rem;
+   }
 }