.heading-menu,#admpcutomerlogos,#allFea,.btmBar,#btmscroll{display:none}
@import url('https://www.manageengine.com/css/fonts.css');
        html, body{margin: 0; padding: 0; font-size: 14px; font-family: 'Open Sans', sans-serif;}
        .container{max-width: 1200px; margin: 0 auto;}
        .flex{display: flex;}
        a{text-decoration: none; cursor: pointer;}
        a:hover{text-decoration: none; cursor: pointer;}
        header{background: #fff; position: fixed;z-index: 999; width: 100%; left: 0; top: 0; -webkit-box-shadow: 0 0 12px 2px rgba(0,0,0,.07); box-shadow: 0 0 12px 2px rgba(0,0,0,.07);}
        header .container{justify-content: space-between; padding: 8px 0;}
        .logo{height: 55px; width: 190px; background: url(https://www.manageengine.com/products/ad-manager/images/ad-academy-sprite.png) no-repeat; background-size: 210px; align-self: center; background-position: -5px 0; align-self: center; cursor: pointer;}
        .topNav{align-self: center;}
        .topNav a{color: #000; margin-left: 30px;}
		.topfix{height: 71px; position: relative;}
        .heroContainer{height: auto; background: #51b2ef; position: relative;}
        .heroContainer::before{content: ""; position: absolute; height: 308px; width: 650px; background: url(https://www.manageengine.com/products/ad-manager/images/ad-academy-banner.png) no-repeat; background-size: 100%; background-position: -8px 3px; bottom: 0; left: 0;right: 0; margin: auto; z-index: 3}
        .heroTitle{text-align: center; margin-bottom: 50px;}
        .heroTitle h1{font-size: 41px; line-height: 52px; color: #fff; font-weight: 800; text-transform: uppercase; padding-top: 35px; margin: 0;}
        .heroTitle p{font-size: 18px; line-height: 26px; color: #1c3c69; font-weight: 400; margin-top: 5px;}
        .heroTitle p span{font-weight: 600;  display: block;}
        .heroBannerImg{position: absolute; height: 327px; width: 450px; bottom: -69px; left: 0; right: 0; margin: auto; background: url(https://www.manageengine.com/products/ad-manager/images/ad-academy-banner-image.png) no-repeat; background-size: 100%; background-position: 21px 0; z-index: 5;}
        .greaBox{position: absolute; height: 308px; width: 650px; bottom: 0; left: 0;right: 0; margin: auto; z-index: 1; overflow: hidden;}
        .greaBox::before{content: ""; position: absolute; height: 647px; width: 100%; background: url(https://www.manageengine.com/products/ad-manager/images/gear.png) no-repeat; background-size: 100%; top: 0; left: 0; z-index: 1; animation: rotateGears 110s linear infinite normal;}
        @-webkit-keyframes rotateGears {
          from {transform: rotate(0deg);}
          to {transform: rotate(360deg);}
        }
        @keyframes rotateGears {
          from {transform: rotate(0deg);}
          to {transform: rotate(360deg);}
        }
        .heroLinkContent{justify-content: space-between; height: 285px; padding-bottom: 25px;}
        .heroLink{width: 30%; display: flex; flex-direction: column; justify-content: space-between; cursor: pointer;}
        .heroLinkContent a{color: #000; font-weight: 600; font-size: 13px; line-height: 16px; width: 200px; display: flex; justify-content: flex-start; flex-direction: row; position: relative; z-index: 20;}
        .heroLink2 a{flex-direction: row-reverse;}
        .heroLink1 a{align-self: flex-end;}
        .heroLink2 a{align-self: flex-start;}
        .heroLinkImg{position: relative; height: 40px; width: 40px; background: url(https://www.manageengine.com/products/ad-manager/images/ad-academy-sprite.png) no-repeat; background-size: 250px; align-self: center;}
        #hl1 .heroLinkImg{background-position: -5px -196px}
        #hl2 .heroLinkImg{background-position: -62px -196px}
        #hl3 .heroLinkImg{background-position: -124px -196px}
        #hl4 .heroLinkImg{background-position: -187px -196px}
        #hl5 .heroLinkImg{background-position: -6px -196px}
        #hr1 .heroLinkImg{background-position: -61px -255px}
        #hr2 .heroLinkImg{background-position: -121px -253px}
        #hr3 .heroLinkImg{background-position: -186px -254px}
        #hr4 .heroLinkImg{background-position: -2px -307px}
        #hr5 .heroLinkImg{background-position: -60px -307px}
        .heroLink span:first-of-type{align-self: center;}
        .heroLink1 span:first-of-type{margin-right: 10px;}
        .heroLink2 span:first-of-type{margin-left: 10px;}
        #hl1{left: 59px;}
        #hl2{right: 14px;}
        #hl3{right: 12px;}
        #hl4{right: 109px;}
        #hl5{right: 139px; width: 150px;}
        #hl5 span:first-of-type{ width: calc(100% - 45px)}
        #hr1{right: 118px;}
        #hr2{right: 70px;}
        #hr4{right: -10px;}
        #hr5{right: -89px;}
        .searchContainer{margin: 100px 0 50px; text-align: center;}
        .searchContainer h2{font-size: 25px; text-transform: uppercase; margin-bottom: 30px;}
        .searchBox{width: 50%; margin: 0 auto; position: relative;}
        .searchBox::after{content: ""; position: absolute; right: 10px; top: 5px; height: 30px; width: 30px; background: url(https://www.manageengine.com/products/ad-manager/images/ad-academy-sprite.png) no-repeat; background-size: 220px; background-position: -3px -68px;}
        .searchBox.active::after{display: none}
        .searchBox input{width: 100%; font-size: 16px; height: 40px; padding: 10px 10px 10px 20px; border: 1px solid #e2e2e2; border-radius: 3px; outline: none; z-index: 11;}
        .searchBox input::placeholder{color: rgba(0,0,0,.4); }
        .blogListContainer{position: relative; margin: 10px 0 40px;}
        .blogListContainer .container{justify-content: space-between;}
        .blogCatWrapper{width: 28%;}
        .blogListWrapper{width: 65%;}
        .blogList{display: none; flex-wrap: wrap;  justify-content: space-between;}
        .showList{display: flex;}
        .blogBox{width: calc(50% - 70px); padding: 12px 35px 12px 20px;-webkit-box-shadow: 0 0 12px 1px rgba(0,0,0,.07);box-shadow: 0 0 12px 1px rgba(0,0,0,.07); margin-bottom: 30px;  color: #000;}
        .blogBox p:first-of-type{font-size: 15px;}
        .blogLink{position: relative; margin-top: 25px; color: #abb7be;  font-size: 14px; margin-bottom: 4px;}
        .blogLink::after{content: ""; position: relative; padding: 5px 10px; background: url(https://www.manageengine.com/products/ad-manager/images/ad-academy-sprite.png) no-repeat; background-size: 240px; background-position: -34px -78px;}
        .blogCatBox{padding: 17px 15px; background: #fbfbfb; color: #4c4c4c; font-weight: 600;  border: 1px solid #efefef; border-top: none;position: relative; cursor: pointer;  display: flex; justify-content: flex-start;}
        .blogCatBox:first-of-type{border-top: 1px solid #efefef}
        .blogCatBox.active{border-right: none; background: #fff; font-weight: 700;}
        .blogCatBox.active::before{content: ""; position: absolute; left: -1px; top: -1px; height: calc(100% + 2px); width: 4px; background: #1298e7; }
        .blogCatImg{position: relative; background: url(https://www.manageengine.com/products/ad-manager/images/ad-academy-sprite.png) no-repeat; background-size: 260px; height: 30px; width: 40px;}
        #bc1 .blogCatImg{background-position: -128px -325px}
        #bc2 .blogCatImg{background-position: -174px -322px}
        #bc3 .blogCatImg{background-position: 0px -377px}
        #bc4 .blogCatImg{background-position: -41px -381px}
        #bc5 .blogCatImg{background-position: -77px -381px}
        #bc6 .blogCatImg{background-position: -2px -423px}
        #bc7 .blogCatImg{background-position: -119px -379px}
        #bc8 .blogCatImg{background-position: -157px -377px}
        #bc9 .blogCatImg{background-position: -200px -377px}
        #bc10 .blogCatImg{background-position: -92px -422px}
        #bc11 .blogCatImg{background-position: -42px -388px; background-size: 240px;}
        #bc12 .blogCatImg{background-position: -145px -491px; background-size: 300px;}
        .blogCatText{margin-left: 10px; align-self: center;}
        .aboutAuthor{background: #f2f8fc;position: relative; overflow: hidden;  padding: 50px 0;}
        .aboutAuthor .container{justify-content: space-between; position: relative;}
        .aboutAuthor .container::before{content: ""; position: absolute; height: 1100px;  width: 1000px; border-radius: 50%; bottom: -43%; right: 82.5%; background: #1298e7; z-index: 0;}
        .authorImg{width: 300px; height: 300px;position: relative; z-index: 1; align-self: center;}
        .authorBrief{width: calc(100% - 100px);position: relative; z-index: 1;}
        .authorBrief h2{font-size: 40px; font-weight: 300; color: #1298e7; margin: 30px 0 25px;}
        .authorBrief h2 span{font-weight: 600;}
        .authorBrief p{line-height: 29px; color: #333333;}
        .authorBrief .authorName{font-size: 18px; line-height: 24px; margin-bottom: 25px; color: #000;}
        .socialIcon{margin-top: 30px;}
        .socialIcon p{font-size: 13.5px; font-weight: 600; margin-right: 25px;}
        .socialIcon a{position: relative; height: 46px; width: 40px; background: url(https://www.manageengine.com/products/ad-manager/images/ad-academy-sprite.png) no-repeat; background-size: 250px; margin-right: 20px;}
        .socialIcon a.lk{background-position: -7px -130px;}
        .socialIcon a.fb{background-position: -63px -130px;}
        .socialIcon a.tw{background-position: -120px -130px;}
        footer{text-align: center;}
        .foo1{font-size: 18px;  line-height: 30px; margin: 35px 0;}
        .zohoLogo{position: relative; padding: 6px 46px; background: url(https://www.manageengine.com/products/ad-manager/images/ad-academy-sprite.png) no-repeat; background-size: 215px; background-position: -60px -66px}
        .foo2{opacity: .8;}
        span#backToTop{display: none !important;}
        .searchList{background: #fff; -webkit-box-shadow: 0 0 12px 1px rgba(0,0,0,.07); box-shadow: 0 0 12px 1px rgba(0,0,0,.07); padding: 0 10px; display: none; position: absolute; width: 96%; left: 0; top: 40px; z-index: 1; max-height: 300px; overflow-y: auto;}
        .searchList a{display: block; color: #000; padding: 8px 10px; border-bottom: 1px solid #efefef; text-align: left;}
		.per30{float:left;padding:0 1.5%;width:30%;}
		.thaLeft{width:30%}
		.fl{float:left}
		.thaLeft a{background:url(https://www.manageengine.com/products/ad-manager/images/thanks-page-sprite.png);display:block;height:60px;margin:0 auto;width:60px}
		.thaRig{font-size:11px;line-height:18px;width:70%}
		.thaRig a{color:#1298e7;display:block;float:left;margin:5px 0 0;width:100%}
		.rigLine{border-right:1px solid #e5e5e5}
		.botLine{border-bottom:1px solid #e5e5e5;padding:30px 1.5%}
		.remLin{border-bottom:none}
		.thaLogo{background:url(https://www.manageengine.com/products/ad-manager/images/thanks-page-sprite.png) no-repeat -291px -92px;height:19px;margin:0 0 8px;width:100%}
		.thaLogo a:hover{text-decoration:none}
		.logoadap{background-position:-291px -110px}
		.logoadssp{background-position:-291px -129px}
		.logoerp{background-position:-291px -150px}
		.logoela{background-position:-291px -170px}
		.logofap{background-position:-291px -189px}
		.logormp{background-position:-291px -207px}
		.logospmp{background-position:-291px -226px}
		.logoomp{background-position:-291px -243px}
		.logoad360{background-position:-291px -260px}
		.logoadap a{width:113px;}
		.logoadssp a{width:160px}
		.logoerp a{width:200px}
		.logoela a{width:158px}
		.logofap a{width:120px}
		.logormp a{width:195px}
		.logospmp a{width:195px}
		.logoomp a{width:143px}
		.logoad360 a{width:60px}
		.mlogoadap{background-position:-60px 0 !important}
		.mlogoadssp{background-position:-119px 0 !important}
		.mlogoerp{background-position:-180px 0 !important}
		.mlogoela{background-position:-239px 0 !important}
		.mlogofap{background-position:-300px 1px !important}
		.mlogormp{background-position:-361px 1px !important}
		.mlogospmp{background-position:-419px 2px !important}
		.mlogoomp{background-position:0px -58px !important}
		.mlogoad360{background-position:-62px -58px !important}
		.mT0{margin-top:0 !important}
        @media screen and (max-width: 1220px){
            .container{max-width: 90%;}
            .heroContainer::before{height: 266px; width: 550px;}
            .heroLinkContent{height: 230px;}
            .heroBannerImg{height: 286px; width: 380px;}
            #hl1{left: 38px;}
            #hl2{right: 19px;}
            #hl3{right: 2px;}
            #hl4{right: 94px;}
            #hl5{right: 119px;}
            #hr1{right: 95px;}
            #hr2{right: 55px;}
            #hr3{right: -41px;}
            #hr4{right: -22px;}
            #hr5{right: -96px;}
			.thaRig{min-height:104px;}
        }
        @media screen and  (max-width: 991px){
            .heroLinkContent, .heroContainer::before{display: none;}
            .heroTitle{margin-bottom: 0; padding-bottom: 20px;}
            .searchContainer{margin-top: 40px;}
            .aboutAuthor .container::before{height: 1500px; right: 76.5%;}
			.thaRig{min-height:auto;width:100%}
        }
        .closeNav{display: none;}
        .openNav{display: none;}
        @media screen and (max-width: 767px){
            .blogListContainer .container, .aboutAuthor .container{flex-direction: column;}
            .blogCatWrapper{width: 100%; display: flex; flex-wrap: wrap;margin-bottom: 30px;}
            .blogCatBox{width: 45%; padding: 17px 2%;}
            .blogListWrapper{width: 100%;}
            .aboutAuthor .container::before{display: none;}
            .authorBrief{width: 100%; text-align: center;}
            .socialIcon{justify-content: center;}
            .topNav{position: fixed; right: -50%; top: 0; height: 100%; width: 50%; background: #fff; z-index: 11; padding-top: 60px; -webkit-box-shadow: 0 0 12px 2px rgba(0,0,0,.07); box-shadow: 0 0 12px 2px rgba(0,0,0,.07); transition: .5s;}
            .topNav a{display: block; margin: 10px 20px;border-bottom: 1px solid #e2e2e2; padding-bottom: 7px; font-size: 16px;}
            .closeNav{display: block; position: absolute; font-size: 45px; right: 30px; top: 0; font-weight: 300;}
            .openNav{display: block; position: absolute;right: 5%; top: 20px; height: 20px; width: 30px; border-top: 2px solid #000;border-bottom: 2px solid #000;}
            .openNav::after{content: ""; position: absolute; width: 100%; height: 2px; left: 0; top: 0; bottom: 0; margin: auto; background: #000;}
            .searchBox{width: 80%;}
			.thaRig{text-align:left}
			.authorImg{display:none;}
        }
		@media screen and (max-width:690px){
			.per30{border-bottom:1px solid #e5e5e5;width:100%}
		}
        @media screen and (max-width: 480px){
            .blogBox{width: 100%;}
        }    
        @media screen and (max-width: 400px){
            .blogCatBox{width: 100%;}
        }    