@charset "utf-8";
/* CSS Document */

/* - - - - - - - - - - - - - - - - - - - - -

Title : Alltechs Electronics
URL : http://alltechs.com.au/

Author : FOX DESIGN creative
URL: www.foxdesign.com.au

- - - - - - - - - - - - - - - - - - - - - */

/*----------------------------------------------------------------------------- 
Global Styles
-----------------------------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea, blockquote,th,td { 
	margin:0;
	padding:0;
}
 
table {
	border-collapse:collapse;
	border-spacing:0;
}

html,body,div,dl,dt,dd,pre,form,fieldset,input,textarea,blockquote { 
	margin:0; 
	padding:0; 
}

html { 
	margin:0; 
	padding:0; 
	overflow: -moz-scrollbars-vertical;
}

html,body {
	margin:0;
	padding:0;
}

/* Perfect Full Page Background Image*/
html { 
  background: url(../images/body_bg03.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
}

/* set image max width to 100% */
img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
}

body,td,th,p,li {font-family: 'Raleway', sans-serif; font-weight: 400; font-size:16px; line-height:24px; color: #d5d5d5; }
body {
 	margin-left: 0px;	margin-top: 0px;	margin-right: 0px;	margin-bottom: 0px;
}

a { color: #fff; text-decoration:underline;}
a:hover { color: #8dc63f;}

h1 { font-size:45px; line-height:45px; color:#8dc63f; padding: 0px; margin:0px; text-align:center;font-family: 'Monoton', cursive;   text-transform: uppercase; font-weight: normal;}

h2 { font-size:45px; line-height:45px; color:#000000; padding: 0px; margin:0px; text-align:center; font-family: 'Monoton', cursive;text-transform: uppercase;font-weight: normal; }

h3 {font-size:26px; line-height:26px;  color:#8dc63f; padding: 0px; margin:0px; font-family: 'Raleway', sans-serif; font-weight:400; text-align: center;}

h4 {font-size:20px; line-height:20px;  color:#000; padding: 0px; margin:0px;  text-align:center; font-family: 'Raleway', sans-serif; font-weight:200; padding-bottom: 20px;}
.bold{font-weight:700; }
 

fieldset { 	border: 0; }

.clear { 
	clear: both; 
	font-size: 0; 
	height: 0; 
	line-height: 0; 
}
a img{ border:none;}
hr {height: 1px; color: #e6e4e2;  }

b{font-size:14px}
p{ padding:0px; color:#ffffff;}

p a{ color:#ffffff; text-decoration:underline; }

/* end of global*/

#wrap{ float:left; 
width:100%; height:100%; 
min-height:100%; 
height:auto !important; /* real browsers */
height:100%; /* IE6: treaded as min-height*/
min-height:100%; /* real browsers */
position:relative;
}
 
.wrap_general{ float:left; width:100%; height:10px; min-height:10px;}
html>body .wrap_general{ height:auto;}


/* header */

#header_wrap{ float:left; width:100%; height:39px; min-height:39px; background:rgba(19,37,48,0.80);  position:fixed; left:0; top:0; z-index:1000; }
html>body #header_wrap{ height:auto;}
#header{ margin:0 auto; max-width:1360px; height:30px; min-height:30px;}
html>body #header { height:auto;}

#logo{ float:left; width:24%; height:auto; text-align:center; }

#header-right{ float:right; width:70%; height:39px; padding:20px 0 2px 0;}
#header_phone{ float:right; font-size:27px; color:#fff; line-height:27px; height:27px; padding-right:25px; margin-right:25px; font-family: 'Monoton', cursive; }
#header_phone a{ color:#fff; }
#header_phone a:hover{ color:#8dc63f; }
#call_icon{ float:right;  width:29px; height:39px; line-height: 39px; padding-right:8px; margin-right:8px; }
  
#nav_wrap{ float:right; width:70%; height:40px;}


@media screen and (max-width: 960px) {
#header{width: 95%; padding-right:0;}
#logo{width:180px; padding:10px 10px 0px 0px;}
#header-right{width:180px;}
#header_phone{display:none;height:0px;} 
#call_icon{display: block; padding-top: 5px; padding-right:15px; border-right:2px solid #161f24; margin-right:60px; }
#header_email{display:none;} 
#nav_wrap{ width:100%; height:10px;padding-right:0;}
	}
 

/* home page slider show */
#slider-show{ position:relative; float:left; width:100%; height:100vh;}
 
#down-arrow{position:absolute; bottom:50px; height:50px; left:50%; margin-left:-25px; }
.bounce {
	-moz-animation: bounce 3s infinite;
	-webkit-animation: bounce 3s infinite;
	animation: bounce 3s infinite;
}
@-moz-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -moz-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
@-webkit-keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -moz-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  60% {
    -moz-transform: translateY(-15px);
    -ms-transform: translateY(-15px);
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
}


@media screen and (max-width: 800px) {
 
	}
 

/* home page company intro*/
#home-company-intro_wrap{float: left; width: 100%; height: auto; background:#132530; padding: 40px 0;}
#home-company-intro{ margin: 0 auto; max-width: 1200px; height: auto;}
#home-company-intro h1{ font-size:45px; line-height:40px; color:#8dc63f; padding: 0px; margin:25px 0; text-align:center ;   text-transform: uppercase; }
#home-company-intro p{font-family: 'Raleway', sans-serif; font-weight: 400; font-size:20px; line-height:28px; color: #ffffff; padding-bottom:20px; text-align: center;}
@media screen and (max-width: 1200px) {
	#home-company-intro{ width: 90%; }
	#home-company-intro h1{font-size:36px; line-height:34px;}
	#home-company-intro p{font-size:18px; line-height:25px;}
	}
/* home page projects*/
#home-projects_wrap-out{float: left; width: 100%; height: auto; background: #f2f4f4; padding: 40px 0;}
#home-projects_wrap{ margin: 0 auto; max-width: 1360px; height: auto;}
#home-projects_wrap h2 { font-size:45px; line-height:45px; color:#000000; padding: 0px; margin:0px; text-align:center;  text-transform: uppercase;}
.home-projects{float:left; width: 24.2647%; height:auto; padding:2% 0.3676%; }
.home-projects:hover{background-color: #fff; }
.top-img{ float:left; width: 100%; height:100%; margin-bottom: 10px;text-align: center;}
.project-title{ float:left; width: 100%; min-height: 110px; height: 110px; margin:20px 0; color:#000; font-family: 'Raleway', sans-serif; font-weight:700;font-size: 24px; line-height: 24px;  text-transform: uppercase;text-align: center; }
html>body .project-title{height:auto; }
.project-title:hover{color:#8dc63f;}
@media screen and (max-width: 1200px) {
	#home-company-intro{ width: 96%; }
	#home-projects_wrap h2{font-size:36px; line-height:34px; padding-bottom: 20px;}
	}
@media screen and (max-width: 720px) {
	.home-projects{width: 48%; height:auto; padding:2% 1%;}
	.project-title{min-height: 180px; height:180px; font-size: 20px; line-height:19px;}
	}

/*-----------------*/
/***** Apollo *****/
/*-----------------*/

figure.effect-apollo {
	background: #222f37;
}

figure.effect-apollo img {
	opacity: 0.95;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale3d(1.05,1.05,1);
	transform: scale3d(1.05,1.05,1);
}

figure.effect-apollo figcaption::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.5);
	content: '';
	-webkit-transition: -webkit-transform 0.6s;
	transition: transform 0.6s;
	-webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
	transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
}

figure.effect-apollo p {
	position: absolute;
	right: 0;
	bottom: 0;
	margin: 3em;
	padding: 0 1em;
	width: 100%;
	text-align: right;
	opacity: 0;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
	max-width:200px;
}

figure.effect-apollo h2 {
	text-align: left; color:#fff; font-weight:normal; line-height:1em;
}

figure.effect-apollo:hover img {
	opacity: 0.6;
	-webkit-transform: scale3d(1,1,1);
	transform: scale3d(1,1,1);
}

figure.effect-apollo:hover figcaption::before {
	-webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
	transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
}

figure.effect-apollo:hover p {
	opacity: 1;
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
}

/* home page partners*/
#home-partners_wrap-out{float: left; width: 100%; height: auto; background:#d6d6d4; padding: 40px 0;}
#home-partners_wrap{ margin: 0 auto; max-width: 1200px; height: auto;}
#home-partners_wrap h2 { font-size:45px; line-height:45px; color:#000; padding: 0px; margin:0px; text-align:center; text-transform: uppercase; font-weight: normal;}
.home-partners{float:left; width: 15%; height:auto; padding:0.83333%;}
.home-partners:hover{background:#f3f3f2; }
@media screen and (max-width: 1000px) {
	#home-partners_wrap{ width: 96%; }
	}
@media screen and (max-width: 800px) {
	.home-partners{ width: 21%; height:auto; padding:2%;}
	}
@media screen and (max-width: 600px) {
	.home-partners{ width: 28.333%; height:auto; padding:2.5%;}
	}

 /* project info */
#project-info_wrap{float: left; width: 100%; height: auto; background:#f2f4f4; padding: 40px 0;}
#project-info{ margin: 0 auto; max-width: 1000px; height: auto;}
#project-info h1{ font-size:45px; line-height:40px; color:#000; padding: 0px; margin:25px 0; text-align:center ;   text-transform: uppercase;}
#project-info p{font-family: 'Raleway', sans-serif; font-weight: 400; font-size:18px; line-height:24px; color: #000; padding-bottom:18px; text-align: center;}

@media screen and (max-width: 1000px) {
#project-info{ max-width:90%; }
	}

/*-footer-*/
#footer_wrap-out{float:left; width: 100%; height: auto; background:#132530;}
#footer_cover{float:left; width: 100%; height: auto; text-align: center;}
#footer_wrap{ margin: 0 auto; max-width:1360px; height: auto; padding: 50px 0;}
#footer_logo{float:left; width: 20%; height: auto; margin-right:5%; text-align:center; }
#footer_contact{ float:left; width:55%; height: auto;}
#footer_social-wrap{float: right; width:15%; height: auto;}
.footer_social {float: right; width: 34px; height:34px; padding-left: 20px; text-align: center;}

.footer{ font-family: 'Raleway', sans-serif; font-weight:400; color:#fff; font-size:18px; line-height:32px;}
.footer a { color:#fff;}
.footer a:hover{ color: #a6a6a6;}
.footer b{ font-family: 'Raleway', sans-serif; font-weight:700; color:#8dc63f;}

#footer_link{ float:right; width:100%; height:auto;  background:#646464;}
.footer-link, .footer-link a{font-family: 'Raleway', sans-serif; font-weight:200; color:#fff; font-size:16px; line-height:16px; text-align: center; padding: 17px 0;}
.footer-link a { color:#fff;}
.footer-link a:hover{ color: #a6a6a6;}


@media screen and (max-width: 1359px) {
#footer_wrap{   max-width:92%; }
	}

@media screen and (max-width: 960px) {
#footer_logo{ width:60%; text-align:center; margin:0 20% 20px 20%;}
#footer_contact{ width:100%; text-align: center;}
#footer_social-wrap{float:left; width:100%; height: auto;}
.footer_social {width:50%; height:34px; padding:0;}
#footer_link{ width:90%; padding: 20px 5%; text-align:center;} 
	}
 
.cover-img{float:left; width: 100%; height: auto; text-align: center;}

/* ---------------about us---------------- */
#about-us_wrap{float: left; width: 100%; height: auto; background:#132530; padding: 40px 0;}
#about-us{ margin: 0 auto; max-width: 1200px; height: auto;}
#about-us h1{ font-size:45px; line-height:40px; color:#8dc63f; padding: 0px; margin:25px 0; text-align:center ;  text-transform: uppercase; font-weight: normal;}
#about-us p{font-family:'Raleway',sans-serif; font-weight: 400; font-size:20px; line-height:28px; color: #ffffff; padding-bottom:20px; }
.about-us_50{float:left; width: 45%; padding:0 2.5%; height: auto;}

@media screen and (max-width: 960px) {
.about-us_50{float:left; width: 90%; padding:0 5%; }
	}

/* our team */
#people_wrap{float: left; width: 100%; height: auto; background:#3d3d3d; padding: 40px 0;}
#people{ margin: 0 auto; max-width: 1360px; height: auto;}
#people h2{ font-size:45px; line-height:40px; color:#fff; padding: 0px; margin:25px 0; text-align:center ; text-transform: uppercase; font-weight: normal;}
.people{ float:left; width:23%; height:auto; padding:1%;}
.people:hover{ background:#132530;}
.people img{ float:left; width:100%; height:auto; padding-bottom:20px;}
.people h3{ float:left; width:90%; height:auto; padding:0 0 0 0; color:#ffffff; font-family: 'Monoton', cursive;  text-transform: uppercase;text-align: center;}
.people p{ float:left; width:90%; height:auto; padding:0 0 20px 0%; text-align: center;}
 
   
 @media screen and (max-width: 1000px) {
.people{ width:31.3333%; height:auto; padding:1%;}
 }
    
 @media screen and (max-width: 800px) {
.people{ width:47%; height:auto; padding:1.5%;}
 }  
  
/* services page */
 
#service_wrap{float: left; width: 100%; height: auto; background:#ECEBE9; padding: 40px 0;}
#service{ margin: 0 auto; max-width: 1200px; height: auto;}
#service h1{ font-size:45px; line-height:40px; color:#000; padding: 0px; margin:25px 0; text-align:center ;  text-transform: uppercase; }
#service p{font-family:'Raleway',sans-serif; font-weight: 400; font-size:20px; line-height:28px; color: #000; padding-bottom:20px; }

.service-section{ float:left; width: 100%; height: auto; background:#f7f7f7;margin: 20px 0;}

.service-01_img{ float:left; width:34%; height:auto; text-align:center;}
.service-01_content{float:right; width:66%; height:auto;}

.service-02_img{ float:right; width:34%; height:auto; text-align:center;}
.service-02_content{float:left; width:66%; height:auto;}
 
.service_content{float:left; padding:5%; width:90%; height:auto;}
.service_content h2 {font-size:36px; line-height:35px;  color:#000; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:700; }
.service_content p{font-family: 'Raleway', sans-serif; font-weight: 400; font-size:16px; line-height:26px; color:#000000; padding-bottom:20px;}
 

@media screen and (max-width: 960px) {
.service-01_img{ float:left; width:90%; padding:5%; height:auto; text-align:center;}
.service-01_content{float:right; width:100%; height:auto;}

.service-02_img{ float:left; width:90%; padding: 5%; height:auto; text-align:center;}
.service-02_content{float:right; width:100%; height:auto;}
 }


/* ---projects--- */
.project_wrap {float:left; width:50%; height:25%; background:#FFFFFF; margin-bottom:20px;}
.project_icon{float:left; width:50%; height:218px; overflow: hidden;}
.project_icon-right{ float:right; width:42%; padding: 15% 3% 0 0; height:40%; }
.project_icon-right h3 {font-size:27px; line-height:27px;  color:#000000; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:700; text-transform:uppercase;}
.project_wrap:hover { background:#8dc63f;}
 
@media screen and (max-width: 1200px) {
.project_icon{ height:180px; }
.project_icon-right{padding: 5% 3% 0 0; height:50%; }
 }
 @media screen and (max-width: 800px) {
.project_wrap { width:100%;}
 }
 
/* projects detail page */
.project_img{ float:left; width:72.75%; height:50%; text-align:center;}
.project_right{float:left; width:27.25%; height:50%; background:#ffffff;}
.project_title{float:left; padding:20% 3% 6.6% 8.3%; width:88.7%; height:auto;}
.project_title-left{float:left; margin-left:-16.1%; width:6.83%; height:11.83%; padding-right:8.3%; z-index:1000;}
.project_title-right{float:left; width:100%; height:auto; }
.project_title-right h1 {font-size:37px; line-height:35px;  color:#8dc63f; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:700; text-transform:uppercase; margin-bottom:30px;}
.project-right p{font-family: 'Raleway', sans-serif; font-weight: 400; font-size:16px; line-height:26px; color:#000000; padding-bottom:20px;}

@media screen and (max-width: 800px) {
 .project_img{width:100%; height:auto; }
 .project_right{ width:100%; height:auto; }
 .project_title{ padding:5% 1% 6.6% 8.3%;  }
 .project_title-left{ margin-left:0; width:0; padding-right:0; overflow:hidden;}
 }
 
 

/*-contact us-*/

#contact-us_wrap{float: left; width: 100%; height: auto; background:#132530; padding: 40px 0;}
#contact-us{ margin: 0 auto; max-width: 800px; height: auto;}
#contact-us h1{ font-size:45px; line-height:40px; color:#8dc63f; padding: 0px; margin:25px 0; text-align:center ;  text-transform: uppercase;}
#contact p{font-family:'Raleway',sans-serif; font-weight: 400; font-size:20px; line-height:28px; color: #ffffff; padding-bottom:20px; }
.title{color:#8dc63f;}

@media screen and (max-width: 800px) {
#contact-us{ max-width:90%; }
	}