/*******************************************************
 *
 * Marketing And Branding
 *
 *******************************************************/
 .ip-container #scroll-down {
   display: block;
}

#inner-page-wrapper {
   margin-bottom: 30px;
}

#inner-page-wrapper > .container {
   width: 100%;
   padding: 0;
}

.global-title h1.is-default small {
   letter-spacing: 0;
}

#ip-marketing-and-branding {
   position: relative;
   padding: 0 0 20px;
}

.ip-mab-bg {
   height: 810px;
}

.ip-mab-bg:after {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: 1;
}

.ip-mab-bg:after {
   top: initial;
   height: 227px;
   height: 28.025%;
   background: rgb(255,255,255);
   background: -moz-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
   background: -webkit-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
   background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
}

.ip-mab-bg canvas {
   opacity: 0.15;
}

.ip-mab-top {
   display: flex;
   flex-flow: row wrap;
   justify-content: space-between;
   align-items: flex-start;
   padding: 132px 0 107px;
}

.ip-mab-title {
   width: 40%;
}

.ip-mab-title .global-title i.dot {
   display: inline-block;
   vertical-align: middle;
   width: 12px;
   height: 12px;
   background: #000;
   border-radius: 50%;
   margin: 0 4px;
   top: -8px;
   position: relative;
}

.ip-mab-title .global-accent-line.is-left {
   top: 32px;
}

.ip-mab-text {
   text-align: right;
   width: 699px;
   padding: 7px 3px 0 0;
}

.ip-mab-text p {
   font-size: 16px;
   letter-spacing: 0.05em;
   line-height: 1.75;
   color: #222222;
   font-weight: 600;
}

.ip-mab-cta-list {
   display: flex;
   flex-flow: row wrap;
   align-items: flex-start;
   margin: 0 -7px;
   position: relative;
   z-index: 1;
}

.ip-mab-cta {
   width: 50%;
   padding: 9px;
}

.ip-mab-cta a {
   display: block;
   position: relative;
   overflow: hidden;
}

.ip-mab-cta-img {
   position: relative;
}

.ip-mab-cta-img canvas {
   display: block;
   width: 100%;
   background-position: center;
   background-size: cover;
   background-color: #999;
   transition: all var(--default-transition);
   filter: grayscale(1);
}

.ip-mab-cta-img:before {
   content: '';
   position: absolute;
   height: 50%;
   opacity: 0.8;
   left: 0;
   right: 0;
   bottom: 0;
   z-index: 1;
   background: rgb(0,0,0);
   background: -moz-linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
   background: -webkit-linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
   background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
}

.ip-mab-cta-name {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   z-index: 1;
   font-size: 30px;
   font-weight: 700;
   line-height: 1;
   color: #fff;
   padding: 0 6.5% 4.5%;
}

.ip-mab-cta-name span {
   display: block;
   font-size: 14px;
   font-weight: 300;
   letter-spacing: 0.05em;
   line-height: 1;
   text-transform: uppercase;
   margin-top: 0;
   opacity: 0;
   visibility: hidden;
   height: 0;
   -webkit-transition: 0.3s all ease-in-out;
   transition: 0.3s all ease-in-out;
}

.ip-mab-cta-name .global-accent-vertical-line {
   left: 3.3%;
   bottom: 30px;
   height: 100vh;
   top: initial;
}

.ip-mab-cta-name .global-accent-vertical-line:before {
   top: initial;
   bottom: 0;
   height: 21px;
}

.ip-mab-cta-monogram {
   position: absolute;
   right: 13px;
   opacity: 0.3;
   width: 130px;
   width: 20.345%;
   bottom: 0;
   right: 2%;
   z-index: 1;
   opacity: 0;
   -webkit-transition: 0.3s all ease-in-out;
   transition: 0.3s all ease-in-out;
}

.ip-mab-cta-monogram img {
   display: block;
   width: 100%;
   height: auto;
}

.ip-mab-cta a:hover .ip-mab-cta-img canvas {
   filter: none;
}

.ip-mab-cta a:hover .ip-mab-cta-name span {
   opacity: 1;
   visibility: visible;
   height: 14px;
   margin-top: 8px;
}

.ip-mab-cta a:hover .ip-mab-cta-monogram {
   opacity: 0.3;
   bottom: 5.8%;
}

@media only screen and (min-width: 992px) {
   .global-title h1 {
       padding-bottom: 5.05vw;
   }

   #ip-marketing-and-branding {
       padding: 0 0 1.25vw;
   }

   .ip-mab-bg {
       height: 50.625vw;
   }

   .ip-mab-top {
       padding: 8.25vw 0 6.688vw;
   }

   .ip-mab-title .global-title i.dot {
       width: 0.75vw;
       height: 0.75vw;
       margin: 0 0.25vw;
   }

   .ip-mab-title .global-accent-line.is-left {
       top: 2vw;
   }

   .ip-mab-text {
       width: 43.688vw;
       padding: 0.438vw 0.188vw 0 0;
   }

   .ip-mab-text p {
       font-size: 1vw;
   }

   .ip-mab-cta-list {
       margin: 0 -0.438vw;
   }

   .ip-mab-cta {
       padding: 0.563vw;
   }

   .ip-mab-cta-name {
       font-size: 1.875vw;
   }

   .ip-mab-cta-name span {
       font-size: 0.875vw;
   }

   .ip-mab-cta a:hover .ip-mab-cta-name span {
       height: 0.875vw;
       margin-top: 0.500vw;
   }

   .ip-mab-cta-name .global-accent-vertical-line {
       bottom: 1.875vw;
   }

   .ip-mab-cta-name .global-accent-vertical-line:before {
       height: 1.313vw;
   }
}

@media only screen and (max-width: 991px) {
   .ip-mab-top {
       padding: 80px 0;
   }

   .ip-mab-bg {
       max-height: 100%;
   }

   .ip-mab-title {
       width: 100%;
       text-align: center;
       margin-bottom: 20px;
   }

   .ip-mab-text {
       width: 100%;
       text-align: center;
   }

   .ip-mab-cta {
       width: 100%;
   }

   .ip-mab-cta-name .global-accent-vertical-line {
       bottom: 20px;
   }

   .ip-mab-cta-name {
       padding: 0 6.5% 20px;
       font-size: 25px;
   }
}

@media only screen and (max-width: 767px) {
   .ip-mab-title .global-title i.dot {
       width: 10px;
       height: 10px;
       top: -4px;
       margin: 0;
   }
}

@media only screen and (max-width: 480px) {
   .ip-mab-cta-name span {
       font-size: 10px;
   }

   .ip-mab-cta a:hover .ip-mab-cta-name span {
       height: 10px;
   }
}