@charset "UTF-8";

@font-face {
    font-family: 'IRANSans-web';
    src: url('iransans_web_font.ttf') format('truetype'); /* Saf3?5, Chrome4+, FF3.5, Opera 10+ */
}

@-ms-viewport {
 width: device-width;
}

body {
    font-family: 'IRANSans-web',tahoma;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    font-size: medium;
    -webkit-font-smoothing: antialiased;
    color: #424242;
    background-color: #FAFAFA;
    direction: rtl;
    overflow-x: hidden;
    padding: 0;
    margin: 0 15% 0 15%;
}

.div-img-wide {
 width: 100%;
 text-align: center;
}

 .div-img-wide img {
 width: auto;
 height: auto;
 }

.p-fa {
    font-family: 'IRANSans-web', tahoma;
    font-weight: normal;
    direction: rtl;
}

.p-en {
 font-family: Arial,sans-serif;
 font-weight: normal;
 direction: ltr;
}

a {
 color: #4285f4;
 text-decoration: none;
 font-weight: bold;
}

 a:focus, a:hover {
 color: #3367d6;
 text-decoration: underline;
 }

a:visited {
    color: #4285f4;
}

    h1 {
    font-family: 'IRANSans-web', tahoma;
    font-weight: bold;
    direction: rtl;
    text-align: right;
    direction: rtl;
    font-size: x-large;
    color: #313131;
}

h2 {
    font-family: 'IRANSans-web', tahoma;
    font-weight: bold;
    direction: rtl;
    text-align: right;
    direction: rtl;
    font-size: x-large;
    color: #424242;
}


/*eLearning Materials*/
h5 {
    background: #00838f url('http://dl.TahlilGaran.org/images/css1.png') no-repeat right center;
    background-size: contain;
    font-family: inherit;
    font-size: large;
    font-weight: normal;
    min-height: 32px;
    text-align: right;
    margin-top: 1em;
    padding-right: 38px;
    direction: rtl;
    white-space: normal;
    color: #ffffff;
}

h6 {
    background: #00695c url('http://dl.TahlilGaran.org/images/css2.png') no-repeat right center;
    background-size: contain;
    font-family: inherit;
    font-size: large;
    font-weight: normal;
    min-height: 32px;
    text-align: right;
    margin-top: 1em;
    padding-right: 38px;
    direction: rtl;
    white-space: normal;
    color: #ffffff;
}

.DivEn {
 font-family: Arial,sans-serif;
 direction: ltr;
 text-align: left;
 margin: .2em 1em 1em 1em;
 color: #003300;
}

.DivCenter {
 direction: rtl;
 text-align: center;
 color: #000000;
 font-weight: bold;
}
/*eLearning Materials*/


.p-box {
    color: #424242;
    background-color: #ffffff;
    display: inline-block;
    text-decoration: none;
    font-weight: normal;
    font-size: medium;
    text-align: right;
    display: inline-table;
    border-radius: 2em 2em 0 0;
}

.p-box-small {
 margin: 1em;
 width: 40%;
}

.p-box-wide {
 width: 95%;
 margin: .2em .2em 2em .2em;
}

.p-box-title {
 font-size: x-large;
 font-family: Arial,sans-serif;
 font-weight: normal;
 direction: ltr;
 text-align: left;
 padding: .2em .4em .2em .4em;
 margin: 0;
 display: block;
 border-radius: .1em 1em 0  0;
 color: #ffffff;
}

.p-box-footer {
    font-size: small;
    font-family: 'IRANSans-web', tahoma;
    direction: rtl;
    text-align: right;
    padding: 0 .2em 0 .2em;
    margin: .5em 0 0 0;
    display: block;
    border-top: 4px solid #424242;
}

.p-box p {
    font-size: medium;
    font-family: 'IRANSans-web', tahoma;
    font-weight: normal;
    direction: rtl;
    text-align: right;
    padding: .4em;
    margin: 0;
    border-style: solid;
    border-width: 1px;
    min-height: 8em;
}

.p-box-a {
 display: inline-block;
 font-weight: normal;
 text-align: center;
 touch-action: manipulation;
 cursor: pointer;
 white-space: nowrap;
 padding: .7em .5em .7em .5em;
 margin: 1em .2em .2em .5em;
 font-size: small;
 line-height: 1em;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
 user-select: none;
 color: #fff;
 min-width: 15em;
 background-color: #546E7A;
 border-radius: .6em;
 border-bottom: 3px solid #455A64;
 border-top: none;
 border-right: 1px solid #455A64;
 border-left: none;
}

    .p-box-a:hover {
        font-weight: normal;
        text-decoration: none;
        color: #fff;
        opacity: 0.85;
        filter: alpha(opacity=85); /* For IE8 and earlier */
    }
    .p-box-a:visited {
        color: #fff;
    }

.menu-spacer {
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    display: none;
}

.menu-spacer1 {
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    display: none;
}

.content-show {
    display: block;
}
.content-hide {
    display: none;
}

.menu-a {
    display: inline-block;
    font-weight: normal;
    text-align: center;
    background-color: #546E7A;
    touch-action: manipulation;
    cursor: pointer;
    white-space: nowrap;
    padding: .4em .7em .4em .7em;
    margin: .1em .2em .1em .2em;
    font-size: small;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: #fff;
    width: 7em;
    border-radius: .9em;
}

    .menu-a:hover {
        text-decoration: none;
        opacity: 0.7;
        color: #fff;
        filter: alpha(opacity=70); /* For IE8 and earlier */
    }
    .menu-a:visited {
        color: #fff;
    }

.h_iframe-aparat_embed_frame {
 position: relative;
}

 .h_iframe-aparat_embed_frame .ratio {
 display: block;
 width: 100%;
 height: auto;
 }

 .h_iframe-aparat_embed_frame iframe {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 }

.h_iframe-aparat_embed_frame_span {
 display: block;
 padding-top: 57%;
}


.namasha-embed {
 position: relative;
 display: block;
 height: 0;
 padding: 0;
 overflow: hidden;
 padding-bottom: 57%;
}

.namasha-embed-iframe {
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 width: 100%;
 height: 100%;
 border: 0;
}

@media screen and (min-width: 800px) {
 .h_iframe-aparat_embed_frame iframe {
 position: absolute;
 top: 0;
 left: 0;
 width: 720px;
 height: 405px;
 }

 .h_iframe-aparat_embed_frame_span {
 display: block;
 padding-top: 400px;
 }



 .namasha-embed {
 position: relative;
 display: block;
 height: 0;
 padding: 0;
 overflow: hidden;
 padding-bottom: 410px;
 }

 .namasha-embed-iframe {
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 width: 720px;
 height: 405px;
 border: 0;
 }
}

@media screen and (min-width: 1281px) and (max-width: 1600px) {
 body {
 margin: 0 3em 0 3em;
 }

 .link-box-medium {
 width: 220px;
 }
}

@media screen and (max-width: 1100px) {
 .p-box-small {
 width: 95%;
 margin: .2em .2em 2em .2em;
 }
}

@media screen and (max-width: 600px) {

    .menu-spacer {
        display: block;
    }

    .content-show {
        display: none;
    }
    .content-hide {
        display: block;
    }
}


@media screen and (min-width: 841px) and (max-width: 1280px) {
 body {
 margin: 0;
 }
    .div-img-wide img {
        width: 90%;
    }
}

@media screen and (min-width: 481px) and (max-width: 840px) {
 body {
 margin: 0;
 }

 .div-img-wide img {
 width: 95%;
 }
    .menu-spacer1 {
        display: block;
    }
    .menu-a {
        width: 10em;
    }
}

@media screen and (max-width: 480px) {
    body {
        margin: 0;
    }

    .div-img-wide img {
        width: 95%;
    }

    h1 {
        font-size: large;
    }

    h2 {
        font-size: large;
    }
    .menu-spacer1 {
        display: block;
    }
    .menu-a {
        width: 80%;
    }
}