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



@media (width:480px) {
#top-bg .logo {width:100%; float:none}
#top-bg .callus {width:100%; float:none}
#top-bg .callus {margin:15px 0 0; padding:0 0 0 10px; float:left}
#top-bg .callus ul {float:left}
#top-bg .callus li {list-style-type:none; display:block; font-size:16px; line-height:26px; font-weight:300; color:#fff; padding:0 10px;}
#top-bg .callus li i {font-size:20px;}
.navbar-default {width:100%; float:none;}
.navbar-nav {float: left;}
.slider-inner ul {padding-top:120% !important;}
.process-box {width:33.333%; float:left; height:210px;}
footer .left {width:100%; float:none;}
footer .center {width:50%; float:left; margin:0}
footer .right {width:50%; float:left;}
#key-feature .box {width:29.333%; margin:0 2% 7%; float:left; min-height: 179px; padding:25px; font-size:15px;	text-align:center;}
#title {margin: 30px 0 0; padding: 0;}
.gallery-items {width:100% !important}
}

@media (max-width:479px) {

#top-bg .logo {width:100%; float:none}
#top-bg .callus {width:100%; float:none}
#top-bg .callus {margin:15px 0 0; padding:0 0 0 10px; float:left}
#top-bg .callus ul {float:left}
#top-bg .callus li {list-style-type:none; display:block; font-size:16px; line-height:26px; font-weight:300; color:#fff; padding:0 10px;}
#top-bg .callus li i {font-size:20px;}
.navbar-default {width:100%; float:none;}
.navbar-nav {float: left;}
.slider-inner ul {padding-top:153% !important;}
.process-box {width:50%; float:left; height:210px;}
footer .left {width:100%; float:none;}
footer .center {width:100%; float:left;}
footer .right {width:100%; float:left;}
#key-feature .box {width:46%; margin:0 2% 7%; float:left; min-height: 179px; padding:25px; font-size:15px;	text-align:center;}
#title {margin: 30px 0 0; padding:0}
.gallery-items {width:100% !important}
}

@media (min-width:481px) and (max-width:767px) {
#top-bg .logo {width:55%; float:left}
#top-bg .callus {width:45%; float:left}
#top-bg .callus {margin:15px 0 0; padding:0 0 0 10px; float:left}
#top-bg .callus ul {float:left}
#top-bg .callus li {list-style-type:none; display:block; font-size:16px; line-height:26px; font-weight:300; color:#fff; padding:0 10px;}
#top-bg .callus li i {font-size:20px;}
.navbar-default {width:100%; float:none;}
.navbar-nav {float: left;}
.slider-inner ul {padding-top:100% !important;}
.process-box {width:33.3333%; float:left; height:210px;}
footer .left {width:100%; float:none;}
footer .center {width:50%; margin:0; float:left;}
footer .right {width:50%; float:left;}
#key-feature .box {width:29.333%; margin:0 2% 7%; float:left; min-height: 179px; padding:25px; font-size:15px;	text-align:center;}
#title {margin: 30px 0 0; padding: 0 ;}
.gallery-items {width:100% !important}
.gallery-items li {width:47% !important;}
}


@media (max-width:767px) {
.mobile-none {display:none}
.pc-none {display:block}
.navbar-default {background-color: #f8f8f8; border-color: #e7e7e7; top:0; padding:5px; border-radius:5px; float:none}
.navbar-default .navbar-nav > li > a {color:#000;}
.navbar-default .navbar-nav > li > a:hover {color:#fccb17;}
#banner .pic {width:100%; float:none;}
#banner .pic img {margin:0 auto}
#banner .wording {width:100%; float:none; text-align:center}
#banner .wording h3 {font-size:24px; color:#fccb17; margin:0; font-weight:300;}
#banner .wording h2 {font-size:28px; color:#fff; margin:0;}
#banner .wording h4 {font-size:14px; line-height:24px; color:#fff;}
#banner .wording p {line-height:26px; font-size:16px; font-weight:300; color:#fff;}
#whyus .image {float:none}
#whyus .points {width:97%; float:none; margin:25px 0 0 5px;}
#whyus .points i {width:60px; height:60px; padding:14px 10px 0; border-radius:50%; font-size:25px; color:#fff; text-align:center;}
#whyus .points h3 {font-size:24px; margin:10px 0 5px; color:#222; font-weight:600;}
.head1 {font-size: 25px; line-height: 30px;}
.head3 {font-size: 20px; line-height: 28px;}
.head4 {font-size: 17px; line-height: 25px;}
#proposal {text-align:center}
#proposal h3 {font-size:18px; line-height:26px; font-weight:600; margin:12px 0; color:#fff;}
#proposal .btn {background:#fff; border:2px #116b88 solid; color:#000; text-transform:uppercase; font-size:15px; padding:10px 20px;}
#proposal .btn:hover {background:#000; color:#fccb17;}
footer h3 {margin:15px 0 10px;}
.project li {font-size: 14px; line-height: 30px;}
.dropdown-menu > li {display:block;}
.dropdown-menu {left:0}
}

@media (min-width:768px) and (max-width:991px)  {
#top-bg .logo {width:55%; float:left}
#top-bg .callus {width:45%; float:left}
#top-bg .callus {margin:15px 0 0; padding:0 0 0 10px; float:left}
#top-bg .callus ul {float:left}
#top-bg .callus li {list-style-type:none; display:block; font-size:16px; line-height:26px; font-weight:300; color:#fff; padding:0 10px;}
#top-bg .callus li i {font-size:20px;}
.navbar-default {width:100%; top:0; float:none;}
.navbar-default .navbar-nav > li > a {padding:8px 10px}
.navbar-nav {float: left;}
.dropdown-menu {z-index:999; left:-185px;}
.dropdown-menu > li {display:table-cell;}
.dropdown-menu > li > a {padding:5px 10px;}
#banner {padding: 20px 0 40px;}
#banner .pic {width:45%; float:left;}
#banner .pic img {margin:0 auto}
#banner .wording {width:55%; float:left; text-align:left}
#banner .wording h3 {font-size:24px; color:#fccb17; margin:0; font-weight:300;}
#banner .wording h2 {font-size:28px; color:#fff; margin:0;}
#banner .wording h4 {font-size:14px; line-height:24px; color:#fff;}
#banner .wording p {line-height:20px; font-size:14px; font-weight:300; color:#fff;}
.slider-inner ul {padding-top:36% !important;}
#whyus .image {float:none}
#whyus .points {width:97%; float:none; margin:25px 0 0 5px;}
#whyus .points i {width:60px; height:60px; padding:14px 10px 0; border-radius:50%; font-size:25px; color:#fff; text-align:center;}
#whyus .points h3 {font-size:24px; margin:10px 0 5px; color:#222; font-weight:600;}
.head1 {font-size: 30px; font-weight: 800; line-height: 40px;}
#proposal {text-align:center}
#proposal h3 {font-size:20px; margin:12px 0;}
#key-feature .box {width:29.333%; margin:0 2% 7%; float:left; min-height: 179px; padding:25px; font-size:15px;	text-align:center;}
footer .left {width:100%; float:none;}
footer .center {width:50%; margin:0; float:left;}
footer .right {width:50%; float:left;}
#title {margin: 30px 0 0; padding: 0;}
.gallery-items li {margin: 0 6% 6% 0; width: 47% !important;}
.gallery-items li:nth-child(2n) {margin-right: 0 !important;}
.gallery-items li:nth-child(3n) {margin-right: 6% !important;}
.gallery-items li:nth-child(6n) {margin-right: 0% !important;}
.gallery-items {width:100% !important}
.process-box {width: 33.3333% !important;}
}

@media (min-width:992px) and (max-width:1199px)  {
#top-bg .logo {width:55%; float:left}
#top-bg .callus {width:45%; float:left}
#top-bg .callus {margin:15px 0 0; padding:0 0 0 10px;}
#top-bg .callus ul {float:right}
#top-bg .callus li {list-style-type:none; display:block; font-size:16px; line-height:26px; font-weight:300; color:#fff; padding:0 10px;}
#top-bg .callus li i {font-size:20px;}
.navbar-default {width:100%; top:0; float:none;}
.navbar-default .navbar-nav > li > a {padding:8px 15px}
.navbar-nav {float: left;}

#banner .pic {width:45%; float:left;}
#banner .pic img {margin:0 auto}
#banner .wording {width:52%; float:right; text-align:left}
#banner .wording h3 {font-size:30px; color:#fccb17; margin:0; font-weight:300;}
#banner .wording h2 {font-size:40px; color:#fff; margin:0;}
#banner .wording h4 {font-size:16px; line-height:24px; color:#fff;}
#banner .wording ul {margin:0; padding:0}
#banner .wording li {list-style-type:none; line-height:26px; font-size:16px; font-weight:300; color:#fff;}
.slider-inner ul {padding-top:29% !important;}

#whyus .image {float:left; width:48%}
#whyus .points {width:50%; float:right; margin:25px 0 0 5px;}
#whyus .points i {width:60px; height:60px; padding:14px 10px 0; border-radius:50%; font-size:25px; color:#fff; text-align:center;}
#whyus .points h3 {font-size:24px; margin:5px 0 5px; color:#222; font-weight:600;}
.head1 {font-size: 30px; font-weight: 800; line-height: 40px;}
#title {margin: 30px 0 0; padding: 0;}
.gallery-items {width:100% !important}

}

@media (min-width:1200px) and (max-width:1280px) {
	.gallery-items {width:1240px !important}
}

@media (min-width:1367px) {
	.gallery-items {width:100% !important}
}