#map {
        height: 400px;  /* The height is 400 pixels */
        width: 100%;  /* The width is the width of the web page */
       }
.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

.clearfix:before,
.clearfix:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

.clearfix:after {
  clear: both;
}

.figure{ margin:0px;}

img{ max-width:100%;}

a, a:hover, a:active{ outline:0px !important}

.fl-lt {float:left;}
.fl-rt {float:right;}

@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.eot?v=4.1.0');
  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.1.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.1.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.1.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.1.0#fontawesomeregular') format('svg');
  font-weight: normal;
  font-style: normal;
  font-family: myfont;
  src: url(../fonts/nasalization-rg.ttf);

}

body {
  font-family: 'Ubuntu', sans-serif;
  font-size:14px;
  font-weight:normal;
  color:#b2b2b2;
  margin:0;
  background-color: black;
 /* background:url(../img/pattern2.png) left top repeat;*/

}
h2{
  font-size:50px;
  color:#EEC80F;
  font-family: 'Ubuntu', sans-serif;
  font-weight:700;
  letter-spacing: -1px;
  margin:0 0 15px 0;
  text-align:center;
  text-transform:uppercase;
}
h3{
  font-family: 'Ubuntu', sans-serif;
  color:#EEC80F;
  font-size:20px;
  font-weight: 200;
  margin:0 0 5px 0;
  text-transform:uppercase;
}
h6{
  font-size:20px;
  color:#b2b2b2;
 font-family: 'Ubuntu', sans-serif;
  line-height: 1.6;
  font-weight:400;
  text-indent: 50px;
  text-align:center;
  margin:0 0 60px 0;
}
p{
  line-height:1.6;
  margin:0;
}
.templatemo-header {  
  background-image: url(../img/templatemo-header.jpg);
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: auto;
  -moz-background-size: auto;
  -o-background-size: auto;
  background-size: auto;
  min-height: 200px;
}
.tm-orange-bg-transparent { background-color: #967702; }
.header{
  text-align:center;
  /*background-color: #0d0d0d;*/
}
.logo{
  width:420px;
  margin:0 auto 35px;
}
.header h1{
  padding-top: 80px;
  font-family: myfont;
  font-size:80px;
  font-weight:400;
  letter-spacing: -1px;
  margin:0 0 22px 0 ;
  color:#fff;
}
.header ul li{
  color:#EEC80F;font-size: 30px; font-weight: bolder;
}

.we-create{
  padding:0;
  margin:35px 0 55px;
}
.wp-pic{
  margin-bottom:20px;
}
.we-create li{
  display:inline-block;
  font-family: 'Ubuntu', sans-serif;
  font-size:14px;
  color: #bcbcbc;
  text-transform: uppercase;
  font-weight: 400;
  margin:0 5px 0 0;
  padding:0 0 0 15px;
}
.we-create li:first-child{
  background:none;
}

.main-nav-outer{
  padding:0px;
  border-bottom:1px solid #dddddd;
  box-shadow:0 4px 5px -3px #ececec;
  position:relative;
  background:#fff;
}
.main-nav{
  text-align:center;
  margin:10px 0 0px;
  padding:0;
  list-style:none;
}
.main-nav li{
  display:inline;
  margin:0 1px;
}
.main-nav li a{
  display:inline-block;
  color:#222222;
  text-transform:uppercase;
  font-family: 'Ubuntu', sans-serif;
  text-decoration: none;
  line-height:20px;
  margin:17px 32px;
  transition:all 0.3s ease-in-out;
  -moz-transition:all 0.3s ease-in-out;
  -webkit-transition:all 0.3s ease-in-out;
}

.main-nav li a:hover{ 
  text-decoration:none;
  color: #7cc576;
}

.small-logo{ 
  padding:0 32px;
}

.main-section{
  padding:20px 0 110px;
}


.serviceContainer{
  margin:0 auto;
  padding-left:15px;
}

.service-box{
  text-align:center;
  margin-bottom:30px;
  height:250px;
  width:250px;
  overflow:hidden;
  float:left;
  padding:0;
  border: 3px #121212 solid;
  box-shadow: 6px 6px #161616;
}
.service-box img{
  margin-bottom:25px;
  filter: brightness(70%);
  transition:all 0.3s ease-in-out;
  -moz-transition:all 0.3s ease-in-out;
  -webkit-transition:all 0.3s ease-in-out;  
}

.service-box img:hover {
  opacity: 0.6;
}

.service-nav li a.current{
  background:#7cc576;
  color:#fff;
  text-decoration:none;
}
img {
   max-width:100%;
}

/* no transition on .isotope container */

.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.6s;
     -moz-transition-duration: 0.6s;
          transition-duration: 0.6s;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
          transition-property:         transform, opacity;
}

.main-section.paddind{
  padding-bottom:60px;
}


.customer-part{
  
  padding:100px 0;
  text-align:center;
}

.customer{
  padding:0;
  margin:20px 0 0;
  list-style:none;
  text-align:center;
}
.customer li{
  display:inline;
  margin:0 15px;
}
.customer li a{
  display:inline-block;
}
.customer li a img{
  margin-bottom:15px;
  border-radius:50%;
}
.customer li a:hover{
  text-decoration:none;
}
.customer li a h3{
  color:#ffffff;
}
.customer li a span{
  color:#f1f1f1;
}
.quote-right{
  font-style:normal;
  width:68px;
  height:68px;
  margin:0 auto;
  border:2px solid #7cc576;
  border-radius:50%;
  display:block;
  line-height:68px;
  text-align:center;
  font-size:27px;
  color:#7cc576;
  cursor: pointer;
  transition:all 0.3s ease-in-out;
  -moz-transition:all 0.3s ease-in-out;
  -webkit-transition:all 0.3s ease-in-out;
}

.quote-right:hover{
color: #fff;
border: 2px solid #fff;
}
.main-section.hire{
  padding:85px 0;
}
.main-section.hire h6{
  margin-bottom:40px;
}


.main-section.contact{
  padding-top:0;
}
.contact-info-box{
  font-size:15px;
  margin:0 0 14px 68px;
  padding-left:0;
}
.contact-info-box h3{
  font-size: 15px;
  font-weight:400;
  float:left;
  width:102px;
  margin-right:12px;
  line-height:28px;
}
.contact-info-box h3 i{
  font-style:normal;
  font-size:18px;
  color:#222222;
  font-family: 'FontAwesome';
  font-weight:normal;
  margin-right:7px;
}
.contact-info-box span{
  line-height:28px;
  display:block;
  overflow:hidden;
}
.footer{
  background-color: #161616;
  padding-top:50px;
}

.serviceContainer{
  max-width: 1140px;
}
.delay-02s { 
  animation-delay: 0.2s; 
  -webkit-animation-delay: 0.2s; 
}
.delay-03s { 
  animation-delay: 0.3s; 
  -webkit-animation-delay: 0.3s; 
}
.delay-04s { 
  animation-delay: 0.4s; 
  -webkit-animation-delay: 0.4s; 
}

.delay-05s { 
  animation-delay: 0.5s; 
  -webkit-animation-delay: 0.5s; 
}
.delay-06s { 
  animation-delay: 0.6s; 
  -webkit-animation-delay: 0.6s; 
}

.delay-07s { 
  animation-delay: 0.7s; 
  -webkit-animation-delay: 0.7s; 
}
.delay-08s { 
  animation-delay: 0.8s; 
  -webkit-animation-delay: 0.8s; 
}

.delay-09s { 
  animation-delay: 0.9s; 
  -webkit-animation-delay: 0.9s; 
}
.delay-1s { 
  animation-delay: 1s; 
  -webkit-animation-delay: 1s; 
}
.delay-12s { 
  animation-delay: 1.2s; 
  -webkit-animation-delay: 1.2s; 
}

.arrow {
  
      text-align: right;
  }

  .bounce {
    
      -moz-animation: bounce 2s infinite;
      -webkit-animation: bounce 2s infinite;
      animation: bounce 2s infinite;
  }

  @keyframes bounce {
  
      0%, 20%, 50%, 80%, 100% {
          transform: translateY(10px);
      }
      40% {
          transform: translateY(-120px);
      }
      60% {
          transform: translateY(-30px);
      }
    }
* {
  margin: 0;
}



.container {
  overflow: hidden;
}

.sliding-background {
  background: url(../img/recruit.png) repeat-x;
  height: 560px;
  width: 5076px;
  animation: slide 60s linear infinite;
}

@keyframes slide{
  0%{
    transform: translate3d(0, 0, 0);
  }
  100%{
    transform: translate3d(-1692px, 0, 0);
  }
}

ul.socialIcons {
    padding: 0;
    text-align: center;
}
.socialIcons li {
    background: yellow;
    list-style: none;
    display: inline-block;
    margin: 15px;
    margin-top: 15%;
    border-radius: 2em;
    overflow:hidden;
}
.socialIcons li a {
    display: block;
    padding: .4em;
    max-width: 2.3em;
    min-width: 2.3em;
    height: 2.3em;
    white-space: nowrap;
    line-height: 1.5em;
    transition:.5s;
    text-decoration: none;
    font-family: 'Ubuntu', sans-serif;
    color: #fff;
}
.socialIcons li i {
    margin-right:.5em;
}
.socialIcons li:hover a {
    max-width:200px;
    padding-right:1em;
}
.socialIcons .facebook {
    background: #3b5998;
    box-shadow: 0 0 16px #3b5998;
}
.socialIcons .twitter {
    background: #00aced;
    box-shadow: 0 0 16px #00aced;
}
.socialIcons .instagram {
    background: #cd486b;
    box-shadow: 0 0 16px #cd486b;
}
.socialIcons .pinterest {
    background: #c92228;
    box-shadow: 0 0 16px #c92228;
}
.socialIcons .steam {
    background: #666666;
    box-shadow: 0 0 16px #666666;
}

.read ul {

    margin: 30px auto;
    padding-right: 100px;
    text-align: right;
}

.read li {

    list-style: none;
    position: relative;
    display: inline-block;
    width: 100px;
    height: 100px;
}

.round {
padding: 0;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    height: 50%;
    text-decoration: none;    
    text-align: center;
    font-size: 15px;    
    text-shadow: 0 1px 0 rgba(255,255,255,.7);
    letter-spacing: -.065em;
    font-family: 'Ubuntu', sans-serif;   
    -webkit-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
    box-shadow: 2px 2px 7px rgba(0,0,0,.2);
    border-radius: 300px;
    z-index: 1;
    border-width: 4px;
    border-style: solid;
}

.round:hover {

    width: 130%;
    height: 130%;
    left: -15%;
    top: -15%;
    font-size: 33px;
    padding-top: 0;
    -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,.3);
    -o-box-shadow: 5px 5px 10px rgba(0,0,0,.3);
    -moz-box-shadow: 5px 5px 10px rgba(0,0,0,.3);
    box-shadow: 5px 5px 10px rgba(0,0,0,.3);
    z-index: 2;
    border-size: 10px;
    -webkit-transform: rotate(-360deg);
    -moz-transform: rotate(-360deg);
    -o-transform: rotate(-360deg);
    transform: rotate(-360deg);
}

a.yellow {
    background-color: #EEC80F;
    color: black;
    border-color: #EEC80F;
    text-decoration: none;
}

a.yellow:hover {

    color: black;
}

.round span.round {

    display: block;
    opacity: 0;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    font-size: 1px;
    border: none;
    padding: 40% 20% 0 20%;
    color: #fff;
}

.round span:hover {

    opacity: .85;
    font-size: 16px;
    -webkit-text-shadow: 0 1px 1px rgba(0,0,0,.5);
    -moz-text-shadow: 0 1px 1px rgba(0,0,0,.5);
    -o-text-shadow: 0 1px 1px rgba(0,0,0,.5);
    text-shadow: 0 1px 1px rgba(0,0,0,.5);  
}

.yellow span {

    background: #ffc300; 
}


/*menu item*/

*, *::after, *::before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

*::after, *::before {
  content: '';
}

.cd-nav-trigger {
  top: 20%;
  right: 4%;
  height: 65px;
  width: 65px;
  z-index: 5;
  position: fixed;
  display: inline-block;
  color: white;
  /* image replacement */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}
.cd-nav-trigger .cd-icon {
  /* icon created in CSS */
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  display: inline-block;
  width: 20px;
  height: 4px;
  background-color: #ffffff;
  z-index: 10;
}
.cd-nav-trigger .cd-icon::before, .cd-nav-trigger .cd-icon:after {
  /* upper and lower lines of the menu icon */
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  color: white;
  background-color: #ffffff;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  /* apply transition to transform property */
  -webkit-transition: -webkit-transform .3s;
  -moz-transition: -moz-transform .3s;
  transition: transform .3s;
}
.cd-nav-trigger .cd-icon::before {
  -webkit-transform: translateY(-6px) rotate(0deg);
  -moz-transform: translateY(-6px) rotate(0deg);
  -ms-transform: translateY(-6px) rotate(0deg);
  -o-transform: translateY(-6px) rotate(0deg);
  transform: translateY(-6px) rotate(0deg);
}
.cd-nav-trigger .cd-icon::after {
  -webkit-transform: translateY(6px) rotate(0deg);
  -moz-transform: translateY(6px) rotate(0deg);
  -ms-transform: translateY(6px) rotate(0deg);
  -o-transform: translateY(6px) rotate(0deg);
  transform: translateY(6px) rotate(0deg);
}
.cd-nav-trigger::before, .cd-nav-trigger::after {
  /* 2 rounded colored backgrounds for the menu icon */
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 50%;
  height: 100%;
  width: 100%;
  background-color: #E6B000;
  animation: beat .5s infinite alternate;
  transform-origin: center;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
}
.cd-nav-trigger::before {
  background-color: #E6B000;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-delay: 0.4s;
  -moz-transition-delay: 0.4s;
  transition-delay: 0.4s;
}
.cd-nav-trigger::after {
  background-color: black;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
  -webkit-transition-duration: 0s;
  -moz-transition-duration: 0s;
  transition-duration: 0s;
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  transition-delay: 0s;
}
.cd-nav-trigger.close-nav::before {
  /* user clicks on the .cd-nav-trigger element - 1st rounded background disappears */
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}
.cd-nav-trigger.close-nav::after {
  /* user clicks on the .cd-nav-trigger element - 2nd rounded background appears */
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-delay: 0.4s;
  -moz-transition-delay: 0.4s;
  transition-delay: 0.4s;
}
.cd-nav-trigger.close-nav .cd-icon {
  /* user clicks on the .cd-nav-trigger element - transform the icon */
  background-color: rgba(255, 255, 255, 0);
}
.cd-nav-trigger.close-nav .cd-icon::before, .cd-nav-trigger.close-nav .cd-icon::after {
  background-color: white;
}
.cd-nav-trigger.close-nav .cd-icon::before {
  -webkit-transform: translateY(0) rotate(45deg);
  -moz-transform: translateY(0) rotate(45deg);
  -ms-transform: translateY(0) rotate(45deg);
  -o-transform: translateY(0) rotate(45deg);
  transform: translateY(0) rotate(45deg);
}
.cd-nav-trigger.close-nav .cd-icon::after {
  -webkit-transform: translateY(0) rotate(-45deg);
  -moz-transform: translateY(0) rotate(-45deg);
  -ms-transform: translateY(0) rotate(-45deg);
  -o-transform: translateY(0) rotate(-45deg);
  transform: translateY(0) rotate(-45deg);
}

.cd-primary-nav {
  /* by default it's hidden */
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  padding: 80px 5%;
  z-index: 3;
  background-color: #E6B000;
  overflow: auto;
  text-decoration: none;
  /* this fixes the buggy scrolling on webkit browsers - mobile devices only - when overflow property is applied */
  -webkit-overflow-scrolling: touch;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: visibility 0s, opacity 0.3s;
  -moz-transition: visibility 0s, opacity 0.3s;
  transition: visibility 0s, opacity 0.3s;
}
.cd-primary-nav li {
  display: block;
  margin: 1.6em 0;
  text-align: center;
  text-transform: capitalize;
  text-decoration: none;
  color: black;
}
.cd-primary-nav li a {
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition: color 0.2s;
  -moz-transition: color 0.2s;
  transition: color 0.2s;
}
.cd-primary-nav li h2{
    color: black;
}
.no-touch .cd-primary-nav a:hover {
  color: #ffffff;
}
.cd-primary-nav.fade-in {
  /* navigation visible at the end of the circle animation */
  visibility: visible;
  opacity: 1;
}
@media only screen and (min-width: 768px) {
  .cd-primary-nav li {
    margin: 2em 0;
  }
  .cd-primary-nav a {
    font-size: 28px;
    font-size: 1.75rem;
  }
}
@media only screen and (min-width: 1170px) {
  .cd-primary-nav li {
    margin: 2.6em 0;
  }
  .cd-primary-nav a {
    font-size: 32px;
    font-size: 2rem;
  }
}

.cd-overlay-nav, .cd-overlay-content {
  /* containers of the 2 main rounded backgrounds - these containers are used to position the rounded bgs behind the menu icon */
  position: fixed;
  top: 20%;
  right: 8%;
  height: 4px;
  width: 4px;
  -webkit-transform: translateX(-20px) translateY(20px);
  -moz-transform: translateX(-20px) translateY(20px);
  -ms-transform: translateX(-20px) translateY(20px);
  -o-transform: translateX(-20px) translateY(20px);
  transform: translateX(-20px) translateY(20px);
}
.cd-overlay-nav span, .cd-overlay-content span {
  display: inline-block;
  position: absolute;
  border-radius: 50%;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: transform;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}

/* Heart beat animation */
@keyframes beat{
  to { transform: scale(1); }
}
.cd-overlay-nav.is-hidden, .cd-overlay-content.is-hidden {
  /* background fades out at the end of the animation */
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
}

.cd-overlay-nav {
  /* main rounded colored bg 1 */
  z-index: 2;
}
.cd-overlay-nav span {
  background-color: #E6B000;
}

.cd-overlay-content {
  /* main rounded colored bg 2 */
  z-index: 4;
}
.cd-overlay-content span {
  background-color: black;
}

.cd-content {
  /* just some dummy content */
  padding: 80px 0;
  width: 90%;
  max-width: 768px;
  margin: 0 auto;
  z-index: 1;
}
.cd-content .cd-intro {
  height: 200px;
  padding-top: 4.6em;
}
.cd-content h1 {
  text-align: center;
  font-size: 20px;
  font-size: 1.25rem;
}
.cd-content p {
  line-height: 1.5;
  color: #a76500;
}

.item-1, 
.item-2, 
.item-3 {
  position: absolute;
  display: block;
  top: 3em;
  
  width: 100%;
  
  font-size: 3em;

  animation-duration: 20s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

.item-1{
  animation-name: anim-1;
}

.item-2{
  animation-name: anim-2;
}

.item-3{
  animation-name: anim-3;
}

@keyframes anim-1 {
  0%, 8.3% { left: -100%; opacity: 0; }
  8.3%,25% { left: 1%; opacity: 1; }
  33.33%, 100% { left: 110%; opacity: 0; }
}

@keyframes anim-2 {
  0%, 33.33% { left: -100%; opacity: 0; }
  41.63%, 58.29% { left: 1%; opacity: 1; }
  66.66%, 100% { left: 110%; opacity: 0; }
}

@keyframes anim-3 {
  0%, 66.66% { left: -100%; opacity: 0; }
  74.96%, 91.62% { left: 1%; opacity: 1; }
  100% { left: 110%; opacity: 0; }
}




@media only screen and (min-width: 768px) {
  .cd-content .cd-intro {
    height: 250px;
    padding-top: 6em;
  }
  .cd-content h1 {
    font-size: 28px;
    font-size: 1.75rem;
  }
  .cd-content p {
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 1.8;
  }
}

.career-detail-page {
background-image: url(//www.designveloper.com/wp-content/themes/designveloper/images/pattern-left.png),
url(//www.designveloper.com/wp-content/themes/designveloper/images/pattern-up.png);
background-position: left center, right bottom;
background-repeat: no-repeat, no-repeat;
background-size: auto 50%, auto 50%;
padding: 110px 0 30px;
}
.career-detail-title {
font-size: 40px;
color: #E6B000;
margin-bottom: 32px;
}
.career-detail-description {
font-size: 20px;
color: #fff;
margin-bottom: 72px;
}
.career-detail-page ul {
-webkit-padding-start: 30px;
padding-inline-start: 30px;
}
.career-detail-description,
.career-detail-title,
.career-title,
.project-more__name,
.project__name {
font-family: MavenPro-Bold;
}
.career-detail-page ul {
-webkit-padding-start: 30px;
padding-inline-start: 30px;
}
.swiper-pagination-career {
position: static !important;
margin-top: 10px;
}
.career-slider-item img {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
}
.career-slider-item.swiper-slide-active img {
-webkit-filter: grayscale(0);
filter: grayscale(0);
}
.swiper-pagination-career > .swiper-pagination-bullet {
margin: 0 3px !important;
}
.swiper-pagination-career > .swiper-pagination-bullet-active {
background: #fcbf10 !important;
}
.back-btn {
width: 50px;
margin-right: 4px;
margin-top: -1px;
background-color: #E6B000;
}
.back-section {
margin-bottom: 58px;
}
.assign {
margin: 20px 0 80px;

border: 1px solid #fcbf10;
position: relative;
color: #fcbf10;
min-width: 244px;
}
.assign:hover {
color: #323940;
z-index: 99;
background: #fcbf10;
}
.assign:before {
position: absolute;
top: 0;
left: 50%;
right: 50%;
bottom: 0;
opacity: 0;
background-color: #fcbf10;
z-index: -2;
}
.assign:hover:before {
border-radius: 0 0 16px;
-webkit-transition: 0.5s all ease;
-o-transition: 0.5s all ease;
transition: 0.5s all ease;
left: 0;
right: 0;
opacity: 1;
}
@-webkit-keyframes fadeInVisible {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeInVisible {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.copy{
    float:right;
}

.mapouter{
    position:relative;
    text-align:right;
    height:500px;
    width:600px;
    
}
.gmap_canvas {
    overflow:hidden;
    background:none!important;
    height:500px;
    width:600px;
    
}

/* ==========================================================================
   Media Queries
   ========================================================================== */


@media only screen and (min-width: 992px) {
  /****Ipad Landscape 1024 Container 970 ****/

  .about-list{ margin-bottom:30px;}
  .c-logo-part ul li{ margin:0 15px;}
  .form{ margin:0 0 0 20px}
  .main-nav{ display:block !important; }
  /*.serviceContainer{ width:800px; margin:0px auto !important; } */


}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  /****Ipad Portrait 768 Container 750 ****/
  body{ font-size:13px;}
  p{ line-height:20px ;}
  .header h1{ font-size:46px; }
  .header ul li{ font-size:36px;}
  .main-nav ul li a{ padding:14px;}
  .small-logo{ padding:0 20px;}
  h2{ font-size:30px}
  h6{ font-size:16px;}
  h3{ font-size:15px;}
  .about-list{ margin-bottom:20px; font-size:15px;}
  .featured-work p.padding-b{ padding-bottom:15px;}
  .main-section{ padding:50px 0;}
  .c-logo-part ul li{ margin:0 1%; float:left; width:18%;}
  .c-logo-part ul li a{ display:block;}
  .c-logo-part ul li a img{ display:block;}
  .form{ margin:0;}
  .contact-info-box{ margin:0 ;}
  .social-link{ margin:0;}

  .main-nav{ display:block !important; }
  .main-nav li a{ padding:8px 15px;}
  .vl{display: none;}
  .slider .quote {font-size: 30px;}
  .slider .source {font-size: 10px;}
  .copy{float:left;}
  .footer{  padding-top:20px;}
  .hire{padding-bottom:-40px;}
 .contact-form{
        padding-top:30px;
    }

  /*.serviceContainer{ width:750px; margin:0px auto !important; }
  .service-box{ height:250px;}*/



}

@media only screen and (max-width: 767px) {
  /****Mobile Landscape 480 Container 100% ****/
  body{ font-size:12px;}
  h2{ font-size:26px;}
  h3{ font-size:14px;}
  h6{ font-size:16px; margin-bottom:40px;}
  p{ line-height:18px;}
  .about-list{ font-size:12px; margin-bottom:20px;}
  .we-create li{ font-size:13px; padding:0 0 0 8px}
  .header h1{ font-size:28px;}
  .header ul li{ font-size:18px; }
  .header{ padding:0;}
  .main-section{ padding:60px 0 70px;}
  .main-nav{ display:none; position:absolute; left:0; width:100%; top:68px; margin:0 auto; float: none; background:#fff; z-index: 99; border-top: 1px solid #eee;}
  .main-nav li{ display:block;}
  .main-nav li.small-logo{ display:none;}
  .main-nav li a{ display:block; padding:12px 32px; margin: 4px 0; border-bottom: 1px solid #f3f3f3;;}
  .main-nav li a:hover{color:#7cc576}
  .team-leader-box{ max-width:307px; width:auto; float:none; margin:0 auto; }
  .team-leader-box:nth-of-type(3n){ margin:0 auto}
  .res-nav_click{ display:block;}
  .featured-work{ font-size:12px; margin-top:30px;}
  .featured-box{ font-size:12px;}
  .featured-box p{ line-height:18px; }
  .c-logo-part ul a{ margin-bottom:5px;}
  .main-section.team{ padding:60px 0 50px;}
  .business-talking h2{ font-size:36px;}
  .contact-info-box{ margin:0 0 12px 30px; font-size:12px;}
  .contact-info-box span{ line-height:18px;}
  .contact-info-box.phone span, .contact-info-box.email span { padding-top: 6px;}
  .social-link{ margin-left:30px;}
  .form{ margin:0 30px;}
  .copyright{ font-size:12px;}
  .business-talking a{ padding:10px 25px; font-size:14px;}
  .main-section.contact{ padding:0px}
  .customer-part-haead{ font-size:20px; line-height:30px;}
  .link{ font-size:14px; padding:10px 25px;}
  .logo{ width:150px;
      padding-bottom:-100px;
  }
  .main-section.contact{ background-size:contain;}
  .service-nav li a{ padding:5px 16px;}
  .service-nav li{ display:block;}
  .vl{display: none;}
  .slider .quote {font-size: 20px;}
  .slider .source {font-size: 10px;}
  /*.isotope-item img{ width:300px; left:50%; margin-left:-100px;}
  .isotope-item{ width:300px; margin:0px auto;}
  .isotope{ width:400px; margin:0px auto;}
  .service-box{}
  .serviceContainer{ width:350px; margin:0px auto !important; } */
  .copy{float:left;}
  .footer{  padding-top:20px;}
  .hire{padding-bottom:-40px;}
    .mapouter{
    height:300px;
    width:300px;
    }
    .gmap_canvas {
    height:300px;
    width:300px;
    }
    .contact-form{
        padding-top:50px;
    }

}

@media only screen and (max-width: 650px) {
  /****Mobile Portrait 320 ****/
  .contact-info-box{height:50%;  margin-left:0px;}
  .header{ padding:0;}
  .header h1{padding:0; }
  .header ul li{padding:0;}
  .social-link{ margin-left:0px;}
  .form{ margin:0}
  .c-logo-part ul li{ display:block;}
  .service-box{  max-width:250px !important; width:96.4% !important; margin:0 !important}
  .service-box img { max-width:100%;}
  .serviceContainer{ width:280px !important; margin:0 auto !important }
  .vl{display: none;}
.main-section.contact{
  height:50%;
  padding-bottom:-100px;
}
 .copy{float:left;}
 .footer{  padding-top:20px;}
 .hire{padding-bottom:-40px;}
   .mapouter{
    height:300px;
    width:300px;
    }
    .gmap_canvas {
    height:300px;
    width:300px;
    }
     .contact-form{
        padding-top:50px;
    }
}