@charset "utf-8";
@import url('Serge-Added-Css.css');

/* CSS Document */

body {
    margin: 0 auto;
    padding: 0px;
    font-family: 'Work Sans', sans-serif;
}

a:hover {
    text-decoration: none;
}

ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

h1 {
    font-size: 35px;
    font-family: 'Work Sans', sans-serif;
}

h2 {
    font-size: 18px;
    font-family: 'Work Sans', sans-serif;
    font-weight: 400;
}

p,
span,
li,
ul {
    font-family: 'Work Sans', sans-serif;
}

.colr-black {
    color: #124559 !important;
    font-weight: 300;
}

.colr-yellow {
    background-color: #f9b348 !important;
}

a:hover {
    text-decoration: none !important;
}

.nopadding {
    padding: 0px !important;
}

.txt-centr {
    text-align: center;
}


/* header css starts */

.container {
    width: 1029px !important;
}

#topheader .container {
    width: 1029px !important;
}

#topheader {
    background-color: #124559;
    width: 100%;
    height: 80px;
}

#topheader .navbar-inverse {
    display: inline-block;
    background-color: transparent;
    border-color: transparent;
    margin-bottom: 0px;
    border: 0px;
}

.logo-footer img {
    max-width: 241px;
}

.logo {
    display: inline-block;
    position: absolute;
}

.navbar-inverse .navbar-nav>.active>a,
.navbar-inverse .navbar-nav>.active>a:focus,
.navbar-inverse .navbar-nav>.active>a:hover {
    background-color: #fff !important;
    color: #f15a24 !important;
}

.navbar-brand {
    padding: 0 !important;
}

#topheader .navbar-nav>li>a {
    padding: 30px 17px !important;
    text-transform: uppercase;
    color: #fff;
    font-size: 13px;
    font-family: "Open Sans";
    font-weight: bold;
}

.logo img {
    float: right;
}

#services-home .heading {
    position: relative;
    text-align: center;
    margin-bottom: 60px;
}

#services-home .heading h2 {
    font-size: 18px;
    color: #124559;
    position: relative;
    background: #fff;
    display: inline-block;
    z-index: 1;
    padding: 0 30px;
    margin: 0;
    text-transform: uppercase;
    font-weight: 300;
}

#services-home .heading:before {
    content: "";
    border-bottom: 2px solid #808080;
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    margin-top: -3px;
    z-index: 0;
}

.navbar-inverse .navbar-nav>.active>a,
.navbar-inverse .navbar-nav>.active>a:focus,
.navbar-inverse .navbar-nav>.active>a:hover {
    background-color: #fff !important;
    color: #f15a24 !important;
}

#topheader .navbar-nav>li>a {
    padding: 30px 17px !important;
    text-transform: uppercase;
    color: #fff;
    font-size: 13px;
    font-family: "Open Sans";
    font-weight: bold;
}

.maclogo {
    max-height: 80px;
}

.logo img {
    float: right;
}

.logo {
    background-color: #f15a24;
}

#banner {
    padding: 30px 0 35px;
    position: relative;
    background-color: #f15a24;
    z-index: -1;
}

#banner:before {
    content: '';
    position: absolute;
    left: 0;
    top: 58%;
    overflow: visible;
    width: 100%;
    height: 500px;
    background: #f9b348;
    z-index: -1;
    -webkit-transform: skewY(-16deg);
    -moz-transform: skewY(-16deg);
    -ms-transform: skewY(-16deg);
    -o-transform: skewY(-16deg);
    transform: skewY(-16deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: initial;
}

#banner .container {
    width: 1125px;
    padding: 0px;
    margin: 0px auto;
}

#banner h1 {
    padding: 15px 63px;
    display: inline-block;
    border-radius: 42px;
    font-family: 'Work Sans', sans-serif;
    font-weight: bold;
    background-color: #f2f2f2;
    color: #124559;
    -webkit-box-shadow: 5px 9px 0px -4px rgba(204, 204, 204, 1);
    -moz-box-shadow: 5px 9px 0px -4px rgba(204, 204, 204, 1);
    box-shadow: 5px 9px 0px -4px rgba(204, 204, 204, 1);
}

#banner font {
    color: #f15a24;
}

#banner span {
    color: #fff;
    font-size: 29px;
    letter-spacing: 1px;
    font-weight: 100;
    font-family: 'Work Sans', sans-serif;
    display: block;
    padding-left: 61px;
    padding-top: 19px;
    line-height: 31px;
    padding-right: 222px;
}

.banner .image {
    margin-left: -74%;
    margin-top: 35px;
}

#bannerhero .col-md-3 {
    text-align: center;
}

#logos-sec {
    background-color: #54bcab;
}

.common-heading h2 {
    font-family: 'Work Sans', sans-serif;
    font-size: 18px;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    margin: -21px auto 43px;
    background-color: #54bcab;
    z-index: 1;
    position: relative;
    width: 38%;
}


/*.common-heading h2:before{content: "";  width: 26%;  height: 1px;  background-color: #fff;  display: inline-block;
left: 120px;  margin: 10px auto;  position: absolute; }*/

.common-heading:before {
    content: "";
    width: 100%;
    height: 1px;
    background-color: #fff;
    display: inline-block;
    margin: 10px auto;
}

#bannerhero {
    background: #f15a24;
    background: linear-gradient( 163deg, #f15a24 0%, #f15a24 50%, #f9b348 50.05%, #f9b348 100%);
    padding-top: 70px;
    padding-bottom: 70px;
    overflow: hidden;
}

#bannerhero h1 {
    padding: 15px 40px;
    display: inline-block;
    border-radius: 42px;
    font-family: 'Work Sans', sans-serif;
    font-weight: bold;
    background-color: #f2f2f2;
    color: #124559;
    -webkit-box-shadow: 5px 9px 0px -4px rgb(204 204 204);
    -moz-box-shadow: 5px 9px 0px -4px rgba(204, 204, 204, 1);
    box-shadow: 5px 9px 0px -4px rgb(204 204 204);
}

#bannerhero span {
    color: #ffffff;
    text-shadow: 1px 1px 1px #124559;
    font-size: 29px;
    letter-spacing: 1px;
    font-weight: 100;
    font-family: 'Work Sans', sans-serif;
    display: block;
    padding-top: 19px;
    padding-left: 40px;
    padding-right: 40px;
    line-height: 31px;
}

#bannerhero span b {
    white-space: nowrap;
}

#bannerhero button {
    background-color: #124559;
    width: 250px;
    height: 46px;
    margin: 40px;
    border: none;
    font-family: "Work Sans", sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
}

.banner_container {
    max-width: 700px;
    width: 100%;
    max-width: 90%;
}

.colr-black {
    color: #124559 !important;
    font-weight: 300;
}

.colr-yellow {
    background-color: #f9b348 !important;
}

.nopadding {
    padding: 0px !important;
}

.txt-centr {
    text-align: center;
}

#sec-areas .common-heading h2 {
    width: 48%;
    font-weight: 300;
}

#sec-areas .contactsec h2 {
    width: 28%;
}

#sec-box {
    background-color: #f9b348;
    display: inline-block;
    width: 100%;
    padding: 20px 0;
}

#sec-box .common-heading h2,
#sec-box1 .common-heading h2 {
    background-color: #f9b348;
}

#sec-box h3 {
    color: #124559;
    font-size: 24px;
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    margin: 48px 0 50px;
    line-height: 30px;
}

#sec-box .common-heading h2:before,
#sec-box .common-heading h2:after {
    background-color: #124559;
}

#sec-box1 .common-heading h2:before,
#sec-box1 .common-heading h2:after {
    background-color: #124559;
}

.box {
    text-align: center;
    margin: 0px;
    padding: 25px 0;
    border: 1px solid transparent;
}

.box p {
    color: #124559;
    line-height: 23px;
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
    margin: 25px 0px 0;
    font-size: 15px;
    min-height: 106px;
}

.box button {
    background-color: #f15a24;
    width: 191px;
    height: 46px;
    border: none;
    font-family: 'Work Sans', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
}

#sec-areas .common-heading h2:before,
#sec-areas .common-heading h2:after {
    width: 20%;
}

.icon {
    min-height: 113px;
    display: inline-block;
}

#sec-box1 {
    display: inline-block;
    padding-top: 30px;
    width: 100%;
    position: relative;
    background-color: #fab349;
}

#sec-box1 .common-heading {
    margin: 0px;
}

.expert-sec-box ul li {
    display: inline-block;
    width: 16%;
    vertical-align: top;
    margin-left: 25px;
}

.contactsec h2:before,
.contactsec h2:after {
    width: 30% !important;
}

.expert-sec-box {
    position: relative;
    z-index: 1000;
    padding-bottom: 35px;
    margin-top: 30px;
}

.expert-sec-box:before {
    content: '';
    position: absolute;
    left: 0;
    top: 61%;
    overflow: visible;
    width: 100%;
    height: 523px;
    background: #f15a25;
    z-index: -1;
    -webkit-transform: skewY(15deg);
    -moz-transform: skewY(15deg);
    -ms-transform: skewY(15deg);
    -o-transform: skewY(15deg);
    transform: skewY(15deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: initial;
}

.expert-sec-box ul li:nth-child(2) {
    margin-top: 51px;
}

.expert-sec-box ul li:nth-child(3) {
    margin-top: 102px;
}

.expert-sec-box ul li:nth-child(4) {
    margin-top: 154px;
}

.expert-sec-box ul li:nth-child(5) {
    margin-top: 207px;
}

.right-img img {
    margin-left: -184px;
}

#expert-service {
    position: relative;
}

.right-img {
    position: absolute;
    top: -241px;
    z-index: 10000;
}

#sec-areas {
    display: inline-block;
    width: 100%;
    padding-bottom: 75px;
    z-index: 100000;
    position: relative;
}

.areas-icon {
    min-height: 101px;
}

.colr-green {
    background-color: #54bcab;
    text-align: center;
    padding: 30px 0px;
}

.colr-grey {
    background-color: #999999;
    text-align: center;
    padding: 30px 0px;
}

.colr-blue {
    background-color: #f15a25;
    text-align: center;
    padding: 30px 0px;
}

#sec-areas p {
    font-size: 14px;
    color: #ffffff;
    font-family: 'Work Sans', sans-serif;
    padding: 25px 26px 0;
}

#sec-areas ul li {
    min-height: 240px;
    float: left;
    width: 33%;
    position: relative;
}

.mycol {
    min-height: 265px;
    border: 4px solid #ffffff;
}

#sec-areas .areas-div .animation:after,
#sec-areas .areas-div .animation:before {
    position: absolute;
    content: '';
    opacity: 0;
}

#sec-areas .areas-div:hover .animation:after,
#sec-areas .areas-div:hover .animation:before {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

#sec-areas .areas-div .animation:before {
    top: 17px;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    right: 9px;
    bottom: 17px;
    left: 9px;
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}

#sec-areas .areas-div .animation:after {
    top: 5px;
    right: 19px;
    bottom: 5px;
    left: 19px;
    border-right: 2px solid #fff;
    border-left: 2px solid #fff;
    -webkit-transform: scale(1, 0);
    transform: scale(1, 0);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
}

.box:hover {
    background-color: #54bcab;
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    /* Firefox */
    -moz-transition: all 3s ease-in;
    /* WebKit */
    -webkit-transition: all 0.5s ease-in;
    /* Opera */
    -o-transition: all 0.5s ease-in;
    /* Standard */
    transition: all 0.5s ease-in;
}

.box:hover button {
    background-color: #124559;
    color: #fff;
    -moz-transition: all 3s ease-in;
    /* WebKit */
    -webkit-transition: all 0.5s ease-in;
    /* Opera */
    -o-transition: all 0.5s ease-in;
    /* Standard */
    transition: all 0.5s ease-in;
}


/*===apart section starts===*/

#apart-section {
    text-align: center;
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
    background-color: #f9b348;
    padding: 70px 0px 30px 0px
}

#apart-section .section-top {
    width: 100%;
    overflow: hidden;
    margin-bottom: 30px
}

#apart-section .section-top img {
    width: 100%;
}

#apart-section .col-md-4 {
    padding-top: 15px;
    padding-bottom: 15px;
    margin-bottom: 35px;
}

#apart-section .col-md-4:hover {
    background-color: #54bcab;
    -webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.15);
    -moz-transition: all 3s ease-in;
    -webkit-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;
}

#apart-section .col-md-4:hover .btn.btn-primary {
    background: #124559;
}

#apart-section .col-md-4 img {
    margin-bottom: 20px;
}

#apart-section .heading {
    margin-bottom: 60px;
}

#apart-section .heading h2 {
    background: #f9b348;
}

#apart-section .col-md-4 p {
    min-height: 83px;
}

#apart-section .col-md-4 img {
    min-height: 113px;
}


/*===apart section ends//===*/


/*===services home section starts===*/

#services-home {
    position: relative;
    margin: 60px auto;
}

#services-home ul {
    font-size: 24px;
    line-height: 1.5em;
    text-transform: uppercase;
    color: #124559;
    font-weight: 900;
    text-align: center;
    list-style: none;
    padding: 0px;
}

#services-home li {
    margin-bottom: 10px;
}

#services-home p {
    text-align: center;
    margin-bottom: 30px
}

#services-home .row {
    overflow: hidden;
}

#services-home .row:last-child {
    margin-bottom: 0;
}


/*===services home section ends//===*/

.colr-black {
    color: #124559 !important;
    font-weight: 300;
}

.colr-yellow {
    background-color: #f9b348 !important;
}

.nopadding {
    padding: 0px !important;
}

.txt-centr {
    text-align: center;
}

#sec-areas .common-heading h2 {
    width: 48%;
    font-weight: 300;
}

#sec-areas .contactsec h2 {
    width: 28%;
}

#sec-box {
    background-color: #f9b348;
    display: inline-block;
    width: 100%;
    padding: 20px 0;
}

#sec-box .common-heading h2,
#sec-box1 .common-heading h2 {
    background-color: #f9b348;
}

#sec-box h3 {
    color: #124559;
    font-size: 24px;
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    margin: 48px 0 50px;
    line-height: 30px;
}

#sec-box .common-heading h2:before,
#sec-box .common-heading h2:after {
    background-color: #124559;
}

#sec-box1 .common-heading h2:before,
#sec-box1 .common-heading h2:after {
    background-color: #124559;
}

.box {
    text-align: center;
    margin: 0px;
    padding: 25px 0;
    border: 1px solid transparent;
}

.box p {
    color: #124559;
    line-height: 23px;
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
    margin: 25px 0px 0;
    font-size: 15px;
    min-height: 106px;
}

.box button {
    background-color: #f15a24;
    width: 191px;
    height: 46px;
    border: none;
    font-family: 'Work Sans', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
}

#sec-areas .common-heading h2:before,
#sec-areas .common-heading h2:after {
    width: 20%;
}

.icon {
    min-height: 113px;
    display: inline-block;
}

#sec-box1 {
    display: inline-block;
    padding-top: 30px;
    width: 100%;
    position: relative;
    background-color: #fab349;
}

#sec-box1 .common-heading {
    margin: 0px;
}

.expert-sec-box ul li {
    display: inline-block;
    width: 16%;
    vertical-align: top;
    margin-left: 25px;
}

.contactsec h2:before,
.contactsec h2:after {
    width: 30% !important;
}

.expert-sec-box {
    position: relative;
    z-index: 1000;
    padding-bottom: 35px;
    margin-top: 30px;
}

.expert-sec-box:before {
    content: '';
    position: absolute;
    left: 0;
    top: 61%;
    overflow: visible;
    width: 100%;
    height: 523px;
    background: #f15a25;
    z-index: -1;
    -webkit-transform: skewY(15deg);
    -moz-transform: skewY(15deg);
    -ms-transform: skewY(15deg);
    -o-transform: skewY(15deg);
    transform: skewY(15deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: initial;
}

.expert-sec-box ul li:nth-child(2) {
    margin-top: 51px;
}

.expert-sec-box ul li:nth-child(3) {
    margin-top: 102px;
}

.expert-sec-box ul li:nth-child(4) {
    margin-top: 154px;
}

.expert-sec-box ul li:nth-child(5) {
    margin-top: 207px;
}

.right-img img {
    margin-left: -184px;
}

#expert-service {
    position: relative;
}

.right-img {
    position: absolute;
    top: -241px;
    z-index: 10000;
}

#sec-areas {
    display: inline-block;
    width: 100%;
    padding-bottom: 75px;
    z-index: 100000;
    position: relative;
}

.areas-icon {
    min-height: 101px;
}

.colr-green {
    background-color: #54bcab;
    text-align: center;
    padding: 30px 0px;
}

.colr-grey {
    background-color: #999999;
    text-align: center;
    padding: 30px 0px;
}

.colr-blue {
    background-color: #f15a25;
    text-align: center;
    padding: 30px 0px;
}

#sec-areas p {
    font-size: 14px;
    color: #ffffff;
    font-family: 'Work Sans', sans-serif;
    padding: 25px 26px 0;
}

#sec-areas ul li {
    min-height: 240px;
    float: left;
    width: 33%;
    position: relative;
}

.mycol {
    min-height: 265px;
    border: 4px solid #ffffff;
}

#sec-areas .areas-div .animation:after,
#sec-areas .areas-div .animation:before {
    position: absolute;
    content: '';
    opacity: 0;
}

#sec-areas .areas-div:hover .animation:after,
#sec-areas .areas-div:hover .animation:before {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

#sec-areas .areas-div .animation:before {
    top: 17px;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    right: 9px;
    bottom: 17px;
    left: 9px;
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}

#sec-areas .areas-div .animation:after {
    top: 5px;
    right: 19px;
    bottom: 5px;
    left: 19px;
    border-right: 2px solid #fff;
    border-left: 2px solid #fff;
    -webkit-transform: scale(1, 0);
    transform: scale(1, 0);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
}

.box:hover {
    background-color: #54bcab;
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    /* Firefox */
    -moz-transition: all 3s ease-in;
    /* WebKit */
    -webkit-transition: all 0.5s ease-in;
    /* Opera */
    -o-transition: all 0.5s ease-in;
    /* Standard */
    transition: all 0.5s ease-in;
}

.box:hover button {
    background-color: #124559;
    color: #fff;
    -moz-transition: all 3s ease-in;
    /* WebKit */
    -webkit-transition: all 0.5s ease-in;
    /* Opera */
    -o-transition: all 0.5s ease-in;
    /* Standard */
    transition: all 0.5s ease-in;
}


/*===apart section starts===*/

#apart-section {
    text-align: center;
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
    background-color: #f9b348;
    padding: 70px 0px 30px 0px
}

#apart-section .section-top {
    width: 100%;
    overflow: hidden;
    margin-bottom: 30px
}

#apart-section .section-top img {
    width: 100%;
}

#apart-section .col-md-4 {
    padding-top: 15px;
    padding-bottom: 15px;
    margin-bottom: 35px;
}

#apart-section .col-md-4:hover {
    background-color: #54bcab;
    -webkit-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.15);
    -moz-box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 0px 13px 0px rgba(0, 0, 0, 0.15);
    -moz-transition: all 3s ease-in;
    -webkit-transition: all 0.5s ease-in;
    -o-transition: all 0.5s ease-in;
    transition: all 0.5s ease-in;
}

#apart-section .col-md-4:hover .btn.btn-primary {
    background: #124559;
}

#apart-section .col-md-4 img {
    margin-bottom: 20px;
}

#apart-section .heading {
    margin-bottom: 60px;
}

#apart-section .heading h2 {
    background: #f9b348;
}

#apart-section .col-md-4 p {
    min-height: 83px;
}

#apart-section .col-md-4 img {
    min-height: 113px;
}


/*===apart section ends//===*/

.toppad {
    padding-top: 75px;
    padding-bottom: 75px;
}

#sec-box h3 {
    color: #124559;
    font-family: 'Work Sans', sans-serif;
    line-height: 29px;
    font-weight: 600;
}

#sec-box .common-heading:before,
#sec-box1 .common-heading:before {
    background-color: #000;
}

#logos-sec .common-heading {
    margin: 33px 0;
}

#logos-sec ul {
    margin: 25px 0;
    padding: 0;
    text-align: center;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
}

#logos-sec ul li {
    display: inline-block;
    text-align: center;
    min-width: 50px;
    width: 25%;
    padding: 20px;
    margin-bottom: 10px;
    margin: 0 auto;
}

.logos-gallery li img {
    width: 85%;
    max-width: 200px;
}


/* Adobe badge */

.adobeBadge {
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.adobeBadgeImg {
    width: 180px;
    margin: 20px 0px 0px 39px;
}

.adobeBadgeImg img {
    width: 100%;
}


/* -- end of Adobe badge */

#sec-areas .common-heading h2 {
    background-color: #f15a25;
    width: 48%;
    font-weight: 300;
}

#sec-areas .contactsec h2 {
    width: 28%;
}

#sec-box {
    background-color: #f9b348;
    display: inline-block;
    width: 100%;
    padding: 20px 0;
}

#sec-box .common-heading h2,
#sec-box1 .common-heading h2 {
    background-color: #f9b348;
}

#sec-box h3 {
    color: #124559;
    font-size: 24px;
    font-family: 'Work Sans', sans-serif;
    font-weight: 600;
    margin: 48px 0 50px;
    line-height: 30px;
}

#sec-box .common-heading h2:before,
#sec-box .common-heading h2:after {
    background-color: #124559;
}

#sec-box1 .common-heading h2:before,
#sec-box1 .common-heading h2:after {
    background-color: #124559;
}

.box {
    text-align: center;
    margin: 0px;
    padding: 25px 0;
    border: 1px solid transparent;
}

.box p {
    color: #124559;
    font-family: 'Work Sans', sans-serif;
    font-weight: 500;
    margin: 25px 0px 0;
    font-size: 16px;
    min-height: 106px;
}

.box button {
    background-color: #f15a24;
    width: 191px;
    height: 46px;
    border: none;
    font-family: 'Work Sans', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    text-transform: uppercase;
}

#sec-areas .common-heading h2:before,
#sec-areas .common-heading h2:after {
    width: 20%;
}

.icon {
    min-height: 113px;
    display: inline-block;
}

#sec-box1 {
    display: inline-block;
    padding-top: 30px;
    width: 100%;
    position: relative;
    background-color: #fab349;
}

#sec-box1 .common-heading {
    margin: 0px;
}

.expert-sec-box ul li {
    display: inline-block;
    width: 16%;
    vertical-align: top;
    margin-left: 25px;
}

.contactsec h2:before,
.contactsec h2:after {
    width: 30% !important;
}

.expert-sec-box {
    position: relative;
    z-index: 1000;
    padding-bottom: 35px;
    margin-top: 30px;
}

.expert-sec-box:before {
    content: '';
    position: absolute;
    left: 0;
    top: 61%;
    overflow: visible;
    width: 100%;
    height: 523px;
    background: #f15a25;
    z-index: -1;
    -webkit-transform: skewY(15deg);
    -moz-transform: skewY(15deg);
    -ms-transform: skewY(15deg);
    -o-transform: skewY(15deg);
    transform: skewY(15deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: initial;
}

.expert-sec-box ul li:nth-child(2) {
    margin-top: 51px;
}

.expert-sec-box ul li:nth-child(3) {
    margin-top: 102px;
}

.expert-sec-box ul li:nth-child(4) {
    margin-top: 154px;
}

.expert-sec-box ul li:nth-child(5) {
    margin-top: 207px;
}

.right-img img {
    margin-left: -184px;
}

#expert-service {
    position: relative;
}

.right-img {
    position: absolute;
    top: -241px;
    z-index: 10000;
}

#sec-areas {
    background-color: #f15a25;
    display: inline-block;
    width: 100%;
    padding-bottom: 75px;
    z-index: 100000;
    position: relative;
}

.areas-icon {
    min-height: 101px;
}

.common-heading {
    margin: 58px 0 75px;
}

.colr-yellow {
    background-color: #f9b348;
    text-align: center;
    padding: 30px 0px;
}

.padding-btm {
    padding-bottom: 75px;
    z-index: 1000000;
    position: relative;
}

.colr-grey {
    background-color: #999999;
    text-align: center;
    padding: 30px 0px;
}

.colr-drk-grey {
    background-color: #808080;
    text-align: center;
    padding: 30px 0px;
}

.colr-green {
    background-color: #54bcab;
    text-align: center;
    padding: 30px 0px;
}

#sec-areas p {
    font-size: 16px;
    color: #fff;
    font-family: 'Work Sans', sans-serif;
    padding: 25px 26px 0;
}

#sec-areas ul li {
    min-height: 240px;
    float: left;
    width: 33%;
    position: relative;
}

input[type="text"],
input[type="email"] {
    width: 100%;
    font-family: 'Work Sans', sans-serif;
    margin-bottom: 35px;
    height: 50px;
    border: 0;
    padding: 0 15px;
    color: #000;
    font-size: 16px;
    font-weight: normal;
}

input[type="submit"] {
    text-align: center;
    margin: 0 auto;
    display: block;
    padding: 10px 62px;
    font-size: 16px;
    color: #fff;
    background-color: #54bcab;
    border: 0;
    text-transform: uppercase;
    font-family: 'Work Sans', sans-serif;
}

#footer {
    background-color: #124559;
    padding-top: 84px;
    color: #fff;
    position: relative;
    z-index: 10000;
}

.right-footer-sec .col-md-8 .col-md-4 {
    padding-left: 0;
}

.right-footer-sec .col-md-8 .col-md-4:nth-child(1n+2) {
    margin-top: 4px;
}

#footer a {
    color: #fff;
    font-size: 13px;
    letter-spacing: 0.3px;
    line-height: 18px;
}

#footer a:hover {
    color: #f15a25;
}

#footer p {
    font-size: 15px;
    letter-spacing: 0.2px;
    line-height: 22px;
}

.logo-footer {
    margin-bottom: 25px;
}

.left-footer {
    display: inline-block;
    float: left;
    margin-top: -41px;
}

.right-footer {
    display: inline-block;
    float: right;
    padding-top: 25px;
    margin-right: 36px;
    margin-top: -41px;
}

#footer ul li {
    color: #fff;
    margin-bottom: 2px;
    font-size: 13px;
}

#footer span {
    margin-bottom: 13px;
    font-size: 16px;
    font-weight: bold;
    display: inline-block;
    margin-top: 9px;
}

.getintouch-sec {
    display: block;
}

.slanted-bottom {
    position: relative;
    z-index: 10000;
    height: 60px;
    margin-top: -2px;
    background-color: #124559;
}


/*.inner-div{   background-color: #0071BC;position:absolute; bottom:0;

  transform-origin: 60px;
  transform: skewY(16deg);
 -webkit-transform: skewY(16deg);width: 27%;
    height: 97px;}*/

.triangle {
    fill: #f9b348;
    left: 0;
    display: inline-block;
    width: 490px;
    height: 84px;
    position: absolute;
    bottom: 0;
}

#bottom {
    display: none;
}

#topheader .navbar-nav>li>a:hover {
    background-color: #fff;
    color: red;
}

#sec-areas .areas-div .animation:after,
#sec-areas .areas-div .animation:before {
    position: absolute;
    content: '';
    opacity: 0;
}

#sec-areas .areas-div:hover .animation:after,
#sec-areas .areas-div:hover .animation:before {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

#sec-areas .areas-div .animation:before {
    top: 17px;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    right: 9px;
    bottom: 17px;
    left: 9px;
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: scale(0, 1);
    transform: scale(0, 1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
}

#sec-areas .areas-div .animation:after {
    top: 5px;
    right: 19px;
    bottom: 5px;
    left: 19px;
    border-right: 2px solid #fff;
    border-left: 2px solid #fff;
    -webkit-transform: scale(1, 0);
    transform: scale(1, 0);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
}

.box:hover {
    background-color: #54bcab;
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    /* Firefox */
    -moz-transition: all 3s ease-in;
    /* WebKit */
    -webkit-transition: all 0.5s ease-in;
    /* Opera */
    -o-transition: all 0.5s ease-in;
    /* Standard */
    transition: all 0.5s ease-in;
}

.box:hover button {
    background-color: #124559;
    color: #fff;
    -moz-transition: all 3s ease-in;
    /* WebKit */
    -webkit-transition: all 0.5s ease-in;
    /* Opera */
    -o-transition: all 0.5s ease-in;
    /* Standard */
    transition: all 0.5s ease-in;
}


/* pricing css strats */

.title-box {
    width: 380px;
    margin-top: -30px;
    display: inline-block;
    position: relative;
    margin-left: 53px;
}

.title-box:before {
    background: url(../images/title-line.png) no-repeat;
    display: block;
    position: absolute;
    left: 0px;
    top: 0;
    content: "";
    width: 19px;
    height: 92px;
    background-size: cover;
    background-position: center;
    margin-left: 0px;
}

.title-box:after {
    background: url(../images/title-line.png) no-repeat;
    position: absolute;
    right: 93px;
    top: 0;
    display: inline-block;
    content: "";
    width: 19px;
    height: 92px;
    background-size: cover;
    background-position: center;
}

.title-box h1 {
    background-color: #124559 !important;
    margin: -6px 0;
    letter-spacing: 1px;
    margin-top: 92px;
    font-weight: bold !important;
    padding: 6px 48px !important;
    font-size: 79px !important;
    text-transform: uppercase;
    color: #fff !important;
    border-radius: 0px !important;
    -webkit-box-shadow: 7px 8px 0px -1px rgb(197, 147, 72, 1) !important;
    -moz-box-shadow: 7px 8px 0px -1px rgb(197, 147, 72, 1) !important;
    box-shadow: 7px 8px 0px -1px rgb(199, 143, 98) !important;
}

.pricing-banner {
    padding: 30px 0 81px !important;
    position: relative;
    background-color: #f9b348 !important;
    z-index: -1;
}

.pricing-banner:before {
    content: '';
    position: absolute;
    left: 0;
    top: 58%;
    overflow: visible;
    width: 100%;
    height: 500px;
    background: #f15a24 !important;
    z-index: -1;
    -webkit-transform: skewY(-16deg);
    -moz-transform: skewY(-16deg);
    -ms-transform: skewY(-16deg);
    -o-transform: skewY(-16deg);
    transform: skewY(-16deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: initial;
}

.pricing-banner .image {
    margin-left: -91%;
    margin-top: 16px;
}


/*billing-sec strats*/

#billing-sec {
    background-color: #f15a24;
    position: relative;
    z-index: 2
}

#billing-sec .common-heading {
    margin-top: -11px;
    margin-bottom: -9px;
    display: inline-block;
    width: 100%;
}

#billing-sec .common-heading h2 {
    background-color: #f15a24;
    font-weight: 200;
    font-size: 20px;
}

.billing-box {
    padding: 27px;
    background-color: #54bcab;
    border-top: 10px solid #1b998b;
}

.billing-box .billing-icon {
    text-align: center;
}

.billing-box span,
.billing-box h5 {
    color: #124559;
    font-weight: bold;
    display: inline-block;
    font-size: 16px;
}

.billing-box p {
    font-size: 16px;
    color: #fff;
    text-align: center;
    padding: 23px 33px;
}

.billing-box a {
    background-color: #f15a24;
    font-weight: bold;
    font-size: 18px;
    font-family: 'Work Sans', sans-serif;
    width: 212px;
    display: block;
    margin: 0 auto;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    padding: 10px 0;
}

.billing-box a:hover,
.packages-box a:hover {
    background-color: #124559;
    color: #fff;
    -webkit-transition: all 0.5s ease-in;
    /* Opera */
    -o-transition: all 0.5s ease-in;
    /* Standard */
    transition: all 0.5s ease-in;
}

#packages-heading .common-heading {
    margin: 58px 0 0px;
}

#packages-heading,
#packages-heading .common-heading h2 {
    background-color: #f15a24;
    padding-bottom: 0px;
    font-weight: 300;
}

.colr-yellow .common-heading {
    margin: 38px auto 0px!important;
}

#packages-sec {
    position: relative;
    z-index: 1;
    background-color: #f15a24;
}

#packages-sec:before {
    content: '';
    position: absolute;
    left: 0;
    top: 58%;
    overflow: visible;
    width: 100%;
    height: 500px;
    background: #f9b348 !important;
    z-index: -1;
    -webkit-transform: skewY(16deg);
    -moz-transform: skewY(16deg);
    -ms-transform: skewY(16deg);
    -o-transform: skewY(16deg);
    transform: skewY(16deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: initial;
}

.packages-box {
    background-color: #54bcab;
    padding: 9px 18px 28px;
    border-top: 10px solid #1b998b;
    color: #fff;
    text-align: center;
}

.packages-box h2 {
    font-size: 16px;
    font-weight: 200;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 2px;
    line-height: 24px;
    margin-bottom: 25px;
}

.packages-box span,
.packages-box h5 {
    color: #124559 !important;
    font-weight: bold;
    display: inline-block;
    font-size: 16px;
}

.packages-box p {
    font-size: 16px;
    font-family: 'Work Sans', sans-serif;
    margin-top: 25px;
    font-weight: 400;
}

.packages-box a {
    background-color: #f15a24;
    font-weight: bold;
    font-size: 18px;
    font-family: 'Work Sans', sans-serif;
    display: block;
    margin: 20px auto 0;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    padding: 10px 0;
}

.package-icon {
    min-height: 110px;
}

.colr-yellow .common-heading h2 {
    background-color: #f9b348 !important;
    width: 50% !important;
    font-weight: 200;
    font-size: 20px;
}


/*About Us Css*/

.about-us-banner {
    height: 465px;
    background-color: #54bbaa !important
}

.about-us-banner:before {
    top: 54% !important;
    webkit-transform: skewY(16deg) !important;
    -moz-transform: skewY(18deg) !important;
    -ms-transform: skewY(18deg) !important;
    -o-transform: skewY(18deg) !important;
    transform: skewY(18deg) !important;
}

.image-left {
    vertical-align: top;
    display: inline-block;
    margin-top: -9px;
    margin-left: 43px;
}

.about-us-title {
    width: 93%;
    float: right;
}

.about-us-title h1 {
    float: right;
    letter-spacing: 3px;
    padding: 0 34px !important;
    line-height: 80px;
    margin-right: 5px;
    -webkit-box-shadow: 7px 8px 0px -1px rgb(197, 147, 72, 1) !important;
    -moz-box-shadow: 7px 8px 0px -1px rgb(197, 147, 72, 1) !important;
    box-shadow: 7px 8px 0px -1px rgb(67, 150, 136) !important;
    margin-top: 83px;
    z-index: 1000;
    position: relative;
}

.about-us-title:after {
    right: 0;
}

.about-us-title:before {
    left: 55%;
}

#four-sections {
    position: relative;
    z-index: 1;
    padding-top: 0px;
    background: #f9b348;
    text-align: center;
}

.section1 .icon {
    min-height: 101px;
}

.section1 p {
    font-family: 'Work Sans', sans-serif;
    min-height: 66px;
    color: #fff;
    font-size: 16px;
    margin-top: 15px;
}

.section1 {
    background-color: #f05a24;
    border-top: 8px solid #d24e24;
    padding: 35px 15px;
}

#g2 {
    padding-top: 100px;
    padding-bottom: 75px;
    text-align: center;
    position: relative;
    margin: 0 auto
}

#bubble {
    position: relative;
}

#bubble:after {
    content: '';
    background: url(http://www.easywebdesignsolutions.com/marketingautomation/images/G2-Reviews-08.png) no-repeat;
    width: 100px;
    height: 67px;
    position: absolute;
    background-size: 100%;
    right: 40px;
}

.rating img {
    position: absolute;
    left: 3em;
    top: 120px;
    max-width: 100%
}

.quotebubble {
    position: relative;
    z-index: 1;
    background: #ffffff;
    border-radius: 20px;
    background-image: url(http://www.easywebdesignsolutions.com/marketingautomation/images/G2-Reviews-07.png);
    background-size: auto;
    background-repeat: no-repeat;
    background-position: top left
}

.quotebubble .col-sm-8 {
    min-height: 420px
}

.mobilebubble {
    margin-bottom: 35px
}

.mystars {
    clear: both;
    width: 100%;
    text-align: left;
}

.star {
    font-family: 'Work Sans', Arial, sans-serif;
    display: inline-block;
    text-align: left;
    margin-top: 35px;
    color: #124559
}

.star p {
    margin-top: 5px
}

.smalllogo {
    display: inline-block;
    float: right;
}

.review p {
    color: #124559
}

.review h2 {
    color: #1b988a;
    font-weight: bold;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    /* number of lines to show */
    -webkit-box-orient: vertical;
}

.review a {
    color: #54bbaa;
    font-weight: bold;
    text-decoration: none;
}

#seeall {
    margin: 0 auto;
    background-color: #f9b348;
    text-align: center;
}

#g2 h3 {
    font-size: 13px;
    font-weight: 300;
    margin-top: 5px;
    line-height: 1.35em;
}

#press-sec {
    position: relative;
    z-index: 1;
    text-align: center;
    padding-top: 34px;
    padding-bottom: 50px;
}

#press-sec .common-heading h2 {
    width: 20% !important;
}

#press-sec .icon {
    margin-top: 27px;
}

#press-sec ul {
    width: 51%;
    margin: 0 auto;
}

#press-sec ul li {
    margin-bottom: 24px;
}

#press-sec ul li a {
    font-weight: bold;
    color: #124559;
    letter-spacing: 0.5;
    font-size: 16px;
    font-family: 'Work Sans', sans-serif;
}

#press-sec ul li a:hover {
    color: #f05a24;
}

#press-sec ul li:after {
    width: 0;
    content: '';
    display: inline-block;
    margin-left: 10px;
    height: 0;
    border-top: 4px solid transparent;
    border-left: 7px solid #f05a24;
    border-bottom: 4px solid transparent;
}

#team-section {
    background-color: #54bbaa;
    padding-bottom: 41px;
}

#team-section .common-heading {
    margin: 68px 0 75px;
}

#team-section .common-heading h2 {
    font-weight: 300
}

.team-image {
    text-align: center;
}

.team1 h3 {
    font-size: 16px;
    font-family: 'Work Sans', sans-serif;
    font-weight: bold;
    color: #fff;
    text-align: center
}

.team1 p {
    text-align: center;
    font-size: 16px;
    color: #fff;
    margin-bottom: 30px;
}


/*What We do starts */

.what-we-do-banner {
    z-index: 1 !important;
    height: 465px;
    background-color: #f05a24 !important
}

.what-we-do-banner:before {
    top: 55% !important;
    background-color: #54bbaa !important;
    webkit-transform: skewY(16deg) !important;
    -moz-transform: skewY(17deg) !important;
    -ms-transform: skewY(17deg) !important;
    -o-transform: skewY(17deg) !important;
    transform: skewY(17deg) !important;
}

.image-left {
    vertical-align: top;
    display: inline-block;
    margin-top: -9px;
    margin-left: 43px;
}

.what-we-do-title {
    width: 100%;
    float: right;
}

.what-we-do-title h1 {
    float: right;
    letter-spacing: 1px;
    padding: 6px 48px !important;
    line-height: 80px;
    margin-right: 5px;
    -webkit-box-shadow: 7px 8px 0px -1px rgb(192, 72, 29, 1) !important;
    -moz-box-shadow: 7px 8px 0px -1px rgb(192, 72, 29, 1) !important;
    box-shadow: 7px 8px 0px -1px rgb(192, 72, 29) !important;
    margin-top: 65px;
    z-index: 1000;
    position: relative;
}

.what-we-do-title:after {
    right: 0;
    height: 77px;
}

.what-we-do-title:before {
    left: 55%;
    height: 77px;
}

.what-we-do-banner .image-left {
    margin-top: -4px;
    margin-left: 32px;
}

#text-sec {
    position: relative;
    background-color: #54bbaa;
    color: #fff;
    font-size: 16px;
    z-index: 2;
}

#text-sec span {
    color: #124559;
    font-weight: bold;
}

#text-sec p {
    margin-bottom: 30px;
    font-family: 'Work Sans', sans-serif;
    font-size: 16px;
}

.middle-boxes {
    text-align: center;
    margin-top: 4px;
    margin-bottom: 22px;
}

.bottom-box {
    background-color: #1b988a;
    padding: 33px 19px;
    margin-top: 10px;
    min-height: 199px;
}

.bottom-box p {
    margin-bottom: 0px !important;
    color: #fff;
    font-size: 16px;
}

#banner .middle .container {
    width: 1029px !important;
}

.middle {
    position: relative!important;
    background-color: #54bbaa !important;
    z-index: 10000 !important
}

.middle:before {
    top: 45% !important;
    height: 100% !important;
    background-color: #f9b348 !important;
    webkit-transform: skewY(-17deg) !important;
    -moz-transform: skewY(-18deg) !important;
    -ms-transform: skewY(-18deg) !important;
    -o-transform: skewY(-18deg) !important;
    transform: skewY(-18deg) !important;
}

.certified-service {
    background-color: #f8b248 !important;
    position: relative;
    padding-bottom: 72px;
    z-index: 10000;
}

.certified-service .common-heading h2 {
    width: 42%;
    background-color: #f9b348;
}

.certified-service .common-heading:before {
    background-color: #124559;
    height: 2px;
}

.certified-service .common-heading {
    margin-bottom: 61px;
    margin-top: 39px;
}

.slider {
    background: url(../images/slider-bg.png) no-repeat;
    background-size: cover;
}

.main-slider-div {
    display: table;
    padding: 0 130px;
}

#bubble .main-slider-div {
    padding: 0;
    margin: 0 0 0 auto;
    width: 100%;
    min-height: 360px
}


/*#bubble .carousel-inner {background-image: url(http://www.easywebdesignsolutions.com/marketingautomation/images/G2-Reviews-04.png);
    background-repeat: no-repeat;
    background-position: 90% top;
    background-size: 90px auto;}*/

#bubble .carousel-inner:before {
    content: url(../images/G2-Reviews-04.png);
    position: absolute;
    right: 40px;
    top: 0;
    z-index: 2
}

.main-slider-div p {
    font-size: 16px;
    margin-bottom: 0px;
    display: inline-block;
    color: #fff;
    float: right;
    padding: 25px 0
}

#bubble .main-slider-div p {
    font-family: 'Work Sans', Arial, sans-serif;
    text-align: left;
    color: #124559;
    float: none;
    padding: 0;
    font-size: 14px
}

.logo-slider {
    background-color: #fff;
    display: table-cell;
    width: 28% !important;
    text-align: center;
    float: inherit!important;
    vertical-align: middle;
}

.content-div {
    width: 90% !important;
    margin-left: 29px;
}

.dextop-veiw {
    display: block;
}

.mobile {
    display: none;
}

.arrow {
    width: 100%
}

.arrow .carousel-control {
    width: auto;
    left: -7%;
    opacity: 1
}

.arrow #nextarr {
    right: -7%;
}

.carousel-control.left,
.carousel-control.right {
    background-image: none !important;
    border-right: 0px !important;
}

.glyphicon-chevron-left,
.glyphicon-chevron-right {
    font-size: 0 !important;
    top: 45% !important;
}

.carousel-control .glyphicon-chevron-left {
    left: 22px !important;
}

.carousel-control .glyphicon-chevron-right {
    right: 36px !important;
}

.middle-boxes:hover .bottom-box {
    background-color: #124559;
}

#myCarousel .carousel-control:focus,
#myCarousel .carousel-control:hover,
#myCarousel .carousel-control {
    width: 100% !important;
}

#emailCarousel .carousel-control:focus,
#emailCarousel .carousel-control:hover,
#emailCarousel .carousel-control {
    width: 100% !important;
}

#landingCarousel .carousel-control:focus,
#landingCarousel .carousel-control:hover,
#landingCarousel .carousel-control {
    width: 100% !important;
}

#otherCarousel .carousel-control:focus,
#otherCarousel .carousel-control:hover,
#otherCarousel .carousel-control {
    width: 100% !important;
}

.emails-sec h2 {
    text-transform: uppercase;
    font-size: 18px;
    color: #fff;
    font-weight: 200;
    text-align: center;
    margin-bottom: 25px;
    font-family: 'Work Sans', sans-serif;
}

.our-work-sec:before {
    background-color: #54bcab !important;
    top: 50% !important;
}

#filter-gallery .div {
    content: '';
    position: absolute;
    left: 0;
    bottom: -210px;
    overflow: visible;
    width: 100%;
    height: 70%;
    background: #f15a24;
    z-index: -1;
    -webkit-transform: skewY(-16deg);
    -moz-transform: skewY(-16deg);
    -ms-transform: skewY(-16deg);
    -o-transform: skewY(-16deg);
    transform: skewY(16deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: initial;
    z-index: -1;
}

.our-work-sec {
    background-color: #f9b348 !important;
    height: 476px;
    z-index: 2
}

.our-work-sec .title-box {
    width: 561px;
    margin-top: -30px;
    display: inline-block;
    position: relative;
    margin-left: 0;
}

.our-work-sec .title-box h1 {
    padding: 0 48px !important;
}

.our-work-sec .image {
    margin-left: -74%;
    margin-top: -13px;
}

#filter-gallery {
    background-color: #54bcab !important;
    margin-top: -46px;
    position: relative;
    z-index: 1;
    padding-bottom: 30px;
    min-height: 850px;
}

.emails-sec {
    margin-bottom: 79px;
    display: inline-block;
}

.example-image-link {
    position: absolute;
    bottom: 0;
    right: 15px;
}

.emails-sec .carousel-control {
    position: absolute;
    top: auto;
    bottom: -26px;
    width: 50%;
}

.item .zoom-btn {
    right: 0;
}

#packages-sec .padding-mobileview {
    padding: 0 8px !important;
}


/*Blog starts */

.blog-banner {
    z-index: 1 !important;
    height: 465px;
    background-color: #54bbaa !important
}

.blog-banner:before {
    top: 55% !important;
    background-color: #f05a24 !important;
    webkit-transform: skewY(16deg) !important;
    -moz-transform: skewY(17deg) !important;
    -ms-transform: skewY(17deg) !important;
    -o-transform: skewY(17deg) !important;
    transform: skewY(17deg) !important;
}

.image-left {
    vertical-align: top;
    display: inline-block;
    margin-top: -9px;
    margin-left: 43px;
}

.blog-title {
    width: 100%;
    float: right;
}

.blog-title h1 {
    float: right;
    letter-spacing: 3px;
    padding: 0 34px !important;
    line-height: 80px;
    margin-right: 5px;
    -webkit-box-shadow: 7px 8px 0px -1px rgb(27, 152, 138, 1) !important;
    -moz-box-shadow: 7px 8px 0px -1px rgb(27, 152, 138, 1) !important;
    box-shadow: 7px 8px 0px -1px rgb(27, 152, 138) !important;
    margin-top: 65px;
    z-index: 1000;
    position: relative;
}

.blog-title:after {
    right: 0;
    height: 77px;
}

.blog-title:before {
    left: 55%;
    height: 77px;
}

.blog-banner .image-left {
    margin-top: -4px;
    margin-left: 32px;
}

#blog-grid {
    background-color: #f05a24;
    z-index: 2;
    position: relative;
}

#blog-grid .row {
    padding-bottom: 4em
}

.blog-content {
    background-color: #f9b348;
    padding: 20px;
    border-top: solid #c1853e 10px !important;
    -webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.15) !important;
    -moz-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.15) !important;
    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.15) !important;
    margin-bottom: 20px
}

.blog-content h2 {
    text-align: left;
    color: #124559;
    font-family: 'Work Sans', sans-serif;
    font-size: 18px;
    font-weight: bold
}

.blog-content p {
    color: #124559;
    font-family: 'Work Sans', sans-serif;
    font-size: 14px;
    font-weight: 400
}

.blog-content a {
    color: #f05a24;
    font-size: 18px
}

.blog-content a:hover {
    color: #c44e2d;
    font-size: 18px
}

.blog-content img {
    width: 100%;
    border-radius: 5px;
    -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25) !important;
    -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25) !important;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25) !important;
}

.blog-content:hover {
    -webkit-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.35) !important;
    -moz-box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.35) !important;
    box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.35) !important;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: scale(1.01, 1.01);
    transform: scale(1.01, 1.01);
}


/*blog end*/


/*blog pages*/

.blogpage {
    padding-bottom: 130px !important
}

#banner.blogpage:before {
    top: 40%;
}

.blogpage .title-box:before {
    left: 93px;
}

.blogpage .title-box {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    float: none;
}

.blogpage .title-box h1 {
    text-align: center;
    font-family: 'Work Sans';
    font-weight: bold;
    text-transform: uppercase;
    width: 100%;
    font-size: 35px !important;
    -webkit-box-shadow: 7px 8px 0px -1px rgba(0, 0, 0, 0.25) !important;
    -moz-box-shadow: 7px 8px 0px -1px rgba(0, 0, 0, 0.25) !important;
    box-shadow: 7px 8px 0px -1px rgba(0, 0, 0, 0.25) !important;
}

#blogpage {
    background-color: #f9b348 !important;
    padding-bottom: 4em
}

.date,
.author {
    font-family: 'Work Sans';
    font-weight: bold;
    font-size: 16px;
    margin: 0
}

.date {
    float: left;
}

.author {
    float: right;
}

.blogdetail {
    background-color: #1b998b;
    padding: 10px 3em;
    color: #ffffff;
    overflow: hidden;
}

.blog {
    background-color: #ffffff;
    padding: 3em;
    overflow: hidden;
}

.blog p,
.blog ul,
.blog ol {
    font-size: 16px;
    color: #124559;
}

.blog ul {
    padding-inline-start: 40px !important;
    list-style: initial !important;
}

.blog li {
    margin-bottom: 10px
}

.blog a {
    color: #f05a24;
}

.blog h2 {
    font-family: 'Work Sans';
    font-weight: bold;
    font-size: 18px;
    color: #1b998b;
}

.blog img {
    border-radius: 6px
}

.break img {
    float: left;
    display: inline-block;
}

.break hr {
    margin-top: 8px;
    margin-bottom: 8px;
    display: inline-block;
    width: calc(100% - 100px);
    border-top: 3px solid #eee;
}

.button a {
    background-color: #f15a24;
    font-weight: bold;
    font-size: 18px;
    font-family: 'Work Sans', sans-serif;
    width: 212px;
    display: block;
    margin: 0 auto;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
    padding: 10px 0;
}

.button a:hover {
    background-color: #124559;
    color: #fff;
    -webkit-transition: all 0.5s ease-in;
    /* Opera */
    -o-transition: all 0.5s ease-in;
    /* Standard */
    transition: all 0.5s ease-in;
}

.signatureblock .photo {
    display: inline-block;
    float: left;
    margin-right: 20px;
}

.signatureblock .detail {
    display: inline-block;
    overflow: hidden;
    float: left;
    width: calc(100% - 130px)
}


/*blog page end*/

#contact-page {
    background-color: #f15a24;
}

#contact-page .title-box {
    width: 68%;
    display: block;
    margin: 0 auto;
    text-align: center;
}

#contact-page .title-box h1 {
    display: inline-block;
    font-family: 'Work Sans', sans-serif;
    margin-top: 71px;
    -webkit-box-shadow: 7px 8px 0px -1px rgb(193, 72, 29, 1) !important;
    -moz-box-shadow: 7px 8px 0px -1px rgb(193, 72, 29, 1) !important;
    box-shadow: 7px 8px 0px -1px rgb(193, 72, 29) !important;
    position: relative;
    z-index: 1;
}

#contact-page .title-box:before {
    left: 32%;
    height: 77px;
}

#contact-page .title-box:after {
    right: 32% !important;
    height: 77px;
}

#contact-page p {
    font-family: 'Work Sans', sans-serif;
    font-size: 16px;
    margin: 25px 0 0px;
    color: #fff;
    padding: 28px 154px 5px;
    text-align: center;
}

#form-sec .common-heading h2 {
    background-color: #f15a24;
    font-size: 18px;
    font-weight: 300;
    width: 25%;
}

#form-sec .common-heading {
    margin: 58px 0 65px;
}

.mktoForm {
    max-width: 95% !important;
}

#form-sec input[type="text"],
#form-sec input[type="email"],
.mktoForm textarea.mktoField,
.mktoForm select,
.mktoForm input[type=text],
.mktoForm input[type=email] {
    padding-left: 12px !important;
}

#form-sec:before {
    content: '';
    position: absolute;
    left: 0;
    top: 59%;
    overflow: visible;
    width: 100%;
    height: 70%;
    background: #f9b348;
    z-index: -1;
    -webkit-transform: skewY(-162deg);
    -moz-transform: skewY(-162deg);
    -ms-transform: skewY(-162deg);
    -o-transform: skewY(-162deg);
    transform: skewY(-167deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: initial;
    z-index: -1;
}

#form-sec {
    background-color: #f15a24;
    position: relative;
    z-index: 2
}

.contact-box {
    background-color: #54bcab;
    width: 31.3% !important;
    min-height: 150px !important;
    margin: 68px 10px;
    padding: 15px 0 8px;
    border-top: 10px solid #1b998b;
    text-align: center;
}

.contact-box .icon {
    min-height: auto;
}

.heading h2,
.heading a {
    margin-bottom: 3px;
    font-size: 16px;
    color: #fff;
    font-weight: bold;
    font-family: 'Work Sans', sans-serif;
}

.heading h2 {
    margin-top: 5px;
    line-height: 21px;
}

.heading,
.heading h2,
.heading a {
    display: inline-block;
    width: 100%;
}

.blank_space {
    height: 100px;
}

.thanks-text {
    font-size: 25px !important;
    padding: 28px 138px 5px !important;
}

.thanks-sec:before {
    height: 100% !important;
}


/* Top Banner Templates Promotion */

.top-banner {
    color: #fff;
    text-align: center;
    background-color: #54BCAB;
    padding: 10px;
}

.top-banner a {
    color: #fff !important;
    text-decoration: underline !important;
    font-family: 'Work Sans', sans-serif !important;
}

.top-banner a:active,
.top-banner a:hover {
    color: #fff !important;
    text-decoration: underline !important;
}

@media only screen and (max-width: 568px) {
    #bannerhero h1 {
        font-size: 26px;
    }
    #bannerhero span {
        font-size: 18px;
        line-height: 24px
    }
}