@charset "utf-8";

/*font-face*/
@font-face {
  font-family: "OpenSans";
  src: url("fonts/OpenSans-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "OpenSans-Light";
  src: url("fonts/OpenSans-Light.ttf") format("truetype");
}
@font-face {
  font-family: "OpenSans-Bold";
  src: url("fonts/OpenSans-Bold.ttf") format("truetype");
}
@font-face {
  font-family: "Montserrat-UltraLight";
  src: url("fonts/Montserrat-UltraLight.ttf") format("truetype");
}
@font-face {
  font-family: "Montserrat";
  src: url("fonts/Montserrat-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "montserrat-light";
  src: url("fonts/montserrat-light.ttf") format("truetype");
}
@font-face {
  font-family: "Montserrat-Bold";
  src: url("fonts/Montserrat-Bold.ttf") format("truetype");
}
/* CSS Document */
/*welcome-page*/
body {
  background: #f1f1f1 none repeat scroll 0 0;
}
#welcome {
  float: left;
  overflow: hidden;
  position: relative;
  width: 100%;
}
#welcome-bg {
    background: #000000;
    display: inline-block;
    padding: 0;
    width: 100%;
}
#welcome-bg-img {
  background: rgba(0, 0, 0, 0) url("/images/2.jpg") no-repeat scroll center / cover ;
  display: inline-block;
  height: 100%;
  padding: 0;
  width: 100%;
}
#welcome-pattern {
  display: none;
}
#welcome-logo {
  display: none;

  position: absolute;
  text-align: center;
top:50%;
left:50%;
transform:translate(-50%,-50%);
  width: 100%;
  z-index: 99;
}
#welcome-pattern {
  background: rgba(0, 0, 0, 0) url("/images/bg-pattern.png") no-repeat scroll center center /cover;
  height: 100%;
  left: 0;
  position: absolute;
  text-align: center;
  top: 0;
  width: 100%;
}
#welcome-logo img {
  display: inline-block;
  max-width: 40vw;
}
/*home-page*/
#home-img, #service-img, #about-img, #contact-img, #enquire-img {
  float: left;
  min-height: 100vh;
  width: 100%;
}
#home-img {
  background: rgba(0, 0, 0, 0) url("/images/1.jpg") no-repeat scroll center center /cover;
}

.main-section {
  position: relative;
  width: 100%;
  float: left;
}
.side-logo {


  width: 18vw;
  min-width: 240px;
}

.content-outer {
  height: 100%;
  display: inline-block;
  width: 55%;

}
.content-inner p {
  font-family: "montserrat-ultralight";
}

#home-content .content-inner .home-inner-text p {
  font-size: 24px;
}
.content-item {
  display: table;
  height: 100%;
  width: 100%;
}
.content-inner {
  position: relative;
  display: table-cell;
  vertical-align: middle;
}
#home-content .content-inner .home-inner-text {
  position: relative;
}
#home-content .home-inner-text::after, #home-content .home-inner-text::before {
  background: rgba(0, 0, 0, 0) url("/images/border.png") no-repeat scroll center center / contain ;
  content: "";
  height: 40px;
  left: 20%;
  position: absolute;
  width: 60%;
}
#home-content .home-inner-text::before {
  top: 100%;
}
#home-content .home-inner-text::after {
  bottom: 100%;
}
.main-nav div:first-child {
  position: absolute;
  top: 50%;
left: 0;
}
.main-nav div {
  cursor: pointer;
  font-family: "montserrat-light";
}
.main-nav div:last-child {
  position: absolute;
  right: 0px;
  top: 50%;

}

.main-pattern {
  position: relative;
  z-index: -102;
}
.section-outer {
  position: relative;
  float: left;
  width: 100%;
}
  /*service*/
   #service-img {
  background: rgba(0, 0, 0, 0) url("/images/3.jpg") no-repeat scroll center center /cover;
}
  #about-full {
  	display: none;
  }
  #service-content .content-outer {
  width: 75%;
}
#service .main-content {
  position: relative;
}
.content-inner h1 {
  font-family: "Montserrat";
  font-size: 30px;


}
.title-bottom p {
  font-family: Montserrat-UltraLight;
  font-size: 24px;
}
.title-bottom {
  display: inline-block;
  min-width: 600px;
  width: 70%;
}
.service-outline ul {
  float: left;
  text-align: -moz-left;
  width: 33.333%;
}
.service-outline {
  clear: both;
  display: inline-block;
}
#front-slider {
  width: 55%;
  display: inline-block;
  visibility:visible;
  position:static;
}
#front-slider.start {
  visibility:hidden;
  height:0;
 /* position:absolute;*/
}
#front-slider .flexslider {
  background: transparent;
  border: none;
  border-radius: 0;
  margin: 15px 0 35px;
}
#front-slider .flexslider ul li p {
  font-size: 15px;
  line-height: 1.8;
  text-align: center;
  margin: 0;
  font-weight: bold;

}
.slides {
  margin-top: 15px;
}
 #front-slider .flexslider .flex-control-nav {
  bottom: -25px;
  }
  #front-slider .flexslider .flex-direction-nav a {
  color: #000000;
  height: 50px;
  opacity: 1;
}
#front-slider .flexslider .flex-direction-nav .flex-next {
  right: 10px;
}
#front-slider .flexslider .flex-direction-nav .flex-prev {
  left: 10px;
}
 #service-content .service-last {
  display: inline-block;
  min-width: 600px;
  width: 50%;
}
.service-last > p {
  font-size: 1.5rem;
  margin-top: 20px;
}
#download-capability > a {
   background: #424243 none repeat scroll 0 0;
  color: #ffffff;
  display: inline-block;
  font-family: montserrat-light;
  margin-top: 15px;
  padding: 3px 30px 5px;
  cursor: pointer;
  text-decoration: none;
}

#about-readmore.show-all {
  display:none;
}
#about-readless {display:none;}
#about-readless.show-all {
  display:inline-block;
}
/*about*/
#about-img {
  background: rgba(0, 0, 0, 0) url("/images/4.jpg") no-repeat scroll center center /cover;
}
#about-content .content-outer {
  width: 55%;
}
#about-content .service-last {
  display: inline-block;
  min-width: 600px;
}
#about-half, #about-content .title-bottom {

  display: inline-block;
}

#about-half.show-all span.readmore {
  display:none;
}
#about-half p {
  font-size: 16px;
}
.title-bottom {
  position:relative;
  margin-bottom: 30px;
}
.title-bottom::after {
  background: rgba(0, 0, 0, 0) url("/images/border.png") no-repeat scroll center center / contain ;
  content: "";
  height: 40px;
  left: 10%;
  position: absolute;
  top: 100%;
  width: 80%;
}
#about-half {
  margin-top: 15px;
}
.service-outline h2 {
  font-family: "opensans-Bold";
  font-size: 26px;
}
/*parallex*/
.parallax-window {
  clear: both;
  min-height: 400px;
  height: 80vh;
  background: transparent;
}
/*-------------------------*/
.inceptio-btn,
input.submit-form.inceptio-btn{
  border: 1px solid black;
line-height: 1;
  background: #000000;
  color: #ffffff ;
  transition: all 0.3s ease-in-out;
  padding: 8px 35px ;
  text-transform: uppercase;
display: inline-block;
  font-size:16px;
  cursor: pointer;
}

.inceptio-btn:hover,
input.submit-form.inceptio-btn:hover{
  color:#000000 ;
  background: transparent ;

}

/*contact*/
#contact-img {
  background: rgba(0, 0, 0, 0) url("/images/contact.jpg") no-repeat scroll center center /cover;
}
.contact-info img {
  display: inline;
  width: 30px;
  margin-bottom: 10px;
}
.contact-info {
  margin-top: 30px;
}


/*enquery-form*/
#enquire-img {
  background: rgba(0, 0, 0, 0) url("/images/enquire.jpg") no-repeat scroll center center /cover;
}
.enquire-form {
  width: 100%;
  clear: both;
}
.enquire-form form {
  display: inline-block;
  width: 65%;
}
.enquire-form input,  .enquire-form select, .enquire-form textarea {
  background: #d4d4d4 none repeat scroll 0 0;
  border: medium none;
  box-shadow: none;
  font-size:16px;
  display: inline-block;
  margin-top: 15px;
  padding: 6px 10px;
  text-align: center;
  width: 80%;
  color: #000000;
}
.enquire-form input::-moz-placeholder, .enquire-form input::placeholder, .enquire-form input::-webkit-input-placeholder, .enquire-form input:-moz-placeholder, .enquire-form input:-ms-input-placeholder, .enquire-form textarea::-moz-placeholder, .enquire-form textarea::placeholder, .enquire-form textarea::-webkit-input-placeholder, .enquire-form textarea:-moz-placeholder, .enquire-form textarea:-ms-input-placeholder {
  color: #000000;
  opacity: 1;
}
#enquire-contact {
  margin-top: 15px;
  background: #9A9A9A;
}
.enquire-form input.submit-form, #enquire-contact {
  min-width: 135px;
  width: auto;
}
input.submit-form[disabled] {
  background-color:#888;
  cursor:default;
}
input[disabled], textarea[disabled] {
  color:#888;
}


.center {
  clear: both;
  position: relative;
  text-align: center;
  width: 100%;
  z-index: 99999;
}

/*----moving-effect*/
.mouseParallax {
  background: rgba(0, 0, 0, 0) url("/images/bg-pattern.png") no-repeat scroll center center / cover ;
  position: fixed;
}

.main-pattern img {
  opacity: 0;
}
/*responsive-menu*/
#mobile-nav {
  display: none;
}

#mobile-slide {
  display: none;
}
.mobile-menu  .cbp-spmenu-vertical {
  width: 80%;
  t
}
.mobile-menu .cbp-spmenu-right {
  right: -80%;
}
.push-body-toleft {
  left: -80%!important;
}
nav.cbp-spmenu {
  background: #ffffff;
}
.mobile-menu  .cbp-spmenu-vertical {
  height: auto;
  min-height: 99vh;
  z-index: 1000;
}
.mobile-menu  .cbp-spmenu a:hover {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
}
.mobile-menu  .cbp-spmenu a:hover {
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
  color: #808080;
  text-decoration: none;
}
.mobile-call {
  background: #333333 none repeat scroll 0 0;
  float: left;
  padding-bottom: 27.5%;
  padding-top: 23px;
  position: relative;
  text-align: center;
  width: 100%;
}
.mobile-call img {
  display: inline-block;
  margin-right: 30px;
  position: absolute;
  right: 0;
  top: 30%;
}
.term {
  bottom: 0;
  position: absolute;
  text-align: center;
  width: 100%;
}
.desktop.term {
  position:relative;
  bottom:4em;
  right:4em;
  text-align:right;
  height:0;
}
.desktop.term a {
  padding:0 10px;
}

.mobile-menu nav .term > a {
  display: inline-block;
  font-family: opensans;
  font-size: 15px;
  text-decoration: underline;
  float: none;
  padding: 0 5px;
  margin-bottom: 10px;
}
.mobile-menu ul li {
  margin-top: 28px;
}

@media screen and (min-width: 1600px) {
  .title-bottom p {
  font-size: 30px;
}
.service-outline h2 {
  font-size: 32px;
}
.service-outline ul li {
  font-size: 16px;
}
.service-last > p {
  font-size: 17px;
}
#home-content .content-inner > p {
  font-size: 36px;
}
#about-content .title-bottom p {
  font-size: 20px;
}
#about-half p {
  font-size: 20px;
}

#download-capability > a {
  font-size: 22px;
  margin-top: 25px;
  padding: 4px 30px 8px;
}
.content-inner p {
  font-size: 17px;
}
.enquire-form input, .enquire-form button, .enquire-form select, .enquire-form textarea {
  font-size: 17px;
}
.enquire-form input.submit-form, #enquire-contact {
  min-width: 220px;
}
#front-slider .flexslider ul li p {
  font-size: 16px;
}
}
  @media screen and (min-width: 1900px) {
#home-content .content-inner > p {
  font-size: 2vw;
}

#download-capability > a {
  font-size: 30px;
  padding: 6px 30px 10px;
}
.content-inner p {
  font-size: 20px;
}
.enquire-form input, .enquire-form button, .enquire-form select, .enquire-form textarea {
  font-size: 20px;
}
.enquire-form input.submit-form, #enquire-contact {
  min-width: 286px;
}
#front-slider .flexslider ul li p {
  font-size: 19px;
}
}
@media screen and (min-width: 1200px) and (max-width: 1300px) {
#service-content .content-outer {
  width: 75%;
}
}

@media screen and (min-width: 1200px) {
  .main-section .main-pattern img {
  min-width: 1300px;
}
}
@media screen and (min-width: 768px) and (max-width: 1199px) {
.main-section .main-pattern img {
  display: none;
}
.main-content {
  position: relative;
}
.content-outer {
}
#service-content .content-outer {
  width: 75%;
}
}

@media screen and (min-width: 768px) and (max-width: 992px) {
#about-content .content-outer {
  padding: 0 90px;
  width: 100%;
}
.content-outer {
  width: 75%;
}
#about-half, #about-content .title-bottom {
  min-width: 0;
  width: 90%;
}
#front-slider {
  width: 70%;
}
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
    .main-section .main-pattern img {
  min-width: 1200px;
}
}

@media screen and (min-width: 768px) {
  .half.left, .half.right {
    width:50%;
    float:left;
    clear:none;
  }
.enquire-form form {
    width: 95%;
    padding-top:15px;
}
.thankyou-message {
  display: none;
  font-family: "montserrat-light";
  font-size: 18px;
  padding: 20px 0;
  width: 100%;
}
.site-by {
  display: none;
}

#welcome-bg {
  height: 100vh;
  min-height: 500px;
}
#welcome-pattern img {
  display: inline-block;
  height: 100%;
  max-width: none;
  min-height: 500px;
  width: auto;
}
#home-img, #service-img, #about-img, #contact-img, #enquire-img {
  min-height: 100vh;
}
.main-content {
  float: left;
  text-align: center;
  width: 100%;
  height: 100vh;
  min-height: 600px;

}
}
@media screen and (max-width: 767px) {
.enquire-form input, .enquire-form select, .enquire-form textarea{
  background: white;
}
  #service-content .title-bottom::after, #mobile-slide .title-bottom::after {
  background-image: url("/images/border-w.png");
}
.p-image {
  display: none;
}
#welcome {
  display: none;
}

  .main-content {
  float: left;
  text-align: center;
  width: 100%;
}
  .service-outline ul li {
  list-style: none;
}


  /*fixed-header*/

.mobile-header {
  background: #ffffff;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
}
#mobile-nav {
  background: #111111 none repeat scroll 0 0;
  position: relative;
  width: 100%;
  display: block;

}
#mobile-nav a {
  display: block;
  max-width: 80%;
}
.mobile-logo {
  padding: 15px;

}
.mobile-logo img {
  width: 90%;
  max-width: 250px;
  display: inline-block;
}
#nav-link > span {
  background: #ffffff none repeat scroll 0 0;
  float: left;
  height: 7px;
  margin: 3px 0;
  width: 100%;
}
#nav-link {
  display: inline-block;
  position: absolute;
  right: 15px;
  top: 40%;
  width: 40px;
  left: auto;
}
.mobile-menu nav a {
  color: #000000;
  float: left;
  font-family: opensans-bold;
  font-size: 30px;
  padding: 10px;
  border: none;
}
.mobile-menu li {
  float: left;
  list-style: outside none none;
  width: 100%;
}
/**/
/*enquire*/
#mobile-slide .flex-direction-nav {
  display: none;
}
.flex-control-paging li a {
  border: 1px solid #ffffff;
}
.flexslider {
  width: 100%;
  float: left;
}
#front-slider .flexslider .flex-direction-nav a {
  color: #ffffff;
  height: 35px;
}
#front-slider .flex-direction-nav a::before {
  color: #ffffff;
}
#front-slider .flex-direction-nav a::before {
  font-size: 30px;
  text-shadow:none;
}
#service-enquire, #download-capability > a {
  background: #ffffff none repeat scroll 0 0;
  color: #000000;
}
#front-slider .flexslider .flex-direction-nav .flex-prev {
  left: -10px;
}
#front-slider .flexslider .flex-direction-nav .flex-next {
  right: -10px;
}
#mobile-slide .section-outer {
  display: table;
  height: 100%;
  width: 100%;
  vertical-align: middle;
}
#mobile-slide #contact-content-mobile {
  display: table-cell;
  vertical-align: middle;
}
#mobile-slide .content-outer p, #mobile-slide .content-outer {
  color: #ffffff;
}
#mobile-slide .mobile-pattern .flex-viewport {
  padding-bottom: 30px;
  position: relative;
  z-index: 1;
}
#mobile-slide .main-section {
  height: 685px !important;
}
.flex-control-paging li a.flex-active {
  background: #ffffff none repeat scroll 0 0!important;

}
#mobile-slide .flex-control-nav {
  bottom: 15px;
  z-index: 9;
}
  #home-img, #service-img, #contact-img, #about-img, #enquire-img, #contact, #enquire {
    display: none;
  }

.side-logo, .main-pattern, .main-nav {
  display: none;
}
.main-content {
  position: static;
}
#welcome {
  padding-bottom: 24%;
}
#welcome-bg-img {
  float: right;
  height: 100vh;
}
#welcome-logo img {
  display: inline-block;
  max-width: 400px;
  width: 70vw;
}
#welcome-pattern {
  background: rgba(0, 0, 0, 0) url("/images/welcom-pm.png") no-repeat scroll center top  / cover ;
}
#welcome-pattern img {
  display: none;
}
#welcome-logo {
  top: 32%;
}
.content-outer {
  margin-top: 30px;
  padding: 30px;
  width: 100%;
  margin-bottom: 30px;
}
#service-content .content-outer, #about-content .content-outer {
  margin-bottom: 45px;
  margin-top: 45px;
  width: 100%;
  position: relative;
  z-index: 1;
}
#service-content .service-last, .title-bottom {
  min-width: 0;
  width: 100%;
}
.service-outline ul {
  padding: 0;
  text-align: center;
  width: 100%;
}

#service-content p, #service-content {
  color: #ffffff;
}

#mobile-slide {
  float: left;
  padding-bottom: 54px;
  padding-top: 77px;
  position: relative;
  width: 100%;
}

#service .section-outer {
  background: rgb(0, 0, 0) none repeat scroll top right/ cover;
  position: relative;
}
#service .main-content {
  background: rgb(0, 0, 0) none repeat scroll 0 0;
}
#mobile-slide {
  display: inline-block;
}

#mobile-slide .mobile-pattern {
  background-color: rgb(0, 0, 0);
  position: relative;
}
.enquire-form form {
  width: 100%;
}
.enquire-form input, .enquire-form button, .enquire-form select, .enquire-form textarea {
  width: 100%;
}
#contact-enquire-mobile, #enquire-content-mobile .enquire-form input.submit-form {
  display: inline-block;
  width: auto;
  padding: 5px 30px;
  min-width: 200px;
  background: #ffffff;
  color: #000000;
  font-family: montserrat;
  font-size: 17px;
  margin-top: 25px;
}
#enquire-contact-mobile {
  background: #444444 none repeat scroll 0 0;
  color: #ffffff;
  display: inline-block;
  font-family: montserrat;
  font-size: 17px;
  margin-top: 15px;
  min-width: 200px;
  padding: 5px 30px;
  width: auto;
}
.site-by {
  background: #111111 none repeat scroll 0 0;
  float: left;
  height: 60px;

  padding: 18px 15px 0;
  position: relative;
  text-align: right;
  width: 100%;
  z-index: 1;
}
.site-by > a {
  color: #ffffff;
  font-family: montserrat-light;
  font-size: 13px;
  opacity: .5;
  text-decoration: none;
}
.site-by > a:hover {
  opacity: 1;
}
#front-slider {
  width: 90%;
}
.service-outline {
  margin: 0 -15px;
}
    }

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

    #nav-link > span {
  height: 5px;
  margin: 2px 0;
}
#nav-link {
  top: 40%;
  width: 30px;
}
.mobile-call img {
  width: 40px;
}
}


nav {
  background-color: #1E1E23;
  height: 65px;
}


#menuToggle {
  display: flex;
  flex-direction: column;
  position: relative;
  top: 25px;
  left: 25px;
  z-index: 1;
  -webkit-user-select: none;
  user-select: none;
}

#menuToggle input
{
  display: flex;
  width: 40px;
  height: 32px;
  position: absolute;
  cursor: pointer;
  opacity: 0;
  z-index: 2;
}

#menuToggle span
{
  display: flex;
  width: 29px;
  height: 2px;
  margin-bottom: 5px;
  position: relative;
  background: #ffffff;
  border-radius: 3px;
  z-index: 1;
  transform-origin: 5px 0px;
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s ease;
}

#menuToggle span:first-child
{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2)
{
  transform-origin: 0% 100%;
}

#menuToggle input:checked ~ span
{
  opacity: 1;
  transform: rotate(45deg) translate(-3px, -1px);
  background: #36383F;
}
#menuToggle input:checked ~ span:nth-last-child(3)
{
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

#menuToggle input:checked ~ span:nth-last-child(2)
{
  transform: rotate(-45deg) translate(0, -1px);
}

#menu
{
  position: absolute;
  width: 180px;
  height: 400px;
  box-shadow: 0 0 10px #85888C;
  margin: -50px 0 0 -50px;
  padding: 50px;
  padding-top: 125px;
  background-color: #F5F6FA;
  -webkit-font-smoothing: antialiased;
  transform-origin: 0% 0%;
  transform: translate(-100%, 0);
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
}

#menu li
{
  padding: 10px 0;
  transition-delay: 2s;
}

#menuToggle input:checked ~ ul
{
  transform: none;
}