@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:wght@400;600;700&display=swap');

body {
    font-family: 'Titillium Web', sans-serif;}

h1 {
    font-size:66px;
    font-weight: 600;
    line-height:80px;
}

.planes-titulo {
    text-align:center;
    color:black;
    margin-bottom: 75px;
}

h2 {font-size:48px; margin-bottom:30px;margin-top:30px;}

h3 {font-size:25px;
    font-weight: 600;
    line-height:1.5px;
    text-align:center;}

h4 {font-size:20px;
    font-weight: 600;
    color:black;
    line-height:1.5px;
    text-align:left;
}

h5 {font-size:25px;
    font-weight: 600;
    color:black;
    line-height:1.5px;
    text-align:center;
}

h6 {font-size:22px;
    font-weight: 600;
    color:black;
    line-height:1.5px;
    text-align:center;
}

p {
    font-size: 16px; 
    color:#000000;
    line-height:1.8;
    margin-bottom:0;}

a:hover {
    text-decoration: none;}

section {padding:100px 0;}

.topmargin-xs {margin-top: 15px;}
.topmargin-sm {margin-top: 30px;}
.topmargin-lg {margin-top: 60px;}

.btn {
    font-size:16px;
    font-weight: 600;
    padding:15px 26px;
    min-width:170px;
    border-radius: 2px;
    display:inline-block;}

.btn i {
    font-size: 14px; margin-left: 5px;}

.btn-light {
    background-color:#ffffff;
    color:#1a1a1a;}

.btn-light-equipos {
    background-color:#264b8a;
    color:white;
    border:white 1px solid;}

.btn-light-equipos:hover {
    background-color:white;
    color:black;
    border:#264b8a 1px solid;}

.btn-light:hover{
    background-color:#264b8a;
    color:white;}

.navbar {background-color:white;
    box-shadow: 0 2px 4px 0 rgba(0,0,0, .05);
    min-height: 100px;}

.nav-link {color:black;font-weight: bold;}

.nav-link:hover {color:darkslategray;
    text-decoration: underline;font-weight: bold;}

.logo-brand {min-width: 160px;
    max-width:180px;}

.navbar-toggler {font-size:35px;}
.navbar-toggler:focus {outline: none;}

#cabecera {
    background-image: url('../img/banntop.jpg');
    background-size: cover;
    padding-top: 90px;
    min-height: 700px;
    color:white;}

#cabecera-alarma {
    background-image: url('../img/familia2.jpg');
    background-size: cover;
    padding-top: 90px;
    min-height: 700px;
    color:white;}

#vecinos {
    background-image: url('../img/_vecinos.jpg');
    background-size: cover;
    padding-top: 90px;
    min-height: 650px;
    color:white;}

#barrios {
    background-image: url('../img/_barrio.jpg');
    background-size: cover;
    padding-top: 90px;
    min-height: 650px;
    color:white;}

#edificios {
    background-image: url('../img/edificio.jpg');
    background-size: cover;
    padding-top: 90px;
    min-height: 650px;
    color:white;}

#colegios {
    background-image: url('../img/escuela.jpg');
    background-size: cover;
    padding-top: 90px;
    min-height: 650px;
    color:white;}

#cercos {
    background-image: url('../img/cerco-electrico-alto-voltaje.jpg');
    background-size: cover;
    padding-top: 90px;
    min-height: 650px;
    color:white;}

#cabecera p {
    color:#ffffff;}

.content-center {
    max-width:800px;
    margin: 80px auto 0 auto;
    text-align:center;
    background: rgba(0, 0, 0, 0.35);
    padding:10px;}

.centro {
    max-width:100%;
    text-align:center;
    margin:75px 0 75px 0;
}

.centro-planes {
    max-width:100%;
    text-align:center;
}

#centrada{
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding: 10px;
}

.iconos {
    font-size:35px;
    text-align:center;
    margin-bottom: 10px;
}

.descripcion {
    font-size:16px;
    text-align:center;
    color:dimgray;
}

.descripcion {
    font-size:16px;
    text-align:left;
    color:dimgray;
}

#nosotros-se {
    background-image: url('../img/nosotros.png');
    background-size: cover;
    padding-top: 90px;
    min-height:400px;
    color:white;}

#nosotros-se {
    background-image: url('../img/cerco-seguridad.jpg');
    background-size: cover;
    padding-top: 90px;
    min-height:400px;
    color:white;}


@media (max-width: 575.98px) {
    h1 {font-size:40px; line-height:normal;}
    h6 {font-size:40px; line-height:normal;}
}
@media (min-width: 576px) and (max-width: 767.98px) { h6 {font-size:50px; line-height:normal;} }
@media (min-width: 768px) and (max-width: 991.98px) { h6 {font-size:20px; line-height:normal;} }
@media (min-width: 992px) and (max-width: 1199.98px) { h6 {font-size:25px; line-height:normal;} }
@media (min-width: 1200px) { ... }