/***
Pantone®️ 103 C
Pantone®️ 7463 C
Pantone®️ 428 C
C97% M90% Y53% K29%
R:0 G:43 B:73
#162f49
C24% M25% Y100% K7%
R:197 G:197 B:0
#C5A900
C28% M20% Y20% K0%
R:195 G:198 B:200
#c3c4c7

*/


/* Layout */

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

.container-fluid {
    background: transparent;
    padding: 0;
}


/* Nav section */

.side-left {
    /* background: #4a697e; */
    background-image: url("assets/images/1_1.jpg");
    box-shadow: inset 2000px 0 0 0 rgba(23, 43, 65, 0.0);
    background-size: cover;
    /* background-size: 100% 100%; */
    background-repeat: no-repeat;
    min-height: 600px;
    padding-left: 4%;
    padding-right: 4%;
    /* background-image: url("bg_sideleft.jpg"); */
}

.side-right {
    background: #00263F;
}

.side-right-background {
    height: 100%;
    width: 100%;
    position: absolute;
    right: 0;
    top: 0;
    background-image: url("assets/images/PRESENTACCIÓN\ COMERCIAL\ R2-03.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-attachment: scroll;
    background-position: right center;
}

.bg-light {
    background-color: transparent!important;
}


/* navbar */

.navbar {
    /* background: #F5F5F5; */
    margin-left: 5%;
    font-weight: bold;
    /* color: #c3c4c7; */
}

.navbar-light .navbar-nav .nav-link:hover {
    color: #C4A800;
}

.navbar-light .navbar-nav .nav-link:active {
    color: #C4A800;
}


/* .navbar-light .navbar-nav .nav-link:visited {
    color: #c3c4c7;
    /* font-weight: bold; */

.navbar-light .navbar-nav .nav-link {
    color: #c3c4c7;
}

.navbar-light .navbar-brand {
    color: #c3c4c7;
}

.navbar-light .navbar-brand:hover {
    color: #C4A800;
}

.navbar-nav>li {
    margin-left: 20px;
    margin-right: 20px;
}

.ecm-navbar-left {}

.ecm-navbar-rigth {}


/* image logo debajo del menu*/

.img-fluid {
    /* position: absolute;
    z-index: 1; */
    width: auto;
    min-width: 400px;
    margin: 20px;
    max-width: 15%;
    margin-left: auto;
    margin-right: auto;
    /* animation */
    animation: backInRight;
    animation-duration: 2s;
}

.logo {
    margin-top: 10%;
    margin-bottom: 200px;
}


/* .left-right {
    z-index: 1;
} */

.only_logo {
    width: 20%;
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 45%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    animation: zoomIn;
    animation-duration: 3s;
}

.float-laptop {
    width: 100%;
    position: absolute;
    z-index: 1;
    right: 30%;
    bottom: -15%;
    transform: translate(30%, 15%);
    -webkit-transform: translate(30%, 15%);
    /* animation: zoomIn;
    animation-duration: 3s; */
}


/*  La seccion de soluciones cambio por la sección de smartflow-energy */

.smartflow-energy-img {
    width: 100%;
    margin-top: 40%;
    /* position: absolute;
    z-index: 1; */
    /* right: 10%; */
    /* bottom: -25%; */
    /* transform: translate(-5%, 15%);
    -webkit-transform: translate(-5%, 15%); */
    animation: zoomIn;
    animation-duration: 3s;
}

@media screen and (max-width: 580px) {
    #navbar {
        padding: 20px 10px !important;
        /* Use !important to make sure that JavaScript doesn't override the padding on small screens */
    }
    #navbar a {
        float: none;
        display: block;
        text-align: left;
    }
    #navbar-right {
        float: none;
    }
}


/* Search section */

.search-section {
    margin-top: 10px;
    margin-right: 10%;
}

#wrapper {
    border: 1px solid blue;
    display: table;
}

.cell {
    display: table-cell;
    border-style: solid;
    border-color: yellow;
}

.separator {
    width: 25%;
    /* size: 100px; */
    text-align: left;
    margin-left: 0px;
    border-top: 5px solid rgba(129, 137, 147, 0.692);
    /* border-bottom: none; */
    /* margin: 30px 0; */
}


/* About section */

.about {
    padding-top: 7%;
    margin-left: 1%;
}

.about-text {
    padding-left: 5%;
    padding-right: 5%;
    font-weight: bold;
    color: #152B46;
}

.about-divitions {
    padding-left: 4%;
    padding-right: 4%;
    font-weight: bold;
}

.image-one {
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    display: block;
    /* min-width: 400px;
    max-width: 15%;
    margin-left: 5%; */
}

.image-two {
    margin-left: auto;
    margin-right: auto;
    width: 50%;
    display: block;
    /* justify-content: flex-center; */
    /* min-width: 200px;
    max-width: 15%; */
}

.image-two-divitions {
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    display: block;
}

.video-demo {
    /* padding-top: 15%;
    padding-bottom: 15%; */
    -webkit-box-shadow: -9px 19px 23px 2px rgba(0, 38, 63, 0.55);
    -moz-box-shadow: -9px 19px 23px 2px rgba(0, 38, 63, 0.55);
    box-shadow: -9px 19px 23px 2px rgba(0, 38, 63, 0.55);
    /* position: fixed; */
    /* top: 50%; */
    /* left: 50%; */
    /* transform: translate(-50%, -50%); */
    /* position: fixed;
    right: 0;
    bottom: 0;*/
    min-width: 100%;
    min-height: 100%;
}

.fullscreen-bg {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    z-index: -100;
}

.fullscreen-bg__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

p.normal {
    font-weight: normal;
}

p.light {
    font-weight: lighter;
}

p.thick {
    font-weight: bold;
}

p.thicker {
    font-weight: 900;
}


/* Divitions section */

.divitions {
    padding-top: 7%;
    margin-left: 1%;
}


/* smartflow-energy section */

.smartflow-energy {
    padding-top: 7%;
    margin-left: 1%;
}

.solutions-smartflow-logo {
    width: auto;
    min-width: 400px;
    /* margin: 20px; */
    max-width: 15%;
    margin-left: 5%;
    padding-left: 10%;
    margin-bottom: 5%;
    /* margin-right: auto; */
}

.solutions-smartflow-logo2 {
    width: auto;
    min-width: 400px;
    max-width: 15%;
    margin-bottom: 5%;
    padding-left: 3%;
    animation: zoomIn;
    animation-duration: 3s;
}

.smartflow-energy-botton {
    background-image: url("assets/images/pag web (3)-02.jpg");
    box-shadow: inset 2000px 0 0 0 rgba(23, 43, 65, 0);
    background-size: contain;
    background-repeat: no-repeat;
    min-height: 400px;
    animation: zoomIn;
    animation-duration: 3s;
}

.smartflow_bottom_image {
    width: auto;
    min-width: 400px;
    max-width: 100%;
    margin-bottom: 5%;
    padding-left: 3%;
    padding-right: 3%;
    animation: zoomIn;
    animation-duration: 3s;
}


/* Solution section */

.solutions {
    padding-top: 7%;
    margin-left: 1%;
}

.title-sf {
    color: #152B46;
}

.solutions-about-text {
    margin-top: 5%;
    padding-left: 10%;
    padding-right: 10%;
    font-weight: bold;
    color: #152B46;
}

.solution-item {
    margin: 5%;
    -webkit-box-shadow: -9px 19px 23px 2px rgba(0, 38, 63, 0.55);
    -moz-box-shadow: -9px 19px 23px 2px rgba(0, 38, 63, 0.55);
    box-shadow: -9px 19px 23px 2px rgba(0, 38, 63, 0.55);
}

.solutions-hr {
    height: 5px;
    background: #152B46;
    border-radius: 3px;
    margin-right: 5%;
    margin-left: 5%;
}


/* Products section */

.products {
    padding-top: 7%;
    margin-left: 1%;
}

.separator-product {
    width: 80%;
    /* text-align: left; */
    /* margin-left: 0px; */
    border-top: 3px solid rgba(129, 137, 147, 0.5);
}

.product-thumbnail {
    width: 300px;
    height: 300px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5%;
    /* width: 100%; */
}

.card-product {
    padding-top: 5%;
    margin: 1%;
    /* -webkit-box-shadow: -9px 19px 23px 2px rgba(0,38,63,0.55);
    -moz-box-shadow: -9px 19px 23px 2px rgba(0,38,63,0.55);
    box-shadow: -9px 19px 23px 2px rgba(0,38,63,0.55); */
    box-shadow: -2px 1px 10px silver;
    border-radius: 10px;
}

.btn-ecm {
    background-image: url("assets/images/pag\ web-11.svg");
    background-color: transparent;
    /* box-shadow: -2px 1px 10px silver; */
    background-repeat: no-repeat;
    min-width: 3%;
    width: auto;
    height: auto;
    color: #fff;
    background-position: center;
    min-width: 200px;
    background-size: 100%;
    border-radius: 10px;
}

.btn-ecm-privacity {
    background-image: url("assets/images/pag\ web-11.svg");
    background-color: transparent;
    /* box-shadow: -2px 1px 10px silver; */
    background-repeat: no-repeat;
    /* min-width: 2%; */
    /* width: auto;
    height: auto; */
    color: #fff;
    background-position: center;
    /* min-width: 150px; */
    background-size: 100%;
    border-radius: 10px;
    /* font-size: 4mm; */
    /* padding: 3%; */
    margin-left: 5%;
    width: 50%;
    height: 30%;
    max-height: 30%;
    text-align: center;
    padding: inherit;
}

.btn-ecm-privacity:hover {
    color: #C5A900;
}

.btn-ecm:hover {
    color: #C5A900;
}

.ecm-modal-privacity {
    /* width: 70%; */
    max-width: 70%;
    margin: auto;
}


/* contact section */

.contact {
    padding-top: 5%;
}

.contact-top {
    background-image: url("assets/images/pag web (3)-03.jpg");
    box-shadow: inset 2000px 0 0 0 rgba(23, 43, 65, 0.0);
    background-size: contain;
    /* background-size: 100% 100%; */
    background-repeat: no-repeat;
    min-height: 400px;
    padding-top: 1%;
    /* padding-left: 4%;
    padding-right: 4%; */
    /* padding-top: 5%; */
    /* background-image: url("bg_sideleft.jpg"); */
}

.img-top-contact {
    width: auto;
    height: auto;
    max-width: 30%;
    /* margin-left: auto;
    margin-right: auto;
    margin-top: auto; */
    text-align: center;
    display: block;
}

.contact-top-description {
    /* margin-top: 5%; */
    /* margin-bottom: 5%; */
    color: white;
    text-align: center;
}

.img-bottom-icons2 {
    margin-top: 5%;
    width: 30%;
    height: auto;
    text-align: center;
}

.search-text {
    background-image: url('assets/images/pag\ web-10.svg');
    background-repeat: no-repeat;
    padding-left: 20px;
    background-color: transparent;
    min-width: 3%;
    width: auto;
    height: auto;
    color: #002B49;
    background-position: center;
    min-width: 200px;
    background-size: 100%;
    border-radius: 10px;
    border-color: transparent;
    margin-bottom: 5%;
    font-weight: bold;
}

.ecm-form {
    padding-right: 5%;
}

.ecm-label {
    color: #002B49;
    font-weight: bold;
}

.ecm-form-control {
    background: #ffffff;
    border-radius: 10px;
}

.alert-message {
    background: #3A5D73;
    color: white;
    text-align: center;
    border-radius: 30px;
    /* height: 10%; */
    font-size-adjust: inherit;
}


/* footer */

.footer {
    margin-top: 5%;
}

.img-bottom-icons {
    width: 30%;
    height: auto;
    margin-top: 10px;
    text-align: center;
    /* display: block; */
}

.footer-logo {
    width: 50%;
    height: auto;
    margin-top: 0px;
    text-align: center;
    margin-right: 5%;
}


/* test */


/* canvas{
  border-radius:200px;
  position:absolute;
  left:50%;
  margin-left:-250px;
  top:50%;
  margin-top:-150px;
  box-shadow:0px 0px 12px black;
  border-top:1px solid rgba(255,255,255,0.5);
} */