@charset "UTF-8";

/*==========================GLOBAL============================*/
/*============================================================*/

*{
	margin: 0;
	padding: 0;
	outline: 0;
}

body{
	height:100%;
	width:100%;
	background-color:#fff;
	min-width:944px;
}

.headerOuterWrapper{
    position: fixed;
    display: block;
    top: 0px;
    left: 0px;
    height: 170px;
    z-index: 15000;
    width: 100%;
    min-width: 800px;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2babe2+0,0092d8+100 */
    background: #2babe2; /* Old browsers */
    background: -moz-linear-gradient(top,  #2babe2 0%, #0092d8 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #2babe2 0%,#0092d8 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #2babe2 0%,#0092d8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2babe2', endColorstr='#0092d8',GradientType=0 ); /* IE6-9 */
    -webkit-box-shadow: 3px 2px 5px 2px rgba(0,0,0,0.3);
    box-shadow: 3px 2px 5px 2px rgba(0,0,0,0.3);
}

#globalLogoOuterWrapper{
	position: fixed;
	display: inline-block;
	top: 25px;
	float: left;
	width: 250px;
	height: 220px;
	margin: 0px 0px 0px 100px;
	z-index: 10000;
}

#globalLogo{
    position: relative;
    display: block;
    float: left;
    width: 100%;
    height: 100%;
    margin: 0px;
}

#topWave{
	position:fixed;
	display: block;
	float:left;
	top:169px;
	left:0px;
	height:140px;
	width:600px;
	z-index: 100;
}

.pageTopRowWrapper{
	position: relative;
	display: inline-block;
	clear:both;
	margin:130px auto 0;
	width:100%;
	height:400px;
	background-color: #efefef;
}

#menuWrapper{
	position: relative;
	display: block;
	float:right;
	margin:100px 60px 0px 0px;
	width:520px; 
}

#hamMenuInnerWrapper{
	display:none;
}

.container{
	position: relative;
	display: inline-block;
	width:100%;
	margin-top:-5px;
	min-height:300px;
	min-width:944px;
}

.contentOuterWrapper{
	position: relative;
	display: inline-block;
	margin:170px auto 0;
	align:center;
	width:100%;
	padding:0px 0px 100px 0px;
	min-height:800px;
	background-image: url("../images/global/contentBg.png");
	background-position:left;
	background-repeat: repeat-y;
}

.contentInnerWrapper{
	position: relative;
	display: block;
	margin:80px auto 190px;
	max-width:1400px;
	min-width: 800px;
	min-height:200px;
	align:center;
	padding:0px 60px;
}

.pageTopPic{
	width:100%;
	height:500px;
	margin:-10px 0px 30px 0px;
	border-bottom:6px solid #0092d8;
}

#pageTopPPSite{
	width:100%;
	height:200px;
	}

.quoteButtonOuter{
	display: inline-block;
	position: relative;
	margin-top:100px;
	padding:15px 0px;
	width: 100%;
}

.reviewButtonOuter{
	display: inline-block;
	position: relative;
	margin-top:30px;
	padding:15px 0px;
	width: 100%;
}

.quoteButtonInner{
	display: block;
	position: relative;
	align:center;
	margin:0 auto;
	padding:15px 40px;
	min-width: 400px;
	max-width:600px;
	text-align:center;
	border:1px solid #0092d8;
	border-radius: 3px;
	background-color: #ffffff;
}

/*===================================================*/
/*====================FOOTER=========================*/

footer{
	position: relative;
	display: inline-block;
	float: left;
	clear: both;
	margin:-10px auto 0;
	align:center;
	padding:0px;
	z-index: 4000;
	width: 100%;
	min-width:944px;
	min-height:250px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0092d8+0,2babe2+100 */
background: #0092d8; /* Old browsers */
background: -moz-linear-gradient(top,  #0092d8 0%, #2babe2 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #0092d8 0%,#2babe2 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #0092d8 0%,#2babe2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0092d8', endColorstr='#2babe2',GradientType=0 ); /* IE6-9 */
    -webkit-box-shadow: 3px -2px 5px 2px rgba(0,0,0,0.3);
    box-shadow: 3px -2px 5px 2px rgba(0,0,0,0.3);
}

#bottomWave{
	position:relative;
	display: block;
	float:right;
	right:0;
	height:140px;
	width:600px;
	margin:-140px auto 0;
	z-index: 1000;
}

#footerInnerWrapper{
	z-index: 4000;
}

#footerCol1{
	width:15%;
	float:left;
}

#footerCol2{
	width:68%;
	float:left;
	padding-bottom:20px;
}

#footerCol3{
	width:15%;
	float:right;
}

#footerCol1Inner{
	margin:30px 0px 0px 60px;
	width:100%;
	float:left;
}

#footerCol2Inner{
	/*border:1px solid #ccc;*/
	margin-top:30px;
	width:100%;
	float:left;
}

#footerCol3Inner{
	padding-top:30px;
	margin:10px 60px 0px 0px;
	width:100%;
	float:right;
}

.telNo,.emailUs{
	margin:10px auto 0px;
	text-align: center;
}

.accredsWrapper{
	position: relative;
	display: block;
	align:center;
	clear:both;
	width:370px;
	height:60px;
	margin:40px auto 12px;
}

#osevFoot,#cgFoot,#napitFoot,#fbFoot,#instaFoot{
	position: relative;
	display: inline-block;
	height:50px;
	width:50px; 
	border-radius: 8px;
	overflow:hidden;
	color:#fff;
}

#osevFoot{
	float:left;
	margin-right:30px; 
	
}

#cgFoot{
	float:left;
	margin-right:30px;
	
}

#napitFoot{
	float:left;
	margin-right:30px;
}

#fbFoot{
	float:left;
	margin-right:30px;
}

#instaFoot{
	float:right;
}

#bottomMenu{
	text-align: center; 
	color:#ccc;
	margin-top:40px;
}



/*===================FOOTERBASE=======================*/
/*====================================================*/


#footerBase{
	position: relative;
	display: inline-block;
	float:left;
	clear: left;
	margin:0 auto;
	padding:10px 0px;
	width: 100%;
	height: 50px;
	min-width:944px;
    background-color:#737272;
}

#footerbaseInner{
	position: relative;
	display: block;
	margin:0 auto;
	align:center;
	width: 97%;
	height: 40px;
}

#footerbaseColLeft{
	position: relative;
	display: inline-block;
	padding-top:3px;
	float:left;
	width: 49%;
	margin:10px auto;
	align:center;
	height: 20px;
	text-align: left;
}

#footerbaseColRight{
	position: relative;
	display: inline-block;
	float:right;
	width: 49%;
	padding-top:22px;
	margin:0px auto;
	align:center;
	height: 22px;
	text-align: right;
	color:#0B552A;
	font-size:12px;
}

/*=============================HOME=============================*/
/*===============================================================*/

#evSlides{
	width:100%;
	height:700px;	
}

.topRowWrapper{
	position: relative;
	display: inline-block;
	clear:both;
	margin:160px auto 0;
	width:100%;
	height:700px;	
	z-index: 500;
}

.homeSlide1{ 
	background-image: url("../images/home/1.jpg");
	background-position:50% 50%;
	background-size: contain;
} 

.homeSlide2{ 
	background-image: url("../images/home/2.jpg");
	background-position:50% 50%;
	background-size: contain;
} 

.homeSlide3{ 
	background-image: url("../images/home/3.jpg");
	background-position:50% 50%;
	background-size: contain;
}

.homeSlide4{ 
	background-image: url("../images/home/4.jpg");
	background-position:50% 50%;
	background-size: contain;
}

.homeTitle{
	position: relative;
    display: block;
}

#homeTitleEV{
	height: 371px;
    width: 600px;
    top: 180px;
    left: 40%;
	text-align: right;
}

#homeTitleSolar{
	height: 371px;
    width: 600px;
    top: 380px;
    left: 10%;
	text-align: right;
}

#homeTitleElectrical{
	height: 371px;
    width: 600px;
    top: 140px;
    left: 55%;
	text-align: right;
}

/*===========================ABOUT US============================*/
/*===============================================================*/

#pageTopPicAboutUs{
	background-image: url("../images/aboutUs/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}

#evolvePageLogo{
	float:right;
	width:150px;
	height:25px;
	margin-top:40px;
}


/*====================ELECTRICAL VEHICLE============================*/
/*===============================================================*/

.supportListOuterWrapper{
	display:flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-content: flex-start;
    align-items: stretch;
	overflow: hidden;
	padding-top:40px;
	/*border:1px solid red;*/
}

.supportOuterWrapper{
	display:block;
	position: relative;
	margin: 20px auto;
	padding:5px;
	align:center;
	text-align:center;
	width:350px;
	height:300px;
	    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#2babe2+0,0092d8+100 */
    background: #2babe2; /* Old browsers */
    background: -moz-linear-gradient(top,  #2babe2 0%, #0092d8 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  #2babe2 0%,#0092d8 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  #2babe2 0%,#0092d8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2babe2', endColorstr='#0092d8',GradientType=0 ); /* IE6-9 */
}


.supportInnerWrapper{
	display: block;
	position: relative;
	margin: 0 auto;
	align:center;
	width:350px;
	height:300px;
	box-shadow:2px 2px 6px rgba(0,0,0,0.2);
	/*border:1px solid blue;*/
}

/*===========================SOLAR===============================*/
/*===============================================================*/

#pageTopPicSolar{
	background-image: url("../images/solar/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}

/*============================EV==============================*/
/*===============================================================*/

#pageTopPicElectricalVehicle{
	background-image: url("../images/ev/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}


/*============================OHME==============================*/
/*===============================================================*/

#pageTopPicOhme{
	background-image: url("../images/manu/ohme/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}

#ohmeLogo{
	float:right;
	width:150px;
	height:45px;
	margin-top:20px;
}

.ohmeProductWrapper{
	display: inline-block;
	width:100%;
	float:left;
	clear:left;
}

.ohmeSupportImages{
	float:left;
	width:350px;
	height:350px;
	margin: 0px 40px 80px 0px;
	border:2px solid #0092D9;
	border-radius: 3px;
}


/*===========================MYENERGI============================*/
/*===============================================================*/

#pageTopPicMyenergi{
	background-image: url("../images/manu/myenergi/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}

#myenergiLogo{
	float:right;
	width:200px;
	height:50px;
	margin-top:20px;
}

.myenergiProductWrapper{
	display: inline-block;
	width:100%;
	float:left;
	clear:left;
}

.myenergiSupportImages{
	float:left;
	width:400px;
	height:400px;
	margin: 10px 40px 50px 0px;
	border:2px solid #0092D9;
	border-radius: 3px;
}

/*===========================EASEE============================*/
/*===============================================================*/

#pageTopPicEasee{
	background-image: url("../images/manu/easee/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}

#easeeColOuterWrapper{
	position: relative;
	display: inline-block;
	margin:30px auto 0;
	width:100%
}

#easeeColInnerWrapper{
	position: relative;
	display: block;
	align:center;
	margin:0 auto;
	max-width:900px;
}

#easeeLogo{
	float:right;
	width:150px;
	height:25px;
	margin-top:40px;
}

.easeeSupportImages{
	float:left;
	width:400px;
	height:400px;
	margin: 10px 40px 50px 0px;
	border:2px solid #0092D9;
	border-radius: 3px;
}

/*==========================ANDERSEN============================*/
/*===============================================================*/

#pageTopPicAndersen{
	background-image: url("../images/manu/andersen/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}

#andersenLogo{
	float:right;
	width:200px;
	height:25px;
	margin-top:40px;
}

/*===========================HYPERVOLT============================*/
/*===============================================================*/

#pageTopPicHypervolt{
	background-image: url("../images/manu/hypervolt/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}

#hyperLogo{
	float:right;
	width:200px;
	height:40px;
	margin-top:30px;
}

.hyperIcons{
	float:left;
	width:40px;
	height:40px;
	margin:-7px 15px 0px 0px;
}

.hyperSupportImages{
	float:left;
	width:420px;
	height:420px;
	margin: -10px 40px 50px 0px;
	border:2px solid #0092D9;
	border-radius: 3px;
}

/*===========================WALLBOX============================*/
/*===============================================================*/

#pageTopPicWallbox{
	background-image: url("../images/manu/wallbox/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}

#wallboxLogo{
	float:right;
	width:200px;
	height:43px;
	margin-top:23px;
}

.wallboxProductWrapper{
	display: inline-block;
	width:100%;
	float:left;
	clear:left;
}

.wallboxSupportImages{
	float:left;
	width:350px;
	height:350px;
	margin: 0px 40px 50px 0px;
	border:2px solid #0092D9;
	border-radius: 3px;
}


/*============================ROLEC=============================*/
/*===============================================================*/

#pageTopPicRolec{
	background-image: url("../images/manu/rolec/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}

#rolecLogo{
	float:right;
	width:200px;
	height:25px;
	margin-top:38px;
}

.rolecProductWrapper{
	display: inline-block;
	width:100%;
	float:left;
	clear:left;
}

.rolecSupportImages{
	float:left;
	width:350px;
	height:350px;
	margin: 20px 40px 50px 0px;
	border:2px solid #0092D9;
	border-radius: 3px;
	
}

/*===========================OTHER SERVICES============================*/
/*====================================================================*/

#pageTopPicOtherServices{
	background-image: url("../images/services/topPic.jpg");
	background-position: 50% 100%;
	background-repeat: no-repeat;
}

.evolvePageLogo{
	float:right;
	width:53px;
	height:50px;
	margin-top:20px;
}

.otherServiceOuterWrapper{
	display: inline-block;
	float:left;
	min-height:150px;
	padding-bottom:70px;
	border-bottom:solid 1px #0092D9;
	margin-bottom:100px;
}

.serviceIcon{
	display: block;
	float: left;
	width:300px;
	height:300px;
	margin:0px 30px 50px 0px
}

/*==========================PRIVACY POLICY============================*/
/*===================================================================*/

.privacyNoticeWrapper{
	padding-top:150px;
}


/*=============================SITEMAP===============================*/
/*===================================================================*/

.sitemapWrapper{
	padding-top:150px;
}
