﻿/* GLOBAL STYLES
-------------------------------------------------- */

/* Iran Sans Font CSS */


/* Typography CSS */
body {
    font-family: IRANSans, 'Roboto', Tahoma, Arial, sans-serif !important;
}

h1, h2, h3, h4, h5, h6, input, textarea {
    font-family: IRANSans, 'Roboto', Tahoma, Arial, sans-serif !important;
}
h1 { font-weight: bold; }

h1 { font-size: 20px; }
h2 { font-size: 16px; }
h3, h4, h5 { font-size: 16px; }

.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;
}

.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;
}

.ltr {
    direction: ltr;
}

.block {
    display: block;
}

/*ol, ul {
    list-style: none;
}
ol, ul, li {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    vertical-align: baseline;
}*/

a:hover, a:focus, a:visited {
    text-decoration: none !important;
}

li > ul {
    margin-top: 5px;
    margin-bottom: 10px;
}

/* Padding below the footer and lighter body text */
body, html {
    color: #333;
}

body > .container {
    -webkit-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.75);
    margin-bottom: 30px;
}

.starter-template {
    padding: 0px 15px 40px 15px;
    text-align: center;
    color: #5a5a5a;
}

/*Full Width*/
.full-width {
    width: 100%;
}

.img-responsive-height {
    display: block;
    max-width: 100%;
    height: auto;
}

/*Margin and Padding Spaces*/
.margin-top-0 { margin-top: 0 !important; }
.margin-top-20 { margin-top: 20px !important; }
.margin-top-40 { margin-top: 40px !important; }
.margin-top-60 { margin-top: 60px !important; }
.margin-left-0 { margin-left: 0 !important; }
.margin-left-5 { margin-left: 5px !important; }
.margin-left-10 { margin-left: 10px !important; }
.margin-left-20 { margin-left: 20px !important; }
.margin-left-40 { margin-left: 40px !important; }
.margin-left-80 { margin-left: 80px !important; }
.margin-right-0 { margin-right: 0 !important; }
.margin-right-5 { margin-right: 5px !important; }
.margin-right-10 { margin-right: 10px !important; }
.margin-right-20 { margin-right: 20px !important; }
.margin-right-40 { margin-right: 40px !important; }
.margin-right-80 { margin-right: 80px !important; }
.margin-bottom-0 { margin-bottom: 0 !important; }
.margin-bottom-5 { margin-bottom: 5px !important; }
.margin-bottom-10 { margin-bottom: 10px !important; }
.margin-bottom-15 { margin-bottom: 15px !important; }
.margin-bottom-20 { margin-bottom: 20px !important; }
.margin-bottom-25 { margin-bottom: 25px !important; }
.margin-bottom-30 { margin-bottom: 30px !important; }
.margin-bottom-35 { margin-bottom: 35px !important; }
.margin-bottom-40 { margin-bottom: 40px !important; }
.margin-bottom-45 { margin-bottom: 45px !important; }
.margin-bottom-50 { margin-bottom: 50px !important; }
.margin-bottom-55 { margin-bottom: 55px !important; }
.margin-bottom-60 { margin-bottom: 60px !important; }
.padding-top-0 { padding-top: 0 !important; }
.padding-top-20 { padding-top: 20px !important; }
.padding-top-40 { padding-top: 40px !important; }
.padding-top-60 { padding-top: 60px !important; }
.padding-left-0 { padding-left: 0 !important; }
.padding-left-5 { padding-left: 5px !important; }
.padding-left-10 { padding-left: 10px !important; }
.padding-left-20 { padding-left: 20px !important; }
.padding-left-40 { padding-left: 40px !important; }
.padding-left-80 { padding-left: 80px !important; }
.padding-right-0 { padding-right: 0 !important; }
.padding-right-5 { padding-right: 5px !important; }
.padding-right-10 { padding-right: 10px !important; }
.padding-right-20 { padding-right: 20px !important; }
.padding-right-40 { padding-right: 40px !important; }
.padding-right-80 { padding-right: 80px !important; }
.padding-bottom-0 { padding-bottom: 0 !important; }
.padding-bottom-5 { padding-bottom: 5px !important; }
.padding-bottom-10 { padding-bottom: 10px !important; }
.padding-bottom-20 { padding-bottom: 20px !important; }
.padding-bottom-40 { padding-bottom: 40px !important; }
.padding-bottom-80 { padding-bottom: 80px !important; }

/*Borders
------------------------------------*/
.border-bottom {
    border-bottom: 1px solid #e7eaec !important;
}

/*Heights
------------------------------------*/
.height-51 {
    min-height: 51px;
}

.height-100 {
    min-height: 100px;
}

/*Background Colors
------------------------------------*/
.bg-color-dark {
    background-color: #555 !important;
}

.bg-color-dark-blue {
    background-color: #3b5385 !important;
}

/* Offset by column */
.offset-l-1 {
    margin-left: 8.33333333%;
}

.offset-r-1 {
    margin-right: 8.33333333%;
}

.offset-b-1 {
    margin-right: 8.33333333%;
    margin-left: 8.33333333%;
}

/*Button Styles
------------------------------------*/
.btn {
    box-shadow: none;
}

.btn-u {
    border: 0;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    font-weight: 400;
    padding: 6px 13px;
    position: relative;
    background: #72c02c;
    white-space: nowrap;
    display: inline-block;
    text-decoration: none;
}

    .btn-u:hover {
        color: #fff;
        text-decoration: none;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

    .btn-u.btn-block {
        text-align: center;
    }

a.btn-u {
    /*padding: 4px 13px;*/
    /*vertical-align: middle;*/
}

.btn-u-sm,
a.btn-u-sm {
    padding: 3px 12px;
}

.btn-u-lg,
a.btn-u-lg {
    font-size: 18px;
    padding: 10px 25px;
}

.btn-u-xs,
a.btn-u-xs {
    font-size: 12px;
    padding: 2px 12px;
    line-height: 18px;
}

/*Rounded and Circle Classes
------------------------------------*/
.no-rounded {
    border-radius: 0 !important;
}

.rounded {
    border-radius: 4px !important;
}

.rounded-x {
    border-radius: 50% !important;
}

.rounded-2x {
    border-radius: 10px !important;
}

.rounded-3x {
    border-radius: 15px !important;
}

.rounded-4x {
    border-radius: 20px !important;
}

.rounded-sm {
    border-radius: 2px !important;
}

.rounded-md {
    border-radius: 3px !important;
}

.rounded-top {
    border-radius: 4px 4px 0 0 !important;
}

.rounded-left {
    border-radius: 4px 0 0 4px !important;
}

.rounded-right {
    border-radius: 0 4px 4px 0 !important;
}

.rounded-bottom {
    border-radius: 0 0 4px 4px !important;
}


/* CUSTOMIZE THE NAVBAR
-------------------------------------------------- */
/* Special class on .container surrounding .navbar, used for positioning it into place. */
.navbar-wrapper {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 20;
}

    /* Flip around the padding for proper display in narrow viewports */
    .navbar-wrapper > .container {
        padding-right: 0;
        padding-left: 0;
    }

    .navbar-wrapper .navbar {
        padding-right: 15px;
        padding-left: 15px;
    }

        .navbar-wrapper .navbar .container {
            width: auto;
        }

    /* Adding a white bottom border for navbar */
    .navbar-wrapper > .container > .navbar > .bottom-border-filler {
        border-bottom: 2px solid white;
        width: 100%;
        min-height: 52px;
        position: absolute;
        z-index: -10;
    }

/* Changing color of the menu items */
.nav > li > a {
    color: white;
}

    .nav > li > a:active, .nav > li > a:visited {
        color: white;
    }

    .nav > li > a:hover, .nav > li > a:focus {
        /*border-bottom: 2px solid #41ae41;*/
        background-color: transparent;
    }

.nav-tabs.nav-justified > li > a {
    margin-bottom: 5px;
    text-align: center;
    margin-right: 0;
    border-radius: 4px;
}
/* END OF CUSTOMIZE THE NAVBAR */

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */
/* Carousel base class */
.carousel {
    height: 505px;
    margin-bottom: 60px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
    z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
    height: 505px;
    background-color: #777;
}

.carousel-inner > .item > img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    height: 505px;
}

/* Fixing carousel indicator position for rtl style */
.carousel-indicators {
    padding-right: 0;
}

/* FEATURETTES STYLES
-------------------------------------------------- */
.featurettes {
    position: relative;
}

.featurettes-box {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 20;
}

.featurettes-text > p {
    font-size: 16px;
    font-weight: 300;
    line-height: 1.4;
}

.featured-logo img {
    margin-top: 15%;
}


/* FOOTER STYLES
-------------------------------------------------- */
.footer-vlight {
    width: 100%;
    background-color: #1c1c1c;
    color: #999999;
}

.footer-vlight .footer {
    padding: 40px;
}

.footer-logo {
    margin: 17px 0 20px;
    height: 60px;
}

.footer-vlight .footer .map-img {
    background: url(/Content/img/map-img.png) 5px 60px no-repeat;
}

.headline {
    display: block;
    margin: 10px 0 25px 0;
    border-bottom: 1px dotted #555;
}

/*Block Headline*/
.headline {
    display: block;
    margin: 10px 0 25px 0;
    border-bottom: 1px dotted #e4e9f0;
}

    .headline h2 {
        font-size: 22px;
    }

    .headline h2,
    .headline h3,
    .headline h4 {
        margin: 0 0 -2px 0;
        padding-bottom: 5px;
        display: inline-block;
        border-bottom: 2px solid #72c02c;
    }

.headline-md {
    margin-bottom: 15px;
}

    .headline-md h2 {
        font-size: 21px;
    }

/*Latest List*/
.latest-list li {
    padding: 8px 0;
    border-top: 1px solid #353535;
}

.latest-list li:first-child {
    padding-top: 0;
    border-top: none;
}

.latest-list li a {
    color: #eee;
}

.latest-list small {
    color: #999;
    display: block;
}

/*Link List*/
.link-list li {
    border-top: solid 1px #353535;
}

    .link-list li:first-child {
        border-top: none !important;
    }

.link-list a {
    color: #eee;
    font-size: 11px;
    padding: 6px 0px;
    display: inline-block;
    text-transform: uppercase;
}

.link-list li i {
    color: #bbb;
    float: left;
    margin-top: 10px;
}

/* ARTICLES
-------------------------------------------------- */
.article-grid {
    margin-top: 20px;
    margin-bottom: 10px;
    border-bottom: 1px solid #e7eaec !important;

}

.article-grid > img {
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5);
}

.article-grid-body {
    margin-top: 5px;
    padding: 5px 10px;
    background-color: white;
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5);
    -moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5);
    box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.5);
}

.article-grid h1 {
    font-size: 20px;
    font-weight: bold;
    margin: 0 10px 10px 0;
    display: block;
}

.article-grid-header h1 {
    font-size: 20px;
    font-weight: bold;
    margin: 20px 0 0 0;
    margin-bottom: 5px;
    padding-bottom: 5px;
    display: block;
    border-bottom: 2px solid #72c02c;
}

.article-grid .article-grid-info {
    padding-right: 0;
    list-style: none;
}

.article-grid .article-grid-info li {
    color: #888;
    padding: 0 2px;
    font-size: 12px;
    display: inline-block;
}

.article-grid-info li:before {
    content: '/';
    font-size: 12px;
    line-height: 1.4;
    margin-left: 9px;
}

.article-grid-info li:first-child:before {
    content: " ";
    margin-left: 0;
}

.article-grid-info li a {
    color: #888;
}

    .article-grid-info li a:hover {
        text-decoration: none;
    }

.article-grid p {
    margin: 0 10px;
}

/* Artcle Page */
.article-content {
    margin-top: 20px;
    padding: 20px 35px;
}

.article-body img {
    max-width: 100% !important;
    height: auto !important;
}
article h1 {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 5px;
    padding-bottom: 5px;
    display: block;
}

article h2 {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 5px;
    padding-bottom: 5px;
    display: block;
}

article h3, article h4, article h5 {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 5px;
    padding-bottom: 5px;
    display: block;
}

.article-share-row {
    font-size: 12px;
    background-color: #3b5385 !important;
    height: 40px;
    position: relative;
    z-index: 4;
}

.share-detail {
    color: white;
    margin-right: 20px;
    padding: 10px 0 0;
    float: right;
}

.topicCategories {
    position: absolute;
    bottom: 11px;
    padding: 0 3px;
    width: 100%;
    height: 21px;
    z-index: 9;
    overflow: hidden;
}

article a:hover, article a:focus, article a:visited {
    text-decoration: none !important;
}

.imageWrapper {
    position: relative
}

.imageWrapper .topicCategories {
    position: absolute;
    bottom: 11px;
    padding: 0 10px;
    width: 100%;
    height: 21px;
    z-index: 9;
    overflow: hidden;
}

.imageWrapper .GroupName {
    /* position: absolute; */
    z-index: 999;
    /* bottom: 20px; */
    /* right: 12px; */
    /*background: #ff7830;*/
    background: #3b5385;
    color: #ffffff;
    padding: 1px 4px;
}

.dateTime {
    font-size: 12px;
    padding-top: 2px;
}

.share-social {
    margin: 9px;
}

.share-social a {
    display: inline-block;
    border-radius: 100%;
    background: #fff;
    margin-left: 3px;
    width: 20px;
    height: 20px;
}

.share-social a i {
    color: #363636;
    display: block;
    text-align: center;
    font-size: 12px;
    padding-top: 4px;
    -webkit-transition: opacity 0.24s ease-in-out;
    -moz-transition: opacity 0.24s ease-in-out;
    transition: opacity 0.24s ease-in-out;
    margin: 0 !important;
}

.article-header h1 {
    font-size: 23px;
    font-weight: normal;
    margin-bottom: 25px;
    padding-top: 5px;
    padding-bottom: 10px;
    border-bottom: solid 2px #e2e2e2;
    display: block;
}

/* Article Tag Row */
.article-tag-row {
    margin: 15px 0 10px 0;
}
.article-tag-row .label {
    position: relative;
    display: inline-block;
    background-color: #3b5385;
    color: #fff;
    padding: 10px 12px 5px;
    font-size: 12px;
    font-weight: normal;
    margin-bottom: 0;
    height: auto;
    min-width: 50px !important;
    border-radius: 0;
}

.article-tag-row a {
    position: relative;
    display: inline-block;
    background-color: #e0e0e0;
    color: #7e7e7e;
    padding: 10px 12px 5px;
    font-size: 12px;
    font-size: 75%;
    font-weight: 700;
    margin-bottom: 0;
    height: auto;
    min-width: 50px !important;
    line-height: 1;
    border-radius: 0;
}

.article-tag-row a:hover, .article-tag-row a:focus {
    background-color: #3b5385;
    color: #fff;
}

/* Next and previous article links*/
.nextarticle-nav {
    text-align: center;
    height: 90px;
    /*background-color: #383838;*/
    background-color: #3b5385;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.nextarticle-nav label {
    font-size: 13px;
    font-weight: 300;
    color: #cfcfcf;
}

.nextarticle-nav a {
    text-align: center;
    padding: 10px 30px;
}

.nextarticle-link, .nextarticle-link:active, .nextarticle-link:visited {
    line-height: 20px;
    display: block;
    color: #f3f3f3;
    position: relative;
    min-height: 70px;
    transition: background .2s ease-out 0;
    text-align: center;
}

.nextarticle-link:focus, .nextarticle-link:hover {
    text-decoration: none;
    color: #ced5e9;
}

.nextarticle-nav h4 {
    height: 40px;
    overflow: hidden;
    font-size: 14px;
}

/*Read More Link*/
.article-grid a.read-more {
    font-size: 16px;
    margin: 10px 10px;
    font-weight: 400;
    /*font-style: italic;*/
    display: inline-block;
}

.article-grid a.read-more:hover {
    text-decoration: none;
    margin: 10px 10px;
}

/*Article Sidebar*/
.article-sidebar {
    padding: 0 !important;
}

.article-sidebar a {
    color: #333;
}

/* Latest Article Column */
.latest-articles h3 {
    /*margin: 0;
    padding: 0;*/
    font-size: 15px;
}

.latest-articles-title {
    position: relative;
    display: block;
    background-color: #3b5385;
    color: #fff !important;
    padding: 10px 17px 0;
    font-size: 1em;
    margin: 0;
    margin-bottom: 7px;
    height: 37px;
    font-weight: normal;
}

.latest-articles li {
    margin-top: 0;
    padding-top: 32px;
}

.latest-articles a {
    display: block;
    /*background: #fff;*/
    margin-bottom: 10px;
}

.latest-articles img {
    width: 100%;
    display: block;
}

.latest-articles h4 {
    padding: 12px 10px;
    color: #000;
    display: block;
    font-size: 16px;
    font-weight: 700;
}

/* --- End of Article css --- */

/*Contact Pages
------------------------------------*/
.map {
    width: 100%;
    height: 350px;
    border-top: solid 1px #eee;
    border-bottom: solid 1px #eee;
}

.map-box {
    height: 250px;
}

.map-box-space {
    margin-top: 15px;
}

.map-box-space1 {
    margin-top: 7px;
}
/* --- End of Contact Pages css --- */
/* RESPONSIVE CSS
-------------------------------------------------- */
@media (min-width: 768px) {
    .nav-tabs.nav-justified > li {
        display: table-cell;
        width: 1%;
    }

        .nav-tabs.nav-justified > li > a {
            margin-bottom: 0;
        }
    /* Navbar positioning foo */
    .navbar-wrapper {
        margin-top: 20px;
    }

        .navbar-wrapper .container {
            padding-right: 15px;
            padding-left: 15px;
        }

        .navbar-wrapper .navbar {
            padding-right: 0;
            padding-left: 0;
        }

        /* The navbar becomes detached from the top, so we round the corners */
        .navbar-wrapper .navbar {
            -ms-border-radius: 4px;
            border-radius: 4px;
        }

    /* Bump up size of carousel content */
    .carousel-caption p {
        margin-bottom: 20px;
        font-size: 21px;
        line-height: 1.4;
    }

    /* FEATTURETTE */
    .featurette-heading {
        font-size: 50px;
    }

    .featurettes-text > h1, .featurettes-text > h2 {
        margin-top: 60px;
    }
}

.nav-tabs.nav-justified > li > a {
    margin-right: 0;
    border-radius: 4px;
}

@media (min-width: 992px) {
    .featurette-heading {
        margin-top: 120px;
    }
}

@media (min-width: 1200px) {

    .featurettes-text > p {
        font-size: 20px;
    }
}

@media (max-width: 992px) {
    .img-responsive-height {
        min-height: 310px;
    }
}

@media (max-width: 768px) {
    .featurettes-text {
        margin-top: 10%;
    }

    .featured-logo {
        display: none;
    }
}
