﻿@font-face {font-family: 'yekan';font-weight: normal;font-style: normal;src: url('/Files/Font/yekan.woff')}
* {margin: 0;padding: 0;text-decoration: none;outline: 0}


::-webkit-scrollbar{width:4px;background-color:#111328;direction:rtl}
::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 4px rgba(0,0,0,0.3);background-color:#cdd8e4}
::-webkit-scrollbar-thumb{-webkit-box-shadow:inset 0 0 4px rgba(0,0,0,0.5);background-color:#111328}

a {color: #f4a302;}
a:hover {color: #f4a302;}

ul,ol {list-style-position: inside}



body {font-family: 'Yekan', Tahome, Arial;font-size: 100%;line-height: 175%;overflow-x:hidden;direction:rtl;text-align:justify; background-color:#2b2e4e; color:#f8f9ff}
main{padding-top:57px;}
#Nav{position:fixed;top:0;right:0;left:0;width:100%;z-index:999;transition:1s;}

#Toggle {height: 50px;width:100px;margin-left:-110px;position: fixed;top: 20%;left:0;z-index:990; background-image:url('https://eflnet.ir/Files/Layout/Search.gif'); background-position:right center; background-repeat:no-repeat; transition:.3s;box-shadow:0 0 10px #000; border:1px solid #069; border-radius:5px; background-color:#fab207;cursor: pointer; padding-right:60px; line-height:50px; vertical-align:middle; font-size:1.5em; color:#000;}
#Toggle:hover {margin-left:-5px;}
#Toggle.closed {width: 100%;height: 100%;opacity: .5;background-image:none; background-color:#000; margin-right:0; top:0;color:transparent;}

#Nav{position:fixed;top:0;right:0;left:0;width:100%;z-index:999;transition:1s;}
#Sidebar > b {text-align: center;display: block;color: #f4a302;  padding:1em 0;}
#Search{display:block;width:96%;margin:0;padding:.5em 2%; border:none; background-color:#2b2e4e; font-size:150%; color:#fff;}
#Sidebar {width: 30%;height: 100%;position: fixed;background-color: #111328;-webkit-transition: all 1s;transition: all 1s;right: 0;top:0;z-index:99999999;overflow-y:auto; border-left:1px solid #2b2e4e}
#Sidebar.closed {right: -30%;}

#Sidebar> nav{margin-bottom:1em; background-color:#111328;padding:1px 1px 0 1px;}
#Sidebar> nav > ul li{list-style:none;overflow:hidden;}

#Sidebar> nav > ul li > a{display: block;font-size: 14px;height: 30px;padding: 5px 10px;color: #fff;margin-bottom:1px; background-color:#2b2e4e;  background-position:10px center; background-repeat:no-repeat;}
#Sidebar> nav > ul li > a:hover{background-color: #6a6e9a;}



#Search{display:block;width:92%;margin:2% auto;padding:2%;}

#Menu,#Menu ul,#Menu ul li,#Menu ul li a,#Menu #menu-button{margin:0;padding:0;border:0;list-style:none;line-height:1;display:block;position:relative;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;background-color:#2b2e4e;}
#Menu{z-index:999;text-align:right;transition:1s;width:auto;line-height:1;border-top:10px solid #93a5ec;border-bottom:1px solid #93a5ec;}
#Menu>ul{padding-right:5%;background-position:1% center;background-size:15%;background-repeat:no-repeat; background-image:url('/Files/Layout/Logo.png');}
#Menu:after,#Menu>ul:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}
#Menu #menu-button{display:none}
#Menu>ul>li{-webkit-perspective:1111328px;-moz-perspective:1111328px;perspective:1111328px;float:right}
#Menu.align-center>ul{font-size:0;text-align:center}
#Menu.align-center>ul>li{display:inline-block;float:none}
#Menu.align-left>ul>li{float:left}
#Menu>ul>li>a{padding:16px 20px;font-size:90%;color:#93a5ec;-webkit-transition:all .3s;-moz-transition:all .3s;-o-transition:all .3s;transition:all .3s;-webkit-transform-origin:50% 0;-moz-transform-origin:50% 0;transform-origin:50% 0;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}
#Menu>ul>li.active>a{color:#111328}
#Menu>ul>li:hover>a,#Menu>ul>li>a:hover{color:#fff;-webkit-transform:rotateX(90deg) translateY(-23px);-moz-transform:rotateX(90deg) translateY(-23px);transform:rotateX(90deg) translateY(-23px);-ms-transform:none; background-color:#525784;}
#Menu>ul>li>a::before{position:absolute;top:100%;right:0;z-index:-1;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:100%;height:100%;padding:16px 20px;color:#cdd8e4;content:attr(data-title);-webkit-transition:background .5s;-moz-transition:background .5s;transition:background .5s;-webkit-transform:rotateX(-90deg);-moz-transform:rotateX(-90deg);transform:rotateX(-90deg);-webkit-transform-origin:50% 0;-moz-transform-origin:50% 0;transform-origin:50% 0;-ms-transform:translateY(- -18px)}
#Menu>ul>li:hover>a::before,#Menu>ul>li>a:hover::before{color:#fff}
#Menu.small-screen{width:100%;}
#Menu.small-screen>ul,#Menu.small-screen.align-center>ul{width:100%;text-align:right; padding-right:0;}
#Menu.small-screen>ul>li,#Menu.small-screen.align-center{float:none;display:block;border-top:1px solid #5e617d}
#Menu.small-screen>ul>li:hover>a,#Menu.small-screen>ul>li>a:hover{color:#cdd8e4;-webkit-transform:none;-moz-transform:none;transform:none;-ms-transform:none}
#Menu.small-screen>ul>li>a::before{display:none}
#Menu.small-screen #menu-button{display:block;padding:16px 7%;cursor:pointer;font-size:14px;text-decoration:none;text-align:center}
#Menu.small-screen #menu-button:after{content:"";position:absolute;left:20px;top:17px;display:block;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;border-top:2px solid #aaa;border-bottom:2px solid #aaa;width:22px;height:3px}
#Menu.small-screen #menu-button.menu-opened:after{border-top:2px solid #fff;border-bottom:2px solid #fff}
#Menu.small-screen #menu-button:before{content:"";position:absolute;left:20px;top:27px;display:block;width:22px;height:2px;background:#fff;}
#Menu.small-screen #menu-button.menu-opened:before{background-color:#aaa}
#Menu a#EFL{color:#f4a302;}
#Menu a#SignOut{color:#ff0000;}
#Page{padding:1em 10%;min-height:450px;}
.Post {display: inline-block;width: 22%;margin: 0.5%;padding: 1%;color: #f8f9ff;border-radius: 5px;background-color: rgba(0,0,0,.1);}
.Post:hover {background-color: rgba(0,0,0,.2);}
.Post > h3 {height: 2em;text-align: center; font-size:90%; font-weight:normal;  padding:.2em 0;}
.Post > a:first-child {display: block;color: #000;margin:2% 5%;border-radius: 5px;overflow: hidden;filter: grayscale(40%);transition: 0.4s;}
.Post:hover > a:first-child {filter: grayscale(0);}
.Post > a > img {display: block;width: 100%;height: auto;}
.Post > p {color: #cdd8e4;font-weight:normal;height: 8em;font-size: 85%;line-height: 150%;text-align: justify;overflow: hidden;}
.Post > div {text-align: center;font-weight: 700;font-size: 1.1em; color:aqua; padding:.3em 0;}     
.Free{background-color:#5fc4e0;color:#235a75;display:block;text-align:center;padding:.2em 0;transition:.3s;}
.Free:hover {background-color: #67d1d8;color:#000;}
.Buy{background-color:#6bcab2;color:#000;display:block;text-align:center;padding:.2em 0;transition:.3s;}
.Buy:hover {background-color:#6abb87;color: #000;}
main > footer {margin-top: 1em;border-top: 1px solid #93a5ec;padding: 1em 0;color: #00ffe8;text-align: center; clear:both;}


#ShoppingBag {border-radius: 50%;overflow: hidden;position: fixed;bottom: 3%;left: 3%;z-index: 99;width: 70px;height: 70px;background-color: #1ebea5;border: 3px solid #f4a302;animation: call 1s infinite ease;}
#ShoppingBag{left:unset;right:3%; text-align:center; line-height:70px; color:#ff0; font-size:300%; text-shadow:1px 1px #000; background-image:url('/Files/Bag.png'); background-position:center center;}
#Loading {background-position: center center;z-index: 99999999;position: absolute;left:35%;top: 40%;bottom:40%;right:35%;background-image: url('/Files/Layout/loading.gif');background-repeat: no-repeat;display: block;background-color: #000;opacity: .9;border-radius:5px;border-color:rgba(0,0,0,.5); border:1px solid #000;}
@media only screen and (min-width:1px) and (max-width: 1023px)
{
    #Menu{border-top:none;}
    #Sidebar {width: 75%;}
    #Sidebar.closed {right: -75%;}
    #Toggle {height: 30px;width: 30px;position: fixed;top: 7px;right: 10px;left:auto;margin-left: 0;z-index: 9999;background-size:30px;background-position: center center;box-shadow: none;padding:0;margin:0;color:transparent;border:none;} 
    #Toggle.closed{border-radius:5px;}
    #Page {padding: 1em 3%;}
    .Post {display: block;width: 90%;margin:1em 2.5%;padding: 1em 2.5%;}
    .Post:nth-child(odd){background-color:#111328;} 
    .Post > a {margin: 5% 10%;border-radius: 0;overflow: hidden;transition: 0.6s;}
    .Post > p {height: auto; line-height:150%;}
}


