/*
Theme Name: Verve Digital
Theme URI: http://vervedigital.com.au/
Author: Verve Digital
Author URI: http://vervedigital.com.au/
Description: 2016 theme
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: verve-digital
Tags:

*/

@font-face {
  font-family: 'Montserrat';
  src: url('fonts/montserrat/Montserrat-Light.otf');
}

@font-face {
  font-family: 'MontserratBold';
  src: url('fonts/montserrat/Montserrat-bold.otf');
}

body {
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  color: #6e6c6c;
    overflow-x: hidden;
}

h2.title {
  font-size: 42px;
  font-family: 'Montserrat', sans-serif;
}

h2.title.white {
  color: #fff;
}

h3 {
  font-size: 24px;
  font-family: 'Montserrat', sans-serif;
}

p {
  margin: 0 0 20px
}

b, strong {
  font-family: 'MontserratBold', sans-serif;
}

.icons {
  display:block;
  background-image: url('images/icons.png');
  background-repeat: no-repeat;
  width: 200px;
  height: 96px;
  margin: 0 auto;
}

.no-padding {
  padding: 0 !important;
}

.hide {
  display: none;
}

.btn {
  font-size: 11px;
  padding: 10px 23px;
  margin-top: 5px;
  border-radius: 0;
}

.btn-close-popup {
  background: transparent;
  color: #fff;
  border:none;
  font-size: 50px;
}

/* --------------------------------------------------
 * NAVIGATION
 * --------------------------------------------------*/
#navigation {
  position: relative;
  width: 100%;
}

#navigation a {
  display: block;
  text-align: center;
  font-size: 32px;
  padding: 10px 0;
  color: #fff;
}

#navigation a:hover {
  text-decoration: none;
  background-color: red;
}

#first_link {
  text-decoration: none;
  background-color: red !important;
}


#navigation .navigation_close {
  position: absolute;
  right: 90px;
  top: -120px;
  z-index: 20;
}

#navigation img {
  display: block;
  margin: -106px auto 70px;
}

/* --------------------------------------------------
 * POPUP WORKS
 * --------------------------------------------------*/
#popup-works .pagination {
  margin: 0;
  padding: 30px 0;
}

#popup-works .pagination a {
  display: inline-block;
  width: 40px;
  height: 34px;
  margin: 0 5px;
  background: url('images/screen-icons.png') no-repeat;
}

#popup-works .pagination a.screen-icon-1 {
  background-position: 0 0;
}

#popup-works .pagination a.screen-icon-1:hover, #popup-works .pagination a.screen-icon-1.selected {
  background-position: 0 -42px;
}

#popup-works .pagination a.screen-icon-2 {
  background-position: -48px 0;
}

#popup-works .pagination a.screen-icon-2:hover, #popup-works .pagination a.screen-icon-2.selected {
  background-position: -48px -42px;
}

#popup-works .pagination a.screen-icon-3 {
  background-position: -96px 0;
}

#popup-works .pagination a.screen-icon-3:hover, #popup-works .pagination a.screen-icon-3.selected {
  background-position: -96px -42px;
}

#popup-works .pagination a.screen-icon-4 {
  background-position: -144px 0;
}

#popup-works .pagination a.screen-icon-4:hover, #popup-works .pagination a.screen-icon-4.selected {
  background-position: -144px -42px;
}

#popup-works .carousel-works-action {
  margin-top: -70px;
}

#popup-works .carousel-works-action a {
  display: none;
  font-size: 12px;
  padding: 11px 36px;
  background: url('images/angle-left-right-red.png') no-repeat;
}

#popup-works .carousel-works-action a.work-left {
  background-position: 0 0;
}

#popup-works .carousel-works-action a.work-right {
  background-position: 137px -44px;
}

#popup-works .carousel-works-action a:hover {
  text-decoration: none;
}

#popup-works .work-header > div{
  border-bottom: 1px solid red;
}

#popup-works .work-header .btn-close-popup {
  font-size: 30px;
  color: #444;
  margin-right:10px;
}

#popup-works .work-description > div{
  padding-top: 15px;
}

#popup-works #carousel-works > div {
  width: 1170px;
}

#popup-works .work-slider{
  position:relative;
  margin-top: 20px;
  height: 600px;
}

#popup-works .work-slider .work-carousel-slide {
  display: inline-block;
  width: 1200px;
  height: 620px;
}


#popup-works .work-slider .work-carousel-slide img{
  display: block;
  margin: 0 auto;
}

#popup-works .work-slider .work-carousel-slide .slider-image-2 {
  margin-top: 60px;
}

#popup-works .work-slider .work-carousel-slide .slider-image-3 {
  margin-top: 45px;
}

#popup-works .work-slider .work-carousel-slide .slider-image-4 {
  margin-top: 55px;
}

#popup-works .work-slider .btn-slider-left,
#popup-works .work-slider .btn-slider-right {
  position: absolute;
  display: block;
  top: 240px;
  width: 50px;
  height: 50px;
  z-index: 100;
  background: url('images/angle-left-right.png') no-repeat;
}

#popup-works .work-slider .btn-slider-left {
  left: 0;
  background-position: 17px 0;
}

#popup-works .work-slider .btn-slider-right {
  right: 0;
  background-position: -40px 0;
  z-index: 999;
}
/* --------------------------------------------------
 * HOME
 * --------------------------------------------------*/
#home{
  position: relative;
}

#home img{
  position: absolute;
  left: 37%;
  z-index: 10;
  margin-top: 160px;
  display: block;
}

#home #open-menu {
  position: absolute;
  right: 17px;
  z-index: 12;
  display: block;
  margin-top: 26px;
  width: 47px;
  height: 47px;
}

#home #open-menu span {
  display: block;
  height: 9px;
  margin-top: 10px;
  background-color: #fff;
}

#home #open-menu span:first-child {
  margin-top: 0;
}

/* HOME INTRO */
#home-intro .container > div{
  padding: 40px 0;
}

#home-intro h2.title {
  font-size: 32px;
  margin-bottom: 40px;
}

#home-intro h2.title small{
  font-size: 32px;
  color: #9A9A9A
}

/* --------------------------------------------------
 * WHAT WE DO
 * --------------------------------------------------*/
#what-we-do {/*
  background: url('images/what-we-do-bg.png') top center no-repeat;*/
  color: #fff;
}
/*#what-we-do .para_1         { height:433px;}*/

#what-we-do .container {
  padding: 40px 0;
}

#what-we-do a.select-content {
  color: #fff;
  padding-top: 40px;
  height: 317px;
}

#what-we-do a.select-content span.band{
  display: block;
  width: 100%;
  height: 40px;
  background-color: #fff;
  position:relative;
  bottom: -93px;
}

#what-we-do a.select-content:hover {
  text-decoration: none;
  cursor: pointer;
}

#what-we-do a.select-content:hover .icons {
  height: 133px;
}

#what-we-do a.select-content:hover h3 {
  font-size: 26px;
}

#what-we-do a.select-content:hover span.band{
  bottom: -54px;
}

#what-we-do a.select-content.active h3,
#what-we-do a.select-content.active span.band{
  display: none;
}

#what-we-do #strategy .icons {
  background-position: -3px -15px;
}

#what-we-do #strategy:hover .icons {
  background-position: -3px -123px;
}

#what-we-do #strategy.active .icons {
  background-position: -3px -123px;
  height: 133px;
}

#what-we-do #creative .icons {
  background-position: -212px -15px;
}

#what-we-do #creative:hover .icons {
  background-position: -213px -130px;
}

#what-we-do #creative.active .icons {
  background-position: -213px -130px;
  height: 133px;
}

#what-we-do #development .icons {
  background-position: -423px -15px;
}

#what-we-do #development:hover .icons {
  background-position: -423px -128px;
}

#what-we-do #development.active .icons {
  background-position: -423px -128px;
  height: 133px;
}

#what-we-do #marketing .icons {
  background-position: -591px -15px;
}

#what-we-do #marketing:hover .icons {
  background-position: -609px -124px;
}

#what-we-do #marketing.active .icons {
  background-position: -609px -124px;
  height: 133px;
}

#what-we-do .content {
  color: #6e6c6c;
  padding: 40px 50px !important;
  background: #ffffff;
}
#what-we-do .content h3 {
  margin-bottom: 40px;
  color: #ff3438;
}

#what-we-do .content h4 {
  padding: 10px 0 25px;
}

#what-we-do .content .list {
  list-style: none;
  padding: 0;
}

#what-we-do .content .list li{
  padding: 10px 0;
  border-bottom: 1px solid #ccc;
}

#what-we-do .content .list .triangle{
  display: inline-block;
  margin-right: 10px;
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-right: 7px solid red;
  vertical-align: 4px;
}

/* --------------------------------------------------
 * OUR PROCESS
 * --------------------------------------------------*/
#our-process {
  padding:0px 0;/*
  background: url('images/our-process-bg.png') top center no-repeat;*/
  color: #fff;
}

#our-process .para_2  { height:873px; padding:40px 0 0 0; }

#our-process .center-column {
  padding: 20px 0 0;
}

#our-process .content {
  padding-top: 60px;
}

#our-process .content dt {
  font-size: 22px;
  border-bottom: 1px solid #fff;
  padding: 3px;
  padding: 58px 0 15px;
}

#our-process .content .left-column dt.first {
  padding: 0 0 15px;
}

#our-process .content .right-column dt.first {
  padding: 84px 0 15px;
}

#our-process .content dd {
  height: 70px;
}

.badges {
  display:block;
  background-image: url('images/icons_process.png');
  width: 85px;
  height: 85px;
  margin: 1px 16px;
  position: relative;
}

.gear {
  background: url('images/icons_process.png') 0 -197px no-repeat;
  display:block;
  width: 117px;
  height: 117px;
  position: absolute;
  top: -18px;
  left: -17px;
}

.badges.discover{
 background-position: 0 0;
   left: 3px;
   top: -5px;
}

.badges.plan{
 background-position: 230px 0;
}

.badges.fusion{
 background-position: 130px 0;
}

.badges.develop{
 background-position: 0 -99px;
}

.badges.launch{
 background-position: 230px -99px;
}

.badges.monitor{
 background-position: 131px -99px;
}

/* --------------------------------------------------
 * OUR  WORK
 * --------------------------------------------------*/
#our-work {
  background:  #dbdbdb url('images/our-work-bg.png') top center no-repeat;
}

#our-work h2.title{
  color: #fff;
  padding: 75px 0;
  margin: 0;
  line-height: 1;
}
/*#our-work .content {
  height: 700px;
}*/

/* CAROUSEL */
/*#our-work #carousel > div {
  height: 700px;
  position: relative;
  float: left;
}

#our-work #carousel > div > * {
  position:absolute;
}

#our-work #carousel .project1 {
  width: 1170px;
}
#our-work #carousel .project1 .image1 {
  top: 80px;
  left: 50px;
  z-index: 1;
}

#our-work #carousel .project1 .image2 {
  top: 338px;
  left: 512px;
  z-index: 2;
}

#our-work #carousel .project1 .image3 {
  top: 410px;
  left: 826px;
  z-index: 3;
}

#our-work #carousel .project1 .image4 {
  top: 398px;
  left: 0;
  z-index: 4;
}

#our-work #carousel .project1 .info {
  width: 415px;
  height: 170px;
  top: 120px;
  left: 680px;
  z-index: 5;
}

#our-work #carousel .project1 .navigation a {
  display: inline-block;
  width: 25px;
  height: 48px;
}

#our-work #carousel .project1 .navigation a.angle-left {
  background: url('images/angle-left-right.png') 0 0 no-repeat;
  margin-right: 60px;
}

#our-work #carousel .project1 .navigation a.angle-right {
  background: url('images/angle-left-right.png') -50px 0 no-repeat;
}*/

/* --------------------------------------------------
 * CAREERS
 * --------------------------------------------------*/
#careers {
  padding:0px;  
  /*
  background: url('images/careers-bg.png') top center no-repeat;*/
  color: #fff;
}
#careers .para_3  { height:318px; }

#careers h2 {
  margin-bottom: 30px;
}

#careers h2 + p + p {
  font-size: 21px
}


#careers a {  font-size: 21px; text-decoration:none; color:#fff;}
/* --------------------------------------------------
 * GET IN TOUCH
 * --------------------------------------------------*/
#get-in-touch {
  /*height: 700px; */
  padding: 40px 0 10px 0;
  background-color: #9f1d27;
  color: #fff;
}

#get-in-touch h2 {
  margin-top: 10px;
}

#get-in-touch h4 {
  margin: 0 0 30px 0;
}

#get-in-touch hr {
  border-color: #bc6168;
  margin-top: 40px;
  margin-bottom: 40px;
}

#get-in-touch .content {
  margin-top: 35px;
}

#get-in-touch input,
#get-in-touch textarea {
  border:none;
  font-size: 16px;
  border-radius: 0;
  padding: 14px;
  height: auto;
}

#get-in-touch form button{
  height: 50px;
  border-radius: 0;
}

#get-in-touch form .row {
  margin-bottom: 26px;
}

#get-in-touch ul {
  list-style: none;
  padding: 0;
}

#get-in-touch ul li {
  padding: 5px 0;
  font-size: 18px;
}

#get-in-touch ul li i{
  font-size: 22px;
  color: #fbaa1b;
  display: inline-block;
  width: 22px;
  text-align: center;
  margin-right: 5px;
}
#get-in-touch ul li a{
text-decoration:none; color:#fff; font-size:18px; 
} 


/* --------------------------------------------------
 * FOOTER CREDITS
 * --------------------------------------------------*/
#footer-credits {
 /* height: 105px; */
  padding: 23px 0;
  font-size: 11px;
}

#footer-credits address,
#footer-credits span {
  display:block;
  margin-top: 23px;
}

#footer-credits span a {
  display: inline-block;
  color: #6e6c6c;
  padding: 0 10px;
}

#footer-credits span a:hover {
  text-decoration: none;
}


/* --------------------------------------------------
 * FOOTER SOCIAL
 * --------------------------------------------------*/
#footer-social {
  height: 115px;
  background-color: #606060;
}

#footer-social div + div {
  color: #fff;
  font-size: 11px;
  margin-top: 20px;
}

#footer-social a {
  display: inline-block;
  background-color: #fff;
  color: #606060;
  font-size: 20px;
  margin: 25px 3px 0 3px;
}

#footer-social a.link-face {
  padding: 4px 12.29px;
}

#footer-social a.link-twitter {
  padding: 4px 8.71875px;
}

#footer-social a.link-google {
  padding: 4px 10.859px;
}

#footer-social a.link-instagram {
  padding: 4px 9.43px;
}

#footer-social a.link-linkedin {
  padding: 4px 9.43px;
}

/* --------------------------------------------------
 * SIGLE PAGE NAVIGATION
 * --------------------------------------------------*/
.single-page-nav a:hover { background-color: red; text-decoration:none;}
.overlay_bg       { visibility: hidden !important; opacity: 0 !important;}
.para         { max-width:1500px; width:100%;  margin:0 auto;}  


/* --------------------------------------------------
 * FANCYBOX
 * --------------------------------------------------*/
#our-process .content .rd_mr      { display:none; margin:10px auto 0; font-family: "Montserrat",sans-serif; font-size: 16px; line-height:20px; color:#fff; text-decoration:none;}
#our-process .content .rd_mr:hover  { text-decoration:none;}  

.fancybox-lock .fancybox-overlay    { background:url(images/fancybox_overlay.png) repeat !important; overflow-x: hidden !important; overflow-y: hidden !important;}
.fancybox-skin            { background:none;}
.pop_sec              { max-width:375px; width:100%; margin:0 auto; text-align:center; display:none; box-shadow:none;}
.pop_sec h3               { font-size:22px; line-height:28px; color:#fff; margin-top:5px;}
.pop_sec p              { color:#fff;} 
.fancybox-close           { position:fixed; top:40px; right:20px;}

#inline1              { display:none;}
#inline2              { display:none;}
#inline3              { display:none;}
#inline4              { display:none;}
#inline5              { display:none;}
#inline6              { display:none;}    
#inline7              { display:none;}
 
#what-we-do a.select-content span.band  { display:none;}
#what-we-do a.select-content.active {  position:relative;}
#what-we-do a.select-content.active:before { background-color: transparent; background:url(images/aht_actv_bg1.png?v=1) no-repeat center;  content:'';} 
#what-we-do a.select-content:before { position:absolute; bottom:0px; left:0px; right:0px; text-align:center; margin:0 auto; text-align:center; background-color: #ffffff; width:100%; height:32px;  content:'';}  

#what-we-do a.select-content:nth-child(1):after { position:absolute; bottom:0px; left:-250px; background-color: #ffffff; width:250px; height:32px;  content:'';}    
#what-we-do a.select-content:nth-child(4):after { position:absolute; bottom:0px; right:-250px; background-color: #ffffff; width:250px; height:32px;  content:'';}   

.pop_sec .badges  { display:inline-block; margin-top:25px;}

#what-we-do .content        { padding:40px 0 0 0;}
#what-we-do .content .list    { margin-bottom:30px;}

.para { background-position: top center; background-repeat: no-repeat; background-attachment: fixed; background-size: cover;}

.gear {
 /* -webkit-animation-name: rotateThis;
  -webkit-animation-duration:2s;
  -webkit-animation-iteration-count:infinite;
  -webkit-animation-timing-function:linear;
   animation-name: rotateThis;
 animation-duration:2s;
 animation-iteration-count:infinite;
 animation-timing-function:linear;*/
}
/*
@-webkit-keyframes rotateThis {
  from {-webkit-transform:scale(1) rotate(0deg); transform:scale(1) rotate(0deg);}
  to {-webkit-transform:scale(1) rotate(360deg); transform:scale(1) rotate(360deg);}
} 
@keyframes rotateThis {
  from {-webkit-transform:scale(1) rotate(0deg); transform:scale(1) rotate(0deg);}
  to {-webkit-transform:scale(1) rotate(360deg); transform:scale(1) rotate(360deg);}
} */


.view_work{display:none;}
#our-process{ overflow-x:hidden;}
#our-process .center-column { position:relative;}
body { -webkit-font-smoothing: antialiased; }
.ScrollSceneIndicators { z-index: 9999999 !important; }

.badges.plan    { background-position:230px 0; top:-9px; left:2px;}
.plan .gear       { top:-15px;}

.badges.fusion    { background-position:130px 0; top:-21px; left:-6px;}
.fusion .gear     { top:-15px;}

.badges.develop   { background-position:0 -99px; top:-23px; left:-9px;}
.develop .gear    { top:-15px;}

.badges.launch    { background-position:232px -102px; top:-33px; left:-16px;}
.launch .gear     { top:-18px; left:-17px;}

.badges.monitor   { background-position:131px -99px; top:-37px; left:-18px;}
.monitor .gear    { top:-15px;}

dl          { padding-right:10px;}

.popup_visible_popup-works body {overflow:hidden;}
.noscroll {overflow-y:hidden;}
#work-2, #work-1 { display:inline-block;}
#popup-works_wrapper { background-color:rgba(253, 253, 253, 0.95) !important;}

.mobileSliderMainWrap { display:none; margin:0 20px; padding:30px 0 20px;}
.mobileSliderWrap {  position:relative; padding-bottom:40px;}
.mobileSlider.slick-slider { position:initial !important;}
.mobileSlider .slick-dots {text-align:center; padding:0px !important; list-style:none; position:absolute; bottom:0px; left:0px; width:100%;}
.mobileSlider .slick-dots li { display:inline-block;}
.mobileSlider .slick-dots li button{
  display:block;
    width: 40px;
    height: 34px;
    margin: 0px 5px;
  font-size:0px;
  outline:none;
  border:0px;
    background: transparent url("images/screen-icons.png") no-repeat scroll 0% 0% !important;
}

.mobileSlider .slick-dots li button { background-position: 0px 0px;}
.mobileSlider .slick-dots li:nth-child(2) button { background-position: -48px 0px !important;}
.mobileSlider .slick-dots li:nth-child(3) button { background-position: -96px 0px !important;}
.mobileSlider .slick-dots li:nth-child(4) button { background-position: -144px 0px !important;}

.mobileSlider .slick-dots li:hover button, .mobileSlider .slick-dots li.slick-active button {background-position: 0 -42px !important;}
.mobileSlider .slick-dots li:nth-child(2):hover button, .mobileSlider .slick-dots li.slick-active:nth-child(2) button {background-position: -48px -42px !important;}
.mobileSlider .slick-dots li:nth-child(3):hover button, .mobileSlider .slick-dots li.slick-active:nth-child(3) button {background-position: -96px -42px !important;}
.mobileSlider .slick-dots li:nth-child(4):hover button, .mobileSlider .slick-dots li.slick-active:nth-child(4) button {background-position: -144px -42px !important;}

.mobSliderInfo { margin-bottom:20px;}
.mobSliderInfo h3 {text-align: center; float: none !important; font-size: 16px; margin: 0px 0px 10px;}
.mobSliderInfo ul {list-style:none; padding:0px; text-align:center;}
.mobSliderInfo ul li {font-size: 14px;line-height: 16px; display:block;}

.slick-prev.slick-arrow {background: transparent url("images/angle-left-right-red.png") no-repeat scroll 0% 0%; width:24px; height:41px; font-size:0px; outline:none; border:0px; position:absolute; bottom:0px; left:0px; z-index:999; }
.slick-next.slick-arrow {background: transparent url("images/angle-left-right-red.png") no-repeat scroll 0% -44px; width:24px; height:41px; font-size:0px; outline:none; border:0px; position:absolute; bottom:0px; right:0px; z-index:999; }

a:focus {outline:none !important;}
.btn-danger:focus{outline:none !important;}
.btn-danger.focus, .btn-danger:focus {background-color:#d9534f !important; border-color:#d43f3a !important;}

body {
    overflow-x: hidden !important;
}

/* Preloader */

#preloader {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background:#333; /* change if the mask should have another color then white */
    z-index:9999; /* makes sure it stays on top */
}

#status {
    position:absolute;
    left:50%; /* centers the loading animation horizontally one the screen */
    top:50%; /* centers the loading animation vertically one the screen */
  text-align:center;
    background-image:url(../img/status.gif); /* path to your loading animation */
    background-repeat:no-repeat;
    background-position:center;
    /*margin:-100px 0 0 -100px;*/ /* is width and height divided by two */
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
}
#status span {display:block; text-transform:uppercase; color:#f51f5a; margin-top:20px; letter-spacing:1px; font-weight:bold; font-size:20px;}

span.wpcf7-not-valid-tip {
    color: #EC971F;
    font-size: 1em;
    display: block;
}

div.wpcf7-mail-sent-ok {
    border: 2px solid #398f14;
    color: #fff;
    background: #398f14;
}

.wpcf7-response-output.wpcf7-display-none.wpcf7-mail-sent-ok:before {
    font-family: FontAwesome;
    content: "\f046";
    margin-right: 10px !important;
}