html {
  scroll-behavior: smooth;
}

@font-face {
  font-family: "MIKHAELHANDWRITTENPERSONALUSE-REGULAR";
  src: url('../fonts/Mont-Regular.otf') format('opentype');
}

body {font-family: "Dancing Script", cursive; font-family: 'Mont', sans-serif; line-height: 1.7; color: #868686; font-weight: 300; font-size: 1.1rem; overflow-x: hidden; position: relative; margin: 0; padding: 0;transition: all 0.4s;}
a:hover {text-decoration: none;}

@media (min-width: 1200px) {
  .container {max-width: 1600px;}
}

p, ul li {font-size: 20px; font-weight: 500; color: #3c3c3c; position: relative; list-style-type: none;}

:root {
  --themeColor: linear-gradient(90deg, #1CEBD1 0%, #3B71D6 100%);
  --secondaryColor: linear-gradient(90deg, #3B71D6 0%, #1CEBD1 100%);
  --text-sec-color: #3583d5;
  --btn-color: #1CEBD1;
}

ul.liarrow {margin: 0; padding: 0;}
ul.liarrow li {padding-left: 20px;}
ul.liarrow li::before {content: '\f101'; position: absolute; top: -4px; left: 0; font-family: 'fontAwesome'; font-size: 18px; color: #3c3c3c;}

.action-btn {font-size: 18px; font-weight: 600; text-align: center; position: relative; padding: 10px 20px 10px 20px; border: 0px #000 solid; border-radius: 0px; cursor: pointer; transition: 0.25s;}

.primary-btn {background: var(--btn-color); color: #000; border: 1px #ddd solid; box-shadow: 0px 0px 0px 0px #3B71D6;}
.primary-btn:hover, .primary-btn:focus {color: #000; box-shadow: 5px 5px 0px 0px #3B71D6;}

.outline-btn {background: transparent; color: #000; border: 2px #000 solid;}
.outline-btn:hover, .outline-btn:focus {--color: #000; --hover: #244572; border-color: var(--color); color: #000;}

header {width: 100%; padding: 10px 0px; background: #FFF; position: fixed; top: 0px; z-index: 2; transition: ease all 0.3s;}
header.sticky {position: fixed; top: 0; background: #FFF; box-shadow: 0px 0px 5px 0px #ccc; transition: ease all 0.3s;}

header {  border-bottom: 8px solid transparent;
  border-image: var(--themeColor) 1;
}

.buy-now-btn {border: 1px #000 solid !important;}
.buy-now-btn:hover {border: 1px #fff solid !important;}

.topLine .container {display: flex; justify-content: space-between;}
.topHeader {display: flex; align-items: center; justify-content: space-between; column-gap: 20px;}
.topHeader .logo {width: 400px;}
.topBtn {display: flex; column-gap: 20px;}
.topLine .container a {color: #FFF; margin-left: 20px;}
.topLine .container a .fa {margin-right: 5px;}

/* Desktop Navigation */
.main-nav, .main-nav * { margin: 0px 0px; padding: 0; list-style: none;}
.main-nav>ul>li { position: relative; white-space: nowrap; float: left;}
.main-nav a { display: block; position: relative; color: #000; padding: 40px 19px; transition: 0.3s; font-size: 15px; font-weight: 500;}
.main-nav a:hover, .main-nav .active>a, .main-nav li:hover>a {color: #000; text-decoration: none;}
.sticky .main-nav a {color: #000;}
.sticky .main-nav a:hover, .sticky .main-nav .active>a, .sticky .main-nav li:hover>a {color: #000000;}
.main-nav .drop-down ul {display: block; position: absolute; left: 0; top: calc(100% + 10px); z-index: 99; opacity: 0; visibility: hidden; padding: 0px 0; background: #fff; box-shadow: 0px 15px 30px rgba(127, 137, 161, 0.25); transition: ease all 0.3s;}
.main-nav .drop-down:hover>ul {opacity: 1; top: 60px; visibility: visible;}

.main-nav .drop-down>ul.megaul {width: 700px; display: flex; flex-wrap: wrap;}
.main-nav .drop-down>ul.megaul li {width: 50%;}

.main-nav .drop-down ul li.more-tax-tools {width: 100% !important; background: #244572; text-align: center;}
.main-nav .drop-down ul li.more-tax-tools a {color: #FFF;}

.main-nav .drop-down>ul.megaul.guideul {width: 440px; column-gap: 20px;}
.main-nav .drop-down>ul.megaul.guideul li {width: 100%;}
.main-nav .drop-down>ul.megaul.guideul li.guideBox {width: 47%;}
.main-nav .drop-down>ul.megaul.guideul li.guideBox ul {opacity: 0; visibility: hidden; position: static; box-shadow: 0px 0px 0px 0px #CCC;}

.main-nav .drop-down:hover ul.megaul.guideul li.guideBox ul {opacity: 1; visibility: visible;}

/* .main-nav a:hover .main-nav .drop-down>ul.megaul.guideul li.guideBox {display: block;} */

.main-nav .drop-down ul a i {margin-right: 10px; position: absolute; top: 14px; left: 20px;}

.main-nav .drop-down ul h3 a {font-size: 16px; color: #000; font-weight: 600; padding: 10px 15px; border-bottom: 1px #CCC solid;}
.main-nav .drop-down li {min-width: 210px; position: relative;}
.main-nav .drop-down ul a {padding: 10px 15px 10px 35px; white-space: normal; font-size: 13px; color: #333; border-bottom: 1px #eee solid;}
.main-nav .drop-down ul a:hover, .main-nav .drop-down ul .active>a, .main-nav .drop-down ul li:hover>a {color: #FFF; background: #244572;}
.main-nav .drop-down>a:after {content: "\f107"; font-family: FontAwesome; padding-left: 5px;}
.main-nav .drop-down .drop-down ul {top: 0; left: calc(100% - 30px);}
.main-nav .drop-down:hover>ul {opacity: 1; top: 65px; left: 0%;}
.main-nav .drop-down .drop-down:hover ul {top: 0; left: calc(100% - 30px);}
.main-nav .drop-down>a {padding-right: 35px;}
.main-nav .drop-down>a:after {content: "\f107"; position: absolute; right: 15px;}
/* Mobile Navigation */
.mobile-nav {position: fixed; top: 0; bottom: 0; z-index: 9999; overflow-y: auto; left: -260px; width: 260px; padding-top: 18px; background: rgb(53, 131, 213, 0.7); transition: 0.4s;}
.mobile-nav * {margin: 0; padding: 0; list-style: none;}

.mobile-nav .drop-down ul h3 {font-size: 16px; color: #000; font-weight: 600; padding: 10px 15px; border-bottom: 1px #CCC solid;}

.mobile-nav a {display: block; position: relative; color: #fff; font-weight: 400; padding: 10px 20px; font-weight: 400;}
.mobile-nav a:hover, .mobile-nav .active>a, .mobile-nav li:hover>a {color: #FFF; text-decoration: none;}
.mobile-nav .drop-down>a:after {content: "\f107"; font-family: FontAwesome; padding-left: 10px; position: absolute; right: 15px;}
.mobile-nav .active.drop-down>a:after {content: "\f106";}
.mobile-nav .drop-down>a {font-size:15px; padding-right: 35px;}
.mobile-nav a {font-size:15px;}
.mobile-nav a i {margin-right: 5px;}
.mobile-nav .drop-down ul h3 {color: #FFF;}
.mobile-nav .drop-down ul {display: none; overflow: hidden;}
.mobile-nav .drop-down li {padding-left: 20px;}
.mobile-nav-toggle {position: fixed; right: 5px; top: 15px; z-index: 11001; border: 0; background: none; font-size: 24px; transition: all 0.4s; outline: none !important; line-height: 1; cursor: pointer; text-align: right;}
.mobile-nav-toggle i {margin: 20px 10px 0 0; color: #FFF;}
.mobile-nav-overly {width: 100%; height: 100%; z-index: 9997; top: 0; left: 0; position: fixed; background: rgba(19, 39, 57, 0.8); overflow: hidden; display: none;}
.mobile-nav-active {overflow: hidden;}
.mobile-nav-active .mobile-nav {left: 0;}
.mobile-nav-active .mobile-nav-toggle i {color: #fff;}
.humburger {background: url('../images/humburger-close.png') no-repeat; background-size: cover; width: 24px; height: 23px; display: block;}
.humburgerOpen {background: url('../images/humburger-menu.png') no-repeat; background-size: cover; width: 20px; height: 15px; display: block;}

.desktopbtn {display: none !important;}
.mobileview {display: none;}


.banner {margin-top: 100px;}
.bannersubBox {}
.bannersubBox span {font-family: "Dancing Script", cursive; font-size: 40px; color: #4AFFE8;}
.bannersubBox h1 {font-size: 36px; font-weight: 700; color: #FFF;}
.bannersubBox p {font-size: 20px; font-weight: 400; color: #FFF;}

.banner {min-height: 750px; background: url('../images/banner-bg.png') no-repeat; background-size: cover; position: relative; display: flex; justify-content: center; align-items: center; padding-top: 70px;}

section {padding: 50px 0px;}

.section-title {width: 100%; max-width: 1180px; text-align: center; margin: 0px auto 30px auto;}
.section-title h2 {font-size: 40px; font-weight: 800; color: #3B71D6;}

.dm-box {padding: 20px; box-shadow: 0px 0px 5px 0px #ccc; border-radius: 20px; border-bottom: 2px #3B71D6 solid;}
.dm-box h3 {font-size: 20px; font-weight: 700; color: #3B71D6; margin: 20px 0px 10px 0px;}
.dm-box p {font-size: 16px; font-weight: 500; color: #000;}

.d-performance {background: #F4F8FF;}

.performance-marketing-box {padding: 20px; border-radius: 20px; box-shadow: 0px 0px 5px 0px #CCC;}
.performance-marketing-box h3 {font-size: 24px; font-weight: 700; color: #3B71D6;}
.performance-marketing-box h3 span {display: block;}
.performance-marketing-box img {width: 100%;}
.performance-marketing-box p {font-size: 14px; font-weight: 500; color: #000; min-height: 75px; margin: 10px 0px;}
.performance-marketing-box ul {margin: 0; padding: 0; min-height: 130px;}
.performance-marketing-box li {position: relative;font-size: 14px; font-weight: 500; color: #000; margin: 5px 0px; padding-left: 30px;}
.performance-marketing-box li:before {content: ''; position: absolute; left: 0; top: 0; width: 18px; height: 20px; background: url('../images/li-icon.png') no-repeat; background-size: contain;}

.who-we-are {background: url('../images/who-we-are.png') no-repeat; background-size: cover; background-position: bottom; height: 825px; text-align: center; padding: 50px; border: 10px #fff solid; border-radius: 20px; box-shadow: 0px 0px 20px 0px #ccc;}
.who-we-are p {width: 100%; max-width: 1100px; margin: 0px auto 20px auto;}

.deliver-performance-sec {background: #F4F8FF; padding: 80px 0px;}

.deliver-performance {display: flex; align-items: center; justify-content: space-between; column-gap: 20px; position: relative;}
.deliver-performanceImage {width: 100%; max-width: 360px; position: relative; z-index: 1;}
.deliver-performanceImage img {width: 90%;}
.deliver-performance-content {width: 100%; max-width: 248px; text-align: center; position: relative; z-index: 1; padding-top: 20px;}
.deliver-performance-content h3 {font-size: 20px; font-weight: 700; color: #3B71D6; margin: 0;}
.deliver-performance-content span {font-size: 60px; font-weight: 700; color: rgba(255, 255, 255, 0.20); line-height: 90px;}
.deliver-performance-content p {font-size: 16px; font-weight: 500; color: #000; min-height: 70px;}
.deliver-performance::before {content: ''; position: absolute; left: 100px; top: 80px; width: 91%; height: 68px; background: var(--themeColor); transform: rotate(180deg); border-radius: 50px;}

.why-media {background: url('../images/why-adsleo.png') no-repeat; background-size: cover; padding: 30px; margin: 50px 0px; border-radius: 30px;}
.whymediaBox {background: #FFF; width: 100%; max-width: 500px; padding: 47px;}
.whymediaBox p {min-height: auto;}
.whymediaBox p, .whymediaBox li {font-size: 18px;}

.we-serve-con {}
.we-serve {display: flex; justify-content: space-between; column-gap: 15px;}
.we-serve .dm-box {width: 245px; text-align: center;}

.strategic-conversation {background: #1B325E; padding: 80px 0px 50px 0px;}
.conversationBox h2 {font-size: 36px; font-weight: 700; color: #FFF;}
.conversationBox p {font-size: 24px; font-weight: 500; color: #FFF;}
.contactUs {display: flex; align-items: flex-start; column-gap: 10px; margin-bottom: 20px;}
.contactUs small {background: #10F9DC; font-size: 12px; font-weight: 500; color: #000; padding: 3px 20px; border-radius: 20px;}
.contactUs p, .contactUs a {font-size: 18px; font-weight: 500; color: #FFF; display: block;}
.bottomline {font-family: "Dancing Script", cursive; font-size: 30px; font-weight: 500; color: #10F9DC; display: block;}

footer {background: var(--secondaryColor); text-align: center; padding: 50px 0px 20px 0px;}
footer p {width: 100%; max-width: 990px; font-size: 14px; font-weight: 500; color: #FFF; margin: 30px auto;}
footer ul {margin: 0px 0px 30px 0px; padding: 0; display: flex; justify-content: center; align-items: center; column-gap: 20px;}
.divider {font-size: 12px; color: #FFF;}
footer ul li {}
footer ul li a { font-size: 16px; font-weight: 500; color: #FFF;}
footer ul li a:hover {color: #FFF;}

/* .copyright {position: relative;}
.copyright::before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: #FFF;}
.copyright p {display: inline-block;  margin: 0px auto; font-size: 18px; font-weight: 500; color: #FFF;} */

.copyright {display: flex; align-items: center; justify-content: center; gap: 20px; padding: 14px 40px; color: #ffffff; font-size: 14px;}
.copyright p {width: auto; margin: 0; white-space: nowrap;}
.copyright .line {flex: 1; height: 1px; background: rgba(255, 255, 255, 0.6);}

.privacy-policy-banner {background: var(--themeColor); height: auto; min-height: auto; padding: 60px 0px 30px 0px;}
.privacy-policy-banner h1 {font-size: 36px; font-weight: 700; color: #FFF;}
.privacy-policy {padding: 30px 0px;}
.privacy-policy h3 {font-size: 20px; font-weight: 600; color: #000;}
.privacy-policy h4 {font-size: 16px; font-weight: 600; color: #000;}
.privacy-policy p {font-size: 14px; color: #535353; font-weight: 500; margin-bottom: 10px;}
.privacy-policy ul li {font-size: 14px; color: #535353; font-weight: 500; list-style-type: circle;}

@media (min-width: 320px) and (max-width: 767px) {
  .topHeader .logo {width: 190px;}
  .topBtn .action-btn {font-size: 12px; padding: 5px 10px; font-weight: 600;}
  .topBtn {margin-right: 20px;}
  .banner {min-height: auto; margin-top: 60px;}
  .bannersubBox h1 { font-size: 24px; font-weight: 600;}
  .bannersubBox span {font-size: 24px;}
  section {padding: 20px 0px;}
  .section-title h2 {font-size: 24px;}
  .performance-marketing-box {margin-bottom: 20px;}
  .who-we-are {background: url('../images/who-we-are-mobile.png') no-repeat; background-size: cover; background-position: bottom;}
  .who-we-are {height: auto; padding: 10px 10px 170px 10px;}
  .who-we-are p {font-size: 14px;}
  .dm-box {margin-bottom: 20px;}
  .we-serve {flex-wrap: wrap;}
  .strategic-conversation .col-md-5 {order: 2;}
  .strategic-conversation .col-md-3 {order: 1; text-align: left !important;}
  .strategic-conversation .col-md-4 {order: 3;}
  .strategic-conversation .col-md-3 img {margin: 0px 0px 20px 0px;}
  .deliver-performance {flex-direction: column;}
  .deliver-performance::before {display: none;}
  .deliver-performance-content span {content: ''; width: 100%; height: auto; display: block; line-height: 60px; background: var(--themeColor); border-radius: 5px;}
  .whymediaBox {padding: 20px;}
  .why-media {padding: 15px;}
  .we-serve .dm-box {width: 100%}
  footer ul {flex-wrap: wrap;}
}

@media (min-width: 768px) and (max-width: 1023px) {
}

@media (min-width: 992px) and (max-width: 1023px) {
}

@media (min-width: 1024px) and (max-width: 1279px) {
}

@media (min-width: 320px) and (max-width: 510px) {
}

@media (min-width: 320px) and (max-width: 510px) {
}

@media (min-width: 768px) and (max-width: 1024px) {
}

@media (min-width: 992px) and (max-width: 1090px) {

}
  
@media (min-width: 1025px) and (max-width: 1260px) {
  
}

@media (min-width: 1366px) and (max-width: 1420px) {
  .banner {min-height: auto; padding-bottom: 30px;}
}