a.text-dark:hover .card-body {
    color: #00aae7 !important;
}

/*@import url(fontiran.css);*/


@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/eot/IRANSansWeb_Bold.eot');
    src: url('../fonts/eot/IRANSansWeb_Bold.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
        /*url('../fonts/woff2/IRANSansWeb_Bold.woff2') format('woff2'),  !* FF39+,Chrome36+, Opera24+*!*/
    url('../fonts/woff/IRANSansWeb_Bold.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb_Bold.ttf') format('truetype');
}
@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/eot/IRANSansWeb_Medium.eot');
    src: url('../fonts/eot/IRANSansWeb_Medium.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
        /*url('../fonts/woff2/IRANSansWeb_Medium.woff2') format('woff2'),  !* FF39+,Chrome36+, Opera24+*!*/
    url('../fonts/woff/IRANSansWeb_Medium.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb_Medium.ttf') format('truetype');
}
@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/eot/IRANSansWeb_Light.eot');
    src: url('../fonts/eot/IRANSansWeb_Light.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
        /*url('../fonts/woff2/IRANSansWeb_Light.woff2') format('woff2'),  !* FF39+,Chrome36+, Opera24+*!*/
    url('../fonts/woff/IRANSansWeb_Light.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb_Light.ttf') format('truetype');
}
@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 200;
    src: url('../fonts/eot/IRANSansWeb_UltraLight.eot');
    src: url('../fonts/eot/IRANSansWeb_UltraLight.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
        /*url('../fonts/woff2/IRANSansWeb_UltraLight.woff2') format('woff2'),  !* FF39+,Chrome36+, Opera24+*!*/
    url('../fonts/woff/IRANSansWeb_UltraLight.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb_UltraLight.ttf') format('truetype');
}
@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/eot/IRANSansWeb.eot');
    src: url('../fonts/eot/IRANSansWeb.eot?#iefix') format('embedded-opentype'),  /* IE6-8 */
        /*url('../fonts/woff2/IRANSansWeb.woff2') format('woff2'),  !* FF39+,Chrome36+, Opera24+*!*/
    url('../fonts/woff/IRANSansWeb.woff') format('woff'),  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb.ttf') format('truetype');
}

body {
    /*font-family: 'Oswald', sans-serif !important;*/
    font-family: IRANSans !important;
    /*font-weight: 300;*/
    direction: rtl;
    /*background-color: #E2E2E2;*/
    /*background-image: url('../img/back.jpg');*/
    margin: 0;

}




h1, h2, h3, h4, h5, h6,input, textarea {
    font-family: IRANSans !important;
}
h1 {
    font-weight: bold;
}
.wrapper {
    max-width: 900px;
    margin: 0 auto;
}
.ltr {
    direction: ltr;
}
.text-right {
    text-align: right;
}
.text-center {
    text-align: center;
}
.text-left {
    text-align: left;
}
.text-small {
    font-size: 0.8em;
}
.text-xsmall {
    font-size: 0.6em;
}
.text-large {
    font-size: 1.2em;
}
.text-xlarge {
    font-size: 1.4em;
}
.text-underline {
    text-decoration:underline;
}
.text-ultralight {
    font-weight: 200;
}
.text-light {
    font-weight: 300;
}
.text-regular {
    font-weight: normal;
}
.text-medium {
    font-weight: 500;
}
.text-bold {
    font-weight: bold;
}
blockquote {
    font-weight: 500;
    padding: 10px;
    border: 1px dashed #666666;
}

.mainbox {
    width: 100%;
    background-color: #EFEFEF;
    display: table;
    margin-bottom: 30px;
    border-right: 8px solid #FFFF33;
}

.mainboxnegativ {
    width: 100%;
    background-color: #000000;
    display: table;
    margin-bottom: 30px;
    border-right: 8px solid #FFFF33;
    color: #F9F9F9;
}

.mainbox2 {
    font-size: 1em;
    width: 90%;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.mainbox3 {
    width: 100%;
    background-color: #b8b8b8;
    display: table;
    margin-bottom: 30px;
    border-right: 8px solid #bd70ff;
}

.mainbox2negativ {
    font-size: 1em;
    color: #F9F9F9;
    background-color: #000000;
    padding-right: 20px;
}

.farsiparagraph {
    font-size: 1em;
    width: 47%;
    float:right;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;

}
.englishparagraph {
    font-size: 1em;
    width: 47%;
    float: left;
    direction:ltr;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;


}
.rightbox {
    width: 60%;
    padding-right: 20px;
    padding-left: 5px;
    float: right;
    margin-left: 10px;
    margin-bottom: 0px;
    min-width: 0px;
    background-color: #F7F7F7;

}

.titelbox {
    width: 60%;
    padding-right: 25px;
    padding-left: 0px;
    float: right;
    margin-left: 10px;
    margin-bottom: 0px;
    min-width: 0px;
    background-color: #F2F2F2;
    color: #4B4B4B;
}


.lefttbox {

    padding-right: 20px;
    padding-left: 4px;
    float: right;
    margin-bottom: 10px;
    min-width: 0px;
}

.alphabet {
    width: 35%;
    float: left;
    font-size: 21em;
    text-align: center;
    font-weight: 500;
    color: #999999;
}

.alphabet2 {
    width: 35%;
    float: left;
    direction: ltr;
    font-size: 1.6em;
    text-align: left;
    font-weight: 500;
    color: #333333;
    margin-top: 100px;
}
.footer {
    font-weight: 300;
    font-size: 0.7em;
    text-align: center;
    direction: ltr;
    margin-bottom: 0px;
    padding-bottom: 0px;
}
/*#################################### Sidebar*/
/* The side navigation menu */
.sidebar {
    margin: 0;
    padding: 0;
    width: 200px;
    background-color: #f1f1f1;
    position: absolute;
    height: 100vh;
    overflow: auto;
    right: 0em;
    /*top: 3.5em;*/
    top: 3.66em;
}

/* Sidebar links */
.sidebar a {
    display: block;
    color: black;
    padding: 16px;
    text-decoration: none;
}

/* Active/current link */
.sidebar a.active {
    background-color: #4CAF50;
    color: white;
}

/* Links on mouse-over */
.sidebar a:hover:not(.active) {
    background-color: #555;
    color: white;
}

/* Page content. The value of the margin-left property should match the value of the sidebar's width property */
div.content {
    margin-left: 200px;
    padding: 1px 16px;
    position: absolute;
    right:200px;
    /*top:100%;*/
    /*margin-top:48%;*/
    /*height: 1000px;*/

}

/* On screens that are less than 700px wide, make the sidebar into a topbar */
@media screen and (max-width: 700px) {
    .sidebar {
        width: 100%;
        height: auto;
        position: relative;
    }
    .sidebar a {float: left;}
    div.content {margin-left: 0;
        right:0;
        top:100%;
        margin-top: 48%;
    }
}

/* On screens that are less than 400px, display the bar vertically, instead of horizontally */
@media screen and (max-width: 400px) {
    .sidebar a {
        text-align: center;
        float: none;
    }
}