.eds_template_Details_Article_Accordion .swiper-slide {
    height: auto
}

.projects.BlogList .SecondContent p {
    height: 8em
}

.eds_news_Iransite2023 .accordion-second .answer {
    max-height: 10rem;
    overflow: hidden
}

.LandingDetail .WhyWebDesign,
.edn__contentBlock_wrapper .edn_pagination,
.portfo.cat .Description,
.related_articles h2 {
    text-align: center
}

.portfo.cat {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1rem;
    margin-bottom: 2rem;
    list-style: none
}

.Ecommerce .Item,
.portfo .project {
    position: relative;
    bottom: 0;
    box-shadow: 0 .1em .2em var(--Shadow-Accent)
}

.portfo .ImageBox {
    background: var(--Department-Primary-Color);
    overflow: hidden;
    /* max-height: 22em; */
}

.Ecommerce .Description,
.portfo .Description {
    position: relative;
    display: block;
    bottom: 0;
    height: 5.5rem
}

.portfo .Description .Content:hover {
    max-height: 9.5rem;
    bottom: 0;
    transition: .5s linear
}

.portfo .Description .Content {
    background: var(--White-Color);
    position: absolute;
    bottom: 0;
    width: 100%;
    transition: max-height .6s ease-out;
    max-height: 5.5em;
    overflow: hidden
}

.portfo .Description h3 {
    font-size: 1.4em;
    padding: .5em
}

.portfo .Description p {
    padding: 1.5em;
}

.portfo .SeeMore {
    padding: 1.2em 1.8em;
    position: relative;
    background: var(--White-Color)
}

.Vetical .LeftTabs,
.Vetical .tab {
    position: sticky;
    align-self: start;
    top: 5rem
}

.ednMoreArticlesTriggerWrapper {
    display: flex;
    justify-content: flex-end;
    padding: 2em 0
}

.ednMoreArticlesTriggerWrapper button {
    background: var(--Department-Back-Color);
    color: var(--White-Color);
    border: 0;
    padding: .8em 2em;
    cursor: pointer
}

.Cat1List .Item:nth-child(2n) img,
.GraphicCats.Department:after,
.GraphicCats.Department:before,
.edNews__commentsWrapper .GDPR input[type=checkbox],
.edNews__editCommentContainer,
.edNews_loadMoreTriggerWrapper .loadingOverlay,
.edNews_loadMoreTriggerWrapper.hide,
.ednMoreArticlesTriggerWrapper button .loadingOverlay,
.edn__contentBlock_wrapper.edn__contentBlock_disableNextPage .edn__contentBlock_nextPage,
.edn__contentBlock_wrapper.edn__contentBlock_disablePreviousPage .edn__contentBlock_previousPage,
.edn__contentBlock_wrapper.edn__contentBlock_noContent .edn__contentBlock_nextPage,
.edn__contentBlock_wrapper.edn__contentBlock_noContent .edn__contentBlock_previousPage,
.edn_contentBlock_trigger,
.eds_contentError {
    display: none
}

.PortfoTitle h1 {
    width: 100%;
    text-align: center
}

.IranSiteServices i,
.LandingDetail .LandingTable ul li:before,
.WhyWebDesign i {
    width: 37px;
    height: 37px;
    background: url(/DesktopModules/EasyDNNnews/Templates/_default/Iransite2023/images/LandingIcons.svg) 0 0/cover no-repeat
}

.PortfoTitle:after,
.PortfoTitle:before {
    content: "";
    width: 100%;
    height: .1em;
    border: .1em solid var(--Silver-Primary-Color);
    display: block;
    margin-top: 1em
}

.PortfoTitle {
    display: flex;
    width: 100%;
    justify-content: space-between
}

.PortfoSummary {
    margin: 2em 0;
    padding: 0 1em
}

.tab_wrap.Vetical {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr
}

.Vetical .tab-contents {
    grid-column: 2/12;
    grid-row: 1/20
}

.Vetical .tab {
    grid-column: 1/2
}

.Vetical .LeftTabs {
    grid-column: 12/12
}

.Vetical .LeftTabs .tablink,
.Vetical .LeftTabs .tablinks {
    margin: .2em 0 0 auto
}

.Vetical .tablink,
.Vetical .tablinks {
    order: -1;
    cursor: pointer;
    transition: .2s ease-in-out;
    text-align: center;
    line-height: 2em;
    width: 3em;
    position: relative;
    margin: .2em auto 0 0;
    background: 0 center #fff;
    height: 3em;
    display: block;
    background: var(--Department-Back-Color)
}

.Vetical .tab-content {
    background-color: var(--Department-Back-Color);
    display: none;
    margin: 0 .5em;
    border: .1em solid var(--Silver-Primary-Color);
    padding: .8em .8em 4em
}

.tab_wrap.Vetical .LeftTabs label.activated {
    width: 100%;
    display: block;
    color: var(--White-Color);
    background: var(--Department-Back-Color)
}

.edNews__editingComment .edNews__editCommentContainer,
.edNews_loadMoreTriggerWrapper.loading,
.tab_wrap.Vetical label.activated span {
    display: block
}

.tab_wrap.Vetical .LeftTabs label.activated .tab-title {
    background: 0 0
}

.tab_wrap.Vetical label.active,
.tab_wrap.Vetical label:hover {
    color: var(--White-Color);
    background: var(--Department-Back-Color);
    display: block;
    width: 100%
}

.tab_wrap.Vetical .tab-title {
    height: 3em;
    background: url(/DesktopModules/EasyDNNnews/Templates/_default/Iransite2023/images/PortfoIcons.png) no-repeat;
    background-position-y: center
}

.tab_wrap.Vetical label[data-name=Phonetab] span {
    font-size: .8rem;
    line-height: 3rem
}

.tab_wrap.Vetical [data-name=AboutTab] .tab-title,
.tab_wrap.Vetical [data-name=BlogTab] .tab-title,
.tab_wrap.Vetical [data-name=ContactTab] .tab-title,
.tab_wrap.Vetical [data-name=VideoTab] .tab-title {
    background-position-x: 0px
}

.tab_wrap.Vetical [data-name=HomeTab] .tab-title {
    background-position-x: -173px
}

.tab_wrap.Vetical [data-name=StoreTab] .tab-title {
    background-position-x: -44px
}

.tab_wrap.Vetical [data-name=LandingTab] .tab-title {
    background-position-x: -130px
}

.tab_wrap.Vetical [data-name=TechnologyTab] .tab-title {
    background-position-x: -260px
}

.tab_wrap.Vetical [data-name=LinkTab] .tab-title {
    background-position-x: -87px
}

.tab_wrap.Vetical.Vetical [data-name=Phonetab] .tab-title {
    background-position-x: -219px
}

.tab_wrap.Vetical label span {
    line-height: 3em;
    display: none;
    padding: 0 .5em
}

.tab_wrap.Vetical .tab-content.active {
    display: block;
    height: 100%;
    position: relative;
    animation: .2s quick-grow-in
}

.tab_wrap.Vetical .tab-title:hover,
.tab_wrap.Vetical label.active .tab-title {
    background-image: none
}

.tab_wrap.Vetical label.active span,
.tab_wrap.Vetical label:hover span {
    display: block;
    color: var(--White-Color)
}

@keyframes quick-grow-in {
    0% {
        display: none;
        opacity: 0
    }

    1% {
        display: block;
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.ColorPalleteSection .Title,
.PortfoDetail .FontsSection .Title,
.PortfoDetail .TechnologySection .Title {
    text-align: left
}

.ColorPalleteSection .Title span,
.PortfoDetail .FontsSection .Title span,
.PortfoDetail .TechnologySection .Title span {
    font-weight: 600;
    font-size: 1.2em
}

.PortfoDetail .FontsSection,
.PortfoDetail .TechnologySection {
    padding: 0 .8em 0 .4em
}

.PortfoDetail .FontsSection .Characters .EnglishName,
.PortfoDetail .FontsSection .Characters .PersianName {
    padding: .3em 0
}

.PortfoDetail .FontsSection .Characters .EnglishName,
.PortfoDetail .TechnologySection .Icons {
    direction: ltr
}

.PortfoDetail .FontsSection .Characters .EnglishName span,
.PortfoDetail .FontsSection .Characters .PersianName span {
    font-weight: 600
}

.PortfoDetail .FontsSection .Characters .EnglishName p,
.PortfoDetail .FontsSection .Characters .PersianName p {
    margin: .5em 0
}

.PortfoDetail .FontsSection .Characters .EnglishName p {
    text-align-last: left
}

.PortfoDetail .TechnologySection .Icons {
    margin-top: 1em;
    gap: .4em
}

.PortfoDetail .TechnologySection i {
    height: 2.1em;
    background-image: url("/DesktopModules/EasyDNNnews/Templates/_default/Iransite2023/images/TechIcons.png");
    margin: 0;
    padding: 0;
    border: 0
}

.PortfoDetail .TechnologySection i.html5 {
    width: 18px;
    background-position: 0 0
}

.PortfoDetail .TechnologySection i.jquery {
    width: 95px;
    background-position: -18px 0
}

.PortfoDetail .TechnologySection i.css3 {
    width: 21px;
    background-position: -115px 0
}

.PortfoDetail .TechnologySection i.handelbarjs {
    width: 59px;
    background-position: -134px 0
}

.PortfoDetail .TechnologySection i.ajax {
    width: 49px;
    background-position: -195px 0
}

.PortfoDetail .TechnologySection i.php {
    width: 50px;
    background-position: -245px 0
}

.PortfoDetail .TechnologySection i.mysql {
    width: 48px;
    background-position: -295px 0
}

.PortfoDetail .TechnologySection i.javascript {
    width: 43px;
    background-position: -343px 0
}

.PortfoDetail .TechnologySection i.bootstrap {
    width: 44px;
    background-position: -386px 0
}

.PortfoDetail .TechnologySection i.react {
    width: 73px;
    background-position: -430px 0
}

.PortfoDetail .TechnologySection i.sqlserver {
    width: 31px;
    background-position: -503px 0
}

.PortfoDetail .TechnologySection i.iis {
    width: 58px;
    background-position: -534px 0
}

.PortfoDetail .TechnologySection i.dnn {
    width: 30px;
    background-position: -593px 0
}

.PortfoDetail .TechnologySection i.wordpress {
    width: 25px;
    background-position: -623px 0
}

.PortfoDetail .TechnologySection i.swiper {
    width: 23px;
    background-position: -649px 0
}

.PortfoDetail .TechnologySection i.owl {
    width: 22px;
    background-position: -672px 0
}

.PortfoDetail .TechnologySection i.slick {
    width: 49px;
    background-position: -694px 0
}

.PortfoDetail .TechnologySection i.selectjs {
    width: 41px;
    background-position: -749px 0
}

.PortfoDetail .TechnologySection i.woocommerce {
    width: 44px;
    background-position: -790px 0
}

.PortfoDetail .TechnologySection i.restfull {
    width: 88px;
    background-position: -834px 0
}

.PortfoDetail .TechnologySection i.redis {
    width: 76px;
    background-position: -922px 0
}

.PortfoDetail .TechnologySection i.sass {
    width: 35px;
    background-position: -998px 0
}

.PortfoDetail .TechnologySection i.lighthouse {
    width: 27px;
    background-position: -1033px 0
}

.PortfoDetail .TechnologySection i.NetCore {
    width: 28px;
    background-position: -1061px 0
}

.PortfoDetail .TechnologySection i.Chartjs {
    width: 24px;
    background-position: -1089px 0
}

.PortfoDetail .TechnologySection i.gridjs {
    width: 77px;
    background-position: -1118px 0
}

.PortfoDetail .TechnologySection i.angularjs {
    width: 90px;
    background-position: -1195px 0
}

.PortfoDetail .TechnologySection i.ratyo {
    width: 25px;
    background-position: -1285px 0
}

.PortfoDetail .TechnologySection i.magictools {
    width: 141px;
    background-position: -1315px 0
}

.PortfoDetail .TechnologySection i.jqueryui {
    width: 102px;
    background-position: -1456px 0
}

.PortfoDetail .TechnologySection i.leaflet {
    width: 92px;
    background-position: -1558px 0
}

.PortfoDetail .TechnologySection i.semanticui {
    width: 29px;
    background-position: -1650px 0
}

.PortfoDetail .TechnologySection i.nodejs {
    width: 86px;
    background-position: -1679px 0
}

.PortfoDetail .TechnologySection i.expressjs {
    width: 86px;
    background-position: -1765px 0
}

.PortfoDetail .TechnologySection i.mongodb {
    width: 63px;
    background-position: -1851px 0
}

.PortfoDetail .TechnologySection i.vuejs {
    width: 68px;
    background-position: -1918px 0
}

.PortfoDetail .TechnologySection i.tailwindcss {
    width: 115px;
    background-position: -1986px 0
}

.ColorPalleteSection .ChartTop,
.ColorPalleteSection .ColorBox {
    margin-top: 1em
}

.PortfoDetail .tab-content .row>div:first-of-type {
    border-left: .1em solid var(--Silver-Primary-Color)
}

.PortfoDetail .ColorPalleteSection .Chart {
    width: 100%;
    height: 3.2em;
    border: .1em solid var(--Silver-Primary-Color)
}

.PortfoDetail .ColorPalleteSection .Box>span {
    text-align: center;
    width: 100%;
    padding: .5em 0;
    direction: ltr;
    font-family: sans-serif;
    font-weight: 400
}

.PortfoDetail .ColorPalleteSection .Box>span:first-of-type {
    border-bottom: .1em solid var(--Silver-Primary-Color)
}

.PortfoDetail .ColorPalleteSection .Box>span:last-of-type {
    border-top: .1em solid var(--Silver-Primary-Color);
    font-weight: 100
}

.PortfoDetail .ColorPalleteSection .Box .ColorBox i {
    width: 2.3em;
    height: 2.3em;
    border-radius: 50%;
    display: block;
    border: .1em solid var(--Silver-Primary-Color)
}

.PortfoDetail .ColorPalleteSection .Box {
    gap: .2em;
    width: 100%
}

.PortfoDetail .ColorPalleteSection .ColorBoxes {
    padding-top: 4em
}

.LandingDetail {
    position: relative;
    padding: 2em 0
}

.LandingDetail .Top {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    max-height: 25rem
}

.LandingDetail .Top p {
    margin: 1rem 0 4rem;
    line-height: 2.3rem
}

.LandingDetail .Top>div:nth-child(3) a {
    padding: .7rem 1rem;
    background: var(--Back-Color-1);
    color: var(--White-Color)
}

.LandingDetail .CounselingSection:before {
    content: url(/DesktopModules/EasyDNNnews/Templates/_default/Iransite2023/images/LandingStar.png);
    margin-top: -4.5rem
}

.LandingDetail .CounselingSection {
    background: var(--Silver-Bg);
    border-bottom: .1rem solid var(--Department-Primary-Color, var(--Color-4-Primary))
}

.LandingDetail .CounselingSection p,
.LandingDetail .CounselingSection strong {
    font-size: 1.42rem;
    text-align: center
}

.LandingDetail .CounselingSection p {
    font-weight: 100;
    text-align-last: center
}

.LandingDetail .CounselingSection a {
    padding: .7rem 1.5rem;
    background: var(--Department-Primary-Color, var(--Color-4-Primary));
    color: var(--White-Color)
}

.LandingDetail .FullArticle img {
    width: 100%;
    height: auto
}

.FullArticle .LandingSecondImage {
    padding: 0 2rem 0 0
}

.FullArticle .in_article_image~:where(h1, h2, h3, h4, h5, h6)+p {
    /* min-height: 17rem; */
}

.FullArticle .in_article_image:nth-child(odd) {
    /* float: right; */
    padding: 2rem 0 1rem 1rem
}

.FullArticle .in_article_image:nth-child(2n) {
    /* float: left; */
    padding: 2rem 1rem 1rem 0
}

.LandingDetail .FullArticle p {
    line-height: 2.2em;
    text-align: justify !important
}

.LandingDetail .FullArticle h2,
.LandingDetail .FullArticle h3,
.LandingDetail .FullArticle h4,
.LandingDetail .FullArticle h5 {
    line-height: 3em
}

.LandingDetail .article-heading {
    max-height: 22rem;
    overflow: auto;
    padding: .5rem 0
}

.LandingDetail .WhyWebDesign h2 {
    margin: 2em 0
}

.LandingDetail .WhyWebDesign .items .item {
    background: var(--Silver-Bg);
    padding: 2em;
    border-bottom: .1em solid var(--Color-1-Primary)
}

.LandingDetail .IranSiteServices {
    background: var(--Silver-Bg);
    padding: 4em;
    margin: 2em 0
}

.IranSiteServices .col-lg-6 {
    padding: 3em
}

.IranSiteServices i,
.WhyWebDesign i {
    background-position-y: center;
    margin: 1em
}

.IranSiteServices i.SeoService {
    background-position-x: -185px
}

.IranSiteServices i.RsponsiveService {
    background-position-x: -148px
}

.IranSiteServices i.UiUx {
    background-position-x: -222px
}

.IranSiteServices i.SupportService {
    background-position-x: -259px
}

.WhyWebDesign i.Chance {
    background-position-x: -111px
}

.WhyWebDesign i.Quality {
    background-position-x: 0
}

.WhyWebDesign i.EarnMoney {
    background-position-x: -74px
}

.WhyWebDesign i.Satisfaction {
    background-position-x: -37px
}

.LandingDetail .IranSiteServices h2 {
    text-align: center;
    margin: 2em 0;
    font-size: 1.35em;
    font-weight: 500
}

.LandingDetail .IranSiteServices h3 {
    font-size: 1.28em;
    font-weight: 300;
    margin: .7em 0
}

.LandingDetail .IranSiteServices p {
    line-height: 2.3em;
    overflow-y: auto;
    height: 14em;
    padding: 0 0 0 1.5em
}

.LandingDetail .ContactUs {
    background: var(--Back-Color-2);
    gap: 3em;
    padding: 2em 0;
    margin: 4em 0
}

.LandingDetail .ContactUs a,
.LandingDetail .ContactUs strong {
    color: var(--White-Color);
    font-size: 1.92em;
    font-weight: 100
}

.LandingDetail .LandingTable {
    margin: 2em 0;
    padding: 0 7em
}

.LandingTable h2 {
    text-align: center;
    margin: 2em 0
}

.LandingDetail .LandingTable ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: .1em solid var(--Silver-Primary-Color);
    margin: 0;
    padding: 0
}

.LandingDetail .LandingTable ul li {
    list-style: none;
    border: .1em solid var(--Silver-Primary-Color);
    padding: .7em;
    display: flex;
    justify-content: start;
    align-items: center
}

.LandingDetail .LandingTable ul li:before {
    content: "";
    background-position-y: center;
    display: block;
    background-position-x: -297px
}

.LandingDetail .accordion-second {
    max-height: 100%;
    margin: 2em 0
}

.LandingDetail .ContactWays {
    max-height: 14em;
    background: var(--DotNetNuke-Back-Color);
    color: var(--White-Color);
    position: relative;
    align-items: center;
    display: flex;
    justify-content: center
}

.ContactWays .First {
    padding-right: 5em
}

.ContactWays p {
    line-height: 4em
}

.LandingDetail .ContactWays .Contacts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 1em
}

.LandingDetail .ContactWays img {
    max-height: 20em;
    width: auto
}

.BlogList .Btn {
    font-size: 1rem;
    background: var(--Department-Back-Color);
    font-weight: 400;
    color: var(--White-Color);
    padding: .7em 1.7em;
    margin-right: .5em;
    text-decoration: none;
    line-height: 2.5em
}

.BlogList,
.Cat2List {
    position: relative
}

.BlogList .ImageBox img,
.Cat2List .ImageBox img {
    height: 22.85em;
    object-fit: cover
}

.Cat2List .Cat2Item {
    padding: 0 5em
}

.BlogList .BlogItem p,
.Cat2List .Cat2Item p {
    margin-bottom: 3em
}

.BlogList .BlogItem .ItemBottom>*,
.Cat2List .Cat2Item .ItemBottom>* {
    font-size: .9em
}

.Cat1List {
    display: grid;
    gap: .1em;
    grid-template-columns: 1fr 1fr 1fr;
    background: var(--Silver-Primary-Color);
    overflow: hidden
}

.Cat1List .Item {
    display: flex;
    max-height: 12em;
    justify-content: center;
    background: var(--White-Color);
    border-bottom: .2em em solid var(--Department-Primary-Color);
    height: 12em;
    position: relative
}

.Cat1List .Item:hover:nth-child(odd) .Overlay {
    animation: .7s alternate slideup;
    opacity: 1
}

.Cat1List .Item:nth-child(odd) .Overlay {
    opacity: 0;
    bottom: 0;
    display: block;
    position: absolute;
    width: 100%;
    background: var(--Silver-Bg);
    border-bottom: .2em solid var(--Department-Primary-Color);
    animation: .7s slideup-out
}

@keyframes slideup {
    from {
        height: 0%
    }

    to {
        height: 100%
    }
}

@keyframes slideup-out {
    from {
        height: 100%
    }

    to {
        height: 0%
    }
}

.Cat1List .Item:nth-child(2n) .Overlay {
    display: block;
    position: relative;
    width: 100%;
    background: var(--Silver-Bg);
    top: 0;
    border-top: .2em solid var(--Department-Primary-Color);
    height: 100%;
    animation: .7s slidedown-out
}

.Cat1List .Item:hover:nth-child(2n) .Overlay {
    animation: .7s backwards slidedown;
    opacity: 1
}

@keyframes slidedown {
    from {
        height: 0%;
        border-top: none
    }

    to {
        height: 100%
    }
}

@keyframes slidedown-out {
    from {
        height: 100%;
        border-top: none
    }

    to {
        height: 0%
    }
}

.Cat1List .Item .Overlay p {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    top: 0;
    text-align-last: center
}

.Cat1List .Item:nth-child(5n) {
    border-left: 0
}

.Cat1List .Item:nth-child(odd) img {
    width: 100%;
    height: calc(12em - .2em);
    object-fit: cover;
    opacity: .2
}

.Overlay {
    opacity: 0;
    transition: .5s linear
}

.Orginal {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: absolute;
    height: 100%
}

.Orginal h2 {
    font-size: 1.2em;
    margin: auto 0
}

.Cat1List .Item:nth-child(30)~div {
    border-bottom: none
}

.GraphicCats.Department {
    height: 100% !important;
    overflow: auto !important
}

.GraphicCats .Caption {
    gap: 1.8em;
    margin-bottom: 1.8em
}

.GraphicCats .Caption span {
    color: var(--Silver-tertiary-Color)
}

.GraphicCats .Caption strong,
.GraphicCats .Caption strong>span {
    font-size: 1.4rem;
    font-weight: 500;
    width: 65%;
    line-height: 2em;
    color: var(--Black-Color);
    position: relative;
    margin: 0;
    display: inline;
    padding: 0;
    z-index: 2
}

.GraphicCats .Caption strong>span:before {
    content: "";
    background: var(--Department-Back-Color);
    display: block;
    position: absolute;
    width: 100%;
    height: 50%;
    bottom: 0;
    left: 0;
    z-index: -1;
    opacity: 80%
}

.GraphicCats .first em {
    font-size: 1.8rem;
    line-height: 1.45em;
    font-style: normal;
    font-weight: 400;
    padding: 1rem 0
}

.GraphicCats .List {
    background: var(--White-Color);
    margin: 1rem 0;
    box-shadow: 0 1px 2px var(--Shadow-Accent);
    position: relative
}

.GraphicCats .image {
    height: auto;
    width: 100%;
    background: var(--Department-Back-Color);
    color: var(--White-Color)
}

.GraphicCats .Description a,
.GraphicCats .Description p {
    padding: .8rem 1rem;
    color: var(--Black-Color);
    margin: 0;
    line-height: 1.8rem
}

.GraphicCats .Description h2 {
    font-size: 1.2rem
}

.GraphicCats .SeeMore {
    height: 3rem;
    margin-left: 1rem
}

.GraphicCats .SeeMore a {
    color: var(--Black-Color);
    font-size: .9rem
}

.article_image,
.eds_mediaWrapper {
    width: 80% !important;
    height: auto;
    margin: 0 auto
}

.edNews__commentPendingApproval,
.edNews_errorMessage {
    transition: .3s ease-in-out;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    display: block
}

.edNews__commentPendingApproval.show,
.edNews_errorMessage.show {
    max-height: 3rem;
    opacity: 1;
    background: var(--accent-color5);
    padding: .4em
}

.edNews__commentsWrapper .btn-submit {
    background: var(--Black-Color);
    color: var(--White-Color);
    transition: .3s ease-in-out;
    cursor: pointer
}

.edNews__commentsWrapper .btn-submit:hover {
    background: var(--accent-color4)
}

.edNews__commentsWrapper :where(input[type=text], input[type=email], textarea) {
    outline: 0;
    padding: 1rem;
    width: -webkit-fill-available;
    border-bottom: solid var(--Shadow-Accent);
    transition: .3s ease-in-out;
    border-width: 0 0 .1em
}

.edNews__commentsWrapper :where(input[type=text], input[type=email], textarea)::placeholder {
    text-align: right !important;
    font-family: IranSite;
    color: var(--Silver-Secondary-Color);
    transition: .3s ease-in-out
}

input:where([type=email], [type=cell]) {
    direction: ltr
}

.edNews__commentsWrapper .form-group label {
    margin-top: 1rem;
    display: none;
    padding: .4rem 0
}

.edNews__commentsWrapper :where(input[type=text], input[type=email], textarea):focus {
    border-color: var(--Accent-Color)
}

.edNews__commentsWrapper :where(input[type=text], input[type=email], textarea):focus::placeholder {
    letter-spacing: -.05rem;
    font-size: .9rem
}

.edNews__commentsWrapper .GDPR input[type=checkbox]+label {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: .2em;
    gap: 1rem
}

.edNews__commentsWrapper .GDPR input[type=checkbox]+label:before {
    content: "\2714";
    border: .1em solid var(--Black-Color);
    border-radius: .2em;
    display: flex;
    color: transparent;
    transition: .2s;
    padding: 0 .5em
}

.edNews__commentsWrapper .GDPR input[type=checkbox]+label:active:before {
    transform: scale(0)
}

.edNews__commentsWrapper .GDPR input[type=checkbox]:checked+label:before {
    background-color: #3cb371;
    border-color: #3cb371;
    color: #fff
}

.edNews__commentsWrapper .GDPR input[type=checkbox]:disabled+label:before {
    transform: scale(1)
}

.edNews__commentsWrapper .GDPR input[type=checkbox]:checked:disabled+label:before {
    transform: scale(1);
    background-color: #bfb;
    border-color: #bfb
}

.edNews__commentsCommentFormWrapper .edNews__replyingToMessage {
    opacity: 0;
    visibility: hidden;
    transition: .3s ease-in-out
}

.edNews__commentsCommentFormWrapper.edNews__replyingToComment .edNews__replyingToMessage {
    opacity: 1;
    visibility: visible
}

.edNews__commentsCollapseWrapper {
    width: 100%
}

.edNews_commentDetails .media-body {
    flex: 1 0 80%
}

.edNews__commentVoting_upvote .fa-thumbs-o-up:before {
    color: green;
    font-size: 1.5rem
}

.edNews__commentVoting_downvote .fa-thumbs-o-down:before {
    color: red;
    font-size: 1.5rem
}

.edNews_commentActions span,
.edNews_numberVotes {
    color: var(--accent-color1)
}

.edNews_loadMoreTriggerWrapper {
    display: flex;
    justify-content: center
}

@media (max-width:768px) {
    .ContactWays .First {
        padding: 0
    }

    .LandingDetail .Top {
        max-height: 100%
    }

    .ContactWays .First p {
        text-align: center;
        text-align-last: center
    }

    .tab_wrap label.active span,
    .tab_wrap label:hover span {
        display: none
    }

    .tab_wrap .tab-title:hover,
    .tab_wrap label.active .tab-title {
        background-image: url(/DesktopModules/EasyDNNnews/Templates/_default/Iransite2023/images/PortfoIcons.png)
    }

    .tab_wrap .tab-title {
        margin-left: -.2em
    }

    .LandingDetail .LandingTable ul,
    .portfo.cat {
        grid-template-columns: 1fr
    }

    .LandingDetail .IranSiteServices {
        padding: 3em 1em
    }

    .LandingDetail .LandingTable {
        padding: .5em
    }

    .PortfoTitle:after,
    .PortfoTitle:before {
        content: "";
        width: 100%;
        height: .1em;
        border: .1em solid var(--Silver-Primary-Color);
        display: block;
        margin-top: 1em;
        max-width: 20%
    }

    .LandingDetail .ContactWays {
        max-height: 90%;
        text-align: center;
        padding: 1em
    }

    .LandingDetail .ContactWays .Contacts {
        grid-template-columns: 1fr;
        margin-bottom: 2em
    }

    .Cat1List {
        grid-template-columns: 1fr 1fr 1fr
    }

    .Cat1List .Item:last-of-type {
        grid-column: 1/4
    }

    .article_image,
    .eds_mediaWrapper {
        width: 100% !important
    }
}

.ServicesList .slick-slide {
    padding: 0 .4rem
}

.Departments.ServicesList .image {
    height: 12.28rem
}

.ServicesList h2 {
    font-size: 1.1rem
}

.portfosilder .project {
    box-shadow: 0 .1em .2em #dadce0;
    border-bottom: .1em solid var(--Department-Primary-Color)
}

.portfosilder .project :where(h2, h3) {
    font-size: 1rem
}

.portfosilder .project :where(span, .SeeMore a) {
    font-size: .9rem;
    color: var(--Silver-Secondary-Color)
}

.article_pager {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
    gap: .5rem
}

.article_pager :where(.page, .next, .prev, .last, .first) {
    width: 2.5rem;
    height: 2.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--Silver-Primary-Color);
    transition: 385ms ease-in-out;
    padding: 0 1rem
}

.article_pager :where(.page.active, .page:hover) {
    background: var(--Department-Primary-Color, var(--Accent-Color));
    color: var(--White-Color) !important
}

.Ecommerce .categoryMenu ul {
    list-style: none;
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    margin: 0
}

.Ecommerce .categoryMenu ul li {
    padding: .5rem;
    cursor: pointer;
    height: 100%;
    position: relative;
    text-align: center;
    background: var(--Department-Back-Color, var(--Black-Color));
    color: var(--White-Color);
    border: .1em solid var(--Department-Back-Color, var(--Black-Color));
    transition: .4s ease-in-out
}

.Ecommerce .categoryMenu ul li.edn__contentBlock_active {
    background: var(--White-Color);
    color: var(--Black-Color);
    border: .1em solid var(--Silver-Primary-Color)
}

.edn__contentBlock_wrapper.edn__contentBlock_disablePreviousPage,
.edn__contentBlock_wrapper.edn__contentBlock_noContent {
    animation: .5s ease-in-out animblog;
    transition: .5s ease-in-out
}

.edn__contentBlock_wrapper.edn__contentBlock_disablePreviousPage .eds_noContent,
.edn__contentBlock_wrapper.edn__contentBlock_noContent .edn__articleListWrapper {
    opacity: 0;
    max-height: 0;
    animation: .5s ease-in-out animblog;
    transition: .5s ease-in-out
}

.edn__contentBlock_wrapper.edn__contentBlock_disablePreviousPage .edn__articleListWrapper,
.edn__contentBlock_wrapper.edn__contentBlock_noContent .eds_noContent {
    opacity: 1;
    max-height: 500rem;
    animation: .5s ease-in-out animblog;
    transition: .5s ease-in-out
}

@keyframes animblog {
    from {
        max-height: 0;
        opacity: 0
    }

    to {
        max-height: 500rem;
        opacity: 1
    }
}

.edn__contentBlock_wrapper .edn_pagination .edn__contentBlock_nextPage,
.edn__contentBlock_wrapper .edn_pagination .edn__contentBlock_previousPage {
    cursor: pointer;
    border: .1em solid var(--accent-color);
    padding: .8rem .5rem
}

.Ecommerce .slick-track {
    display: flex;
    gap: 1rem
}

/***************GraphicPortfoDetail*****************/
.GraphicPortfoDetail img {
    width: auto;
}
.FullArticle .edn_documentlink {
    background: var(--Adwords-Primary-Color);
    color: var(--Silver-Secondary-Bg);
    padding: 1rem;
}
.category_menu {
    list-style: none;
}
.Buttonsfixed {
    left: 0;
    bottom: 7%;
    z-index: 10;
}
.Buttonsfixed a {width: 12rem;}

.comments-frame {
    background-color: var(--CustomColor3);
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    padding: 1.5rem;
}

.comments-form {
    .sec-title {
        display: block;
        color: #000;
        font-size: 1.1rem;
        margin-bottom: 1rem;
    }

    .field-holder {
        position: relative;
        border: solid 1px #F1EEEE !important;
        background-color: #fff;
        display: flex;
        align-items: center;
        justify-content: start;
        border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        -ms-border-radius: 5px;
        -o-border-radius: 5px;
        padding: 0px 1rem;
        margin-bottom: 1rem;

        svg {
            min-width: 18px;
            width: 18px;
            height: 15px;
            stroke: #1B2C65;
            margin-left: 0.8rem;
        }

        .form-control {
            width: 100%;
            height: 42px;
            border: none !important;
            outline: none;
            font-size: 1rem;
            padding: 0.5rem 0;
            resize: none;
            text-align: right;

            &::placeholder {
                color: #959595;
                font-size: 1rem;
                font-weight: normal;
            }

            &:disabled {
                background-color: transparent;
            }

            ;
            font-family: 'IranSite';
        }

        textarea {
            min-height: 150px;
        }
    }

    .rating-in-comment {
        .caption {
            color: #000;
        }
    }

    .submit-btn {
        font-size: 1rem;
        color: #fff;
        border: none;
        padding: 0.3rem 1.5rem;
        background-color: var(--Accent-Color);
        cursor: pointer;
    }
}

.comments-list {
    background-color: var(--CustomColor3);
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    padding: 3rem 1.2rem;
    margin-bottom: 2rem;

    .avatar {
        width: 50px;
        min-width: 50px;
        height: 50px;
        background-color: #fff;
        border-radius: 5px;
        margin-left: 1rem;

        svg {
            width: 20px;
            stroke: var(--accent-color);
        }
    }

    .comment-head {
        width: 100%;
        height: 50px;
        padding: 0.4rem 1rem;
        background-color: #FBFBFB;
        border-radius: 5px;
        border: solid 1px #F1F1F1;

        .author {
            font-size: 1rem;
            color: #000;
        }

        .dete {
            .item {
                font-size: 0.8rem;
                color: #000;

                svg {
                    width: 14px;
                    height: 14px;
                    margin-left: 0.5rem;
                    stroke: var(--accent-color);
                }

            }
        }

        @media(max-width:760px) {
            display: block !important;
            height: auto;

            .dete {
                flex-direction: column;
            }
        }
    }

    .comment-body {
        padding: 1rem;

        .comment-content {
            font-size: 1rem;
            color: #000;
        }

        .action-btns {
            svg {
                cursor: pointer;
            }

            .like {
                .like-couner {
                    color: #000;
                    margin-top: -3px;
                    margin-left: 2px;
                }
            }
        }

        @media(max-width:760px) {
            display: block !important;
            height: auto;

        }
    }
}