refactory footer , tarifa , conduce

LeidyRosmery · Sep 7, 2017 · 0b8f083 · 0b8f083
1 parent 90b33e9
commit 0b8f083
Show file tree

Hide file tree

Showing 2 changed files with 163 additions and 223 deletions.
diff --git a/assets/css/main.css b/assets/css/main.css
@@ -1,174 +1,95 @@
 * {
-    color: #fff;
     box-sizing: border-box;
     margin: 0;
     padding: 0;
     font-size: 1em;
 }
 
-div#map {
-    width: 80%;
-    height: 400px;
-}
-
-.bag-yellow {
-    background: #f7b617;
-}
-
-.bag-white {
-    background: #fff;
-}
-
-.bg-gray {
-    background: #F8F8F8;
-}
-
-ul.nav.navbar-nav.navbar-right {
-    padding: 10px;
-}
-
-.main {
-    border: 1px solid #fff;
-}
-
-.bd-bootom {
-    border-left: 1px solid #fff;
-}
-
-.icon {
-    color: #fff;
-}
-
-.form-control::-webkit-input-placeholder {
-    color: #fff;
-}
-
-.form-control:-moz-placeholder {
-    color: #fff;
-}
-
-.form-control {
-    color: #fff;
-}
-
-.form-control[placeholder] {
-    color: #fff;
-}
-
-.dis-inline {
-    display: inline-block;
-}
 
-.tarifa {
-    padding: 20px 20px;
-}
-
-.under {
-    border-bottom: 2px solid #fff;
-}
-
-footer {
-    background: gray;
-}
-
-.borde-row {
-    border: 2px #fff solid;
-    border-radius: 20px;
-    margin: 26px;
-}
+/******************** conductor ********************/
 
 .conductor {
-    height: 100vh;
-    background-image: url("../img/conduce.jpg");
+
+    background-image: url(../img/conduce.jpg);
+    background-position: 0em -14em;
     background-repeat: no-repeat;
     background-size: cover;
 }
 
 .driver {
-    opacity: 0.5;
-    background-color: gray;
-    height: 508px;
-    padding: 137px 20px;
-    right: 0;
-    position: absolute;
+    height: 75vh;
+    background-color: rgba( 0, 0, 0, 0.3);
+    display: flex;
+    flex-direction: column;
+    padding: 0 4em;
+    justify-content: center;
 }
 
-#boton {
-    margin-left: 82px;
+
+/******************** tarifas ********************/
+
+#map {
+    height: 50vh;
+    padding: 2em;
 }
 
-.portada, .informacion, .conductor, .tarifa {
-    height: 508px;
+#tarifa {
+    font-size: 2.5em;
 }
 
-.portada {
-    background-image: url("../img/taxi.jpg");
-    height: 100vh;
-    background-repeat: no-repeat;
-    background-size: cover;
+.cntr-map {
+    border: 0.1em solid #fff;
+    padding: 0.6em;
+    width: 80%;
 }
 
-.hero {
-    position: absolute;
-    padding: 60px 20px;
-    right: 0;
-    top: 35%;
-    width: 504px;
-    height: 355px;
+.form-control {
+    border: #fff solid 0.1em;
 }
 
-.title {
-    margin-top: 30px;
+.form-control:focus {
+    box-shadow: none;
+    border-color: white;
 }
 
-.font-20px {
-    font-size: 20px;
+.form-control::placeholder {
+    color: #fff;
 }
 
-@media (max-width: 768px) {
-    .hero {
-        width: 75% !important;
-    }
+.border-map {
+    border: 0.2em solid #fff;
 }
 
-@media (max-width: 768px) {
-    #boton {
-        margin-left: 36px;
-    }
+.bag-yellow {
+    background: #f7b617;
 }
 
-.logo {
-    width: 74px;
-    height: 23px;
+.bag-white {
+    background: #fff;
 }
 
-.texto {
-    /* line-height: 33px; */
-    padding: 0px;
-    font-size: 35px;
-    margin: 0;
+.font-white {
+    color: #fff;
 }
 
-.derecha {
-    float: right !important;
+.font-gray {
+    color: #2b2b2b;
 }
 
-.izquierda {
-    float: left !important;
+.btn-send {
+    font-weight: bold;
+    border: none;
 }
 
-.menu {
-    margin: 0;
-    height: 71px;
+.tarifa, .pie-pagina {
+    padding: 2.5em 3em;
 }
 
 
 /******************** footer ********************/
 
 .pie-pagina {
     background: #2b2b2b;
-    padding: 2.5em 3em;
-
 }
 
 .tag-footer {
@@ -187,10 +108,17 @@ ul>li {
 }
 
 @media screen and (max-width: 767px) {
-  .pie-pagina{
-    padding: 2em 1em;
-  }
+    .pie-pagina, .tarifa {
+        padding: 2em 1em;
+    }
     .detail-footer {
         display: inline-block;
     }
+    .driver {
+        height: 60vh;
+        padding: 0 5em 0 1em;
+    }
+    .conductor{
+      background-position: 0em;
+    }
 }