/*
Theme Name:     divi_child
Description:    
Author:         webmasterJack - Bluehouse
Template:       Divi

(optional values you can add: Theme URI, Author URI, Version, License, License URI, Tags, Text Domain)
*/
/************************IMAGE TXT ACCEUIL **********************/

.jb_image_1{
	padding-top:10%;
}
/*************************HEADER TXT*****************************/

.et_pb_fullwidth_header .et_pb_fullwidth_header_container.left .header-content {
    
    margin-top: -20%;
}
.jb_copy{
	font-weight:700;
	line-height:1em;
	margin-top:20%!important;
}

@media screen and (max-width: 480px) {
	.jb_copy{
	font-weight:500;
	
	margin-top:200px!important;
}
	.et_pb_fullwidth_header .et_pb_fullwidth_header_container.left .header-content {
    
    margin-top: -1%;
}
	}

/*hack firefox -> menu */
.et-fixed-header {
opacity: 1!important;
}


/* CSS FOR FULL SCREEN SLIDER/BACKGROUND VIDEO */ 

.dc_bizz_slider{height: 100vh;}

.dc_bizz_slider i {font-size: 92px;padding-bottom: 30px;}

.dc_slider_small_headline{font-size: 18px;}
.dc_slider_main_headline{font-size: 5vw; font-weight: 900;padding-top: 20px; padding-bottom: 20px;}
@media screen and (max-width: 981px) {.dc_slider_main_headline{font-size: 6vw;}}
@media screen and (max-width: 550px) {.dc_slider_main_headline{font-size: 7vw;}}
@media screen and (max-width: 480px) {.dc_slider_main_headline{font-size: 8vw;}}
.dc_dot_headlines{padding-top:10px; font-size: 18px;}
.dc_dot_headlines span{position:relative;padding-bottom:8px;padding-top:8px;}
.dc_dot_headlines span:after {position: absolute; 
    left: 0; 
    bottom: 0; 
    width: 100%; 
    height: 1px; 
    border-bottom: 3px solid #fff; 
    content: "";}
.dc_dot_headlines span:before {position: absolute; 
    left: 0; 
    top: 0; 
    width: 100%; 
    height: 1px; 
    border-top: 3px solid #fff;
    content: "";}

/* END CSS FOR FULL SCREEN SLIDER/BACKGROUND VIDEO */ 		

/*anime fleche*/

#clicker_transition { 
width: 500px; 
height: 50px; 
cursor:pointer;
float:left;

}


#rotating_transition { 
width:50px;
height:50px;
float:left;

-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}


.rotated_transition { 
transform:rotate(-90deg); 
-webkit-transform:rotate(-90deg); 
-moz-transform:rotate(-90deg); 
-o-transform:rotate(-90deg); 
}


#clicker_forum { 
width: 500px; 
height: 50px; 
cursor:pointer;
float:left;

}


#rotating_forum { 
width:50px;
height:50px;
float:left;

-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}


.rotated_forum { 
transform:rotate(-90deg); 
-webkit-transform:rotate(-90deg); 
-moz-transform:rotate(-90deg); 
-o-transform:rotate(-90deg); 
}

#clicker_diagnostic { 
width: 500px; 
height: 50px; 
cursor:pointer;
float:left;

}


#rotating_diagnostic { 
width:50px;
height:50px;
float:left;

-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}


.rotated_diagnostic { 
transform:rotate(-90deg); 
-webkit-transform:rotate(-90deg); 
-moz-transform:rotate(-90deg); 
-o-transform:rotate(-90deg); 
}

#clicker_rebonds { 
width: 500px; 
height: 50px; 
cursor:pointer;
float:left;

}


#rotating_rebonds { 
width:50px;
height:50px;
float:left;

-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}


.rotated_rebonds { 
transform:rotate(-90deg); 
-webkit-transform:rotate(-90deg); 
-moz-transform:rotate(-90deg); 
-o-transform:rotate(-90deg); 
}

.text {
	opacity:1;
	font-size: 38px;
	color: #BBB;
	font-weight:700;
	padding-top:14px;
	padding-left:10px;
	
	float:left;
	-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
	
}
.text:hover {
	opacity:0.5;
	-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
	
}

.text2 {
	opacity:1;
	font-size: 20px;
	color: #BBB;
	font-weight:700;
	padding-top:14px;
	padding-left:10px;
	
	float:left;
	-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
	
}
.text2:hover {
	opacity:0.5;
	-webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
	
}


/*ANIME LIEN */
.lien {
	
	opacity:1;
	transition: all 0.3s ease-in; 
	 -webkit-transition: all 0.3s ease-in; 
    -moz-transition: all 0.3s ease-in;  
    -o-transition: all 0.3s ease-in;   
    -ms-transition: all 0.3s ease-in; 
}

.lien:hover {
	opacity:0.5;
	transition: all 0.3s ease-out; 
	-webkit-transition: all 0.3s ease-out; 
    -moz-transition: all 0.3s ease-out;  
    -o-transition: all 0.3s ease-out;   
    -ms-transition: all 0.3s ease-out; 
}

/* fade image-2 */

.fade-2 a img {
    opacity: 1.0;/* l'opacite que vous voulez au depart */
    border: none;/* enlever les border d'une image en lien */
    -ms-filter: "prodig:DXImageTransform.Microsoft.Alpha(Opacity=25)"; /* Hack IE8 */
    filter: alpha(opacity = 25); /* Hack IE 5-7 */
    -webkit-transition: opacity 0.5s ease-in-out;/* transition pour Chrome et Safari */
    -moz-transition: opacity 0.5s ease-in-out;/* transition pour Firefox */
    -o-transition: opacity 0.5s ease-in-out;/* transition pour Opéra */
    transition: opacity 0.5s ease-in-out; /* on écrit cette ligne à la fin de façon à ce que ce soit elle qui soit prise en compte lorsque l'attribut transition sera pris en compte par tous les navigateurs */
 
}
 
.fade-2 a:hover img, .fade-2 a:focus img {
    opacity: 0.5; /* opacite au survol */
    -ms-filter:"prodig:DXImageTransform.Microsoft.Alpha(Opacity=90)"; /* Hack IE 8 */
    filter: alpha(opacity = 90); /* Hack IE 5-7 */
}






/* zoom Hover image */
.zoom {
	transition-property: transform;
	-webkit-transition-property: transform;
    transition-duration: .2s;
	transition-timing-function: ease-out;
	}

.zoom:hover {
	transform: scale(1.08);
   	-webkit-transform: scale(1.08);
}


/* responsive text #a_film */
@media only screen and ( max-width: 980px ) {
#a_films .et_pb_text {
display: inline-block;
}
}



/* 4 colonnes */
#myfour .et_pb_module{
width: 25%;
margin-right: 0%;
float: left;
}


/* test txt */



.hobit:after {
	content: 'Frugalité énergétique des établissements humains';
	display: block;
	position: relative;
	width: 260px;
	height: auto;
	top: 100px;
	font-family: "Open Sans";
	font-size: 110%;
	color: #000;
	line-height: 1.2em;
	text-align: center;
  z-index: 12;
}




.fade {
   opacity: 1;
   transition: opacity .50s ease-in-out;
   -moz-transition: opacity .50s ease-in-out;
   -webkit-transition: opacity .50s ease-in-out;
   }

   .fade:hover {
      opacity: 0.5;
      }


/* anim_button_landing_page */

.anim_landing {
	width: 66px;
	height: 66px;
	background-image: url(http://www.territoires-energies.fr//wp-content/uploads/2016/03/anim-landing-page-2.png);
	
	position: relative;
	-webkit-animation-name: example; /* Chrome, Safari, Opera */
	-webkit-animation-duration: 2s; /* Chrome, Safari, Opera */
	animation-name: example;
	animation-duration: 4s;
	animation-iteration-count: infinite;

}

/* Chrome, Safari, Opera */
@-webkit-keyframes example {
    0%   { left:0px; top:0px;}
    12%  { left:0px; top:36px;}
	25%  { left:0px; top:0px;}
	37%  { left:0px; top:18px;}
    50%  { left:0px; top:0px;}
    
    100% { left:0px; top:0px;}
}

/* Standard syntax */
@keyframes example {
      0%   { left:0px; top:0px;}
    12%  { left:0px; top:36px;}
	25%  { left:0px; top:0px;}
	37%  { left:0px; top:18px;}
    50%  { left:0px; top:0px;}
    
    100% { left:0px; top:0px;}
}




/* arrow-section */



.arrow-section_1h_rg:before {
	content: '';
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	
top: -25px;
	left: calc(50% - 25px);
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	z-index: 1;
	
	
	background-image: url(http://www.territoires-energies.fr//wp-content/uploads/2016/03/secDiv_2_rg.png);
	
	
}





.arrow-section_1h_ve:before {
	content: '';
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	
top: -25px;
	left: calc(50% - 25px);
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	z-index: 1;
	
	
	background-image: url(http://www.territoires-energies.fr//wp-content/uploads/2016/03/secDiv_ve_3.png);
	
	
}



.arrow-section_1h_bl:before {
	content: '';
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	
top: -25px;
	left: calc(50% - 25px);
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	z-index: 1;
	
	
	background-image: url(http://www.territoires-energies.fr//wp-content/uploads/2016/03/secDiv_2_bl.png);
	
	
}




.arrow-section_1b_bl:after {
	content: '';
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	
bottom: -25px;
	left: calc(50% - 25px);
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	z-index: 1;
	
	
	background-image: url(http://www.territoires-energies.fr//wp-content/uploads/2016/03/secDiv_2_bl.jpg);
		
}



.arrow-section_1b:after {
	content: '';
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	
bottom: -25px;
	left: calc(50% - 25px);
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	z-index: 1;
	
	
	background-image: url(http://www.territoires-energies.fr//wp-content/uploads/2016/03/secDiv_1.jpg);
		
}
.arrow-section_1h:before {
	content: '';
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	
top: -25px;
	left: calc(50% - 25px);
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	z-index: 1;
	
	
	background-image: url(http://www.territoires-energies.fr//wp-content/uploads/2016/03/secDiv_1.jpg);
	
	
}
.arrow-section_2:before {
	content: '';
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	
top: -25px;
	left: calc(50% - 25px);
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	z-index: 1;
	
	
	background-image: url(http://www.territoires-energies.fr//wp-content/uploads/2016/03/secDiv_1.jpg);
	

	
}

.arrow-section_2:after {
	content: '';
	display: block;
	position: absolute;
	width: 50px;
	height: 50px;
	
bottom: -25px;
	left: calc(50% - 25px);
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	z-index: 1;
	
	
	background-image: url(http://www.territoires-energies.fr//wp-content/uploads/2016/03/secDiv_1.jpg);
	

	
}




/* roll over cut */

#rollover img {
display: none;
}
#rollover {
display: inline-block;
padding: 0;
background-image: url("http://www.territoires-energies.fr//wp-content/uploads/2016/03/habitat-10.png");
width: 200px;
height: 200px;
cursor: pointer;
}
#rollover:hover {
background-image: url("http://www.territoires-energies.fr//wp-content/uploads/2016/03/habitatOn-7.png");
}


/* roll over fade */

div.fadehover {
	position: relative;
  	height: 270px;
  z-index:1;
	}

div.fadehover_forum {
	position: relative;
  	height: 34px;
	}

div.fadehover_txt {
	position: relative;
  	height: 157px;
	}
img.a {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 10;
        }
	
img.b {
	position: absolute;
	left: 0;
	top: 0;
	}




/***************** LAYOUT ************************/
#myfive .et_pb_module {
width: 20%;
margin-right: 0%;
float: left;
}

#myfour .et_pb_module {
width: 25%;
margin-right: 0%;
float: left;
}

/*****************ROLLOVER ***********************/

.jb_g_title_1 {
font-size:1.5vw !important;
}

.jb_g_txt_1 {
font-size:0.9vw !important;
	
}


.jb_rollOver_txt_1{
	
	margin-top:-54%;
	line-height:1.3em;
	padding-left:5px;
	padding-right:5px;
	z-index:1000;
	position:relative;
}

.jb_rollover_gap_1{
	margin-left:5px;
	margin-right:5px;
}

.jb_rollover_gap_2{
	margin-bottom:10px!important;
	
}

.jb_rollover_z{
	
	z-index:9999;
	
}

@media screen and (max-width: 1177px) {
	
	.jb_rollOver_txt_1{
	
	
	line-height:1.1em;
	
}
	
}

@media screen and (max-width: 1015px) {
	
	.jb_rollOver_txt_1{
	
	
	line-height:0.9em;
	
}
	
}

@media screen and (max-width: 981px) {
	
	.jb_rollOver_txt_1{
	
	margin-top:-42%;
	line-height:1.3em;
		margin-bottom:62px!important;
	
}
	
	.jb_g_title_1 {
font-size:2.5vw !important;
}

.jb_g_txt_1 {
font-size:1.8vw !important;
	
}
	
	.jb_rollover_gap_1{
	margin-right:10px!important;
}

.jb_rollover_gap_2{
	margin-right:10px!important;
	
}
	
}

@media screen and (max-width: 712px) {
	
	.jb_rollOver_txt_1{
	
	margin-top:-52%;
		line-height:1.3em;
		margin-bottom:42px!important
	
}
	
}

@media screen and (max-width: 564px) {
	
	.jb_rollOver_txt_1{
	
	margin-top:-50%;
		line-height:1.1em;
		margin-bottom:18px!important
	
}
	
}
@media screen and (max-width: 480px) {
	
	.jb_rollOver_txt_1{
	
	margin-top:-160px;
		margin-bottom:90px!important;
	
}
	.jb_g_title_1 {
font-size:30px!important;
}

.jb_g_txt_1 {
font-size:14px !important;
	line-height:1.7em;
	
}
	.jb_rollover_gap_1{
	margin-right:0px!important;
}

.jb_rollover_gap_2{
	margin-right:0px!important;
	
	
}
	
	
	
}

/*cont_but*/


.cont_but_3 {
	height: 160px;
	max-width: 100%;
	_width: 100%; /* IE6 seulement */
	width: 200px;
	margin-top: -165px;
	background-image: url(http://www.bluehouse.fr/JB6/territoires/wp-content/uploads/2016/03/menu_1.png);	
}


/*---------- [Load The Fonts] ----------*/
@font-face {
    font-family: Geog-BdIt;
    src: url('font/Geog-BdIt.otf');
}

@font-face {
    font-family: Geog-LgIt;
    src: url('font/Geog-LgIt.otf');
}

@font-face {
    font-family: Geog-MdIt;
    src: url('font/Geog-MdIt.otf');
}

@font-face {
    font-family: Geog-RgIt;
    src: url('font/Geog-RgItt.otf');
}

@font-face {
    font-family: Geog-SbIt;
    src: url('font/Geog-SbIt.otf');
}

@font-face {
    font-family: Geog-ThIt;
    src: url('font/Geog-ThIt.otf');
}

@font-face {
    font-family: Geog-UlIt;
    src: url('font/Geog-UlIt.otf');
}

@font-face {
    font-family: Geogrotesque Stencil C-Bd;
    src: url('font/Geogrotesque Stencil C-Bd.otf');
}

@font-face {
    font-family: Geogtq-Bd;
    src: url('font/Geogtq-Bd.otf');
}

@font-face {
    font-family: Geogtq-Lg;
    src: url('font/Geogtq-Lg.otf');
}

@font-face {
    font-family: Geogtq-Md;
    src: url('font/Geogtq-Md.otf');
}

@font-face {
    font-family: Geogtq-Rg;
    src: url('font/Geogtq-Rg.otf');
}

@font-face {
    font-family: Geogtq-Sb;
    src: url('font/Geogtq-Sb.otf');
}

@font-face {
    font-family: Geogtq-Th;
    src: url('font/Geogtq-Th.otf');
}

@font-face {
    font-family: Geogtq-Ul;
    src: url('font/Geogtq-Ul.otf');
}