/*
 Theme Name:     MundoColor Theme
 Theme URI:      http://www.teide.net
 Description:    MundoColor Child Theme
 Author:         TeideNet
 Author URI:     http://www.teide.net
 Template:       Divi
 Version:        1.0.0
*/

@import url("../Divi/style.css");

/* =Theme customization starts here
------------------------------------------------------- */
/* Contact Form 7 personalizacion  */
.wpcf7-text, .wpcf7-textarea, .wpcf7-captchar {
  background-color: #eee !important;
  border: none !important;
  width: 100% !important;
  -moz-border-radius: 0 !important;
  -webkit-border-radius: 0 !important;
  border-radius: 0 !important;
  font-size: 14px;
  font-weight: 800;
  color: #999 !important;
  padding: 16px !important;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.wpcf7-submit {
color: #2ea3f2 !important;
margin: 8px auto 0;
cursor: pointer;
font-size: 20px;
font-weight: 500;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
padding: 6px 20px;
line-height: 1.7em;
background: transparent;
border: 2px solid;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-moz-transition: all 0.2s;
-webkit-transition: all 0.2s;
transition: all 0.2s;
}
.wpcf7-submit:hover {
background-color: #eee;
border-color:#eee;
padding: 6px 20px !important;
}


/*------------------------------------------------*/
/*----[Left Diagonal Lines - By Geno Quiroz]------*/
/*-----------------[Quiroz.Co]--------------------*/
/*------------------------------------------------*/

#et-main-area { overflow: hidden;} /* Hides all the items that float over the right margin */

.left-diagonal {
z-index: 1;
padding-top: 0px;}

.left-diagonal::after {
position: absolute;
content: '';
pointer-events: none;
top: -150px;
left: -25%;
z-index: -1;
width: 150%;
height: 50%;
background: inherit;
-webkit-transform: rotate(3deg);
transform: rotate(3deg);
-webkit-transform-origin: -3% 0;
transform-origin: -3% 0;}

@media only screen and ( min-width: 1901px ) and ( max-width: 2500px ) {.left-diagonal::after {top: -150px; height: 85%;}}
@media only screen and ( min-width: 1501px ) and ( max-width: 1900px ) {.left-diagonal::after {top: -131px; height: 68%;}}
@media only screen and ( min-width: 1001px ) and ( max-width: 1500px ) {.left-diagonal::after {top: -116px;}}
@media only screen and ( max-width: 1000px ) {.left-diagonal::after {top: -90px;}}

/*------------------------------------------------*/
/*------[Shadow Diagonal Lines - Quiroz.co]-------*/
/*------------------------------------------------*/

#et-main-area { overflow: hidden;} /* Hides all the items that float over the right margin */

    .diagonal-shadow::before,
    .diagonal-shadow::after {
        position: absolute;
        content: '';
        pointer-events: none;}

    .diagonal-shadow {
        z-index: 1;
        padding-top: 6em;
        background: #2072a7;}

    .diagonal-shadow::before,
        .diagonal-shadow::after {
        top: 0;
        left: -25%;
        z-index: -1;
        width: 150%;
        height: 75%;
        background: inherit;
        -webkit-transform: rotate(-2deg);
        transform: rotate(-2deg);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;}

    .diagonal-shadow::before {
        height: 50%;
        background: #535353;
        -webkit-transform: rotate(-3deg);
        transform: rotate(-3deg);
        -webkit-transform-origin: 3% 0;
        transform-origin: 3% 0;}

/*--------------------------------------------*/
/*------[Triangle Dividers - Quiroz.co]-------*/
/*--------------------------------------------*/

    .triangles::before, .triangles::after {position: absolute; content: ''; pointer-events: none;}

    .triangles::before, .triangles::after {
        left: 50%;
        width: 100px;
        height: 100px;
        -webkit-transform: translateX(-50%) rotate(45deg);
        transform: translateX(-50%) rotate(45deg);}

     /* Top arrow pointing down. Currently set as black. This can be removed if you don't want a top arrow */
     .triangles::before {top: -50px; background: #000;}

     /* Bottom arrow pointing down. Currently set to inherit the background of the section. This can be removed if you don't want a bottom arrow */
     .triangles::after { bottom: -50px; z-index: 10; background: inherit;}


/*------------------------------------------------*/
/* Carrusel portafolio sin link                   */
/*------------------------------------------------*/

.sinlink .et_pb_portfolio_item .et_overlay {
  z-index: 6;
}

.sinlink .et_pb_fullwidth_portfolio .et_pb_portfolio_image h3 {
  display: inline-block;
  position: relative;
  z-index: 6;
}

.sinlink .et_pb_portfolio_item .et_pb_portfolio_image:hover:after {
  content:"";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 5;
  display: block;
}

.sinlink .et_pb_portfolio_item .post-meta {
  display: none !important;
}

.sinlink .et_pb_portfolio_image:hover .meta {
    display:none;
}

/* blurb secciones */
#row-secciones .et_pb_main_blurb_image {
    margin-bottom: 10px;
}
#row-secciones .et_pb_blurb h4, #row-secciones .et_pb_blurb h4 a {
    color: #0c71c3;
}
#row-secciones .et_pb_blurb_content {
    background-color: #f6f6f6;
    border: 1px solid #f6f6f6;
    padding-bottom: 5px;
}

/* Tabla formatos */
.ancho-completo {
  width: 100%;
  margin: auto;
}
.cabecera-resaltada thead {
  background: aliceblue;
  font-weight: bold;
}

/* Flex para columnas */
@media (min-width: 981px) {
  .columna-distribuida {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  .columna-distribuida .et_pb_text_align_center {
    margin: 0 auto;
  }
}

/* Color hover widget */
.et_pb_bg_layout_light .et_pb_widget li a:hover {
    color: #08affe;
}

/* Parche para el problema de visualizacion del sumario en el modo personalizar articulo*/
/*body.fpd-customize-button-hidden .summary {
        width: 100% !important;
        float: none !important;
        margin-top: 2em;
}

/*
Altura slider principal
*/
@media only screen and ( min-width:981px ) {
    /* Set the slider height */
    .slider-principal .et_pb_container { 
        height: 300px !important; 
    }
    .slider-principal, .slider-principal .et_pb_slide { 
        max-height: 300px; 
    }
    .slider-principal .et_pb_slide_description { 
        position: relative; 
        top: 25%; 
        padding-top: 0 !important; 
        padding-bottom:0 !important; 
        height:auto !important; 
    }
}