/* CSS Document */

html,body {
  height: 100%;
  
}



body {
  margin: 0px;
  padding:0px;
  font-family: Calibri Light, Arial, Helvetica, sans-serif;
font-size:22px;
  width:100%;
  background-color:#000000;
  color:#CCCCCC;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
body {
  margin: 0px;
  padding:0px;
  font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:18px;
  width:100%;
  background-color:#000;
  color:#CCCCCC;
}}


@font-face {
   font-family: swiss;
   src: url(swissc.ttf);
}

* {
   font-family: swiss;
}

a{
text-decoration:none  !important;
outline: 0   !important;;
}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
marquee{
display:none;}}


#home_frame{
margin:0px;
padding:0px;
display:block;
position:relative;
float:left;
background-color:#000000;
background-image:  url(img/home_top_bg.jpg);
background-size:contain;
background-repeat:no-repeat;
background-position:right top;
width:100%;
height: auto;
z-index:1 !important;
}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
#home_frame{
margin:0px;
padding:0px;
display:block;
position:relative;
float:left;
background-color:#000000;
width:100%;
height: auto;
z-index:1 !important;
background-image: url(img/home_top_bg_m.jpg);
background-size:110%;
background-repeat:no-repeat;
background-position:right top;
}}

#contact_frame{
margin:0px;
padding:0px;
display:block;
position:relative;
float:left;
background-color:#000000;
width:100%;
height: auto;
z-index:1 !important;
background-image:url(img/contact_top_bg.jpg);
background-size: 80%;
background-repeat:no-repeat;
background-position: right top;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
#contact_frame{
margin:0px;
padding:0px;
display:block;
position:relative;
float:left;
background-color:#000000;
width:100%;
height: auto;
z-index:1 !important;
background-image: url(img/contact_top_bg.jpg);
background-size:160%;
background-repeat:no-repeat;
background-position:left top;

}}

#maintenance_frame{
margin:0px;
padding:0px;
display:block;
position:relative;
float:left;
background-color:#000000;
width:100%;
height: auto;
z-index:1 !important;
background-image:url(img/maint_top_bg.jpg);
background-size: 80%;
background-repeat:no-repeat;
background-position: right top;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
#maintenance_frame{
margin:0px;
padding:0px;
display:block;
position:relative;
float:left;
background-color:#000000;
width:100%;
height: auto;
z-index:1 !important;
background-image: url(img/maint_top_bg_m.jpg);
background-size:110%;
background-repeat:no-repeat;
background-position:right top;

}}
#installation_frame{
margin:0px;
padding:0px;
display:block;
position:relative;
float:left;
background-color:#000000;
width:100%;
height: auto;
z-index:1 !important;
background-image: url(img/install_top_bg.jpg);
background-size: 100%;
background-repeat:no-repeat;
background-position: right top;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
#installation_frame{
margin:0px;
padding:0px;
display:block;
position:relative;
float:left;
background-color:#000000;
width:100%;
height: auto;
z-index:1 !important;
background-image: url(img/install_top_bg_m.jpg);
background-size:110%;
background-repeat:no-repeat;
background-position:left top;

}}
#charging_frame{
margin:0px;
padding:0px;
display:block;
position:relative;
float:left;
background-color:#000000;
width:100%;
height: auto;
z-index:1 !important;
background-image: url(img/ev_top_bg.jpg);
background-size: 100%;
background-repeat:no-repeat;
background-position: right top;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
#charging_frame{
margin:0px;
padding:0px;
display:block;
position:relative;
float:left;
background-color:#000000;
width:100%;
height: auto;
z-index:1 !important;
background-image: url(img/ev_top_bg_m.jpg);
background-size:110%;
background-repeat:no-repeat;
background-position:left top;

}}


	  #myDIV {
  width: auto;
  text-align: left;
  position: absolute;
  left:0px;
  top:40px;
  display:none;
  z-index:100;}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
  	  #myDIV {
  width: auto;
  text-align: left;
  position: absolute;
  left:0px;
  top:26px;
  display:none;
  z-index:100;}
}
  
   #myDIV a {
  float:left;
  position:relative;
  padding:0px 20px 0px 0px;
  text-transform: uppercase;
  color: #999999;
  white-space:nowrap;
 }
@media screen and (max-device-width:600px), screen and (max-width:600px) {
    #myDIV a {
  float:left;
  position:relative;
  padding:7px 0px 5px 0px;
  text-transform: uppercase;
  color: #fff;
  white-space:nowrap;
 }}

    #myDIV a:hover {
	color:#FFFFFF;
	}



#topnav
{position:relative;
float:left;
width: 100%;
height:44px;
background-color: #333;
border-bottom:#CCCCCC 1px solid;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
#topnav
{position:relative;
float:left;
width: 100%;
height: auto;
background-color: #000;
border-bottom:#CCCCCC 1px solid;
}}

#topnav:hover
{
background-color: #000;
}



.top_menu
{
padding:0px;
margin:18px 0px 0px 40px;
display:block;
position:relative;
float:left;
width: auto;
height:auto;
color:#999999;
cursor:pointer;

}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
.top_menu
{
padding:0px 0px 4px 0px;
margin:18px 0px 0px 40px;
display:block;
position:relative;
float:left;
width: auto;
height:auto;
color:#999999;
cursor:pointer;
}}

.top_menu:hover
{
color:#fff;
}

.top_menu  a
{color:#999999;
}
.top_menu a:hover
{
color: #FF9900;}



/* dropdown menu*/
.topnav {
width:auto;
background-color: transparent;
  text-transform:uppercase;

}

.topnav a {
  float: right;
  color: #bfbfbf;
  text-align: center;
  padding: 12px 10px;
  text-decoration: none;
  font-size: 15px;
  text-transform:uppercase;
  background-color: transparent;
  font-family:Verdana, Arial, Helvetica, sans-serif;
}

.active {
  color: #fff !important;
  
}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
.active {
  color: #fff !important;
  text-decoration:underline  !important;
  
}}


.topnav .icon {
  display: none;
}

.dropdown {
  float: right;
  overflow: hidden;
  background-color: transparent;

}

.dropdown .dropbtn {
  font-size: 15px;    
  border: none;
  outline: none;
  color: #bfbfbf;
  padding:12px 10px;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  margin: 0;
    text-transform:uppercase;
	background-image:none;
	background-color: transparent;
}
.dropbtn i{
display:none;}

.dropdown-content, .dropdown-content a {
  display: none;}

/*
.dropdown-content {
  display: none;
  position: absolute;
  min-width: 400px;
  z-index: 1;
  background-color: transparent;
  

}

.dropdown-content a {
  float: none;
  color: #fff;
  padding: 10px 10px;
  text-decoration: none;
  display: block;
  text-align: left;
  background-color: transparent;
  font-family:Verdana, Arial, Helvetica, sans-serif;
}
*/
.topnav a:hover, .dropdown:hover .dropbtn {
  color: #fff;
}

.dropdown-content a:hover {
  color: #fff;
}

.dropdown:hover .dropdown-content {
  display: block;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
  .topnav a:not(:first-child), .dropdown .dropbtn {
    display: none;
  }
  .topnav a.icon {
    float: left;
    display: block;
  }
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown {float: none;}
  .topnav.responsive .dropdown-content {position: relative;}
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
}
/* dropdown menu ends*/
.re_logo
{
padding:0px;
margin:90px 0px 20px 40px;
display:block;
position:relative;
float:left;
clear:left;
width: auto;
height:auto;

}
@media screen and (max-device-width:600px), screen and (max-width:600px) {

.re_logo
{
display:none;
}}

#top_titles_quote{
padding:5px 18px 5px 18px;
top:-42px;
right:-70px;
display:block;
position: absolute;
width: auto;
background-color:#FF9900;
z-index:1000 !important;
color:#fff;
text-transform:uppercase;
  font-family: Calibri Light, Arial, Helvetica, sans-serif;
font-size:19px;
letter-spacing:1px;
border-left:#FFFFFF 4px solid;
box-shadow: 8px 4px 8px 0 rgba(0, 0, 0, 0.5), 10px 6px 10px 0 rgba(0, 0, 0, 0.20);}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
#top_titles_quote{
padding:5px 18px 5px 18px;
display:block;
position: relative !important;
float:left;
width:100%;
background-color:#FF9900;
z-index: inherit;
color:#fff;
text-transform:uppercase;
text-align:center;
  font-family: Calibri Light, Arial, Helvetica, sans-serif;
font-size:19px;
letter-spacing:1px;
top:0px;
right:0px;
border: none !important;


}}

#top_titles_quote span{
font-size:32px;
font-weight:bold;
line-height:34px;

}

.top_titles{
padding:0px;
margin:30px 0px 0px 40px;
display:block;
position:relative;
float:left;
clear:left;
z-index:inherit;
width: 60%;
}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
.top_titles, .top_titles_contact{
margin:300px 0px 0px 0px;
padding:40px 10px 10px 10px;
display:block;
position:relative;
width: 100%;
float:left;
z-index:inherit;
text-align:center !important;

}}

.top_titles img, .top_titles_contact img{
display:none;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
.top_titles img, .top_titles_contact img{
width:90%;
display:block;
position:relative;
float:left;
z-index:inherit;
padding:0px !important;
margin:0px 0px 40px 6px  !important;


}}

.top_titles_contact{
margin:0px;
padding:40px 40px 0px 0px;
display:block;
position:relative;
float:right;
clear:right;
z-index:inherit;

}



.h1{
color:#8c8b8b;
text-transform:uppercase;
font-family:swiss, Swis721 Cn BT;
font-size:48px;
line-height:48px;
margin:0px;
padding:0px;
z-index:inherit;

}
.h1_orange{
color:#FF9900 !important;
text-transform:uppercase;
font-family:swiss, Swis721 Cn BT;
font-size:48px;
line-height:48px;
margin:0px;
padding:0px !important;
z-index:inherit;

}

.h1_white{
color:#FFF !important;
text-transform:uppercase;
font-family:swiss, Swis721 Cn BT;
font-size:48px;
line-height:48px;
margin:0px;
padding:0px !important;
z-index:inherit;
text-align:left !important;

}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
.h1_white{
color:#FFF !important;
text-transform:uppercase;
font-family:swiss, Swis721 Cn BT;
font-size:48px;
line-height:48px;
margin:0px;
padding:0px !important;
z-index:inherit;
text-align: center !important;

}}


@media screen and (max-device-width:600px), screen and (max-width:600px) {
a.h1_orange, .h1_orange a{
color:#FF9900 !important;}}


.h3{
	color:#8c8b8b;
	text-transform:uppercase;
	font-family:swiss, Swis721 Cn BT;
	font-size:28px;
	line-height:38px;
	margin:0px;
	padding:0px;
	z-index:inherit;

}

.h3_white{
	color:#fff;
	text-transform:uppercase;
	font-family:swiss, Swis721 Cn BT;
	font-size:28px;
	line-height:38px;
	margin:0px;
	padding:0px;
	z-index:inherit;

}

.h3_orange{
color:#FF9900;
	text-transform:uppercase;
	font-family:swiss, Swis721 Cn BT;
	font-size:28px;
	line-height:38px;
	margin:0px;
	padding:0px;
	z-index:inherit;
	text-align:center;

}

.h2{
color:#8c8b8b;
text-transform: capitalize;
font-family:swiss, Swis721 Cn BT;
font-size:40px;
line-height:48px;
padding:0px;
z-index:inherit;

}

#bottom_content
{display:block;
clear:both;
overflow:hidden;
position:relative;
z-index:1 !important;
top:-100px !important;
text-align:center;
width:70%;
padding:100px 0px 20px 0px;
background-color:#1a1a1a;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
#bottom_content
{display:block;
clear:both;
overflow:hidden;
z-index:100 !important;
margin:0px !important;
text-align:center;
width:95%;
padding:0px;
background-color:#000;
top:0px !important;

}}

.bottom_content_font {
  color: #bfbfbf;
  text-align:justify;
  padding: 30px;
  margin:0px;
  text-decoration: none;
  font-size: 15px;
  line-height:20px;
  font-family:Verdana, Arial, Helvetica, sans-serif !important;
  z-index:inherit;
}
.bottom_content_font_services {
display:block;
  color: #bfbfbf;
  text-align:justify;
  padding: 30px;
  margin:0px;
  text-decoration: none;
  font-size: 15px;
  line-height:20px;
  font-family:Verdana, Arial, Helvetica, sans-serif !important;
  z-index:inherit;
}


#bottom_content_contact
{display:block;
clear:both;
overflow:hidden;
position:relative;
z-index:1 !important;
top:20px !important;
text-align:center;
width:70%;
padding:40px 0px 20px 0px;
background-color:#1a1a1a;
border-top:#FFFFFF 2px solid;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
#bottom_content_contact
{display:block;
clear:both;
overflow:hidden;
z-index:100 !important;
margin:0px !important;
text-align:center;
width:95%;
padding:0px;
background-color:#000;
top:0px !important;
border:none;}}

#bottom_content_maint
{display:block;
clear:both;
position:relative;
z-index:1 !important;
top:20px !important;
text-align:center;
width:70% !important;
padding:0px 0px 20px 0px;
background-color:#1a1a1a;
border-top:#FFFFFF 2px solid;
}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
#bottom_content_maint
{display:block;
clear:both;
position:relative;
z-index:1 !important;
top:0px !important;
text-align:center;
width:95% !important;
padding:0px;
background-color:#1a1a1a;
border-top:#FFFFFF 2px solid;
}}



#under_mail_form
{
margin:0px;
padding:30px 0px 0px 0px;
display:block;
position:relative;
float:left;
width:100%;

}


#service_icons
{display:block;
position:relative;
float:left;
z-index:inherit;
margin:40px 0px 50px 0px;
text-align:center;
width:100%;
height:auto;
padding:0px;
text-transform:uppercase;
  text-decoration: none;
  font-size: 15px;
  line-height:20px;
  font-family:Verdana, Arial, Helvetica, sans-serif;

}


.sm_icons
{display:inline;
 position:relative;
 clear:both;
z-index:inherit;
padding:0px;
text-align:center;
width:40%;
margin:0px;
}

.sm_icons a
{display:inline-block;
 position:relative;
 clear:both;
z-index:inherit;
margin:40px 10px;
width: auto;
height: auto;
opacity: 0.2;
}

.sm_icons a:hover{
opacity: 0.8;
}

.marque_1
{z-index:-100 !important;
display: block;
position:absolute;
bottom:50px;
width:100%;
height:510px;
opacity: 0.6;

}

#footer

{display:block;
position:relative;
float:left;
width: 95%;
  color:#666666;
  text-align: center;
  padding:100px 20px 20px 20px;
  margin:0px;
  text-decoration: none;
  font-size: 14px;
  line-height:30px;
  font-family:Verdana, Arial, Helvetica, sans-serif;

}


#footer_contact

{display:block;
position:relative;
float:left;
width: 95%;
  color:#666666;
  text-align: center;
  padding:100px 20px 20px 20px;
  margin:0px;
  text-decoration: none;
  font-size: 14px;
  line-height:30px;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  background-image:url(img/map.png);
background-size:90%;
background-repeat:no-repeat;
background-position:bottom center;
min-height:900px;
vertical-align:bottom;

}



.mobile
{display:none;}

@media screen and (max-device-width:600px), screen and (max-width:600px) {
.mobile
{display:block;
text-align:center !important;
position:relative;
float:left;
margin:0px 0px 20px 0px;
width:inherit;}}


/* form */


/* CSS Document */
@media screen and (max-device-width:600px), screen and (max-width:600px) {
{
}}

#mail_form
{
margin:0px;
padding:0px 0px 0px 60px;
display:block;
position:relative;
float:left;
width:95%;
}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
#mail_form
{
margin:0px;
padding:0px 0px 0px 0px;
display:block;
position:relative;
float:left;
width:100%;
background-image: none;
}}

form{
width:90%;
height: auto;
display:block;
position:relative;
float:left;

}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
form{
width:100%;
height: auto;
display:block;
position:relative;
float:left;

}}



input{
margin:10px;
padding:6px;
display:block;
position:relative;
float:left;
background-color:#fff;
height:30px;
z-index: inherit;
  font-family: Calibri Light, Arial, Helvetica, sans-serif;
font-size:18px;
line-height:22px;
text-align:left;
color:#333333;
width:60%;
border:none;
}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
input{
margin:10px;
padding:6px;
display:block;
position:relative;
float:left;
background-color:#fff;
height:30px;
z-index: inherit;
  font-family: Calibri Light, Arial, Helvetica, sans-serif;
font-size:18px;
line-height:22px;
text-align:left;
color:#333333;
width:93%;
border:none;
}}


textarea
{
margin:10px;
padding:6px;
display:block;
position:relative;
float:left;
background-color:#fff;
height:auto;
z-index: inherit;
  font-family: Calibri Light, Arial, Helvetica, sans-serif;
font-size:18px;
line-height:22px;
text-align:left;
color:#333333;
width:60%;
border:none;

}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
textarea
{
margin:10px;
padding:6px;
display:block;
position:relative;
float:left;
background-color:#fff;
height:auto;
z-index: inherit;
  font-family: Calibri Light, Arial, Helvetica, sans-serif;
font-size:18px;
line-height:22px;
text-align:left;
color:#333333;
width:93%;
border:none;

}}


.form_text{
display:block;
position:relative;
float:left;
clear:left;
height:30px;
width:15%;
  color: #bfbfbf;
  text-align:left;
  padding: 0px;
  margin:10px;
  text-decoration: none;
  font-size: 15px;
  line-height:30px;
  font-family:Verdana, Arial, Helvetica, sans-serif !important;
  z-index:inherit;
  text-transform:uppercase;
  white-space:nowrap;
}
.submit_button
{
margin:10px;
border:0px  !important;
display:block;
position:relative;
float:left;
background-color:#999999;
height:40px;
z-index: inherit;
  font-family: Calibri Light, Arial, Helvetica, sans-serif;
font-size:19px;
line-height:22px;
text-align: center;
color:#000;
width:30%;
text-transform:uppercase;
font-weight:bold;
cursor:pointer;
}
.submit_button:hover
{background-color:#CCCCCC;
color:#000000;
}
@media screen and (max-device-width:600px), screen and (max-width:600px) {
.submit_button
{
margin:10px;
border:0px  !important;
display:block;
position:relative;
float:right;
background-color:#999999;
height:40px;
z-index: inherit;
  font-family: Calibri Light, Arial, Helvetica, sans-serif;
font-size:19px;
line-height:22px;
text-align: center;
color:#000;
width:40%;
text-transform:uppercase;
font-weight:bold;
cursor:pointer;
}}

.rotate {
margin:50 10 50 0;
width:200px;
padding:10px;
border:0px  !important;
display:block;
position:relative;
float: left;
background-color:#FF9900;
color:#333333;


  transform: rotate(-90deg);


  /* Legacy vendor prefixes that you probably don't need... */

  /* Safari */
  -webkit-transform: rotate(-90deg);

  /* Firefox */
  -moz-transform: rotate(-90deg);

  /* IE */
  -ms-transform: rotate(-90deg);

  /* Opera */
  -o-transform: rotate(-90deg);

  /* Internet Explorer */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}