/*!
 * Base Bootstrap 
 * Template Name: CONCESIONARIA Landing - v1
 * Author: CONCESIONARIA
 * Copyright 2024 CONCESIONARIA
 *
 * COLORS
 * #22cfc8  => Celeste
 * #da291c  => Rojo
 * #2b5161  => Azul oscuro 1
 * #284b5a  => Azul oscuro 2
 *
 * FONTS
 * Gotham-Light, Gotham-Book, Gotham-Bold, Gotham-Black
 */

/*   [Table content]
*      
*       01. GENERAL
*			_ body
*			_ h1, h2, h3, h4, h4, h5, h6
*           _ Fonts			 
*
*       02. HEADER
*           _ Logo
*
*       03. MAIN CONTENT
*           _ Portada
*           _ Info
*           _ Info-2
*
*       04. RESPONSIVE
*
*/ 

/*--------------------------------------------------------------
# 01. General
--------------------------------------------------------------*/

html {
    background-color: white;
}
body {
    color:#000000;
    font-family: 'Gotham-Book', sans-serif;
    font-size: 16px;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Gotham-Bold', sans-serif;
    font-weight:800;
}
hr {   
	background-color: #000000;
	height: 1px;
    margin: 0px auto;
}
.btn-dark {   
	background-color: #000000 !important;
}
.btn-danger {   
	background-color: #da291c !important;
}
.btn-primary:hover,
.btn-primary {   
	background-color: #0d9fd2 !important;
    color:black !important;
}


/* Fonts */ 
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
@font-face {
    font-family: "Gotham-Light";
    font-style: normal;
    font-weight: 300;
    src: url("../fonts/Gotham-Light.woff2") format("woff2");
}
@font-face {
    font-family: "Gotham-Book";
    font-style: normal;
    font-weight: 500;
    src: url("../fonts/Gotham-Book.woff2") format("woff2");
} 
@font-face {
    font-family: "Gotham-Bold";
    font-style: normal;
    font-weight: 700;
    src: url("../fonts/Gotham-Bold.woff2") format("woff2");
}
@font-face {
    font-family: "Gotham-Black";
    font-style: normal;
    font-weight: 900;
    src: url("../fonts/Gotham-Black.woff2") format("woff2");
}


/*--------------------------------------------------------------
# 02. HEADER
--------------------------------------------------------------*/

/* Header */ 
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
header {
    background-color:#2b5161;
    background: linear-gradient(90deg, rgba(43,81,97,1) 0%, rgba(40,75,90,1) 50%);    
}


/*--------------------------------------------------------------
# 03. MAIN CONTENT
--------------------------------------------------------------*/
.main {
    padding-top: 0px;
}


/* Info */ 
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
#info h3 {
    font-family:Gotham-Bold;
    letter-spacing: .1rem;   
}
#info .info-col-bg-black {
    background-color:#000000;
    margin-right:0%;
}
#info .info-col-bg-blue-light {
    background-color:#22cfc8;
    margin-left:0%;
}
#info .btn {
    border-radius: 15px;
    box-shadow: 6px 6px 6px 0px rgba(0,0,0,0.3);
    -webkit-box-shadow: 6px 6px 6px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 6px 6px 6px 0px rgba(0,0,0,0.3);    
    margin-bottom:-40px;    
}


/* Info-2 */ 
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
#info-2 {
    background-color:#f4f4f4;
    border-top:1px solid #bfbfbf;
    -webkit-box-shadow: -1px -4px 14px -1px rgba(0,0,0,0.32);
    -moz-box-shadow: -1px -4px 14px -1px rgba(0,0,0,0.32);
    box-shadow: -1px -4px 14px -1px rgba(0,0,0,0.32);    
}


/*--------------------------------------------------------------
# 04. RESPONSIVE
--------------------------------------------------------------*/

/* Desktop 1 */
@media (min-width: 1537px) {
  
}

/* Desktop 2 */
@media (min-width: 993px)  {

}

/* Tablet 1  */
@media (min-width: 769px) and (max-width: 992px) {

}

/* Tablet 2 */
@media (min-width: 601px) and (max-width: 768px) {
  
}

/* Mobile 1 */
@media (max-width: 600px) {
    body {
        text-align:center;
    }   
    h1 {
        text-align:center;
    }
    h1 img {
        width:80%;
    }

}

/* Mobile 2 */
@media (min-width: 280px) and (max-width: 599px) {
    body {
        text-align:center;
    }   
    h1 {
        text-align:center;
    }
    h1 img {
        width:80%;
    }
}