/*
 Theme Name:   Engie España Theme
 Theme URI:    http://divi.space/
 Description:  A Child Theme built for Divi on Divi Space
 Author:       Quality Devs S.L.
 Author URI:   https://www.qualitydevs.com
 Template:     Divi
 Version:      1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
*/

/* @import must be at top of file, otherwise CSS will not work */
@import url("//hello.myfonts.net/count/315f4c");

  
@font-face {font-family: 'FFClanWebBold';src: url('fonts/315F4C_0_0.eot');src: url('fonts/315F4C_0_0.eot?#iefix') format('embedded-opentype'),url('fonts/315F4C_0_0.woff2') format('woff2'),url('fonts/315F4C_0_0.woff') format('woff'),url('fonts/315F4C_0_0.ttf') format('truetype');}
 
  
@font-face {font-family: 'FFClanWebMedium';src: url('fonts/315F4C_1_0.eot');src: url('fonts/315F4C_1_0.eot?#iefix') format('embedded-opentype'),url('fonts/315F4C_1_0.woff2') format('woff2'),url('fonts/315F4C_1_0.woff') format('woff'),url('fonts/315F4C_1_0.ttf') format('truetype');}
 
  
@font-face {font-family: 'FFClanWebThin';src: url('fonts/315F4C_2_0.eot');src: url('fonts/315F4C_2_0.eot?#iefix') format('embedded-opentype'),url('fonts/315F4C_2_0.woff2') format('woff2'),url('fonts/315F4C_2_0.woff') format('woff'),url('fonts/315F4C_2_0.ttf') format('truetype');}
 
/*---------- [Font Styling] ----------*/
h1 {
    font-family: FFClanWebMedium, Lato, sans-serif;
}
h2 {
    font-family: FFClanWebMedium, Lato, sans-serif;
}
h3 {
    font-family: FFClanWebMedium, Lato, sans-serif;
}
h4 {
	font-family: FFClanWebMedium, Lato, sans-serif;
}
h5 {
    font-family: FFClanWebMedium, Lato, sans-serif;
}
body {
    font-family: FFClanWebMedium, Lato, sans-serif;
}
p {
    font-family: FFClanWebMedium, Lato, sans-serif;
}

.breadcrumbs{ float: left; width: 75%; margin-bottom: 1em; position:relative; z-index:1; }
@media screen and (max-width: 980px){
 .breadcrumbs{ width: 100%; }
}

#logo{
	margin-left: 0px!important;
}

.et_header_style_left #et-top-navigation, .et_header_style_split #et-top-navigation {
    padding: 38px 0 0 0 !important;
}

.five-columns-rsc .et_pb_module {
    float: left;
    width: 20%!important;
    padding: 10px !important;
}
 
@media only screen and (max-width: 980px) {
     
	.five-columns-rsc .et_pb_module {
    	width: 33%!important; 
    }
}
 
@media only screen and (max-width: 479px) {
     
	.five-columns-rsc .et_pb_module {
   	 	width: 50%!important;
    }
}

.rsc-box{display:table;width:100%;}
.rsc-box > div {
	display:table-cell;
	text-align: center;
	vertical-align: middle;
	height: 50px;
	border-radius: 10px;
	color: #fff;
	line-height: 16px;

}
.rsc-box.rsc-box-green > div{background: #9fc54d}
.rsc-box.rsc-box-purple > div{background: #7d2b8b}
.rsc-box.rsc-box-pink > div{background: #e62e86}
.rsc-box.rsc-box-yellow > div{background: #ffc100}
.rsc-box.rsc-box-dark-green > div{background: #359954}

.rsc-text{
	padding: 10px 21px;
    text-align: center;
    line-height: 16px;
	height: 68px;
	text-transform: uppercase;
}
.rsc-img{
	height:40px !important;
	width:40px !important;
}
	

.business-areas{
	width: 900px;
	margin: 0 auto;
	height: 625px;
	position:relative;
}

.business-areas .circle{
	position: absolute;
	width:386px;
	height:386px;
	top: 83px;
	left: 256px;
	display:none;
}

.business-areas .circle.active{
	display:block;
}

.business-areas #circle-00{background: url(assets/circle-00.png);}
.business-areas #circle-01{background: url(assets/circle-01.png);}
.business-areas #circle-02{background: url(assets/circle-02.png);}
.business-areas #circle-03{background: url(assets/circle-03.png);}
.business-areas #circle-04{background: url(assets/circle-04.png);}
.business-areas #circle-05{background: url(assets/circle-05.png);}
.business-areas #circle-06{background: url(assets/circle-06.png);}

.business-areas #circle-info-01{
	background: url(assets/circle-info-01.png) no-repeat 0 0;
	position: absolute;
	top: 1px;
	left: 545px;
	width: 0;
	height: 458px;
	overflow: hidden;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
}
.business-areas #circle-info-01.active{
	width:298px;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
	overflow: inherit;
}

.business-areas #circle-info-01 .circle-info-text{
	position: relative;
    top: 19px;
    left: 150px;
    text-align: center;
    color: #fff;
    font-size: 13px;
    line-height: 16px;	
	width:126px;
}

.business-areas #circle-info-01 .circle-info-ul{
    position: relative;
    top: 43px;
    left: 119px;
    font-size: 13px;
    background: url(assets/info-01-ul.png) no-repeat 0 0;
    width: 200px;
    height: 0px;
    padding-left: 28px;
    line-height: 14px;
	overflow:hidden;
}
.business-areas #circle-info-01.active .circle-info-ul{
	height: 346px;
	-webkit-transition: height 500ms ease-out 500ms;
	-moz-transition: height 500ms ease-out 500ms;
	-ms-transition: height 500ms ease-out 500ms;
	-o-transition: height 500ms ease-out 500ms;
	transition: height 500ms ease-out 500ms;
}
.business-areas .circle-info-ul a{
	margin-bottom: 16px;
	display:block;
	color: #666;
}
.business-areas .circle-info-ul a:hover{
	color:#00aaff;
}
.business-areas .circle-info-ul .mb-2{
	margin-bottom: 8px;
}
.business-areas .circle-info-ul .mt-1{
	margin-top: 30px;
}

.business-areas .circle-info-ul.right{
	text-align:right;
}

/***** CIRCLE 02 ******/

.business-areas #circle-info-02{
	background: url(assets/circle-info-02.png) no-repeat 0 0;
	position: absolute;
	top: 206px;
	left: 642px; 
	height: 140px;
	width: 0;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
	overflow:hidden;
}

.business-areas #circle-info-02 .circle-info-ul a:hover{
	color: #00a73b;
}

.business-areas #circle-info-02.active{
	width:258px;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
	overflow: inherit;
}

.business-areas #circle-info-02 .circle-info-text{
	position: relative;
    top: 24px;
    left: 112px;
    text-align: center;
    color: #fff;
    font-size: 13px;
    line-height: 16px;	
	width:126px;
}

.business-areas #circle-info-02 .circle-info-ul{
    position: relative;
    top: 43px;
    left: 119px;
    font-size: 13px;
    background: url(assets/info-02-ul.png) no-repeat 0 0;
    width: 200px;
    height: 0px;
    padding-left: 28px;
    line-height: 14px;
	overflow:hidden;
}
.business-areas #circle-info-02.active .circle-info-ul{
	height: 324px;
	-webkit-transition: height 500ms ease-out 500ms;
	-moz-transition: height 500ms ease-out 500ms;
	-ms-transition: height 500ms ease-out 500ms;
	-o-transition: height 500ms ease-out 500ms;
	transition: height 500ms ease-out 500ms;
}

/***** CIRCLE 03 ******/

.business-areas #circle-info-03{
	background: url(assets/circle-info-03.png);
	position: absolute;
	top: 411px;
	left: 545px; 
	width: 0;
	height: 139px;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
	overflow: hidden;
}

.business-areas #circle-info-03.active{
	width:298px;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
	overflow: inherit;
}

.business-areas #circle-info-03 .circle-info-text{
	position: relative;
    top: 41px;
    left: 147px;
    text-align: center;
    color: #fff;
    font-size: 13px;
    line-height: 16px;	
	width:126px;
}

/***** CIRCLE 04 ******/

.business-areas #circle-info-04{
	background: url(assets/circle-info-04.png);
	position: absolute;
	top: 411px;
	left: 57px; 
	width: 298px;
	width: 0;
	height: 139px;
	overflow: hidden;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
}

.business-areas #circle-info-04.active{
	width:298px;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
	overflow: inherit;
}

.business-areas #circle-info-04 .circle-info-text{
	position: relative;
    top: 41px;
    left: 22px;
    text-align: center;
    color: #fff;
    font-size: 13px;
    line-height: 16px;	
	width:126px;
}


/***** CIRCLE 05 ******/

.business-areas #circle-info-05{
	background: url(assets/circle-info-05.png);
	position: absolute;
	top: 206px;
	left: 0px; 
	width: 0;
	height: 139px;
	overflow: hidden;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
}

.business-areas #circle-info-05 .circle-info-ul a:hover{
	color: #0079c2;
}

.business-areas #circle-info-05.active{
	width:268px;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
	overflow: inherit;
}

.business-areas #circle-info-05 .circle-info-text{
	position: relative;
    top: 24px;
    left: 22px;
    text-align: center;
    color: #fff;
    font-size: 13px;
    line-height: 16px;	
	width:126px;
}

.business-areas #circle-info-05 .circle-info-ul{
    position: relative;
    top: 43px;
    right: 25px;
    font-size: 13px;
    background: url(assets/info-05-ul.png) no-repeat right 0;
    width: 200px;
    height: 0px;
    padding-right: 28px;
    line-height: 14px;
    overflow: hidden;
}
.business-areas #circle-info-05.active .circle-info-ul{
	height: 324px;
	-webkit-transition: height 500ms ease-out 500ms;
	-moz-transition: height 500ms ease-out 500ms;
	-ms-transition: height 500ms ease-out 500ms;
	-o-transition: height 500ms ease-out 500ms;
	transition: height 500ms ease-out 500ms;
}

/***** CIRCLE 06 ******/

.business-areas #circle-info-06{
	background: url(assets/circle-info-06.png);
	position: absolute;
	top: 1px;
	left: 57px; 
	width: 0;
	height: 139px;
	overflow: hidden;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
}

.business-areas #circle-info-06 .circle-info-ul a:hover{
	color: #83bf00;
}


.business-areas #circle-info-06.active{
	width:298px;
	-webkit-transition: width 500ms ease-out;
	-moz-transition: width 500ms ease-out;
	-ms-transition: width 500ms ease-out;
	-o-transition: width 500ms ease-out;
	transition: width 500ms ease-out;
	overflow: inherit;
}

.business-areas #circle-info-06 .circle-info-text{
	position: relative;
    top: 22px;
    left: 16px;
    text-align: center;
    color: #fff;
    font-size: 13px;
    line-height: 16px;
    width: 140px;
}

.business-areas #circle-info-06 .circle-info-ul{
    position: relative;
    top: 43px;
    right: 25px;
    font-size: 13px;
    background: url(assets/info-06-ul.png) no-repeat right 0;
    width: 200px;
    height: 0px;
    padding-right: 28px;
    line-height: 14px;
    overflow: hidden;
}
.business-areas #circle-info-06.active .circle-info-ul{
	height: 324px;
	-webkit-transition: height 500ms ease-out 500ms;
	-moz-transition: height 500ms ease-out 500ms;
	-ms-transition: height 500ms ease-out 500ms;
	-o-transition: height 500ms ease-out 500ms;
	transition: height 500ms ease-out 500ms;
}


.business-areas #btn_circle-01 {
	position: absolute;
    width: 150px;
    height: 100px;
    top: 86px;
    left: 450px;
	cursor: pointer;
}
.business-areas #btn_circle-02 {
	position: absolute;
    width: 80px;
    height: 176px;
    top: 188px;
    left: 564px;
	cursor: pointer;
}
.business-areas #btn_circle-03 {
	position: absolute;
    width: 150px;
    height: 100px;
    top: 366px;
    left: 450px;
	cursor: pointer;
}
.business-areas #btn_circle-04 {
	position: absolute;
    width: 150px;
    height: 100px;
    top: 366px;
    left: 299px;
	cursor: pointer;
}
.business-areas #btn_circle-05 {
	position: absolute;
    width: 80px;
    height: 176px;
    top: 188px;
    left: 255px;
	cursor: pointer;
}
.business-areas #btn_circle-06 {
	position: absolute;
    width: 150px;
    height: 100px;
    top: 86px;
    left: 299px;
	cursor: pointer;
}

.infraestructura ul {
	line-height: 24px !important;	
}

.industria-bottom ul, .infraestructura ul {
	padding-left: 30px !important;
	padding-right: 20px !important;
}

.terciario ul{
    max-width: 300px;
    margin: 36px auto 0;
}
.seguridad-salud, .seguridad-salud > div{
	height:100%;	
}

.renovables .et_pb_module{
	position:relative;
}
.renovables .et_pb_module,
.renovables .et_pb_module .renovable-overlay,
.renovables .et_pb_module .renovable-text{
	height:233px;
	width:100%;
}

.renovables .renovable-overlay{
	background: url(../../uploads/2018/07/renovable-overlay-2.png) no-repeat center center;
	background-size:cover;
	visibility:hidden;
	cursor:pointer;
}

.renovables .renovable-text{
	position:absolute;
	border: solid 2px #ddd;
	padding: 20px;
	top:0;
	font-size:13px;
	background-color: #fff;
	display:none;
}

.renovables h5{
	font-size: 16px;
	font-weight: 700;
}

.renovables h5:before{
	background: #fff;
    border-radius: 8px;
    content: "";
    display: block;
    height: 8px;
    margin-bottom: 10px;
    width: 40px;
}
#renovable-text-fotovoltaica h5{
	color: #ffc300;
}
#renovable-text-fotovoltaica h5:before{
	background: #ffc300;
}

#renovable-text-hidraulica h5{
	color: #005faf;
}
#renovable-text-hidraulica h5:before{
	background: #005faf;
}

#renovable-text-eolica h5{
	color: #b8ce00;
}
#renovable-text-eolica h5:before{
	background: #b8ce00;
}

#infoGoya{
    border: 1px solid #b8ce00;
	color:#b8ce00;
    border-radius: 15px;
    padding: 2px 6px;
    position: absolute;
    right: 20px;
    bottom: 20px;
}

#login-my-engie{
    background-color: #fff;
    color: #00aaff;
    width: 130px;
    font-size: 16px;
    margin-left: 25%;
    border: solid 1px #00aaff;
    border-radius: 16px;
    padding: 6px 0;
}

#bim_link{
	position: absolute;
    bottom: -18px;
    left: 50%;
    margin-left: -100px;
}
#bim_link img{
	max-width:200px;
}