@font-face {
    font-family: San9;  font-style: normal;  font-weight: bold;  src: url('../../fonts/9/eot/SansWeb_Bold.eot');
    src: url('../../fonts/9/eot/SansWeb_Bold.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
    url('../../fonts/9/woff2/SansWeb_Bold.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
    url('../../fonts/9/woff/SansWeb_Bold.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../../fonts/9/ttf/SansWeb_Bold.ttf') format('truetype');
}
@font-face {
    font-family: San9;  font-style: normal;  font-weight: normal;  src: url('../../fonts/9/eot/SansWeb.eot');
    src: url('../../fonts/9/eot/SansWeb.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
    url('../../fonts/9/woff2/SansWeb.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
    url('../../fonts/9/woff/SansWeb.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../../fonts/9/ttf/SansWeb.ttf') format('truetype');
}

:root {
    --d: rgb(0, 0, 0);
    --d1:    rgba(0, 0, 0, .1);
    --d2:    rgba(0, 0, 0, .2);
    --d3:    rgba(0, 0, 0, .3);
    --d4:    rgba(0, 0, 0, .4);
    --d5:    rgba(0, 0, 0, .5);
    --d6:    rgba(0, 0, 0, .6);
    --d7:    rgba(0, 0, 0, .7);
    --d8:    rgba(0, 0, 0, .8);
    --d9:    rgba(0, 0, 0, .9);
    --w: rgb(255, 255, 255);
    --w1:   rgba(255, 255, 255, .1);
    --w2:   rgba(255, 255, 255, .2);
    --w3:   rgba(255, 255, 255, .3);
    --w4:   rgba(255, 255, 255, .4);
    --w5:   rgba(255, 255, 255, .5);
    --w6:   rgba(255, 255, 255, .6);
    --w7:   rgba(255, 255, 255, .7);
    --w8:   rgba(255, 255, 255, .8);
    --w9:   rgba(255, 255, 255, .9);
    --b: rgb(110, 90, 160);
    --b1:   rgba(110, 90, 160, .1);
    --b2:   rgba(110, 90, 160, .2);
    --b3:   rgba(110, 90, 160, .3);
    --b4:   rgba(110, 90, 160, .4);
    --b5:   rgba(110, 90, 160, .5);
    --b6:   rgba(110, 90, 160, .6);
    --b7:   rgba(110, 90, 160, .7);
    --b8:   rgba(110, 90, 160, .8);
    --b9:   rgba(110, 90, 160, .9);
    --f: rgb(255, 207, 44);
}

body {
    font-family:San9,Tahoma,Arial,SansSerif;font-weight:normal;font-size:14px;
    direction:rtl;text-align:right;background-color: var(--b1);
}

h1,h2,h3,h4,h5 { padding:0;margin:0; }
a,a:visited { text-decoration: none;color: var(--d);outline: none; }
a:hover { text-decoration: none;color: var(--b); }
.left { text-align: left; }
.ltr { direction:ltr; }
i.ion { display: inline-block;width:1em;height:1em;mask-repeat:no-repeat;mask-position:center center;
    vertical-align: middle;visibility: hidden;mask-size:contain;-webkit-mask-size:contain/*chrome*/; }
i.ion[style] { visibility: visible; }
.scroll-x { white-space:nowrap;width:100%;overflow-x:auto; }

.header { background-color: var(--b7);background-repeat: no-repeat;background-size: cover;background-position: center center; }
.header a i.ion { background-color:var(--f);font-size:1.6em; }
.header .nav { display:block;width:100%;padding:0 2em;background-color: var(--d2); }
.header .nav a { display:inline-block;color: var(--w);padding:.8em .5em;border:1px solid var(--w4); }
.header .nav a:hover { color:var(--f);background-color: rgba(255,255,255,.3); }
.header .nav.bottom { min-height:35px;white-space:nowrap;overflow-y:auto; }
.header .nav.top h1 { font-size:1.4em;display:inline-block; }
.header .nav.top a { border-width:0 1px 0 0; }
.header .nav.top a { float:left; }
.header .nav.top a:first-child { float:right;padding:.7em 1.5em 0 0;border:none; }
.header .nav.top a:first-child:hover { background-color: transparent; }
.header .nav.bottom a { border-width:0 0 0 1px;padding:.5em 1.2em; }
.header .nav a:last-child { border:none; }

.header .logo { display:block;margin:2em auto;width:700px;padding:0 2em 0 0; }
.header .logo .content { background-color: var(--w8);padding:1em 1.5em;border-radius:.3em; }
.header .logo .content div { padding:0; }
.header .logo img { height:100px;width:100px;border-radius:50%;object-fit: cover;-o-object-fit: cover;
    margin:0;box-shadow: 0 2px 10px -5px var(--d5);border:2px solid var(--w); }
.header .logo h1 { font-size:1.5em;color: var(--d);margin:.9em 0 .2em 0;display: inline-block;padding:.2em .5em; }
.header .logo h2 { font-size:1.1em;color: var(--d6);display: inline-block;padding:.2em 1em; }


.container.archive { padding:2em 15px; }
.container.archive .card { background-color: var(--w);border-radius: 1.4em;border-color: var(--b3);
    overflow: hidden;padding:.4em; }
.container.archive .card a { color: var(--d9); }
.container.archive .card a:hover { color: var(--b); }
.container.archive .card img.card-img-top { border-radius: 1.2em;border:none;transition: opacity 200ms; }
.container.archive .card .date { position:absolute;top:15px;left:15px;border-radius:.7em;padding:.2em .6em;
    background-color: var(--w6);color: var(--d7); }
.container.archive .card .date i.ion { background-color: var(--d7);margin:0 .2em; }
.container.archive .card .date i:last-child { margin-right:1em; }
.container.archive .card:hover .date { background-color: var(--w9);transition:background-color 200ms; }
.container.archive .card:hover img.card-img-top { opacity: .96;filter: opacity(.96);transition: opacity 200ms; }
.container.archive .card .card-body { padding:0 1em; }
.container.archive .card .card-body .card-title { font-size:1.3em;font-weight:bold;line-height:1.5em;margin:.7em 0; }
.container.archive .card .card-body .card-text { color: var(--d7);line-height:2em;margin:0; }
.container.archive .card .social { text-align:left;margin:.7em 0; }
.container.archive .card .social a { padding:.5em; }
.container.archive .card .social a i.ion { background-color: var(--d3);font-size:1.2em; }
.container.archive .card .social a:hover i.ion { background-color: var(--b);transition:background-color 200ms; }


.row.i-btm { max-width: 700px;padding: 0;margin:2em auto; }
.row.i-btm div { width: 25%;display:inline-block;margin-bottom:1em; }
.row.i-btm div a { display:block;border:1px solid var(--d2);background-color: var(--w);position: relative;
    border-radius:.5em;padding:1em .5em;text-align: center;color: var(--d);transition: all 200ms; }
.row.i-btm div a:hover { color: var(--d);background-color: var(--f);transition: all 200ms; }
.row.i-btm div a::before { content: '';position:absolute;top:8px;left:-8px;width:16px;height:16px;
    background-color:var(--f);border-radius:50%; }
.row.i-btm div a:hover::before { background-color:var(--b);transition: background-color 200ms; }
@media (min-width: 576px) AND (max-width: 992px) {
    .card-columns {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
}

.pages { direction:ltr; }
.pages ul li {  }
.pages .page-item .page-link { background-color: var(--w); }
.pages .page-item a.page-link:hover { background-color: var(--b6);border-color: var(--b6);color: var(--f); }
.pages .page-item.active a.page-link { background-color: var(--b6);border-color: var(--b6); }



.container.single { padding:2em 15px;max-width: 750px;color: var(--b); }
.container.single .card { background-color: var(--w);border-radius: 1.4em;border-color:var(--b3);
    overflow: hidden;padding:.4em; }
.container.single .card h1 { font-size:2em; }
.container.single .card img { max-width: 100%; }
.container.single .card .card-text { line-height:1.7em;font-size:1.05em; }
.container.single .card .profile { padding:.5em 1em; }
.container.single .card .profile img { width:30px;height:30px;object-fit: cover;-o-object-fit: cover;margin-left:.3em;
    border-radius: 50%; }
.container.single .card .profile .date { color: var(--d4);float:left;font-size:.8em; }
.container.single .card .cat { display: block; }
.container.single .card .cat a { display: inline-block;border-radius: .4em;background-color: var(--d1);
    padding:.2em .6em; }
.container.single .card .cat a i { background-color: var(--b); }
.container.single .card .social { text-align:left;margin:1em 0 .5em 0; }
.container.single .card .social a { padding:.5em; }
.container.single .card .social a i.ion { background-color: var(--d4);font-size:1.6em; }
.container.single .card .social a:hover i.ion { background-color: var(--f);transition:background-color 200ms; }
.container.single .card .info { display: block;border-top:1px solid var(--b3);padding:.4em 1em;
    color:var(--b); }
.container.single .card .short { direction:ltr; }
.container.single .card .short input { color:var(--b);background-color:var(--b1);border-radius:.2em;border:0px;padding:1px 1px 1px .6em; }
.container.single .card .short .input-group-text { background-color:var(--b2);border:0px; }
.container.single .card .short .input-group-text .ion { background-color:var(--b8); }


.container.single .related { margin:1em 0; }
.container.single .related .title { margin:1em 0;border-bottom:2px solid var(--d1); }
.container.single .related .title span { border-bottom:2px solid var(--b);line-height: 3em;padding:.75em .5em;
    color: var(--d6); }
.container.single .related .post { max-width: 100%;border-radius:1em;overflow: hidden;background-color: var(--w);
    padding:.5em;border:1px solid var(--b3); }
.container.single .related .post img { width: 100%;border-radius:.4em;max-height:20em;
    object-fit: cover;-o-object-fit: cover; }
.container.single .related .post h2 { font-size:1.4em;margin:.4em 0; }
.container.single .related .post .text { font-size:.9em;line-height:1.6em;color: var(--d6); }


.foot-light { background-color: var(--b2); }
.footer { font-size:.9em;color: var(--b8);padding:2em 0 4em 0; }
.footer div.col { white-space: nowrap; }
.footer i.ion { background-color: var(--b6); }
.footer .social { display:inline-block;text-align:left; }
.footer .social a { font-size:2em;margin:0 .3em; }
.footer a:hover { color: var(--d5); }
.footer .social a:hover i.ion { background-color: var(--d5); }


@media (min-width: 576px) {

}
@media (max-width: 768px) {
    .header nav { padding:0 .5em; }
}
@media (min-width: 992px) {

}