﻿/***** General *****/

html, body, div, span,
h1, h2, h3, h4, h5, h6, p,
a, img, ol, ul, li,
fieldset, form, label, wup, bego {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

ad { display:none; }

body {
    font-family: Arial, sans-serif;
    font-size: 13px;
    line-height: 1;
}

ol, ul {
	list-style: none;
}

a {
	text-decoration: none;
	color: #2aacc8;
}

a:hover {
    text-decoration: underline;
}

.container {
    margin: auto;
    width: 1000px;
}

.separation {
    border-top: 1px solid #dfe1e5;
    padding-top: 10px;
}

h2 {
    font-size: 200%;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: 10px;
    line-height: 120%;
    text-align: center;
}

h3 {
    font-size: 120%;
    font-weight: bold;
    margin-top: 5px;
    margin-bottom: 5px;
}

h4 {
    font-size: 110%;
    font-weight: bold;
    margin-top: 5px;
    margin-bottom: 5px;
}

wup {
    font-size: 150%;
    font-weight: bold;
    color: #7B7777;
    line-height: 130%;
    text-align: center;
}

bego {
    font-size: 150%;
    font-weight: bold;
    color: #7B7777;
    line-height: 130%;
    text-align: center;
}

 .list2 {
 margin-left:20px;
}

table {
border-spacing: 0px;
padding: 0px;
}


/***** General *****/

/***** Header *****/

#header {
    background: #e8ebf1;
    height: 100px;
}

h1 {
    float: left;
    margin-top: 10px;
}

/***** Header *****/

/***** Navigation *****/

#main_menu {
    float: right;
    margin-top: 44px;
    
}

.first_list {
    float: left;
    margin: 0 14px;
}

.main_menu_first {
    color: #000;
    font-weight: bold;
    padding: 10px 8px;
    text-transform: uppercase;
}

.main_menu_first:hover {
    border-top: 5px solid #333366;
    text-decoration: none;
}

.with_dropdown {
    position: relative;
    z-index:10;
}

.with_dropdown li a {
    display: block;
}

.with_dropdown ul {
    background: #fff;
    border-bottom: 5px solid #333366;
    padding: 2px 0;
    position: absolute;
    top: 24px;
    visibility: hidden;
    width: 140px;
}

.first_list:hover.first_list ul {
    visibility: visible;
}

.with_dropdown .main_menu_first {
    background: url('images/arrow_down.png') no-repeat 92% 92%;
    padding-right: 23px;
}

.with_dropdown:hover .main_menu_first {
    background: #fff url('images/arrow_down.png') no-repeat 92% 92%;
    border-top: 5px solid #333366;
    color: #333366;
}

.second_list {
	/*background: #333366;*/
    margin: 0 5px;
    padding: 7px;
}

.second_list_border {
    border-bottom: 1px solid #e7e7e7;
}

.main_menu_second {
    color: #000;
    text-transform: capitalize;
}

.main_menu_second:hover {
    color: #2aacc8;
    text-decoration: none;
}

.main_current {
    border-top: 5px solid #333366;
}

/***** Navigation *****/


/***** Slider *****/

#about_back {
	height: 400px;
    background: #AAAAC7 url('images/about.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#about_text {
	position:relative;
	top:25px;
	left:100px;
	width:800px;
	color:white;
}

#wind_back {
	height: 180px;
	background: #AAAAC7 url('images/wave.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#vierge_back {
	height: 400px;
    background: #AAAAC7;
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#contacts_back {
	height: 100px;
	background: #AAAAC7 url('images/propellers100.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#sitemap_back {
	height: 100px;
	background: #AAAAC7 url('images/containers100.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#energy_back {
	height: 400px;
    background: #AAAAC7 url('images/propellers.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#energy_text {
	position:relative;
	top:25px;
	left:100px;
	width:800px;
	color:white;
}

#energy_icon {
    background: url(images/energy_icon.png) no-repeat left;
    height: 32px;
    margin-bottom: 15px;
    padding: 12px 0 0 60px;
}

#consumers_back {
	height: 400px;
    background: #AAAAC7 url('images/containers.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#consumers_text {
	position:relative;
	top:255px;
	left:100px;
	width:800px;
	color:white;
}

#consumers_icon {
    background: url(images/customers_icon.png) no-repeat left;
    height: 32px;
    margin-bottom: 15px;
    padding: 12px 0 0 60px;
}

#tourism_back {
	height: 400px;
    background: #AAAAC7 url('images/ocean.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#tourism_text {
	position:relative;
	top:25px;
	left:100px;
	width:800px;
	color:white;
}

#tourism_icon {
    background: url(images/tourism_icon.png) no-repeat left;
    height: 32px;
    margin-bottom: 15px;
    padding: 12px 0 0 60px;
}

#insurance_back {
	height: 400px;
    background: #AAAAC7 url('images/storm.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#insurance_text {
	position:relative;
	top:25px;
	left:100px;
	width:800px;
	color:white;
}

#insurance_icon {
    background: url(images/insurance_icon.png) no-repeat left;
    height: 32px;
    margin-bottom: 15px;
    padding: 12px 0 0 60px;
}

#transport_back {
	height: 400px;
    background: #AAAAC7 url('images/winterroad.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#transport_text {
	position:relative;
	top:25px;
	left:100px;
	width:800px;
	color:white;
}

#transport_icon {
    background: url(images/transport_icon.png) no-repeat left;
    height: 32px;
    margin-bottom: 15px;
    padding: 12px 0 0 60px;
}

#weather_back {
	height: 400px;
    background: #AAAAC7 url('images/hills.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#weather_text {
	position:relative;
	top:25px;
	left:100px;
	width:800px;
	color:white;
}

#weather_icon {
    background: url(images/weather_icon.png) no-repeat left;
    height: 32px;
    margin-bottom: 15px;
    padding: 12px 0 0 60px;
}

#technology_back {
	height: 400px;
    background: #AAAAC7 url('images/binary.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#technology_text {
	position:relative;
	top:25px;
	left:100px;
	width:800px;
	color:white;
}

#deeplearning_back {
	height: 400px;
    background: #AAAAC7 url('images/transformers.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#deeplearning_text {
	position:relative;
	top:25px;
	left:100px;
	width:800px;
	color:#548DD4;
}

#data_back {
	height: 400px;
    background: #AAAAC7 url('images/models.jpg');
    background-repeat:no-repeat;
    background-position: center; 
    padding: 20px 0 20px 0;
    vertical-align:middle;
}

#data_text {
	position:relative;
	top:25px;
	left:100px;
	width:800px;
	color:white;
}

#scene {
   
   /* Positioning and dimensions */
   position: relative;
   top: 0px;
   left: 0px;
   width: 1000px;
   height: 400px;
   overflow: hidden;
   z-index: 0;
}

.Slide {
   position:absolute;
   left:0;
}

.Slide1 
{   
	animation: SlideTransfo1 ease-out infinite;
    animation-duration: 40s;
}
   
.Slide2 
{   
	animation: SlideTransfo2 ease-out infinite;
    animation-duration: 40s;
}

.Slide3
{   
	animation: SlideTransfo3 ease-out infinite;
    animation-duration: 40s;
}

.Slide4
{   
	animation: SlideTransfo4 ease-out infinite;
    animation-duration: 40s;
}

.Slide5
{   
	animation: SlideTransfo5 ease-out infinite;
    animation-duration: 40s;
}

.Slide6
{   
	animation: SlideTransfo6 ease-out infinite;
    animation-duration: 40s;
}

   @keyframes SlideTransfo1 {
   0% { transform: translateX(-1000px); }
   16% { transform: translateX(-1000px); }
   18% { transform: translateX(0px); }
   97% { transform: translateX(0px); }
   100% { transform: translateX(-1000px); }
   }

   @keyframes SlideTransfo2 {
   0% { transform: translateX(-1000px); }
   30% { transform: translateX(-1000px); }
   32% { transform: translateX(0px); }
   97% { transform: translateX(0px); }
   100% { transform: translateX(-1000px); }
   }
    
   @keyframes SlideTransfo3 {
   0% { transform: translateX(-1000px); }
   44% { transform: translateX(-1000px); }
   46% { transform: translateX(0px); }
   97% { transform: translateX(0px); }
   100% { transform: translateX(-1000px); }
   }
   
   @keyframes SlideTransfo4 {
   0% { transform: translateX(-1000px); }
   58% { transform: translateX(-1000px); }
   60% { transform: translateX(0px); }
   97% { transform: translateX(0px); }
   100% { transform: translateX(-1000px); }
   }

   @keyframes SlideTransfo5 {
   0% { transform: translateX(-1000px); }
   72% { transform: translateX(-1000px); }
   74% { transform: translateX(0px); }
   97% { transform: translateX(0px); }
   100% { transform: translateX(-1000px); }
   }

   @keyframes SlideTransfo6 {
   0% { transform: translateX(-1000px); }
   86% { transform: translateX(-1000px); }
   88% { transform: translateX(0px); }
   97% { transform: translateX(0px); }
   100% { transform: translateX(-1000px); }
   }

	.titres
	{
		top:25px;
		left:100px;
		color:white;
		position:absolute;
	}

	.titres1
	{
	animation: TexteAppear1 linear infinite;
    animation-duration: 40s;
	}

	.titres2
	{
	animation: TexteAppear2 linear infinite;
    animation-duration: 40s;
	}
	
	.titres3
	{
	animation: TexteAppear3 linear infinite;
    animation-duration: 40s;
	}

	.titres4
	{
	animation: TexteAppear4 linear infinite;
    animation-duration: 40s;
	}
	
	.titres5
	{
	animation: TexteAppear5 linear infinite;
    animation-duration: 40s;
	}

	.titres6
	{
	animation: TexteAppear6 linear infinite;
    animation-duration: 40s;
	}


	@keyframes TexteAppear1 {
	 0%, 18%, 100% { opacity:0; transform: translateY(-20px);}
	 20%, 30% { opacity:1; transform: translatey(0px)}
	 34% { opacity:0; transform: translatey(0px);}
	 }
	
	@keyframes TexteAppear2 {
	 0%, 32%, 100% { opacity:0; transform: translateY(-20px);}
	 34%, 42% { opacity:1; transform: translatey(0px);}
	 46% { opacity:0; transform: translatey(0px);}
	}
	
	@keyframes TexteAppear3 {
	 0%, 46%, 100% { opacity:0; transform: translateY(-20px);}
	 48%, 58% { opacity:1; transform: translatey(0px);}
	 62% { opacity:0; transform: translatey(0px);}
	}
	
	@keyframes TexteAppear4 {
	 0%, 60%, 100% { opacity:0; transform: translateY(-20px);}
	 62%, 72% { opacity:1; transform: translatey(0px);}
	 76% { opacity:0; transform: translatey(0px);}
	}

	@keyframes TexteAppear5 {
	 0%, 74%, 100% { opacity:0; transform: translateY(-20px);}
	 76%, 86% { opacity:1; transform: translatey(0px);}
	 90% { opacity:0; transform: translatey(0px);}
	}

	@keyframes TexteAppear6 {
	 0%, 88%, 100% { opacity:0; transform: translateY(-20px); z-index:0;}
	 90%, 97% { opacity:1; transform: translatey(0px); z-index:7;}
	 100% { opacity:0; transform: translatey(0px);}
	}

	.intro1
	{
		top:100px;
		left:50px;
		color:white;
		position:absolute;
		font-size:60px;
		
		animation: IntroAppear1 linear infinite;
    	animation-duration: 40s;
	}

	@keyframes IntroAppear1 {
	 0%, 100% { opacity:0; transform: translateY(-60px);}
 	 3% { opacity:0.5;  transform: translateY(0px);}
	 8%, 16% { opacity:1; transform: translateY(0px);}
	 20% { opacity:0; transform: translateY(0px);}
	 }

/***** Slider *****/


/* ----- Slideshow Styling ----- */

#mid_content {
    border-bottom: 1px solid #d9d9d9;
    background: #e8ebf1;
    height: 380px;
}

#slideshow_pagination {
    margin: 10px auto;
    width: 160px;
}

#slideshow_pagination li {
    float: left;
    margin: 0 9px;
}

#slideshow_pagination a {
    background: url('images/grey_button.png') no-repeat;
    display: block;
    height: 14px;
    width: 14px;
}

#slideshow_pagination a.current {
    background: url('images/white_button.png') no-repeat;
}

/* ----- Slideshow Styling ----- */


/***** 1 Column  *****/

.Scontent {
	/*clear: right;*/
    float: left;
    width: 1000px;
    margin: 24px 0 24px 0;
    color: #363636;
    line-height: 20px;
 }

.Scontent a img {
    margin: 0 8px 1px 0;
}

/***** 1 Column  *****/

/***** 2 Columns *****/

.Dcontent {
	/*clear: right;*/
    float: left;
    width: 470px;
    margin: 24px 0 24px 0;
    color: #363636;
    line-height: 20px;
 }
 
.Dcontent_space {
    margin-right: 60px;
}

.Dcontent a img {
    margin: 0 8px 1px 0;
}

/***** 2 Columns *****/

/***** 3 Columns *****/

.Tcontent {
	/*clear: right;*/
    float: left;
    width: 300px;
    margin: 24px 0 24px 0;
    color: #363636;
    line-height: 20px;
 }
 
.Tcontent_space {
    margin-right: 50px;
}

.Tcontent a img {
    margin: 0 8px 1px 0;
}

/***** 3 Columns *****/

/***** 4 Columns *****/

.Qcontent {
    float: left;
    width: 220px;
    margin: 24px 0 24px 0;
    color: #363636;
    line-height: 20px;
}

.Qcontent_space {
    margin-right: 40px;
}

.Qcontent a img {
    margin: 0 8px 1px 0;
}

/***** 4 Columns *****/


/***** Footer *****/

#footer {
    background: #333366;
    border-top: 1px solid #d9d9d9;
    clear: both;
    height: 280px;
    margin-top: 40px;
}

#footer p, #footer a {
    color: #AAAAC7;
}

#footer h4 {
	color: #fff;
    font-size: 15px;
    font-weight: bold;
    /*text-transform: uppercase;*/
    margin: 0 0 21px 0;
}

.footer_info {
    float: left;
    margin: 32px 128px 32px 0;
    line-height: 18px;
}

#footer_about {
    width: 360px;
}

#footer_explore {
    width: 360px;
}


#footer a:hover {
    color: #2aacc8;
    text-decoration: none;
}

p#copyright {
    clear: both;
    float: left;
}

/***** Footer *****/

/***** Google Maps *****/
 #map {
        height: 100%;
      }
/***** Google Maps*****/
