@charset "UTF-8";
/*
Theme Name: Anka Html Landing Page
Description:  قالب لندینگ آنکا
Version: 1.0.0
Author: Amir_KHP
Author URI: https://umx.ir
*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,top-header,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;outline:0}
html{height:100%;scroll-behavior:smooth}
body{font-size:62.5%;line-height:1;font-family:shabnam,Arial,Tahoma,Verdana,sans-serif}
article,aside,details,figcaption,figure,footer,top-header,menu,nav,section{display:block}
ol,ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
strong{font-weight:700}
input:focus{outline:unset}
table{border-collapse:collapse;border-spacing:0}
img{border:0;max-width:100%;height:auto}
a{text-decoration:none;color:inherit}
.clearfix:before,.container:after{content:"";display:table}
.clearfix:after{clear:both}
.clearfix{zoom:1}
.clear{clear:both}
*{box-sizing:border-box;transition:ease-in-out .15s}
@font-face{font-family:'shabnam';src:url(fonts/Shabnam-FD.eot);src:url(fonts/Shabnam-FD.eot?#iefix) format("embedded-opentype"),url(fonts/Shabnam-FD.woff2) format("woff2"),url(fonts/Shabnam-FD.woff) format("woff"),url(fonts/Shabnam-FD.ttf) format("truetype");font-weight:400;font-style:normal}
@font-face{font-family:'shabnam';src:url(fonts/Shabnam-Bold-FD.eot);src:url(fonts/Shabnam-Bold-FD.eot?#iefix) format("embedded-opentype"),url(fonts/Shabnam-Bold-FD.woff2) format("woff2"),url(fonts/Shabnam-Bold-FD.woff) format("woff"),url(fonts/Shabnam-Bold-FD.ttf) format("truetype");font-weight:700;font-style:normal}
:root{--main:#881C4A;--main-light:#FEF1EE;--second:#eb596e;--second-light:#F9A09C;--gray:#eee;--gray-light:#f5f5f5;--gray-dark:#9E9E9E;--white:#fff;--black:#212121;--overlay:rgba(0,0,0,.04)}
body{direction:rtl;font:normal 14px/24px shabnam;text-align:right;margin:0;padding:0;box-sizing:border-box;color:var(--black);background:var(--white)}
.container{width:1280px;margin:0 auto;position:relative}
.header{min-height:100vh;position:relative}
.topbar{padding:16px 0;display:flex;align-items:center;grid-column-gap:32px}
.header .logo img{max-height:115px}
.navigation{color:var(--black);padding:16px 0;font:normal 16px/1 shabnam}
.navigation ul{display:flex}
.navigation li{margin:0 16px}
.navigation li a{padding:4px 0}
.navigation li a:hover{color:var(--second)}
.open-btn{cursor:pointer;display:none}
.closebtn{width:0;position:fixed;top:0;right:0;background:rgba(0,0,0,.5);height:100vh;display:block;transition:none;z-index:100000}
.flex-header{display:flex;justify-content:flex-end;grid-column-gap:32px;min-height:calc(100vh - 156px);height:auto}
.header-title{width:50%;display:flex;flex-direction:column;justify-content:center;margin:128px 0}
.header-title h1{font:bold 48px/1 shabnam;color:var(--main);position:relative;display:inline}
.header-title h1::before{content:"";width:100%;height:32px;background:var(--main-light);display:block;position:absolute;z-index:-1;right:0;bottom:8px}
.header-title p.desc{font:normal 18px/32px shabnam;margin-top:32px}
.header-title a{font:bold 18px/1 shabnam;background:var(--second);padding:16px 24px;display:inline-block;margin-top:48px;color:var(--white);border-radius:8px;border:2px solid var(--second)}
.header-title a:hover{color:var(--second);background:transparent}
.header-title a::after{content:"\e912";margin-right:8px;vertical-align:middle;font-size:24px}
.header-element{background:var(--gray);width:50%;margin-top:-125px;display:flex;align-items:flex-end;border-radius:0 0 16px 16px;overflow:hidden;z-index:-1}
.header-element .light{background:var(--gray-light);width:100%;height:180px;position:relative}
.element{background-repeat:no-repeat;background-image:url(img/element.png);background-position: bottom;background-size:contain;width:100%;margin:-320px auto 0;background-position:bottom;background-size:contain;height:125vh;position:absolute;bottom:-16px;}
.header-bg{width:100%;height:100vh;background-image:url(img/overlay-bg.svg);position:absolute;top:0;right:0;z-index:-1;background-repeat:no-repeat;background-position:top}
.template-section{padding:48px 0}
.template-section:first-of-type .title{padding-top:48px}
.title{display:flex;justify-content:space-between;align-items:center;margin-bottom:48px}
.title h2,.footer-flex h2{font:bold 32px/1 shabnam;color:var(--main);position:relative;display:inline}
.title h2::before,.footer-flex h2::before{content:"";width:100%;height:24px;background:var(--main-light);display:block;position:absolute;z-index:-1;right:0;bottom:0}
.title p.desc{font:normal 18px/1 shabnam;margin-top:16px}
#product-offer-countdown{display:flex;align-items:center}
#product-offer-countdown p{background:var(--gray);padding:16px;min-height:64px;min-width:64px;display:flex;justify-content:center;align-items:center;color:var(--second);font:bold 24px/1 shabnam;border-radius:8px}
#product-offer-countdown span{color:var(--second);font:bold 24px/1 shabnam;margin:0 8px}
.title a{font:normal 18px/1 shabnam;color:var(--second);padding:4px 0}
.title a.with-icon::after{content:"\e912";margin-right:8px;vertical-align:middle;font-size:20px}
.title a:hover{color:var(--black)}
.offer-product-flex,.social-flex{display:grid;grid-template-columns:repeat(2,calc(50% - 16px));grid-gap:32px;align-items:center}
.offer-product-img,.social-img{display:flex;position:relative;grid-column-gap:32px;min-height:512px;height:100%}
.element-box1{background:var(--second);height:100%;border-radius:8px;width:calc(50% - 16px);position:relative;overflow:hidden}
.element-box1 i{color:var(--second-light);font-size:320px;display:block;position:absolute;bottom:-88px;right:-96px}
.element-box2{background:var(--gray);height:100%;width:32px;border-radius:8px}
.offer-product-img img,.social-img img{position:absolute;top:0;bottom:0;margin:auto;left:32px}
.offer-product-info h3,.social-info h3{font:bold 24px/1.8 shabnam;margin-bottom:16px}
.offer-product-price del{font:normal 16px/32px shabnam;color:var(--gray-dark)}
.offer-product-price ins{display:block;font:bold 22px/1 shabnam;text-decoration:none;color:var(--second);margin-top:8px}
.offer-product-price span{display:inline-block;color:var(--white);font:bold 16px/28px shabnam;padding:0 16px;border-radius:100px;margin-right:8px;background:var(--second)}
.offer-product-info ul{margin:32px 0}
.offer-product-info li{font:normal 16px/2 shabnam;color:var(--gray-dark);margin:8px 0}
.offer-product-info li::before,.plan-option li::before{content:"\e95a";display:inline-block;vertical-align:middle;margin-left:8px}
.offer-product-info a,.plan-btn,.social-btn{font:bold 18px/1 shabnam;background:var(--second);padding:16px 24px;display:inline-block;color:var(--white);border-radius:8px;border:2px solid var(--second)}
.offer-product-info a:hover,.plan-btn:hover,.social-btn:hover{color:var(--second);background:transparent}
.offer-product-info a::before,.plan-btn::before{content:"\e91e";margin-left:8px;vertical-align:middle;font-size:24px}
.grid-list{display:grid;grid-template-columns:repeat(4,calc(25% - 24px));grid-gap:32px 32px}
.product-img{position:relative;line-height:0;border-radius:8px;overflow:hidden;display:block;padding:24px 8px}
.product-img::after{content:"";position:absolute;width:100%;height:100%;background:var(--overlay);top:0;right:0;display:block}
.product-img img{display:block}
.sale-flash{position:absolute;top:16px;left:0;background:var(--second);font:bold 16px/1 shabnam;color:var(--white);width:50px;height:30px;display:flex;justify-content:center;align-items:center;border-radius:0 16px 16px 0;z-index:2}
.product-title{font:normal 16px/1.8 shabnam;margin:16px 0;display:block;width:100%}
.product-title h3{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.product-title:hover{color:var(--second)}
.product-footer{display:flex;justify-content:space-between;align-items:center}
.product-btn,.social-other a{width:48px;height:48px;background:var(--gray);border-radius:8px;display:flex;justify-content:center;align-items:center;font-size:28px;color:var(--gray-dark)}
.product-btn:hover,.social-other a:hover{background:var(--second-light);color:var(--second)}
.product-price{text-align:left}
.product-price del{font:normal 16px/1.8 shabnam;color:var(--gray-dark)}
.product-price ins,.product-price span{font:bold 18px/1.8 shabnam;text-decoration:none;color:var(--second)}
.sale-flash,.offer-product-price span{direction:ltr}
.sale-flash::after,.offer-product-price span::after{content:"٪"}
.product-box:hover .product-img,.plan-box:hover,.coupon-box:hover{transform:scale(1.02)}
.plan-box,.coupon-box{background:var(--gray);border-radius:8px;position:relative;padding:24px 16px;overflow:hidden}
.plan-box .circle,.coupon-box .circle{width:12px;height:12px;border:2px solid var(--second);border-radius:12px;margin-top:1px}
.plan-box h3,.coupon-box h3{font:bold 22px/1.4 shabnam;margin-top:24px}
.plan-box .product-price{margin-top:8px}
.plan-desc{font:normal 16px/1.8 shabnam;margin-top:16px;color:var(--gray-dark)}
.plan-option{margin-top:24px;font:normal 16px/1 shabnam}
.plan-option li:not(:last-of-type){margin-bottom:16px}
.plan-btn{width:100%;text-align:center;margin-top:32px}
.plan-box .product-price strong{font:normal 14px shabnam}
.plan-box .product-price strong::after{content:"/";margin:0 4px 0 2px}
.social-img{justify-content:flex-end}
.social-img .element-box1 i{left:-96px;right:unset}
.social-img img{left:96px}
.social-info .desc{font:normal 16px/1.8 shabnam;color:var(--gray-dark)}
.social-btn{margin-top:16px}
.social-btn::before{margin-left:8px;vertical-align:middle;font-size:24px}
.social-btn.instagram::before{content:"\e905"}
.social-btn.twitter::before{content:"\e904"}
.social-btn.facebook::before{content:"\e901"}
.social-btn.whatsapp::before{content:"\e903"}
.social-btn.mail::before{content:"\e943"}
.social-btn.phone::before{content:"\e924"}
.social-other-title{font:normal 18px/1 shabnam;margin-top:32px;color:var(--gray-dark)}
.social-other{display:flex;grid-gap:8px;margin-top:16px}
.coupon-box .desc{font:normal 16px/1.8 shabnam;color:var(--gray-dark);margin-top:4px}
.coupon-code{width:100%;padding:22px 8px 14px;box-shadow:inset 0 0 0 2px var(--gray-dark);border-radius:8px;margin-top:16px;text-align:center;text-transform:uppercase;font:normal 22px/1 shabnam;position:relative;overflow:hidden}
.coupon-code::before,.coupon-code::after{content:"";display:block;width:12px;height:12px;position:absolute;border-radius:100%;border:2px solid var(--gray-dark);background:var(--gray);top:calc(50% - 6px)}
.coupon-code::before{right:-6px}
.coupon-code::after{left:-6px}
.footer{padding:48px 0}
.advantages{padding:0;list-style:none;display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between}
.icon-box{display:flex;align-items:center}
.icon-box .box-wrapper{padding-right:12px}
.icon-box .box-title{font-size:18px;font-weight:700;color:var(--second)}
.box-icon{background:var(--second);width:64px;height:64px;border-radius:8px;display:flex;justify-content:center;align-items:center;font-size:32px;color:var(--white)}
.box-wrapper .desc{font:normal 14px/1.8 shabnam;margin-top:4px}
.footer-flex{display:grid;margin-top:88px;grid-column-gap:16px;grid-template-columns:auto auto}
.about p{font:normal 16px/1.8 shabnam;text-align:justify}
.namad{display:flex;justify-content:space-between;align-items:center}
.namad img{margin:0 10px}
p.copyright{font:normal 16px/2 shabnam;color:var(--gray-dark);display:block;text-align:center;margin-top:64px}
.footer-title{grid-column:1/3;margin-bottom:32px}
@media only screen and (max-width:1320px) {
.container{width:calc(100% - 64px)}
.offer-product-img img,.social-img img{max-width:90%;max-height:calc(100% + 48px);width:auto}
}
@media only screen and (max-width:1120px) {
.header-title{width:58.333%}
.header-element{width:41.666%}
}
@media only screen and (max-width:980px) {
.grid-list{grid-template-columns:repeat(2,calc(50% - 16px))}
.element-box1 i{font-size:280px}
}
@media only screen and (min-width:961px) {
.navigation ul{width:100%!important}
}
@media only screen and (max-width:960px) {
.navigation ul{height:100%;width:0;position:fixed;z-index:100002;top:0;left:0;background-color:#fff;overflow-x:hidden;transition:.3s;display:block;box-shadow:0 0 100px rgba(0,0,0,.5);color:#212121;margin-top:0;font-size:14px}
.navigation ul li{margin:32px 24px}
.navigation ul li:first-child{margin-top:64px}
.open-btn{display:block}
.header-title{margin:64px 0}
.logo img{height:48px;width:auto}
.topbar{justify-content:space-between}
.open-btn{font-size:28px;margin:0 16px}
}
@media only screen and (max-width:900px) {
.header-title{margin:48px 0}
.template-section:first-of-type .title{padding-top:16px}
.logo{margin:0 16px}
.social-flex,.offer-product-flex{grid-template-columns:1fr}
.offer-product-img,.social-img{flex-direction:column;grid-gap:32px;justify-content:center;min-height:unset}
.social-img{flex-direction:column-reverse;grid-row:1}
.element-box1{height:256px;width:100%}
.element-box1 i{font-size:320px}
.element-box2{height:32px;width:100%}
.offer-product-img img,.social-img img{left:0;right:0;margin:auto}
.flex-header{flex-direction:column-reverse}
.header-title,.header-element{width:100%}
.header-element{margin-top:-100px;padding-top:256px}
.open-btn{margin-right:32px}
}
@media only screen and (max-width:680px) {
.header-title h1{font-size:32px}
.header-title h1::before{height:24px;bottom:0}
.header-title p.desc,.icon-box .box-title,.header-title a,.title p.desc,.offer-product-info a,.plan-btn,.social-btn,.title a,.product-price ins,.product-price span,.social-other-title{font-size:16px}
.template-section{padding:32px 0}
.title h2,.footer-flex h2{font-size:24px}
.title h2::before,.footer-flex h2::before{height:18px}
.offer-product-info h3,.social-info h3,#product-offer-countdown p,#product-offer-countdown span,.plan-box h3,.coupon-box h3,.offer-product-info a::before,.plan-btn::before,.social-btn::before,.header-title a::after{font-size:20px}
.offer-product-price del,p.copyright,.about p,.offer-product-price span,.offer-product-info li,.product-title h3,.product-price del,.sale-flash,.plan-desc,.plan-option,.social-info .desc,.coupon-box .desc{font-size:14px}
.offer-product-price ins,.coupon-code{font-size:18px}
.box-wrapper .desc{font-size:12px}
#product-offer-countdown p{min-height:unset;min-width:48px;padding:12px 8px}
#product-offer-countdown span{margin:0 4px}
.product-btn,.social-other a{width:40px;height:40px;font-size:22px}
.box-icon{width:58px;height:58px;font-size:28px}
}
@media only screen and (max-width:540px) {
.container{width:calc(100% - 32px)}
.grid-list{grid-gap:8px;grid-template-columns:repeat(2,calc(50% - 4px))}
.footer-flex{grid-template-columns:100%}
.footer-title{grid-column:1}
.namad{justify-content:center;margin-top:16px}
.title{flex-direction:column;align-items:flex-start;grid-gap:16px}
.element-box1{height:186px}
.element-box1 i{font-size:220px}
}
@media only screen and (max-width:420px) {
html{overflow-x:hidden}
}
@media only screen and (max-width:380px) {
.grid-list{grid-template-columns:100%}
}
@font-face{font-family:'iconly';src:url(fonts/iconly.eot?d0odj8);src:url(fonts/iconly.eot?d0odj8#iefix) format("embedded-opentype"),url(fonts/iconly.ttf?d0odj8) format("truetype"),url(fonts/iconly.woff?d0odj8) format("woff"),url(fonts/iconly.svg?d0odj8#iconly) format("svg");font-weight:400;font-style:normal;font-display:block}
[class^="ic-"],[class*=" ic-"],.with-icon::after,.with-icon::before{font-family:'iconly'!important;speak:never;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.ic-close-x:before{content:"\e969"}
.ic-menu:before{content:"\e96a"}
.ic-facebook:before{content:"\e901"}
.ic-telegram:before{content:"\e902"}
.ic-whatsapp:before{content:"\e903"}
.ic-twitter:before{content:"\e904"}
.ic-instagram:before{content:"\e905"}
.ic-user:before{content:"\e906"}
.ic-user1:before{content:"\e907"}
.ic-activity:before{content:"\e908"}
.ic-add-user:before{content:"\e909"}
.ic-arrow-down-2:before{content:"\e90a"}
.ic-arrow-down-3:before{content:"\e90b"}
.ic-arrow-down-circle:before{content:"\e900"}
.ic-arrow-down-square:before{content:"\e90c"}
.ic-arrow-down:before{content:"\e90d"}
.ic-arrow-left-2:before{content:"\e90e"}
.ic-arrow-left-3:before{content:"\e90f"}
.ic-arrow-left-circle:before{content:"\e910"}
.ic-arrow-left-square:before{content:"\e911"}
.ic-arrow-left:before{content:"\e912"}
.ic-arrow-right-2:before{content:"\e913"}
.ic-arrow-right-3:before{content:"\e914"}
.ic-arrow-right-circle:before{content:"\e915"}
.ic-arrow-right-square:before{content:"\e916"}
.ic-arrow-right:before{content:"\e917"}
.ic-arrow-up-2:before{content:"\e918"}
.ic-arrow-up-3:before{content:"\e919"}
.ic-arrow-up-circle:before{content:"\e91a"}
.ic-arrow-up-square:before{content:"\e91b"}
.ic-arrow-up:before{content:"\e91c"}
.ic-bag-2:before{content:"\e91d"}
.ic-bag:before{content:"\e91e"}
.ic-bookmark:before{content:"\e91f"}
.ic-buy:before{content:"\e920"}
.ic-calendar:before{content:"\e921"}
.ic-call-missed:before{content:"\e922"}
.ic-call-silent:before{content:"\e923"}
.ic-call:before{content:"\e924"}
.ic-calling:before{content:"\e925"}
.ic-camera:before{content:"\e926"}
.ic-category:before{content:"\e927"}
.ic-chart:before{content:"\e928"}
.ic-chat:before{content:"\e929"}
.ic-close-square:before{content:"\e92a"}
.ic-danger:before{content:"\e92b"}
.ic-delete:before{content:"\e92c"}
.ic-discount:before{content:"\e92d"}
.ic-discovery:before{content:"\e92e"}
.ic-document:before{content:"\e92f"}
.ic-download:before{content:"\e930"}
.ic-edit-square:before{content:"\e931"}
.ic-edit:before{content:"\e932"}
.ic-filter-2:before{content:"\e933"}
.ic-filter:before{content:"\e934"}
.ic-folder:before{content:"\e935"}
.ic-game:before{content:"\e936"}
.ic-graph:before{content:"\e937"}
.ic-heart:before{content:"\e938"}
.ic-hide:before{content:"\e939"}
.ic-home:before{content:"\e93a"}
.ic-image-2:before{content:"\e93b"}
.ic-image:before{content:"\e93c"}
.ic-info-circle:before{content:"\e93d"}
.ic-info-square:before{content:"\e93e"}
.ic-location:before{content:"\e93f"}
.ic-lock:before{content:"\e940"}
.ic-login:before{content:"\e941"}
.ic-logout:before{content:"\e942"}
.ic-message:before{content:"\e943"}
.ic-more-circle:before{content:"\e944"}
.ic-more-square:before{content:"\e945"}
.ic-notification:before{content:"\e946"}
.ic-paper-download:before{content:"\e947"}
.ic-paper-fail:before{content:"\e948"}
.ic-paper-negative:before{content:"\e949"}
.ic-paper-plus:before{content:"\e94a"}
.ic-paper-upload:before{content:"\e94b"}
.ic-paper:before{content:"\e94c"}
.ic-password:before{content:"\e94d"}
.ic-play:before{content:"\e94e"}
.ic-plus:before{content:"\e94f"}
.ic-profile:before{content:"\e950"}
.ic-scan:before{content:"\e951"}
.ic-search:before{content:"\e952"}
.ic-send:before{content:"\e953"}
.ic-setting:before{content:"\e954"}
.ic-shield-done:before{content:"\e955"}
.ic-shield-fail:before{content:"\e956"}
.ic-show:before{content:"\e957"}
.ic-star:before{content:"\e958"}
.ic-swap:before{content:"\e959"}
.ic-tick-square:before{content:"\e95a"}
.ic-ticket-star:before{content:"\e95b"}
.ic-ticket:before{content:"\e95c"}
.ic-time-circle:before{content:"\e95d"}
.ic-time-square:before{content:"\e95e"}
.ic-unlock:before{content:"\e95f"}
.ic-upload:before{content:"\e960"}
.ic-video:before{content:"\e961"}
.ic-voice-2:before{content:"\e962"}
.ic-voice:before{content:"\e963"}
.ic-volume-down:before{content:"\e964"}
.ic-volume-off:before{content:"\e965"}
.ic-volume-up:before{content:"\e966"}
.ic-wallet:before{content:"\e967"}
.ic-work:before{content:"\e968"}
.social-btn.telegram::before{content:"\e902"}