/* Header section RGB Color */ .headI{position:relative;display:flex;align-items:center;justify-content:center} @keyframes animate{to{background-position:200% center}} .headH .headTtl{background:linear-gradient(330deg,#6d1989 0%,#1f70d9 25%,#6140b6 50%,#7f00ff 75%,#6d1989 100%);background-size:200% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:animate 1.5s linear infinite; font:700 20px var(--fontB); overflow:hidden;white-space:nowrap;text-overflow:ellipsis; display:block}
/* Label */
 /*.pLbls::before, .pLbls >*::before{content:attr(data-text)} .pLbls::before{opacity:.7} .pLbls a:hover{text-decoration:underline} .pLbls >*{color:inherit;display:inline;padding:16px 0} .pLbls >*:not(:last-child)::after{content:'/'}*/
 
 /* Label Bot in the post */
.pLbL > a{padding: 9px 12px;background:#fffdfc;color:#08102b;font-size: 13px;border-radius:50px;box-shadow: 3px 6px 15px rgba(0,0,0,.07);margin-right: 5px;}
.pLbL{display: block;direction: ltr;text-align: left;margin-bottom: 25px;}
.pLbL > a::before {content: '/';font-size: 15px;}
.drK .pLbL > a{background:var(--darkT)}

/* Label Custom */ 
.pLbls::before, .pLbls >*::before{content:attr(data-text)} 
.pLbls::before{opacity:.8;margin-right: 5px} 
.pLbls a:hover{text-decoration:underline;font-weight:bold}
.pLbls >*{color:inherit;display:inline}
.pLbls >*:not(:last-child)::after{content:''}

/*Label Custom Homepage aveestb*/
.pHdr .pLbls >*{color:#fefefe;display:inline;margin-right:5px;border-radius: 6px;background:#06D7A0;height:24px;padding:0 10px;border:1px solid transparent}
.pHdr .pLbls >*:hover{text-decoration:none;color:#0b57cf;border:1px solid #0b57cf;background:rgba(0,0,0,.05);font-weight:normal}
.pHdr .pLbls >*:not(:last-child)::after{content:''}
.pHdr .pLbls {display:flex;align-items:center}
.pHdr .pLbls ::before,.pHdr .pLbls a:before{content:''attr(data-text)}
.pHdr .pLbls a:nth-child(n){padding:2px 10px; border-radius:20px;margin-right:1
5px;border:1px solid transparent}
.pHdr .pLbls a:hover:nth-child(n){text-decoration:none;color:#0b57cf;border:1px solid #0b57cf;background:transparent;font-weight:normal}
.pHdr .pLbls a:nth-child(1){background:var(--linkC)}
.pHdr .pLbls a:nth-child(1):before{border-color:transparent #00a5af transparent transparent}
.pHdr .pLbls a:nth-child(2){background:red}
.pHdr .pLbls a:nth-child(2):before{border-color:transparent #f89000 transparent transparent}
.pHdr .pLbls a:nth-child(3){background:#FFD167}
.pHdr .pLbls a:nth-child(3):before{border-color:transparent #FFD167 transparent transparent}

/*Dark Mode*/
pHdr .pLbls a:nth-child(1){background:var(--darkU)}
.drK .pHdr .pLbls >*:hover{text-decoration:none;color:#fff;border:1px solid #fff;background:var(--darkU);font-weight:normal}
.drK .pHdr .pLbls a:hover:nth-child(n){text-decoration:none;color:#fff;border:1px solid #fff;background:transparent;font-weight:normal}
 
/* Note */
.note {
	position: relative;
	padding: 16px 20px 16px 50px;
	background: var(--notifU);
	color: #3c4043;
	font-size: .85rem;
	font-family: var(--fontB);
	line-height: 1.6em;
	border-radius: 10px;
	overflow: hidden
}

.note::before {
	content: '';
	width: 60px;
	height: 60px;
	background: rgba(0, 0, 0, .4);
	display: block;
	border-radius: 50%;
	position: absolute;
	top: -12px;
	left: -12px;
	opacity: .1
}

.note::after {
	content: '\002A';
	position: absolute;
	left: 18px;
	top: 16px;
	font-size: 20px;
	min-width: 15px;
	text-align: center
}

.note.hijau {
	position: relative;
	padding: 16px 20px 16px 50px;
	background: var(--notifU);
	color: #008C5F;
	font-size: .85rem;
	font-family: var(--fontB);
	line-height: 1.6em;
	border-radius: 10px;
	overflow: hidden
}

.note.hijau::after {
	content: '\002A';
	position: absolute;
	left: 18px;
	top: 16px;
	font-size: 20px;
	min-width: 15px;
	text-align: center
}


.note.wr {
	background: #ffdfdf;
	color: #48525c
}

.note.wr::after {
	content: '\0021'
}

.drK .note {
	background: var(--darkBs);
	color: rgba(255, 255, 255, .9)
}

/* Syntax */ .pre { color:  black;
  direction: ltr;
  background-color:#F2F2F2;
  max-height: 300px;
  position:relative;
  overflow:auto;
  border-radius:8px;
}
  
  margin:.5em auto;
}
.pre:not(.tb) {
  position: relative;
  border-radius: 8px;
  overflow: hidden;
  margin: 1.7em auto;
  font-family: var(--fontC);
  position:absolute;
}
.pre pre {
  margin: 0;
  color: inherit;
  background: inherit;
}
.pre:not(.tb)::before,
.cmC i[rel="pre"]::before {
  content: "</>";
  display: flex;
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  background-color:#CAD4ED;
  
  color: 50637E;
  padding: 0 10px;
    font-weight:400;
    
  z-index: 2;
  line-height: 30px;
}
.pre:not(.tb)HTML::before {
  content: "HTML";
}
.pre:not(.tb)CSS::before {
  content: "CSS";
}
.pre:not(.tb)JavaScript::before {
  content: "JavaScript";
  
}
.pre:not(.tb):hover::before {
  content: "Double click to copy | </>";
}
.pre:not(.tb)HTML:hover::before {
  content: "Double click to copy | HTML";
}
.pre:not(.tb)CSS:hover::before {
  content: "Double click to copy | CSS";
}
.pre:not(.tb)JavaScript:hover::before {
  content: "Double click to copy | JavaScript";
}
.pre[data-text]:not([data-text=""]):not(.tb)::before {
  content: attr(data-text);
}
.pre[data-text]:not([data-text=""]):not(.tb):hover::before {
  content: "Double Click to Copy | " attr(data-text);
}
pre,
.cmC i[rel="pre"] {
  display: block;
  position: relative;
  font-family: var(--fontC);
  font-size: 13px;
  line-height: 1.6em;
  border-radius: 3px;
  background: var(--synxBg);
  color: var(--synxC);
  padding: 30px 20px 20px;
  margin: 1.7em auto;
  -moz-tab-size: 2;
  tab-size: 2;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  overflow: auto;
  direction: ltr;
  white-space: pre;
}
pre i {
  font-style: normal;
}
pre i.block {
  color: #fff;
  background: var(--synxBlue);
}
pre i.green {
  color: var(--synxGreen);
}
pre i.gray {
  color: var(--synxGray);
}
pre i.red {
  color: var(--synxOrange);
}
pre i.blue {
  color: var(--synxBlue);
}
code {
  display: inline;
  padding: 5px;
  font-size: 14px;
  border-radius: 3px;
  line-height: inherit;
  color: var(--synxC);
  background: #f2f3f5;
  font-family: var(--fontC);
}

/* download techlystb */

/* List Info techlystb*/
.techly
{position:relative;display:flex;justify-content:center;align-items:center;text-align:center;margin:30px auto 10px;border-radius:30px;line-height:20px;color:#fefefe;background-color:#25d366;font-size:14px;font-weight:bold;width:calc(100% - 40px)}

/* CSS stb*/
.stb{animation: blink 5s infinite}
@keyframes blink{0%{background:#f7176a;}20%{background:#25d366}40%{background:#bf00ff}60%{background:#2ad2c9}80%{background:f14300}100%{background:#f7176a}}
@-webkit-keyframes blink{0%{background:#f7176a}20%{background:#25d366}40%{background:#bf00ff}60%{background:#2ad2c9}80%{background:f14300}100%{background:#f7176a}}
.t{-webkit-animation: bounce 2s;animation: bounce 2s;-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite}
@-webkit-keyframes bounce{0%,25%,50%,75%,100%{-webkit-transform: translateY(0);transform: translateY(0)}40%{-webkit-transform: translateY(-20px);transform: translateY(-20px)}60%{-webkit-transform: translateY(-12px);transform: translateY(-12px)}}
@keyframes bounce{0%,25%,50%,75%,100%{-webkit-transform: translateY(0);transform: translateY(0)}40% {-webkit-transform: translateY(-20px);transform: translateY(-20px)}60% {-webkit-transform: translateY(-12px);transform: translateY(-12px)}}
.icon.s{background-image: url("data:image/svg+xml,%3Csvg viewbox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23ffffff' d='M17,13L12,18L7,13H10V9H14V13M19.35,10.03C18.67,6.59 15.64,4 12,4C9.11,4 6.6,5.64 5.35,8.03C2.34,8.36 0,10.9 0,14A6,6 0 0,0 6,20H19A5,5 0 0,0 24,15C24,12.36 21.95,10.22 19.35,10.03Z' /%3E%3C/svg%3E");margin:7px 10px 7px 0;width:24px;height:24px;}
  
/* download techlystb */
/* Automatic theme changer */
.brr {content:'';display: block;border-bottom: 1px solid var(--contentL);margin: 12px 5px;}
.head1{font-size:14px;font-family:'Google Sans Text';color:#343435;margin-bottom:-7px;font-weight:unset}
.para1{margin-bottom:-11px}
.head1,.para1,.para2{margin-left:6px}
@media screen and (min-width:750px){.switch{left:205px;transform:rotate(90deg);top:-48px}}
@media screen and (max-width:361px) and (min-width:322px){.switch{left:220px!important;top:-45px!important}}
@media screen and (max-width:321px){.switch{left:202px!important;top:-46px!important;transform:rotate(90deg)!important}}
@media screen and (max-width:376px) and (min-width:362px){.switch{left:240px!important;top:-45px!important}}
@media screen and (max-width:415px) and (min-width:395px){.switch{left:280px!important;top:-45px!important}}
@media screen and (max-width:394px) and (min-width:377px){.switch{left:255px!important;top:-45px!important}}
@media screen and (max-width:749px) and (min-width:416px){.switch{left:286px;top:-45px}}
.switch{position:relative;display:inline-block;width:55px;height:30px;margin-bottom:-2000px}
.switch input{opacity:0;width:0;height:0}
label.switch {background-color:#d1d1d1;border-radius:8px}
.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;-webkit-transition:.4s;transition:.4s}.slider:before{position:absolute;content:"";height:22px;width:22px;left:3.5px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}input:checked+.slider{background-color:#56ff00}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{-webkit-transform:translateX(26px);-ms-transform:translateX(26px);transform:translateX(26px)}.slider.round{border-radius:8px}.slider.round:before{border-radius:5px}
/* Toc Type Colour Changer */.themeCNG {position: fixed ! important  ; z-index:5; top:180px ; right:0px ! important; box-shadow: 0 0 15px rgba(0,0,0,.07); border-radius:170px 0px 0px 170px  ;background:white; height:33px !important; padding:6px 7px 5px 10px; padding-right:15px}.drK .themeCNG {box-shadow:0px 2px 10px #000 ;background:#1c1c1c ;}.themeCNG svg{stroke-width:.80px ! important;}

/* Site Navigation Element */
.Medo-Tags{text-align:center;position:relative}.Medo-Tags ul{clear:both;margin:15px 0 20px;width:100%;display:flex;padding:0;flex-wrap:wrap;justify-content:space-between}.Medo-Tags.m-p-2 li{position:relative;width:30%;list-style:none;line-height:1.3em;text-align:center;border-radius:10px;margin:6px 0;background:var(--contentB);box-shadow:0 5px 35px rgb(0 0 0/7%);padding:6px 0 12px;display:flex;align-items:center;justify-content:center}.Medo-Tags li a{display:block;text-decoration:none;color:var(--fontC)}.Medo-Tags li svg{margin:3px 0;width:35px;height:35px;display:inline-block}.Medo-Tags li span{display:block;padding:0 3px}.drK .Medo-Tags li{background:var(--darkBa)}

/* Sponsore contanier */ 
.Sponsore-contanier{display:flex;flex-direction:row;justify-content:space-between;border:1px solid #e1e1e1;border-radius:15px}.Sponsore-cont{display:flex;align-items:center}.Sponsore-text svg.line{vertical-align:middle;padding-left:10px}span.Sponsore-text{border-radius:0 0 15px;border:1px solid #e1e1e1;border-top:0;border-right:0;padding:0 5px;height:30px}span.Sponsore-text p{display:contents;font-size:13px}a:hover{opacity:.9;transition:filter .1s}.Sponsore-cont p{font-size:14px}span.Sponsore-text:before{background:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' class='line' fill='none' stroke='%237a7a7a'><path d='M4.40476 15.5264L8.93476 20.0564C10.7948 21.9164 13.8148 21.9164 15.6848 20.0564L20.0748 15.6664C21.9348 13.8064 21.9348 10.7864 20.0748 8.91637L15.5348 4.39637C14.5848 3.44637 13.2748 2.93637 11.9348 3.00637L6.93476 3.24637C4.93476 3.33637 3.34476 4.92637 3.24476 6.91637L3.00476 11.9164C2.94476 13.2664 3.45476 14.5764 4.40476 15.5264Z'/><path d='M9.73486 12.2263C11.1156 12.2263 12.2349 11.107 12.2349 9.72632C12.2349 8.34561 11.1156 7.22632 9.73486 7.22632C8.35415 7.22632 7.23486 8.34561 7.23486 9.72632C7.23486 11.107 8.35415 12.2263 9.73486 12.2263Z'/><path d='M13.2349 17.2263L17.2349 13.2263'/></svg>") center/14px no-repeat;content:"";padding:10px}.Sponsore-contanier img.Sponsore{border-radius:15px;padding:10px}

/* Ads Blocker Detector */
  .detector {
    margin: 30px 0;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .detector::before {
    content: 'Checking...';
    padding: 10px 12px;
    background: #fff;
    color: #000;
    border-radius: 8px;
    box-shadow: 0 0 35px rgba(0, 0, 0, 0.1);
  }
  .detector.allowed::before {
    content: 'Ads are Allowed';
    background: #3d983d;
    color: #fff;
  }
  .detector.blocked::before {
    content: 'Ads are Blocked';
    background: #f56969;
    color: #fff;
  }

 /* Pop-Up Box Ads Blocker Detector */
.popSc{position:fixed;z-index:99981;top:0;bottom:0;left:0;right:0;padding:20px;background:#f3f5fe;display:flex;justify-content:center;align-items:center}
.popSc.hidden{display:none}
.popSc .popBo{position:relative;background:#fff;max-width:400px;display:flex;justify-content:center;align-items:center;flex-direction:column;padding:30px;border-radius:30px}
.popSc .popBo svg{display:block;width:50px;height:50px;fill:none !important;stroke:#08102b;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5}
.popSc .popBo h2{margin:10px 0 15px 0;font-size:1.2rem;font-weight:800;color:#08102b}
.popSc .popBo p{margin:0;line-height:1.7em;font-size:0.9rem;color:#08102b}
.popSc .popBo .popBtn{display:inline-flex;justify-content:center;align-items:center;height:50px;width:50px;outline:none;border:none;background:#f3f5fe;border-radius:50%;margin-top:20px;transition:all .2s ease;-webkit-transition:all .2s ease}
.popSc .popBo .popBtn:hover{transform:scale(1.05);-webkit-transform:scale(1.05)}
.popSc .popBo .popBtn svg{width:24px;height:24px;flex-shrink:0;opacity:.8}
.popSc .popBo .popBtn svg.r{animation:rotateIcn 1.5s infinite linear;-webkit-animation:rotateIcn 1.5s infinite linear}
.darkMode .popSc, .darkMode .popSc .popBo .popBtn{background:#1f1f1f}
.darkMode .popSc .popBo{background:#2c2d31}
.darkMode .popSc .popBo svg{stroke:#fefefe}
.darkMode .popSc .popBo p, .darkMode .popSc .popBo  h2{color:#fefefe}
@keyframes rotateIcn{from{transform:rotate(0deg)} to{transform:rotate(359deg)}}
@-webkit-keyframes rotateIcn{from{-webkit-transform:rotate(0deg)} to{-webkit-transform:rotate(359deg)}}

/* ---Main-IH3 snip1543 page pic--- */
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro); @import url(https://fonts.googleapis.com/css?family=Teko:700); .Main-IH3{display:flex;justify-content:center;align-items:center;flex-flow:wrap;margin:0;height:100%;} .snip1543 { background-color: #fff; color: #ffffff; font-family: 'Source Sans Pro', sans-serif; font-size: 16px; margin: 10px; max-width: 315px; min-width: 230px; overflow: hidden; position: relative; text-align: left; width: 100%; -webkit-transform: translateZ(0); transform: translateZ(0); } .snip1543 *, .snip1543 *:before, .snip1543 *:after { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.45s ease; transition: all 0.45s ease; } .snip1543 img { backface-visibility: hidden; max-width: 100%; vertical-align: top; } .snip1543:before, .snip1543:after { position: absolute; top: 0; bottom: 0; left: 0; right: 0; content: ''; background-color:#ff4a03; opacity: 0.5; -webkit-transition: all 0.45s ease; transition: all 0.45s ease; } .snip1543:before { -webkit-transform: skew(30deg) translateX(-80%); transform: skew(30deg) translateX(-80%); } .snip1543:after { -webkit-transform: skew(-30deg) translateX(-70%); transform: skew(-30deg) translateX(-70%); } .snip1543 figcaption { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: 1; bottom: 0; padding: 25px 40% 25px 20px; } .snip1543 figcaption:before, .snip1543 figcaption:after { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: #b81212; box-shadow: 0 0 20px rgba(0, 0, 0, 0.7); content: ''; opacity: 0.5; z-index: -1; } .snip1543 figcaption:before { -webkit-transform: skew(30deg) translateX(-100%); transform: skew(30deg) translateX(-100%); } .snip1543 figcaption:after { -webkit-transform: skew(-30deg) translateX(-90%); transform: skew(-30deg) translateX(-90%); } .snip1543 h3, .snip1543 p { margin: 0; opacity: 0; letter-spacing: 1px; } .snip1543 h3 { font-family: 'Teko', sans-serif; font-size: 36px; font-weight: 700; line-height: 1em; text-transform: uppercase; } .snip1543 p { font-size: 0.9em; } .snip1543 a { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; } .snip1543:hover h3, .snip1543.hover h3, .snip1543:hover p, .snip1543.hover p { -webkit-transform: translateY(0); transform: translateY(0); opacity: 0.9; -webkit-transition-delay: 0.2s; transition-delay: 0.2s; } .snip1543:hover:before, .snip1543.hover:before { -webkit-transform: skew(30deg) translateX(-20%); transform: skew(30deg) translateX(-20%); -webkit-transition-delay: 0.05s; transition-delay: 0.05s; } .snip1543:hover:after, .snip1543.hover:after { -webkit-transform: skew(-30deg) translateX(-10%); transform: skew(-30deg) translateX(-10%); } .snip1543:hover figcaption:before, .snip1543.hover figcaption:before { -webkit-transform: skew(30deg) translateX(-40%); transform: skew(30deg) translateX(-40%); -webkit-transition-delay: 0.15s; transition-delay: 0.15s; } .snip1543:hover figcaption:after, .snip1543.hover figcaption:after { -webkit-transform: skew(-30deg) translateX(-30%); transform: skew(-30deg) translateX(-30%); -webkit-transition-delay: 0.1s; transition-delay: 0.1s; } 
/*-- Share QR Start --*/ .auto-share-box {
  backdrop-filter: blur(10px);
  padding: 10px;
  border-radius: 16px;
  text-align: center;
  max-width: 220px;
  margin: 40px auto;
  border: 2px solid #4CAF50;
  box-shadow: 0 8px 30px rgba(0,0,0,0.4);
  font-family: 'Segoe UI', sans-serif;
}
.share-buttons {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}
.share-buttons button,
.share-buttons a {
  background: linear-gradient(135deg, #4CAF50, #2E7D32);
  color: white;
  padding: 10px 20px;
  font-size: 15px;
  border: none;
  border-radius: 10px;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.2s ease;
}
.share-buttons button:hover,
.share-buttons a:hover {
  transform: scale(1.05);
}
.copy-toast {
  display: none;
  margin-top: 10px;
  padding: 8px 16px;
  background: #4CAF50;
  border-radius: 20px;
  color: white;
  font-size: 14px;
  animation: fadeInOut 2s ease-in-out;
}
.qr-popup {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  backdrop-filter: blur(8px);
  background: rgba(0,0,0,0.7);
  z-index: 999;
}
.qr-box {
  background: #1c1c1c;
  color: white;
  border-radius: 12px;
  padding: 20px;
  max-width: 300px;
  margin: 12% auto;
  text-align: center;
  position: relative;
}
.qr-box hjh {
  margin-bottom: 10px;
}
.qr-close {
  position: absolute;
  right: 10px;
  top: 6px;
  font-size: 24px;
  cursor: pointer;
  color: #ccc;
}
.qr-close:hover {
  color: white;
}
.qr-download {
  margin-top: 10px;
  padding: 8px 16px;
  background: #4CAF50;
  border: none;
  color: white;
  border-radius: 8px;
  cursor: pointer;
  font-size: 16px;
}/*-- Share QR End --*/
 /* CSS News Ticker */
.ticker-wrap {
  display: block;
  border-top-left-radius: 21px;
  text-align: center;
  margin: 0 0px 20px 0px;
  padding: 5px;
  background: #fefefe;
  border-left: 5px solid #db3535
}
.ticker-wrap>span {
  display: inline-block;
  background: #fefefe;
  padding: 0;
  font: 700 13px 'roboto', sans-serif;
}
.ticker-wrap>span>a {
  color: #222;
  text-decoration: none
}
#ticker {
  height: 45px;
  overflow: hidden;
  background: #fefefe;
  text-align: left
}
#ticker ul {
  padding: 0;
  margin: 0;
  list-style: none
}
#ticker ul li {
  height: 45px;
  white-space: nowrap
}
#ticker ul li img {
  float: left;
  border-top-left-radius: 11px;
  width: 35px;
  height: 35px;
  margin: 5px 7px 5px 5px
}
#ticker ul li h3 {
  margin: 0;
  font: 700 16px 'roboto', sans-serif
}
#ticker ul li h3 a {
  color: #f10707;
  text-decoration: none;
  line-height: 25px!important
}
#ticker ul li .tickermeta {
  font: 400 13px 'roboto', sans-serif;
  line-height: 20px!important;
  color: #999
}
/* Tools widget */
.asyoutube{position:relative;display:flex;align-items:center;width:100%;background-color:#fefefe;margin:15px 0 0;padding:12px 15px;border:1px solid #ebeced;border-radius:3px;color:#161617;overflow:hidden
}
.asyoutube .asyoutube-img{width:50px;height:50px}
.asyoutube .asyoutube-img span{display:flex;align-items:center;justify-content:center;height:100%;background-color:#ebeced;border-radius:8px;color:#505050;font-weight:700;font-size:28px}
.asyoutube .asyoutube-content{width:calc(100% - 50px);padding-right:15px}
.asyoutube .asyoutube-content .title{display:block;font-weight:700;font-size:12px;margin:0}
.asyoutube .asyoutube-content .desc{display:block;font-size:11px;margin-top:2px;color:#505050}
.asyoutube.fletro{border:0;background-color:#CFEDEB;box-shadow:0 4px 18px 0 rgba(9,32,76,.035);justify-content:space-between;padding:0;overflow:visible}
.asyoutube.fletro .asyoutube-content{width:calc(100% - 100px);padding:15px 10px 15px 15px}
.asyoutube.fletro .asyoutube-img{width:100px;height:auto;flex-shrink:0}
.asyoutube.fletro .asyoutube-img img{position:absolute;bottom:0;right:0;max-width:110px}
.asyoutube.discount:after{content:'SEO Tools';font-weight:700;font-size:12px;display:flex;align-items:center;
justify-content:flex-end;width:80px;height:23px;padding-right:10px;background-color:#fa0324;
border-radius:20px 20px 2px 2px;color:#ffffff;position:absolute;bottom:0;right:0}
/* Post Body */
.post-body a.b-tooltip-container {
      position: relative;
      display: inline-block;
    }
    .post-body a.b-tooltip-container .b-tooltip {
      position: absolute;
      top: 100%;
      left: 50%;
      transform: translate(-20%, 1px);
      visibility: hidden;
      opacity: 0;
      z-index: 1;
      transition: opacity 0.2s ease-in-out;
    }
    .post-body a.b-tooltip-container .b-tooltip iframe {
      width: 200px;
      height: 198px;
      max-width: none;
      border: none;
      border-radius: 20px;
      box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.2);
    }
    .post-body a.b-tooltip-container:hover .b-tooltip {
      visibility: visible;
      opacity: 1;
    }
/* discount banner */
.at-banner { z-index: 999999; position: fixed; top: 0; right: 0; left: 0; background:#ff4f70; width: 100%; border-bottom: 1px solid;border-color: #c1f0db; box-sizing: border-box; transform: translateY(-150%); color: #fff; font-family: "Open Sans", sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; animation: at-banner-slide-in 0.8s ease forwards; } 
.at-banner__container { display: flex; align-items: center; flex-direction: row; justify-content: center; width: 90%; margin: 0 auto; padding: 10px 40px; box-sizing: border-box; } .at-banner__title { font-size: 18px; } .at-banner__text { margin: 0 20px 0 0; } .at-banner__button { display: inline-block; background: #fff; height: 30px; border: 0; border-radius: 2px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); padding: 0 20px; color: #974df3; font-size: 12px; font-weight: 700; line-height: 30px; text-decoration: none; white-space: nowrap; } .AT-banner-close { position: absolute; top: 50%; right: 20px; width: 20px; height: 20px; transform: translateY(-50%); cursor: pointer; } .AT-banner-close:before, .AT-banner-close:after { content: ""; position: absolute; top: 50%; left: 50%; display: block; background: #fff; width: 100%; height: 3px; border-radius: 2px; transform-origin: center; } .AT-banner-close:before { transform: translate(-50%, -50%) rotate(-45deg); } .AT-banner-close:after { transform: translate(-50%, -50%) rotate(45deg); } @keyframes at-banner-slide-in { 0% { transform: translateY(-150%); } 100% { transform: translateY(0%); } }