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

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

Title : Sydney Powder Coating
URL : https://www.sydneypowdercoating.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: #eea328;}
 
h1{ font-size:45px; line-height:40px; color:#eea328; padding: 0px; margin:25px 0; text-align:center; font-family: Verdana, "sans-serif"; font-weight:bold;	text-transform: uppercase;
background: -webkit-linear-gradient(45deg, #f9a926, #fcc257,#f9a926 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


h2 { font-size:45px; line-height:45px; color:#000000; padding: 0px; margin:0px; text-align:center;  font-family:Verdana, "sans-serif"; font-weight:bold; text-transform: uppercase;}

h3 {font-size:26px; line-height:26px;  color:#eea328; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:200;}

h4 {font-size:20px; line-height:20px;  color:#000; padding: 0px; margin:0px;  text-align:center; font-family: 'Titillium Web', 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_product-page
{ 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;

background-color:#f5f5f6; background-image:url(../images/body_bg.png); background-repeat:no-repeat; background-position:left top; 
}

.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(0,0,0,0.60); position:fixed; left:0; top:0; z-index:1000; }
html>body #header_wrap{ height:auto;}
#header{ margin:0 auto; width:1360px; height:30px; min-height:30px;position: relative;}
html>body #header { height:auto;}

#logo{ float:left; width:25%; height:auto; text-align:center; position: absolute; top: 50px; left:50px;}

#header-right{ float:right; width:65%; height:34px; 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: 'Titillium Web', sans-serif; font-weight:700; }
#header_phone a{ color:#fff; }
#header_phone a:hover{ color:#04abee; }
#call_icon{ float:right;  width:29px; height:39px; line-height: 39px; padding-right:8px; margin-right:8px; }


#header_email{ float:right; font-size:18px; color:#FFF; line-height:34px; height:34px; padding-right:25px; border-right:2px solid #04abee; margin-right:25px;font-family: 'Raleway', sans-serif; font-weight: 400;}
#header_email a{ color:#FFFFFF; }
#header_email a:hover{ color:#04abee; }
#email_icon{ float:right;  width:34px; height:34px; padding-right:15px; border-right:2px solid #04abee; margin-right:85px; display:none; }

#header_icons{ float:right; height:34px; width:auto; padding:0 17px;}
.header_icons{ float:right; height:34px; width:34px; padding:0 5px;}

#nav_wrap{ float:right; width:65%; height:40px; padding-bottom: 15px;}


@media screen and (max-width: 1200px) {
#header{width: 95%; padding-right:0;}
	}
 
@media screen and (max-width: 960px) {
#logo{width:200px; padding:10px 10px 0 0px;   position:relative; top:0px; left:0px;}
#header-right{width:200px;}
#header_phone{display:none;} 
#call_icon{display: block; padding-top: 5px; padding-right:15px; border-right:2px solid #161f24;margin-right:65px; }
#header_email{display:none;} 
#email_icon{display: block; }
#header_icons{ display:none;}
#nav_wrap{ float:right; width:95%; height:10px; padding-bottom: 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) {
	}
 
#page-cover{float:left; width: 100%; height: auto; background: #000000; text-align: center;}

/* home page company intro*/
#home-company-intro_wrap{float: left; width: 100%; height: auto; background:#3d3e39; padding: 40px 0;background-image: url("../images/bg_about-us.png"); background-position: right bottom; background-repeat: no-repeat;}
#home-company-intro{ float: left; padding: 20px 40% 20px 5%; width: 55%; height: auto; }
#home-company-intro h1{ font-size:45px; line-height:40px; color:#eea328; padding: 0px; margin:25px 0; text-align:left ; font-family: Verdana, "sans-serif"; font-weight:bold;	text-transform: uppercase;
background: -webkit-linear-gradient(45deg, #f9a926, #fcc257,#f9a926 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
#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:left; text-shadow:0 1px 0 #2e2e2e; }

/* home page projects*/
#home-projects_wrap-out{float: left; width: 100%; height: auto; background: #f2f4f4; padding: 60px 0 10px 0;}
#home-projects_wrap{ margin: 0 auto; padding: 0 20px; max-width: 1360px; height: auto; }
#home-projects_wrap h2 { font-size:45px; line-height:45px; color:#3d3e39; padding: 0px; margin:0px; text-align:center; font-family: Verdana, "sans-serif"; font-weight:bold;}
.home-projects{float:left; width: 24.2647%; height:auto; margin:2% 0.3676%;}
.home-projects:hover{background-color: #fff; }
.top-img{ float:left; width: 100%; height:100%; margin-bottom: 10px;}
.project-title{ float:left; width: 100%; min-height: 110px; height: 110px; margin:20px 0; color:black; font-size: 24px; line-height: 24px; font-family: 'Titillium Web', sans-serif; font-weight:700;text-transform: uppercase; }
html>body .project-title{height:auto;}
.project-title a{color:#000; display: block; }
.project-title a:hover{color:#eea328;}


 @media screen and (max-width: 960px) {
#home-company-intro{  padding: 10px 5% 20px 5%; width: 90%; }
#home-company-intro h1{ font-size:35px; line-height:35px; color:#eea328; padding: 0px; margin:15px 0; text-align:left ; font-family: Verdana, "sans-serif"; font-weight:bold;	text-transform: uppercase;
background: -webkit-linear-gradient(45deg, #f9a926, #fcc257,#f9a926 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
#home-projects_wrap h2 { font-size:35px; line-height:35px; color:#3d3e39; padding: 15px 0px; }
 .home-projects{float:left; width: 48%; height:auto; margin:2% 1%;}
 }
/*-----------------*/
/***** 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:#e8e5e1; padding: 40px 0;}
#home-partners_wrap{ margin: 0 auto; max-width: 900px; height: auto;}
#home-partners_wrap h2 { font-size:45px; line-height:45px; color:#3d3e39; padding: 0px; margin:0px; text-align:center; font-family:  Verdana, "sans-serif"; font-weight:bold;}
.home-partners{float:left; width: 49%; height:auto; margin:0.5%;}
 
@media screen and (max-width: 960px) {
#home-partners_wrap h2 { font-size:35px; line-height:35px; padding: 15px 0px;  }
	}
 
 /* project info */
#project-info_wrap{float: left; width: 100%; height: auto; background:#f2f4f4; padding: 40px 0;}
#project-info{ margin: 0 auto; max-width: 1360px; padding: 0 30px; height: auto;}
#project-info_left{ float: left; width: 38%;height: auto;  color: #000; text-align: center;}
#project-info_right{ float:right; width: 58%;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: 960px) {
#project-info_left{ float: left; width: 100%;height: auto;}
#project-info_right{ float:right; width: 100%;height: auto;}
	}


/*-footer-*/
#footer_wrap-out{float:left;margin-top:250px;  width: 100%; height: auto; background-color:#3d3e39; background-image: url("../images/footer_bg.png");  background-position: left bottom; background-repeat: no-repeat;}
#footer_cover{float:left; width: 100%; height: auto; text-align: center;}
#footer_wrap{ margin: 0 auto; width: 100%; height: auto;}
#footer_logo{float:left; width: 15%; height: auto; margin:60px 3% 50px 12%; text-align:center; }
#footer_contact{ float:left; padding: 50px 0; width:40%; height: auto;}

#footer_social-wrap{float: right; width:30%; height: auto; padding-top: 200px; background-image: url("../images/footer_bg-right.png"); background-repeat: no-repeat; background-position:top right;}
.footer_social { width: 34px; height:34px; padding: 10px;}

.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:#eea328;}

#footer_link{ float:right;  padding: 50px 0; width:100%; height:auto;  }
.footer-link, .footer-link a{font-family: 'Raleway', sans-serif; font-weight:200; color:#fff; font-size:16px; line-height:22px; }
.footer-link a { color:#fff;}
.footer-link a:hover{ color: #a6a6a6;}
 
@media screen and (max-width: 1200px) {
#footer_logo{ width:30%; height:48px; min-height:48px; text-align:center; margin:30px 35% 30px 35%;}
    #footer_contact{ width:100%; height:48px; min-height:48px;  margin:0 0 20px 0; text-align:center;}
 #footer_social-wrap{float: right; width:100%; height: auto; padding: 20px 0 80px 0; background-image: none; text-align: center;}
	}
 
@media screen and (max-width: 960px) {
#footer_logo{ width:60%; height:48px; min-height:48px; text-align:center; margin:30px 20% 10px 20%;}
	}
 
/* ---------------about us---------------- */
#about-us_wrap{float: left; width: 100%; height: auto; background:#242424; padding: 40px 0;}
#about-us{ margin: 0 auto; max-width: 1200px; height: auto;}
#about-us h1{ font-size:45px; line-height:40px; color:#04abee; padding: 0px; margin:25px 0; text-align:center ; font-family: 'Titillium Web', sans-serif; font-weight:900;	text-transform: uppercase;}
#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;}
  
/* our team */
#people_wrap{float: left; width: 100%; height: auto; background: #929292; padding: 40px 0;}
#people{ margin: 0 auto; padding: 20px 0;  max-width: 1200px;height: auto;}
#people h2{ font-size:45px; line-height:40px; color:#fff; padding: 0px; margin:25px 0; text-align:center ; font-family:Verdana, "sans-serif"; font-weight:bold;	text-transform: uppercase;}
.people{ float:left; width:21%; height:auto; padding:2%; border-radius:10px;}
.people:hover{ background:#eea328}
.people img{ float:left; width:100%; height:auto; padding-bottom:20px; border-radius:5px;}
.people h3{ float:left; width:90%; height:auto; padding:0 0 0 0; color:#ffffff; font-weight:400; 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: 960px) {
#people h2{ font-size:35px; line-height:35px; }
 }  
     
 @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-image: url("../images/colour/gray-hammer.jpg"); padding: 40px 0;}
#service{ margin: 0 auto; max-width: 1200px; height: auto; }
  d
#service p{font-family:'Raleway',sans-serif; font-weight: 400; font-size:20px; line-height:28px; color: #ffffff; padding-bottom:20px; }

.service-section{ float:left; width: 100%; height: auto; background-image: url("../images/colour/blue-hammer.jpg"); 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:#fff; 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:#fff; padding-bottom:10px;}
 

@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;}
 }

/* color chart page */
 
#color_wrap{float: left; width: 100%; height: auto; background-image:url("../images/colour/93551677__surreal-effects-sarouk-graphite-sarouk.jpg"); padding: 40px 0;}
#color{ margin: 0 auto; max-width: 1200px; height: auto; }
  d
#color p{font-family:'Raleway',sans-serif; font-weight: 400; font-size:20px; line-height:28px; color: #ffffff; padding-bottom:20px; }
 
.color-section{ float:left; width: 100%; height: auto; background-image:url("../images/colour/93584874__surreal-effects-sarouk-silver-sarouk.jpg"); margin: 20px 0;}

.color_img{padding: 4% 0 4% 4%;  float:left; width:30%; height:auto; text-align:center;}
.color_content {padding: 4%;  float:right; width:58%; height:auto;}
.color_content h2 {font-size:30px; line-height:30px;  color:#fff; padding: 0px; margin:0px;  text-align:left; font-family: 'Raleway', sans-serif; font-weight:700; }
.color-53{float: left; width: 53%; height: auto;}
.color-44{float: right; width: 42%; height: auto; padding-left: 2%; border-left: 2px solid  #EBEBEB;}

@media screen and (max-width: 960px) {
.color_img{ float:left; width:90%; padding:5%; text-align:center;}
.color_content {padding: 5%;  float:right; width:90%; }
 }

/* ---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:#04abee;}
 
@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:#04abee; 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;}
 }
 
 
/* windows gallery */

#windows-gallery{ float:left; padding:55px; width:1100px; height:auto;}

/* gallery page */
#gallery_wrap-out{ float:left; width:100%; height:69px; min-height:69px; margin:38px 0;}
html>body #gallery_wrap-out{height:auto;}
#gallery_wrap { margin:0 auto; width:1200px; height:20px; min-height:20px; background: url(../images/about_bg.png);}
html>body #gallery_wrap {height:auto;}
#gallery { float:left; width:95%; padding:3% 0 2% 5%;height:20px; min-height:20px; text-align:center;}
html>body #gallery {height:auto;}
#gallery_page-title{ float:left; width:100%; height:auto;}
#gallery h1{font-family: 'Raleway', sans-serif; font-weight: 200; font-size:40px; line-height:40px; color: #04abee; padding-bottom:24px; }
@media screen and (max-width: 1200px) {
#gallery_wrap { width:100%; }
 }
  

/*-contact us-*/

#contact-us_wrap{float: left; width: 100%; height: auto; background:#242424; padding: 40px 0;}
#contact-us{ margin: 0 auto; max-width: 960px; height: auto;}
#contact-us h1{ font-size:45px; line-height:40px;  padding: 0px; margin:25px 0; text-align:center ;  text-transform: uppercase;}
#contact-us_left{float:left; width: 45%; height: auto; }
#contact-us_right{float:right; width: 50%; height:auto; }

#contact p{font-family:'Raleway',sans-serif; font-weight: 400; font-size:20px; line-height:28px; color: #ffffff; padding-bottom:20px; }
.title{color:#fbad18;}

@media screen and (max-width: 960px) {
#contact-us{ max-width:90%; }
 #contact-us_left{float:left; width: 100%; height: auto; }
#contact-us_right{float:left; width: 100%; height:auto; }   
	}
 