.logo-sm, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block
}

.itemtitle, .mid-row span {
    text-align: center;
    color: #fff
}

.electronic-ul li, .navigation li, .newspaper-ul li, .other-link-site li, .right-menu2 {
    list-style-type: none
}

article, aside, audio, canvas, caption, dd, details, dl, dt, embed, fieldset, figcaption, figure, footer, form, header, hgroup, label, legend, li, mark, menu, nav, ol, output, ruby, section, summary, table, tbody, td, tfoot, th, thead, time, tr, ul, video {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: middle;
    outline: 0
}

a, a:focus, a:hover {
    text-decoration: none;
    outline: 0
}

body {
    direction: rtl;
    font-family: IRANSansFA,Tahoma;
    font-size: 12px;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden
}

.mr15 {
    margin-right: 15px
}

.floatNone {
    float: none
}

.clearBoth {
    clear: both
}

.width100 {
    width: 100%
}

.font14 {
    font-size: 14px
}

.font12 {
    font-size: 12px
}

.font15 {
    font-size: 15px
}

.mt10 {
    margin-top: 10px
}

.mt80 {
    margin-top: 96px
}

.mb20 {
    margin-bottom: 20px
}

.mb5 {
    margin-bottom: 5px
}

.mb10 {
    margin-bottom: 10px
}

.padding-10 {
    padding: 10px 0
}

.ml5 {
    margin-left: 5px
}

.ml10 {
    margin-left: 10px
}

.mr5 {
    margin-right: 5px
}

.mt5 {
    margin-top: 5px
}

.ml50 {
    margin-left: 50px
}

.carousel-control.left, .carousel-control.right {
    background-image: none
}

.colorGreen {
    color: #0aaa57
}

.colorBlue, .language a {
    color: #004d8f
}

.login-title {
    margin-top: 10px
}

.logo-sm {
    width: 200px;
    margin: auto
}

.headerBanner img {
    position: absolute;
    z-index: 10;
    right: -72px;
    width: 335px;
    top: -49px
}

.Header {
    background: url(../../Images/headbg.png) repeat-x rgba(0,0,0,0);
    height: 150px;
    width: 100%;
    max-width: 100%
}

.background-header {
    background: url(../../Images/leader.png) no-repeat;
    background-size: 214px 147px;
    height: 148px
}

.language {
    float: right;
    margin-top: 9px
}

.seperator {
    border-left: 1px solid #222;
    height: 15px;
    margin-top: 2px
}

.DateTimes {
    margin-right: 10px;
    margin-top: 10px
}

    .DateTimes span {
        color: #004d8f;
        font-size: 14px;
        font-weight: 700;
        display: inline-block
    }

.search-input-group {
    border: 1px solid #9b9b9b;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
    margin-left: 8px;
    width: 290px;
    background-color: #fff
}

    .search-input-group .search-input {
        background: rgba(0,0,0,0);
        border: 0;
        color: #888;
        line-height: 33px;
        margin: 0;
        width: calc(100% - 18px);
        padding: 3px 20px
    }

    .search-input-group .SearchButton {
        border-radius: 2px 0 0 2px;
        -webkit-border-radius: 2px 0 0 2px;
        -moz-border-radius: 2px 0 0 2px;
        -ms-border-radius: 2px 0 0 2px;
        -o-border-radius: 2px 0 0 2px;
        background: url(../../Images/header-sprite-min.png) -2px -65px no-repeat rgba(0,0,0,0);
        color: transparent;
        float: left;
        height: 30px;
        -moz-transition: all .2s ease-in-out 0s;
        -o-transition: all .2s ease-in-out 0s;
        -webkit-transition: all .2s ease-in-out 0s;
        transition: all .2s ease-in-out 0s;
        width: 29px;
        border: none
    }

.IconGroup, .login-ico a {
    width: 31px;
    height: 31px
}

.search-input-group .SearchButton, .search-input-group .search-input {
    display: table-cell;
    height: 30px;
    vertical-align: middle
}

.login-ico a, .menu-header #headerMenu .nav li.dropdown:hover > .dropdown-menu {
    display: block
}

.search-input-group .SearchButton:hover {
    background-position: -34px -65px
}

.IconGroup {
    background-image: url(../../Images/header-sprite-min.png);
    border-radius: 5px;
    float: left;
    -moz-transition: all .2s ease-in-out 0s;
    -o-transition: all .2s ease-in-out 0s;
    -webkit-transition: all .2s ease-in-out 0s;
    transition: all .2s ease-in-out 0s
}

.head-icon-link {
    display: block;
    float: right;
    height: 41px;
    margin: 0 0 0 6px;
    width: 30px
}

.IconGroup.login-ico {
    background-position: 0 0
}

    .IconGroup.login-ico:hover {
        background-position: 0 -33px
    }

.IconGroup.sitemap-ico {
    background-position: 200px 0
}

    .IconGroup.sitemap-ico:hover {
        background-position: 200px -33px
    }

.IconGroup.News-ico {
    background-position: 158px 0
}

    .IconGroup.News-ico:hover {
        background-position: 158px -33px
    }

.IconGroup.Map-ico {
    background-position: 115px 0
}

    .IconGroup.Map-ico:hover {
        background-position: 115px -33px
    }

.IconGroup.cell-ico {
    background-position: 73px 0
}

    .IconGroup.cell-ico:hover {
        background-position: 73px -33px
    }

.IconGroup.home-ico {
    background-position: 31px 0
}

    .IconGroup.home-ico:hover {
        background-position: 31px -33px
    }

.logo-container {
    position: relative;
    height: 165px;
    width: 165px;
    background-clip: content-box;
    -webkit-border-radius: 500px;
    -moz-border-radius: 500px;
    border-radius: 500px
}

    .logo-container::after {
        content: '';
        height: 100%;
        width: 100%;
        position: absolute;
        top: -5px;
        animation: rotate infinite 2s linear;
        right: 0;
        border-top: 5px solid #67bef6;
        border-bottom: 5px solid #0c638e;
        -webkit-border-radius: 500px;
        -moz-border-radius: 500px;
        border-radius: 500px
    }

    .logo-container img {
        position: relative;
        top: 0;
        z-index: 2;
        transition: .3s;
        height: 100%;
        width: 100%;
        -webkit-border-radius: 800px;
        -moz-border-radius: 800px;
        border-radius: 800px;
        background-color: #fff
    }

    .logo-container .blue-layer {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        z-index: 4;
        -webkit-border-radius: 800px;
        -moz-border-radius: 800px;
        border-radius: 800px;
        background: rgba(52,171,252,.17)
    }

    .logo-container .bold-border {
        border: 15px solid rgba(39,120,203,.5);
        position: absolute;
        -webkit-border-radius: 800px;
        -moz-border-radius: 800px;
        border-radius: 800px;
        top: 0;
        transition: .15s;
        height: 100%;
        width: 100%;
        z-index: 3
    }

    .logo-container .think-border {
        height: calc(100% - 48px);
        width: calc(100% - 48px);
        position: absolute;
        top: 24px;
        left: 24px;
        opacity: .8;
        transition: .15s;
        z-index: 4;
        mix-blend-mode: overlay;
        border: 2px solid #fff;
        -webkit-border-radius: 500px;
        -moz-border-radius: 500px;
        border-radius: 500px
    }

@keyframes rotate {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

.col-sm-1-9 {
    width: 16%;
    float: right;
    padding: 0 10px;
    top: 65px;
    position: absolute
}

.col-sm-8-0 {
    padding-left: 0;
    width: 75.333%;
    float: right;
    margin-right: 235px
}

.menu-header nav {
    margin-top: 16px
}

.menu-header .nav > li > a {
    padding: 6px 5px;
    color: #004d8f;
    transition: .5s;
    font-size: 13px
}

.menu-header .nav .dropdown-menu {
    background-color: #184471;
    border-top: 4px solid #2778cb
}

    .menu-header .nav .dropdown-menu li a {
        transition: .5s;
        font-size: 12px;
        position: relative;
        color: #fff
    }

        .menu-header .nav .dropdown-menu li a:focus, .menu-header .nav .dropdown-menu li a:hover {
            color: #004d8f;
            background-color: #eee;
            border-radius: 0
        }

        .menu-header .nav .dropdown-menu li a:before {
            right: -13px;
            top: -22%;
            -webkit-transform: translateY(50%);
            -ms-transform: translateY(50%);
            transform: translateY(50%);
            position: absolute;
            content: '\f0a8';
            font-family: FontAwesome;
            font-size: 12px;
            display: inline-block;
            margin-right: 17px;
            transition: right .3s,opacity .3s;
            opacity: 0;
            color: #004d8f
        }

.dropdown-submenu:hover > .dropdown-menu, .itemtitle, .news .date {
    display: block
}

.menu-header .nav .dropdown-menu li a:hover:before {
    right: -9px;
    opacity: 1
}

.menu-header .nav > li a:focus, .menu-header .nav > li a:hover {
    color: #004d8f;
    background-color: #eee;
    border-radius: 6px 6px 0 0
}

.navbar-header i {
    color: #004d8f;
    font-size: 18px
}

.menu-header .nav .open > a, .menu-header .nav .open > a:hover, .nav .open > a:focus {
    color: #004d8f;
    background-color: #eee;
    border-radius: 6px 6px 0 0
}

.dropdown-submenu {
    position: relative
}

    .dropdown-submenu > .dropdown-menu {
        top: 0;
        right: 100%;
        margin-top: -6px;
        margin-left: -1px
    }

    .dropdown-submenu > a:after {
        content: "\f0d9";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: 400;
        text-decoration: inherit;
        color: #fff;
        font-size: 16px;
        padding-right: .5em;
        position: absolute;
        top: 1px;
        left: 5px
    }

    .dropdown-submenu.pull-left {
        float: none
    }

        .dropdown-submenu.pull-left > .dropdown-menu {
            left: -100%;
            margin-left: 10px;
            -webkit-border-radius: 6px 0 6px 6px;
            -moz-border-radius: 6px 0 6px 6px;
            border-radius: 6px 0 6px 6px
        }

#carouselMajor {
    width: 100%;
    position: relative
}

    #carouselMajor .carousel-inner > .item {
        width: 100%;
        height: 400px
    }

        #carouselMajor .carousel-inner > .item > img {
            width: 100%;
            height: 100%;
            background-size: cover;
            background-position: center
        }

    #carouselMajor .carousel-inner .item .mid-row {
        opacity: 0;
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        -ms-opacity: 0;
        -webkit-opacity: 0;
        -webkit-transition: 2s all ease-in-out .1s;
        -moz-transition: 2s all ease-in-out .1s;
        -ms-transition: 2s all ease-in-out .1s;
        -o-transition: 2s all ease-in-out .1s;
        transition: 2s all ease-in-out .1s
    }

    #carouselMajor .carousel-inner .item.active .mid-row {
        opacity: 1;
        filter: alpha(opacity=100);
        -moz-opacity: 1;
        -ms-opacity: 1;
        -webkit-opacity: 1;
        -webkit-transition: right .5s all ease-in-out;
        -moz-transition: right .5s all ease-in-out;
        -ms-transition: right .5s all ease-in-out;
        -o-transition: right .5s all ease-in-out;
        transition: right .5s all ease-in-out;
        right: 17%
    }

.mid-row {
    padding: 20px;
    position: absolute;
    bottom: 24%;
    right: -999px;
    background-color: rgba(0,0,0,.7)
}

    .mid-row span {
        font-size: 22px
    }

#carouselMajor .carousel-control.right {
    top: 39%;
    width: 9%;
    font-size: 75px;
    opacity: 0;
    transition: opacity .34s
}

    #carouselMajor .carousel-control.left i, #carouselMajor .carousel-control.right i {
        font-size: 75px
    }

#carouselMajor .carousel-control.left {
    width: 10%;
    top: 39%;
    font-size: 75px;
    opacity: 0;
    transition: opacity .34s
}

#carouselMajor:hover .carousel-control.left, #carouselMajor:hover .carousel-control.right {
    opacity: 1
}
.btn-download {
    margin-bottom: 20px;
    background-color: #004d8f;
    transition: .5s;
    font-size: 14px;
    padding: 7px 10px;
    text-align: center;
    color: #fff;
    border-radius: 5px;
}
.Reg-headcurved {
    background: url(../../Images/slidebanner.png) center 0 no-repeat rgba(0,0,0,0);
    height: 137px;
    margin-top: -119px;
    position: absolute;
    width: 100%;
    z-index: 180;
    max-width: 100%
}

.access-item, .access-item.circle, .accessLink, .books {
    position: relative
}

.accessLink {
    background: linear-gradient(to bottom,#f3f3f3 0,#edeaea 80%,#fff 100%);
    padding: 45px 0 70px;
    width: 100%
}

.animate.show {
    opacity: 1;
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -ms-opacity: 1;
    -webkit-opacity: 1;
    animation: accessLink 1s ease-in-out;
    -ms-animation: accessLink 1s ease-in-out;
    -webkit-animation: accessLink 1s ease-in-out;
    -moz-animation: accessLink 1s ease-in-out;
    -o-animation: accessLink 1s ease-in-out
}

@keyframes accessLink {
    0% {
        opacity: 0;
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        -ms-opacity: 0;
        -webkit-opacity: 0;
        transform: scale(.8)
    }

    100% {
        opacity: 1;
        filter: alpha(opacity=100);
        -moz-opacity: 1;
        -ms-opacity: 1;
        -webkit-opacity: 1;
        transform: scale(1)
    }
}

@-moz-keyframes accessLink {
    0% {
        opacity: 0;
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        transform: scale(.8);
        -moz-transform: scale(.8)
    }

    100% {
        opacity: 1;
        filter: alpha(opacity=100);
        -moz-opacity: 1;
        transform: scale(1);
        -moz-transform: scale(1)
    }
}

@-ms-keyframes accessLink {
    0% {
        opacity: 0;
        filter: alpha(opacity=0);
        -ms-opacity: 0;
        transform: scale(.8);
        -ms-transform: scale(.8)
    }

    100% {
        opacity: 1;
        filter: alpha(opacity=100);
        -ms-opacity: 1;
        transform: scale(1);
        -ms-transform: scale(1)
    }
}

@-webkit-keyframes accessLink {
    0% {
        opacity: 0;
        filter: alpha(opacity=0);
        -webkit-opacity: 0;
        transform: scale(.8);
        -webkit-transform: scale(.8)
    }

    100% {
        opacity: 1;
        filter: alpha(opacity=100);
        -webkit-opacity: 1;
        transform: scale(1);
        -webkit-transform: scale(1)
    }
}

@-o-keyframes accessLink {
    0% {
        opacity: 0;
        filter: alpha(opacity=0);
        -o-opacity: 0;
        transform: scale(.8);
        -o-transform: scale(.8)
    }

    100% {
        opacity: 1;
        filter: alpha(opacity=100);
        -o-opacity: 1;
        transform: scale(1);
        -o-transform: scale(1)
    }
}

.mb40 {
    margin-bottom: 40px
}

.access-item {
    -webkit-transition: all .35s ease-in-out;
    -moz-transition: all .35s ease-in-out;
    transition: all .35s ease-in-out
}

    .access-item.circle.effect1 .spinner, .ih-item3.circle.effect1 .spinner {
        -webkit-transition: all .8s ease-in-out;
        -moz-transition: all .8s ease-in-out
    }

    .access-item, .access-item * {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }

        .access-item.circle {
            width: 155px;
            height: 155px;
            border-radius: 50%;
            margin: 0 auto
        }

            .access-item.circle.effect1 .spinner {
                height: 155px;
                width: 155px;
                border: 10px solid #04205a;
                border-right-color: #2778cb;
                border-bottom-color: #184471;
                border-radius: 50%;
                transition: all .8s ease-in-out
            }

.post-img, .post-img a {
    width: 200px;
    max-width: 100%
}

.access-item.circle.effect1 a:hover .spinner {
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg)
}

.itemtitle {
    background: #004d8f;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 700;
    margin: 26px 0;
    padding: 6px
}

.news {
    padding: 30px 0
}

    .news h3 {
        margin-top: 5px
    }

        .news h3 a {
            color: #004d8f;
            font-size: 16px
        }

            .news h3 a:focus, .news h3 a:hover {
                color: #ED1C24
            }

    .news .category {
        color: #333;
        display: block;
        margin-bottom: 5px
    }

    .news .date {
        color: #0baa57;
        font-size: 14px;
        margin-top: 15px
    }

    .news p {
        color: #888;
        font-size: 14px;
        display: inline
    }

.more-read i {
    color: #0baa57;
    vertical-align: middle;
    font-size: 19px;
    margin-right: 2px;
    display: inline-block
}

.more-read:focus i, .more-read:hover i {
    -ms-animation: shake 1s ease-in-out;
    -webkit-animation: shake 1s ease-in-out;
    -moz-animation: shake 1s ease-in-out;
    -o-animation: shake 1s ease-in-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite
}

.post-img {
    float: right
}

    .post-img a {
        height: 150px;
        display: block;
        border: 5px solid #e0e0e9;
        border-radius: 4px
    }

        .post-img a img {
            width: 100%;
            height: 100%;
            border-radius: 4px;
            transition: .5s
        }

        .post-img a:hover img {
            opacity: .8
        }

.post-info {
    padding-right: 230px
}

.block-title, .news .title-slideshow {
    font-size: 14px;
    line-height: 1;
    margin-top: 0;
    margin-bottom: 26px;
    border-bottom: 2px solid #268cc4
}

    .block-title span, .news .title-slideshow span {
        line-height: 17px;
        display: inline-block;
        background-color: #268cc4;
        color: #fff;
        border-radius: 4px 4px 0 0;
        padding: .7em 2.2em
    }

#newsCarousel .carousel-indicators li {
    background-color: #0baa57
}

#newsCarousel .carousel-indicators {
    text-align: left;
    margin-right: -11%
}

#newsCarousel.show1 {
    animation: fromRight 1s ease-in-out
}

@keyframes fromRight {
    0% {
        transform: translateX(999px)
    }

    100% {
        transform: translateX(0)
    }
}

@keyframes shake {
    0%,100% {
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0)
    }

    30%,70% {
        -webkit-transform: translateX(7px);
        -ms-transform: translateX(7px);
        transform: translateX(7px)
    }

    40%,60% {
        -webkit-transform: translateX(-5px);
        -ms-transform: translateX(-5px);
        transform: translateX(-5px)
    }
}

@-moz-keyframes shake {
    0%,100% {
        -moz-transform: translateX(0);
        transform: translateX(0)
    }

    30%,70% {
        -moz-transform: translateX(7px);
        transform: translateX(7px)
    }

    40%,60% {
        -moz-transform: translateX(-5px);
        transform: translateX(-5px)
    }
}

@-ms-keyframes shake {
    0%,100% {
        -ms-transform: translateX(0);
        transform: translateX(0)
    }

    30%,70% {
        -ms-transform: translateX(7px);
        transform: translateX(7px)
    }

    40%,60% {
        -ms-transform: translateX(-5px);
        transform: translateX(-5px)
    }
}

@-webkit-keyframes shake {
    0%,100% {
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    30%,70% {
        -webkit-transform: translateX(7px);
        transform: translateX(7px)
    }

    40%,60% {
        -webkit-transform: translateX(-5px);
        transform: translateX(-5px)
    }
}

@-o-keyframes shake {
    0%,100% {
        -o-transform: translateX(0);
        transform: translateX(0)
    }

    30%,70% {
        -o-transform: translateX(7px);
        transform: translateX(7px)
    }

    40%,60% {
        -o-transform: translateX(-5px);
        transform: translateX(-5px)
    }
}

.wiget-tabs .nav-tabs li.active a {
    background-color: #268cc4;
    color: #fff
}

.wiget-tabs .nav-tabs li a {
    background: #eff0f2;
    border-radius: 6px 6px 0 0;
    color: #222;
    margin: 0 0 0 6px;
    padding: .7em 2.2em
}

.article-info h2 a, .radio-info2 h2 a {
    margin-bottom: 10px;
    display: block;
    color: #004d8f
}

.wiget-tabs .tab-content {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: #fff;
    border-color: #268cc4;
    -moz-border-image: none;
    -o-border-image: none;
    -webkit-border-image: none;
    border-radius: 10px 0 10px 10px;
    border-style: solid;
    border-width: 4px 2px 2px;
    box-shadow: 1px 2px 5px -2px #268cc4;
    min-height: 80px;
    padding: 20px
}

.article-section {
    overflow: hidden;
    transition: .5s
}

.radio-section2 {
    overflow: hidden;
    transition: .5s;
    border-bottom: 1px solid #e7dbdb;
    padding-bottom: 10px
}

.article-section.show1 {
    animation: fromTop 1s ease-out
}

.article-section:hover {
    background-color: #F8F9F9
}

.article-section [class*=col-] {
    padding-right: 0
}

.article-pic, .radio-pic2 {
    width: 130px;
    max-width: 100%;
    float: right
}

    .article-pic a, .radio-pic2 a {
        width: 130px;
        max-width: 100%;
        height: 90.83px;
        display: block;
        border: 5px solid #e0e0e9;
        border-radius: 4px
    }

        .article-pic a img, .radio-pic2 a img {
            width: 100%;
            height: 100%;
            transition: .5s;
            -webkit-transition: .5s;
            -moz-transition: .5s;
            -ms-transition: .5s;
            -o-transition: .5s
        }

        .article-pic a:hover img, .radio-pic2 a:hover img {
            opacity: .8;
            filter: alpha(opacity=80);
            -moz-opacity: .8;
            -ms-opacity: .8;
            -webkit-opacity: .8
        }

.article-info, .radio-info2 {
    padding-right: 145px
}

    .article-info .preTitle, .blog-post .preTitle, .post-info .preTitle {
        font-weight: 700;
        display: block
    }

    .article-info h2 {
        margin-top: 0
    }

        .article-info h2 a {
            font-size: 14px;
            transition: .5s
        }

    .radio-info2 h2 a {
        font-size: 16px;
        transition: .5s;
        margin-top: 20px
    }

        .article-info h2 a:focus, .article-info h2 a:hover, .radio-info2 h2 a:focus, .radio-info2 h2 a:hover {
            color: #ED1C24
        }

    .article-info .more, .gardeshgari-post .more {
        margin-bottom: 5px;
        background-color: #004d8f;
        transition: .5s;
        font-size: 12px;
        padding: 5px 10px;
        text-align: center;
        color: #fff;
        border-radius: 5px
    }

        .article-info .more:focus, .article-info .more:hover, .gardeshgari-post .more:focus, .gardeshgari-post .more:hover,
        .btn-download:hover, .btn-download:focus{
            background-color: #ED1C24;
            color: #fff
        }

    .article-info p {
        color: #888;
        margin: 0 0 1px
    }

    .article-info .category-name {
        font-size: 11px
    }

.article-news {
    border: 2px solid #268cc4;
    border-radius: 5px;
    padding: 5px
}

.archive {
    font-size: 20px;
    color: #004d8f;
    padding: 10px;
    cursor: pointer;
}

    .archive:focus, .archive:hover {
        color: #ED1C24
    }

.border-archive {
    border-bottom: 1px solid #c9c6c6;
    width: 100%
}

.psd-archive {
    margin-bottom: 3px;
    margin-top: 10px;
    width: 100%;
    height: 10px;
    margin: 35px 0px;
}

.profile {
    height: 220px;
    width: 220px;
    margin: auto auto 10px
}

.shahrdar-name-info {
    display: inline-block;
    background: #24669f;
    border-radius: 10px;
    color: #fff;
    margin: 5px auto;
    padding: 5px 35px
}

    .shahrdar-name-info span {
        display: block;
        font-size: 13px;
        text-align: center;
        margin-bottom: 5px
    }

    .shahrdar-name-info:focus, .shahrdar-name-info:hover {
        color: #fff
    }

.shahrdar-sprite {
    background-image: url(../../Images/item-sprite-min.png);
    display: inline-block;
    height: 45px;
    width: 45px
}

.shahdar-contact {
    display: inline-block;
    margin-top: 5px
}

.mail-shahdar {
    background-position: -6px 59px
}

.mobile-shahdar {
    background-position: -64px 61px
}

.phone-shahdar {
    background-position: -123px 59px
}

.quick-access {
    width: 100%;
    min-height: 200px;
    margin-top: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap
}

    .quick-access > .quick-box {
        margin: 5px;
        width: 120px;
        -webkit-border-radius: 15px;
        -moz-border-radius: 15px;
        border-radius: 15px;
        border: 1px solid rgba(0,0,0,.2);
        height: 120px
    }

    .quick-access .quick-box a img {
        width: 100%;
        height: 100%;
        border-radius: 15px
    }

    .quick-access .quick-box2 {
        width: 100%
    }

#carouselBook, #carouselnewspaper {
    width: 92%;
    position: relative;
    margin: 0 auto 10px
}

    #carouselnewspaper .carousel-inner > .item, #carouselnewspaper .carousel-inner > .item a img {
        width: 100%;
        height: 176px;
        border-radius: 4px
    }

    #carouselBook .carousel-inner > .item {
        width: 100%;
        height: 250px;
        border-radius: 4px
    }

.books {
    width: 100%;
    height: 250px;
    overflow: hidden;
    background: -webkit-linear-gradient(-45deg,#000 0,#fff 100%);
    background: linear-gradient(-45deg,#000 0,#fff 100%)
}

    .books figcaption, .books figcaption > a {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

    .books figcaption {
        padding: 2em;
        text-transform: uppercase;
        font-size: 1.25em;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

        .books figcaption > a {
            z-index: 1000;
            text-indent: 200%;
            white-space: nowrap;
            font-size: 0;
            opacity: 0;
            color: #fff
        }

    .books img {
        margin: -10px 0 0 -10px;
        max-width: none;
        width: -webkit-calc(100% + 10px);
        width: calc(100% + 10px);
        position: relative;
        display: block;
        min-height: 100%;
        height: 300px;
        opacity: .9;
        -webkit-transition: opacity .35s,-webkit-transform .35s;
        transition: opacity .35s,transform .35s;
        -webkit-transform: translate3d(10px,10px,0);
        transform: translate3d(10px,10px,0);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        border-radius: 4px
    }

    .books figcaption::before {
        -webkit-transition: opacity .35s,-webkit-transform .35s;
        transition: opacity .35s,transform .35s;
        position: absolute;
        right: -100px;
        bottom: -100px;
        width: 245px;
        height: 204px;
        border: 2px solid #fff;
        border-radius: 50%;
        box-shadow: 0 0 0 900px rgba(0,0,0,.8);
        content: '';
        opacity: 0;
        -webkit-transform: scale3d(.5,.5,1);
        transform: scale3d(.5,.5,1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }

    .books h4, .galleryImage figcaption {
        -webkit-transition: -webkit-transform .35s
    }

    .books:hover img {
        opacity: .6;
        -webkit-transform: translate3d(1,1,1);
        transform: translate3d(1,1,1)
    }

    .books h4 {
        opacity: 0;
        font-size: 18px;
        color: #fff;
        transition: transform .35s;
        -webkit-transform: translate3d(5px,5px,0);
        transform: translate3d(5px,5px,0)
    }

    .books:hover figcaption::before {
        opacity: 1;
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1)
    }

    .books:hover h4, .books:hover p {
        opacity: 1;
        -webkit-transform: translate3d(1,1,1);
        transform: translate3d(1,1,1)
    }

    .books p {
        position: absolute;
        right: 10px;
        bottom: 10px;
        padding: 0 1.5em 1.5em 0;
        width: 140px;
        opacity: 0;
        -webkit-transform: translate3d(20px,20px,0);
        transform: translate3d(20px,20px,0);
        color: #fff
    }

.send-pic {
    height: 75px;
    transition: .3s;
    background: #34abfc;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: 1px solid #34abfc;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    width: 94%;
    margin: 20px auto
}

    .send-pic:hover {
        background: #fff;
        border: 1px solid #34abfc
    }

        .send-pic:hover .right-image svg {
            left: -5px
        }

            .send-pic:hover .right-image svg .camera {
                fill: rgba(52,171,252,.6)
            }

        .send-pic:hover h5 {
            color: #34abfc !important
        }

    .send-pic .right-image {
        width: 50%;
        height: 100%;
        overflow: hidden
    }

        .send-pic .right-image svg {
            width: 90px !important;
            height: 90px !important;
            position: relative;
            left: -20px;
            top: 15px;
            transition: .3s
        }

            .send-pic .right-image svg .camera {
                transition: .3s;
                fill: rgba(0,0,0,.1)
            }

    .send-pic .left-desc {
        width: 50%;
        height: 100%;
        padding-right: 10px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center
    }

        .send-pic .left-desc h5 {
            color: #fff;
            font-size: 13px;
            transition: .3s;
            position: relative;
            top: -3px;
            margin: 0
        }

        .send-pic .left-desc span {
            color: rgba(0,0,0,.6);
            font-size: 11px
        }

#sendImageModal .sendpic-header {
    width: 100%;
    height: 180px;
    display: flex;
    justify-content: center;
    align-items: center
}

    #sendImageModal .sendpic-header .upload-box {
        cursor: pointer;
        width: 230px;
        height: 130px;
        border: 1px solid rgba(153,153,153,.3);
        -webkit-border-radius: 40px;
        -moz-border-radius: 40px;
        border-radius: 40px;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        flex-direction: column
    }

        #sendImageModal .sendpic-header .upload-box #camera-upload {
            height: 75px;
            width: 75px
        }

        #sendImageModal .sendpic-header .upload-box .titleUpload {
            display: flex;
            justify-content: center;
            align-items: center
        }

        #sendImageModal .sendpic-header .upload-box h3 {
            color: #004d8f;
            margin: 0;
            font-size: 14px
        }

        #sendImageModal .sendpic-header .upload-box span {
            color: rgba(0,0,0,.5);
            font-size: 10px
        }

#sendImageModal form {
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    width: 100%;
    height: 100%
}

    #sendImageModal form textarea {
        padding: 10px;
        border: 1px solid #888;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;
        width: 100%;
        resize: none;
        height: 100px;
        transition: .3s
    }

        #sendImageModal form textarea:focus {
            color: #004d8f
        }

    #sendImageModal form .form-submit {
        width: 100%;
        height: 80px;
        display: flex;
        justify-content: center;
        align-items: center
    }

        #sendImageModal form .form-submit input {
            border: 1px solid #004d8f;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
            background: #004d8f;
            height: 30px;
            padding: 0 10px;
            width: 150px;
            color: #fff;
            transition: .3s;
            margin: 0 15px
        }

            #sendImageModal form .form-submit input:hover {
                border: 1px solid #004d8f;
                color: #004d8f;
                background: #fff
            }

    #sendImageModal form .form-group {
        margin-bottom: 10px;
        height: 35px;
        display: flex;
        justify-content: center;
        align-items: center
    }

        #sendImageModal form .form-group input {
            border: 1px solid #888;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
            height: 30px;
            padding: 0 10px;
            width: 178px;
            margin: 0 5px;
            transition: .3s
        }

.footerBanner, .headBanner {
    background: url(../../Images/slidebanner.png) center 0 no-repeat rgba(0,0,0,0);
    height: 139px;
    width: 100%;
    z-index: 10;
    position: relative;
    max-width: 100%
}

#sendImageModal form .form-group input:focus {
    color: #004d8f;
    border: 1px solid #004d8f
}

.headBanner {
    top: -57px
}

.footerBanner {
    -moz-transform: rotate(-180deg);
    -ms-transform: rotate(-180deg);
    -o-transform: rotate(-180deg);
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg);
    top: 60px
}

.Bannerinner {
    margin: -85px 0;
    padding: 50px 0 90px;
    background: url(../../images/banner-project.jpg) center center no-repeat fixed;
    background-size: cover;
    max-width: 100%
}

.Bannerinner2 {
    background: url(../../images/banner-person.jpg) center center no-repeat fixed;
    margin: -55px 0;
    background-size: cover;
    padding: 50px 0 85px;
    max-width: 100%
}

#slideCarousel, #slideCarousel2 {
    position: relative
}

    #slideCarousel .carousel-inner.show1, #slideCarousel2 .carousel-inner.show1 {
        animation: scaleSlide 1s ease-in-out
    }

@keyframes scaleSlide {
    0% {
        transform: scale(.5)
    }

    100% {
        transform: scale(1)
    }
}

#slideCarousel2 .carousel-control.right {
    top: 77px;
    right: -103px;
    width: 9%;
    font-size: 53px;
    color: #2b2b2b;
    opacity: 1
}

#slideCarousel2 .carousel-control.left {
    left: -114px;
    width: 10%;
    top: 77px;
    font-size: 53px;
    color: #2b2b2b;
    opacity: 1
}

#slideCarousel .carousel-control.right {
    top: 77px;
    right: -103px;
    width: 9%;
    font-size: 53px;
    color: #fff;
    opacity: 1
}

#slideCarousel .carousel-control.left {
    left: -114px;
    width: 10%;
    top: 77px;
    font-size: 53px;
    color: #fff;
    opacity: 1
}

    #slideCarousel .carousel-control.left i, #slideCarousel .carousel-control.right i, #slideCarousel2 .carousel-control.left i, #slideCarousel2 .carousel-control.right i {
        font-size: 53px
    }

#slideCarousel .carousel-inner > .item > .row .col-sm-3, #slideCarousel2 .carousel-inner > .item > .row .col-sm-3 {
    height: 230px
}

.animate-person.show1 {
    animation: fromTop 1s ease-in-out;
    -ms-animation: fromTop 1s ease-in-out;
    -webkit-animation: fromTop 1s ease-in-out;
    -moz-animation: fromTop 1s ease-in-out;
    -o-animation: fromTop 1s ease-in-out
}

.col-sm-2-5 {
    float: right;
    width: 19.5%
}

.ih-item img, .ih-item2 img {
    width: 100%;
    height: 100%
}

.ih-item3 img {
    width: 80px;
    height: 80px;
    text-align: center;
    margin: 30px auto;
    display: block
}

.ih-item3.circle, .ih-item3.circle .img {
    position: relative;
    width: 155px;
    height: 155px
}

.ih-item2.circle, .ih-item3.circle {
    margin-bottom: 20px
}

    .ih-item3.circle, .ih-item3.circle .img {
        border-radius: 50%
    }

    .ih-item2.circle, .ih-item2.circle .img {
        width: 170px;
        height: 170px;
        position: relative;
        border-radius: 50%
    }

.ih-item.circle, .ih-item.circle .img {
    position: relative;
    width: 220px;
    height: 220px;
    border-radius: 50%
}

    .ih-item.circle .img:before, .ih-item2.circle .img:before, .ih-item3.circle .img:before {
        position: absolute;
        display: block;
        content: '';
        width: 100%;
        height: 100%;
        border-radius: 50%;
        box-shadow: inset 0 0 0 16px rgba(255,255,255,.6),0 1px 2px rgba(0,0,0,.3);
        -webkit-transition: all .35s ease-in-out;
        -moz-transition: all .35s ease-in-out;
        transition: all .35s ease-in-out
    }

    .ih-item.circle .img img, .ih-item2.circle .img img, .ih-item3.circle .img img {
        border-radius: 50%
    }

    .ih-item.circle .info, .ih-item2.circle .info, .ih-item3.circle .info {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        text-align: center;
        border-radius: 50%;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden
    }

.ih-item3.circle.effect1 .spinner {
    width: 165px;
    height: 165px;
    border: 10px solid #04205a;
    border-right-color: #2778cb;
    border-bottom-color: #184471;
    border-radius: 50%;
    transition: all .8s ease-in-out
}

.ih-item.circle.effect1 .spinner, .ih-item2.circle.effect1 .spinner {
    -webkit-transition: all .8s ease-in-out;
    -moz-transition: all .8s ease-in-out
}

.ih-item2.circle.effect1 .spinner {
    width: 180px;
    height: 180px;
    border: 10px solid #04205a;
    border-right-color: #2778cb;
    border-bottom-color: #184471;
    border-radius: 50%;
    transition: all .8s ease-in-out
}

.ih-item.circle.effect1 .spinner {
    width: 230px;
    height: 230px;
    border: 10px solid #04205a;
    border-right-color: #2778cb;
    border-bottom-color: #184471;
    border-radius: 50%;
    transition: all .8s ease-in-out
}

.ih-item.circle.effect1 .img, .ih-item2.circle.effect1 .img, .ih-item3.circle.effect1 .img {
    position: absolute;
    top: 10px;
    bottom: 0;
    right: 10px;
    left: 0;
    width: auto;
    height: auto
}

.ih-item.circle.effect1 .info span, .ih-item2.circle.effect1 .info span {
    height: 110px;
    text-shadow: 0 0 1px #fff,0 1px 2px rgba(0,0,0,.3);
    line-height: 87px;
    color: #fff;
    position: relative;
    text-align: center
}

.ih-item.circle.effect1 .img:before, .ih-item2.circle.effect1 .img:before, .ih-item3.circle.effect1 .img:before {
    display: none
}

.ih-item.circle.effect1.colored .info, ih-item2.circle.effect1.colored .info, ih-item3.circle.effect1.colored .info {
    background: #1a4a72;
    background: rgba(26,74,114,.6)
}

.ih-item.circle.effect1 .info, .ih-item2.circle.effect1 .info {
    top: 10px;
    bottom: 0;
    right: 10px;
    left: 0;
    background: #333;
    background: rgba(0,0,0,.6);
    opacity: 0;
    -webkit-transition: all .8s ease-in-out;
    -moz-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out
}

    .ih-item.circle.effect1 .info span {
        font-size: 16px;
        display: block;
        margin: 0 30px;
        padding: 55px 0 0
    }

    .ih-item2.circle.effect1 .info span {
        font-size: 14px;
        display: block;
        margin: 0 5px;
        padding: 38px 0 0
    }

.ih-item.circle.effect1 a:hover .info, .ih-item2.circle.effect1 a:hover .info {
    opacity: 1
}

.projects-container .title {
    color: #fff;
    font-size: 32px;
    margin-bottom: 40px;
    font-weight: 700
}

.projects-container {
    margin-top: 50px
}

.person-container .title {
    color: #004d8f;
    font-size: 34px;
    margin-bottom: 31px;
    font-weight: 700
}

.animatefooter.hide {
    opacity: 0
}

.animatefooter.show1 {
    animation: footeranim 1s ease-in-out
}

@keyframes footeranim {
    0% {
        transform: translateX(400px);
        opacity: 0
    }

    50% {
        opacity: .7
    }

    100% {
        transform: translateX(0);
        opacity: 1
    }
}

.footer {
    /*margin: -110px 0 0*/
    margin: -25px 0 0
}

.footerhead {
    background: url(../../Images/slidebanner.png) center 0 no-repeat rgba(0,0,0,0);
    height: 176px;
    position: relative;
    width: 100%;
    z-index: 2;
    max-width: 100%
}

.footerinner {
    background: url(../../Images/footerbg-min.jpg) center 0 repeat-y rgba(0,0,0,0);
    position: relative;
    margin-top: -66px;
    padding: 86px 0 20px;
    max-width: 100%
}

.maps-convas {
    width: 100%;
    height: 280px;
    border: 10px solid #2778CB;
    border-radius: 4px
}

.contact-info h5, .quick-links h5 {
    color: #fff;
    font-size: 17px;
    margin-bottom: 26px;
    text-align: center;
    font-weight: 700
}

.footer .contact-info ul {
    margin-right: 19%
}

.footer .quick-links ul {
    margin-right: 36%
}

    .contact-info ul li, .footer .quick-links ul li {
        list-style-type: none;
        margin-bottom: 15px;
        color: #fff;
        font-size: 13px
    }

.contact-info .fa-map-marker {
    color: #1081e0;
    font-size: 23px
}

.contact-info .fa-phone {
    color: #fb6363;
    font-size: 21px
}

.contact-info .fa-fax {
    color: #00a3aa;
    font-size: 17px
}

.contact-info .fa-envelope {
    color: #ffa210;
    font-size: 17px;
    margin-top: 1px
}

.footer .quick-links ul li a {
    color: #fff;
    font-size: 13px;
    display: block;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    margin-bottom: 10px
}

    .footer .quick-links ul li a:focus, .footer .quick-links ul li a:hover {
        transform: translateX(-10px);
        color: #f9f9f9
    }

    .footer .quick-links ul li a i {
        margin-left: 10px;
        font-size: 18px !important;
        vertical-align: middle
    }

.footer2 {
    background-color: #011e37;
    box-shadow: 0 -3px 8px -4px #011e37;
    padding: 10px
}

    .footer2 .text-danger {
        color: #f61e1a;
        font-weight: 700
    }

    .footer2 span, .footer2 a {
        color: #fff;
        font-size: 13px
    }

.other-link-site li a {
    display: block;
    width: 220px;
    height: 40px;
    border: 2px solid #2778CB;
    margin: 0 auto 5px
}

    .other-link-site li a img {
        width: 216px;
        height: 36px
    }

.navigation {
    margin: 20px 0;
    overflow: hidden
}

    .navigation li {
        float: right
    }

        .navigation li a {
            color: #2b2b2b;
            font-size: 12px;
            padding: 5px 15px;
            display: inline-block;
            position: relative;
            transition: .4s;
            -webkit-transition: .4s;
            -moz-transition: .4s;
            -ms-transition: .4s;
            -o-transition: .4s
        }

            .navigation li a:focus, .navigation li a:hover, .navigation li:last-child a {
                color: #004d8f
            }

            .navigation li a i {
                margin-left: 10px
            }

            .navigation li a:before {
                content: "\f104";
                font-family: FontAwesome;
                font-style: normal;
                font-weight: 400;
                text-decoration: inherit;
                color: #7E7D7D;
                font-size: 20px;
                padding-right: .5em;
                position: absolute;
                left: -4px;
                top: 1px
            }

        .navigation li:last-child a:before {
            display: none
        }

.news-gallery {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 200px
}

    .news-gallery img {
        width: 100%;
        height: 100%;
        transition: .5s;
        -webkit-transition: .5s;
        -moz-transition: .5s;
        -ms-transition: .5s;
        -o-transition: .5s
    }

#newsCarouselPost {
    margin: 20px 0
}

    #newsCarouselPost .carousel-indicators li {
        background-color: #0baa57
    }

    #newsCarouselPost .carousel-indicators {
        bottom: -26px;
        z-index: 2
    }

#PopUpGallery {
    width: 100%;
    position: relative;
    padding: 40px 0
}

    #PopUpGallery .carousel-inner > .item {
        width: 847px;
        height: 565px;
        max-width: 100%
    }

        #PopUpGallery .carousel-inner > .item > img {
            width: 100%;
            height: 100%
        }

    #PopUpGallery:hover .carousel-control.left, #PopUpGallery:hover .carousel-control.right {
        opacity: 1
    }

    #PopUpGallery .carousel-control.right {
        top: 0;
        right: 2px;
        width: 18%;
        font-size: 53px;
        color: #fff;
        opacity: 0;
        transition: opacity .5s
    }

    #PopUpGallery .carousel-control.left {
        left: 22px;
        width: 18%;
        top: 0;
        font-size: 53px;
        color: #fff;
        opacity: 0
    }

        #PopUpGallery .carousel-control.left i {
            font-size: 70px;
            margin-top: 178%;
            margin-left: -31px
        }

    #PopUpGallery .carousel-control.right i {
        font-size: 70px;
        margin-top: 178%;
        margin-left: 35px
    }

.blog-post {
    overflow: hidden
}

    .blog-post h1 {
        font-size: 18px;
        margin-bottom: 20px
    }

    .blog-post .img-major {
        width: 250px;
        margin-right: 21px;
        float: left;
        max-width: 100%;
        overflow: hidden;
        position: relative;
        display: inline-block;
        height: 175.75px;
        margin-bottom: 10px
    }

        .blog-post .img-major img {
            width: 100%;
            height: 100%;
            transition: .5s;
            -webkit-transition: .5s;
            -moz-transition: .5s;
            -ms-transition: .5s;
            -o-transition: .5s
        }

    .blog-post .img-major2 img {
        border-radius: 4px;
        border: 10px solid #e0e0e9
    }

    .blog-post .img-major2 {
        height: 300px
    }

        .blog-post .img-major2.show1 {
            opacity: 1;
            animation: imgMajor 1s ease-in-out
        }

.full-desc.show1 {
    opacity: 1;
    animation: fullDesc 1s ease-in-out
}

@keyframes fullDesc {
    0% {
        transform: translateX(1350px)
    }

    100% {
        transform: translateX(0)
    }
}

@keyframes imgMajor {
    0% {
        transform: translateX(-1350px)
    }

    100% {
        transform: translateX(0)
    }
}

.overlayImage {
    background: rgba(0,77,143,.4);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    opacity: 0;
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    cursor: pointer
}

    .overlayImage div {
        margin: 70px auto;
        transform: translateX(-100px);
        transition: transform .5s;
        -webkit-transition: transform .5s;
        -moz-transition: transform .5s;
        -ms-transition: transform .5s;
        -o-transition: transform .5s
    }

.overlayImage2 div {
    margin: 20px auto
}

.blog-post .img-major:hover .overlayImage, .grid-magezin:hover .overlayImage, .magazin-list .magazin-pic:hover .overlayImage, .news-gallery:hover .overlayImage {
    opacity: 1
}

    .blog-post .img-major:hover .overlayImage .slideView, .blog-post .img-major:hover .overlayImage div, .grid-magezin:hover .overlayImage div, .grid-magezin:hover .slideView, .magazin-list .magazin-pic:hover .overlayImage div, .news-gallery:hover .overlayImage .slideView, .news-gallery:hover .overlayImage div {
        transform: translateX(0)
    }

.slideView {
    width: 40px;
    height: 40px;
    display: inline-block;
    margin-right: 10px;
    background-color: #004D8F;
    text-align: center;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    margin-bottom: 37px;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    transform: translateX(-250px);
    transition-delay: .1s
}

    .slideView i {
        color: #fff;
        font-size: 20px;
        text-align: center;
        margin-top: 10px
    }

.overlay, .overlay2 {
    background-color: rgba(0,0,0,.8);
    position: fixed;
    top: 0;
    left: 0;
    transition: .5s;
    width: 100%;
    height: 100%;
    z-index: 10
}

.popUp.hide1, .popUp2.hide1 {
    opacity: 0
}

.popUp.show, .popUp2.show {
    opacity: 1;
    animation: galerypop 1s ease-in-out
}

@keyframes galerypop {
    0% {
        opacity: 0;
        transform: rotate(180deg) scale(0)
    }

    100% {
        opacity: 1;
        transform: rotate(0) scale(1)
    }
}

.popUpnews {
    width: 650px;
    position: relative;
    margin: 30px auto;
    max-width: 100%
}

.img-overlay img, .img-overlay-newspaper img {
    display: block;
    padding: 40px 0;
    margin: 0 auto;
    position: relative;
    max-width: 100%
}

.img-overlay-newspaper img {
    width: 650px;
    height: 600px
}

.img-overlay img {
    width: 480px;
    height: 360px
}

.closePopUp, .closePopUp2, .closePopUp3 {
    position: absolute;
    top: 23px;
    width: 36px;
    height: 36px;
    background-color: #222;
    z-index: 1;
    text-align: center;
    line-height: 36px;
    cursor: pointer
}

.closePopUp, .closePopUp2 {
    right: -6px;
    border: 3px solid #fff;
    border-radius: 50%
}

.closePopUp3 {
    right: -15px;
    border: 3px solid #fff;
    border-radius: 50%
}

    .closePopUp i, .closePopUp2 i, .closePopUp3 i {
        color: #fff;
        font-size: 18px
    }

.colorGray {
    color: #888
}

.summery {
    color: #534545;
    margin-top: 10px;
    text-align: right;
    border-top: 1px solid #aca2a2;
    border-bottom: 1px solid #aca2a2;
    margin-bottom: 15px
}

    .summery p {
        font-size: 13px;
        margin-top: 10px
    }

.post-share {
    width: 100%;
    padding: 20px 0;
    border-top: 1px solid #E9E9E9;
    overflow: hidden;
    margin-bottom: 20px
}

    .post-share span {
        font-size: 15px;
        height: 40px;
        line-height: 40px;
        display: inline-block
    }

.share-links a {
    width: 50px;
    display: block;
    float: right;
    height: 40px;
    line-height: 30px;
    text-align: center;
    color: #FFF;
    font-size: 20px;
    margin-left: 10px;
    padding: 7px;
    border-radius: 4px
}

.post-share .share-facebook {
    background-color: #0956b5
}

.post-share .share-google-plus {
    background-color: #F96A23
}

.post-share .share-instagram {
    background-color: #895D4B
}

.post-share .share-twit {
    background-color: #28D4F9
}

.post-share .share-mail {
    background-color: #FC0
}

.mr13s {
    margin-right: 14.067%
}

.paddingbm100 {
    padding-bottom: 100px
}

.form-body {
    padding: 15px 0 10px
}

    .form-body textarea {
        resize: none
    }

    .form-body .btn-primary {
        color: #FFF;
        background-color: #004d8f;
        border-color: #004d8f;
        box-shadow: 0 1px 3px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.18);
        transition: box-shadow .28s cubic-bezier(.4,0,.2,1)
    }

        .form-body .btn-primary:focus, .form-body .btn-primary:hover {
            box-shadow: 0 3px 6px rgba(0,0,0,.2),0 3px 6px rgba(0,0,0,.26)
        }

.form-group.form-md-line-input {
    position: relative;
    margin: 0 0 25px;
    padding-top: 20px
}

    .form-group.form-md-line-input .form-control {
        background: 0 0;
        border: 0;
        border-bottom: 2px solid #2b2b2b;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        -ms-border-radius: 0;
        -o-border-radius: 0;
        border-radius: 0;
        color: #555;
        box-shadow: none;
        padding-right: 0;
        padding-left: 0;
        font-size: 14px
    }

        .form-group.form-md-line-input .form-control::-moz-placeholder {
            color: #999;
            opacity: 1
        }

        .form-group.form-md-line-input .form-control:-ms-input-placeholder {
            color: #999
        }

        .form-group.form-md-line-input .form-control::-webkit-input-placeholder {
            color: #999
        }

        .form-group.form-md-line-input .form-control ~ .form-control-focus, .form-group.form-md-line-input .form-control ~ label {
            width: 100%;
            position: absolute;
            right: 0;
            bottom: 0;
            pointer-events: none
        }

            .form-group.form-md-line-input .form-control ~ .form-control-focus:after, .form-group.form-md-line-input .form-control ~ label:after {
                content: '';
                position: absolute;
                z-index: 5;
                bottom: 0;
                right: 50%;
                height: 3px;
                width: 0;
                visibility: hidden;
                transition: .2s ease all
            }

        .form-group.form-md-line-input .form-control ~ label {
            top: 0;
            margin-bottom: 0;
            font-size: 14px;
            color: #888;
            opacity: 1;
            filter: alpha(opacity=100)
        }

        .form-group.form-md-line-input .form-control:focus:not([readonly]) ~ .form-control-focus, .form-group.form-md-line-input .form-control:focus:not([readonly]) ~ label {
            color: #888
        }

            .form-group.form-md-line-input .form-control:focus:not([readonly]) ~ .form-control-focus:after, .form-group.form-md-line-input .form-control:focus:not([readonly]) ~ label:after {
                visibility: visible;
                right: 0;
                width: 100%;
                background: #004d8f
            }

        .form-group.form-md-line-input .form-control:focus:not([readonly]) ~ label {
            opacity: 1;
            filter: alpha(opacity=100)
        }

    .form-group.form-md-line-input.form-md-floating-label .form-control ~ label {
        font-size: 14px;
        top: 25px;
        transition: .2s ease all;
        color: #999
    }

    .form-group.form-md-line-input .form-control:focus ~ label, .form-group.form-md-line-input.form-md-floating-label .form-control.edited ~ label, .form-group.form-md-line-input.form-md-floating-label .form-control.focus:not([readonly]) ~ label, .form-group.form-md-line-input.form-md-floating-label .form-control.form-control-static ~ label, .form-group.form-md-line-input.form-md-floating-label .form-control:focus:not([readonly]) ~ label, .form-group.form-md-line-input.form-md-floating-label .form-control[readonly] ~ label {
        top: 0;
        font-size: 13px
    }

    .form-group.form-md-line-input.has-success .form-control {
        border-bottom: 2px solid #2b2b2b
    }

        .form-group.form-md-line-input.has-success .form-control.edited:not([readonly]) ~ .form-control-focus:after, .form-group.form-md-line-input.has-success .form-control.edited:not([readonly]) ~ label:after, .form-group.form-md-line-input.has-success .form-control.focus:not([readonly]) ~ .form-control-focus:after, .form-group.form-md-line-input.has-success .form-control.focus:not([readonly]) ~ label:after, .form-group.form-md-line-input.has-success .form-control.form-control-static ~ .form-control-focus:after, .form-group.form-md-line-input.has-success .form-control.form-control-static ~ label:after, .form-group.form-md-line-input.has-success .form-control:focus:not([readonly]) ~ .form-control-focus:after, .form-group.form-md-line-input.has-success .form-control:focus:not([readonly]) ~ label:after {
            background: #004d8f
        }

        .form-group.form-md-line-input.has-cm .form-control:focus ~ label, .form-group.form-md-line-input.has-success .form-control.edited:not([readonly]) ~ i, .form-group.form-md-line-input.has-success .form-control.edited:not([readonly]) ~ label, .form-group.form-md-line-input.has-success .form-control.focus:not([readonly]) ~ i, .form-group.form-md-line-input.has-success .form-control.focus:not([readonly]) ~ label, .form-group.form-md-line-input.has-success .form-control.form-control-static ~ i, .form-group.form-md-line-input.has-success .form-control.form-control-static ~ label, .form-group.form-md-line-input.has-success .form-control:focus:not([readonly]) ~ i, .form-group.form-md-line-input.has-success .form-control:focus:not([readonly]) ~ label, .form-group.form-md-line-input.has-success label {
            color: #004d8f
        }

.CommentContainer {
    padding: 15px 0 10px
}

.btn-reply {
    color: #0096E4;
    transition: .5s;
    border: 3px solid transparent
}

    .btn-reply:focus, .btn-reply:hover {
        border: 2px solid #0096E4;
        color: #0096E4;
        padding: 3px 22px
    }

.comment-section {
    margin-bottom: 20px;
    overflow: hidden;
    width: 100%;
    border-bottom: 1px solid #e3e3e3;
    padding-bottom: 20px
}

    .comment-section .img-profile, .comment-section .img-profile img {
        width: 65px;
        height: 65px;
        float: right;
        margin-bottom: 10px
    }

        .comment-section .img-profile img {
            border: 1px solid #ccc
        }

        .comment-section .img-profile span {
            display: block;
            font-size: 14px;
            font-weight: 700
        }

    .comment-section .comment-content {
        margin-right: 24px;
        float: right;
        width: 80%;
        font-size: 13px
    }

        .comment-section .comment-content p {
            margin-top: 10px
        }

.Person-Job-info {
    margin-bottom: 20px
}

    .Person-Job-info .title {
        border-bottom: 3px solid #0baa57;
        border-radius: 13px;
        color: #0baa57;
        display: inline-block;
        font-size: 15px;
        margin-bottom: 9px;
        padding: 3px 29px
    }

    .Person-Job-info .contact-info ul li {
        color: #2b2b2b;
        font-size: 13px
    }

    .Person-Job-info .contact-info ul {
        text-align: right;
        margin-right: 21%
    }

#clock, #to_top, .contact-icon i, .message-info, .social-network {
    text-align: center
}

.Reg-headcontent {
    background: linear-gradient(to bottom,#edeaea 0,#f8f8f8 50%,#fff 100%);
    width: 100%;
    margin-top: -1px;
    margin-bottom: 10px;
    max-width: 100%
}

.titlePage {
    margin-bottom: 30px;
    font-size: 26px
}

.PageTittle > h1 {
    color: #004d8f;
    font-size: 23px;
    margin-top: 40px;
    margin-right: 23px
}

.magezin-section {
    overflow: hidden;
    border-bottom: 1px solid #e0e0e9;
    padding-bottom: 10px
}

.magezin-info {
    margin-right: 135px
}

    .magezin-info h2 a {
        font-size: 16px;
        margin-bottom: 10px;
        display: block;
        color: #004d8f;
        transition: .5s;
        margin-top: 20px
    }

        .magezin-info h2 a:focus, .magezin-info h2 a:hover {
            color: #ED1C24
        }

.grid-magezin {
    width: 130px;
    float: right;
    position: relative
}

    .grid-magezin .more-see {
        display: block;
        height: 90.83px;
        width: 130px;
        max-width: 100%;
        border: 5px solid #e0e0e9;
        border-radius: 4px
    }

    .grid-magezin a img {
        width: 100%;
        height: 100%
    }

.gallery-school {
    box-shadow: 0 3px 21px -1px #737373;
    overflow: hidden;
    position: relative
}

.gallery-school, .grid-gallery {
    height: 250px;
    margin-bottom: 20px  ;
    position:relative;
   
}

    .gallery-school, .gardeshgari-post.show, .grid-gallery.show, .radio-effect.show, show {
        opacity: 1;
        filter: alpha(opacity=100);
        -moz-opacity: 1;
        -ms-opacity: 1;
        -webkit-opacity: 1;
        animation: accessLink 1s ease-in-out;
        -ms-animation: accessLink 1s ease-in-out;
        -webkit-animation: accessLink 1s ease-in-out;
        -moz-animation: accessLink 1s ease-in-out;
        -o-animation: accessLink 1s ease-in-out
    }

        .gallery-school .more-see, .grid-gallery .more-see {
            width: 100%;
            height: 100%;
            display: block;
            position: relative;
            background-color: #000;
            overflow: hidden
        }

#slide-content, #to_top {
    display: none
}

.gallery-school:hover img, .grid-gallery .more-see:hover img {
    transform: scale(1.2);
    -ms-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2)
}

.gallery-school img, .grid-gallery img {
    width: 100%;
    height: 100%;
    opacity: .8;
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s
}

.gallery-school:hover figcaption {
    background-color: #2b2b2b
}

    .gallery-school:hover figcaption h3 a {
        color: #fff
    }

.gallery-school figcaption, .gallery-school figcaption > a {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    background-color: #fff
}

    .gallery-school figcaption h3 {
        margin-top: 10px
    }

        .gallery-school figcaption h3 a {
            font-size: 15px;
            color: #2b2b2b;
            transition: .5s
        }

.grid-gallery figcaption {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   width: 100%;
   height: 38%;
   padding: 15px;
   color: #fff;
}
.grid-gallery a {
   position: absolute;
   width: 100%;
   height: 100%;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
}
.grid-gallery figcaption h4 {
   white-space: nowrap;
   width: 100%;
   overflow: hidden;
   text-overflow: ellipsis;
   display: block;
   color: #fff;
   width: 100%;
   font-size: 16px;
}


.icon-video > img {
    position: absolute;
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    width: 30px !important;
    height: 30px !important;
    opacity: 1
}

.news-pannel .panel-heading {
    padding: 6px 15px !important
}

.news-pannel-archive .panel-heading {
    padding: 2px 15px !important
}

.panel-gallery .panel-heading {
    border-bottom: 2px solid #bdc0ca;
    overflow: hidden;
    padding: 8px 15px
}

    .panel-gallery .panel-heading h1, .panel-gallery .panel-heading h3 {
        color: #ED1C24;
        margin: 0
    }

        .panel-gallery .panel-heading h1 span, .panel-gallery .panel-heading h3 span {
            border-bottom: 2px solid #ED1C24;
            padding-bottom: 1px
        }

.news-pannel .panel-heading h1 span, .news-pannel .panel-heading h3 span {
    font-size: 18px
}

.archive i {
    vertical-align: middle
}

.archive:focus i, .archive:hover i {
    animation: shake 1s ease-in-out;
    -ms-animation: shake 1s ease-in-out;
    -webkit-animation: shake 1s ease-in-out;
    -moz-animation: shake 1s ease-in-out;
    -o-animation: shake 1s ease-in-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite
}

#to_top {
    background-color: #2778CB;
    border-radius: 5px;
    bottom: 20px;
    cursor: pointer;
    float: right;
    font-size: 24px;
    height: 43px;
    margin-top: 10px;
    position: fixed;
    right: 20px;
    -moz-transition: all .2s ease-in 0s;
    -o-transition: all .2s ease-in 0s;
    -webkit-transition: all .2s ease-in 0s;
    transition: all .2s ease-in 0s;
    width: 43px;
    z-index: 1000
}

    #to_top i {
        color: #fff;
        font-size: 35px
    }

    #to_top:hover {
        background-color: #ED1C24
    }

@keyframes fromTop {
    0% {
        -webkit-transform: translateY(-60px);
        -ms-transform: translateY(-60px);
        transform: translateY(-60px);
        opacity: 0
    }

    50% {
        opacity: .6
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

@-moz-keyframes fromTop {
    0% {
        -moz-transform: translateY(-60px);
        transform: translateY(-60px);
        opacity: 0
    }

    50% {
        opacity: .6
    }

    100% {
        opacity: 1;
        -moz-transform: translateY(0);
        transform: translateY(0)
    }
}

@-ms-keyframes fromTop {
    0% {
        -ms-transform: translateY(-60px);
        transform: translateY(-60px);
        opacity: 0
    }

    50% {
        opacity: .6
    }

    100% {
        opacity: 1;
        -ms-transform: translateY(0);
        transform: translateY(0)
    }
}

@-webkit-keyframes fromTop {
    0% {
        -webkit-transform: translateY(-60px);
        transform: translateY(-60px);
        opacity: 0
    }

    50% {
        opacity: .6
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@-o-keyframes fromTop {
    0% {
        -o-transform: translateY(-60px);
        transform: translateY(-60px);
        opacity: 0
    }

    50% {
        opacity: .6
    }

    100% {
        opacity: 1;
        -o-transform: translateY(0);
        transform: translateY(0)
    }
}

.menu-header .nav > li > a:focus, .menu-header .nav > li > a:hover {
    background-color: #eee;
    border-radius: 6px 6px 0 0;
    text-decoration: none
}

.gallery-image {
    list-style: none;
    margin-top: 20px;
    overflow: hidden
}

    .gallery-image li a img {
        height: 63.75px
    }

#carousel-text {
    border: 1px solid #e0dfdf;
    border-left: none;
    height: 350px;
    padding: 20px 15px
}

.carousel-text {
    padding-left: 0
}

#carousel-bounding-box {
    padding-right: 0
}

#galleryCarousel .carousel-inner > .item {
    width: 100%;
    height: 350px
}

    #galleryCarousel .carousel-inner > .item > img {
        width: 100%;
        height: 100%
    }

#galleryCarousel .carousel-control {
    opacity: 1;
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -ms-opacity: 1;
    -webkit-opacity: 1
}

    #galleryCarousel .carousel-control i {
        font-size: 55px;
        margin-top: 134%
    }

    #galleryCarousel .carousel-control.left, #galleryCarousel .carousel-control.right {
        opacity: 0
    }

#galleryCarousel:hover .carousel-control.left, #galleryCarousel:hover .carousel-control.right {
    opacity: 1
}

.galleryImage h3 a:focus, .galleryImage h3 a:hover {
    color: #004d8f
}

.galleryImage {
    width: 100%;
    height: 250px;
    position: relative;
    overflow: hidden;
    padding: 20px;
    border: 1px solid #e0dfdf;
    box-shadow: 0 5px 10px rgba(0,0,0,.4);
    margin-bottom: 20px
}

    .galleryImage.hide1 {
        opacity: 0;
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        -ms-opacity: 0;
        -webkit-opacity: 0
    }

    .galleryImage.show {
        opacity: 1;
        filter: alpha(opacity=100);
        -moz-opacity: 1;
        -ms-opacity: 1;
        -webkit-opacity: 1;
        animation: accessLink 1s ease-in-out;
        -ms-animation: accessLink 1s ease-in-out;
        -webkit-animation: accessLink 1s ease-in-out;
        -moz-animation: accessLink 1s ease-in-out;
        -o-animation: accessLink 1s ease-in-out
    }

    .galleryImage .img-major {
        width: 100%;
        height: 100%;
        display: block
    }

        .galleryImage .img-major img {
            position: relative;
            opacity: 1;
            filter: alpha(opacity=100);
            -moz-opacity: 1;
            -ms-opacity: 1;
            -webkit-opacity: 1;
            height: 100%;
            width: 100%
        }

    .galleryImage figcaption {
        left: 0;
        right: 0;
        bottom: 0;
        padding: 1em;
        position: absolute;
        height: 60px;
        background: #fff;
        transition: transform .35s;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }

    .galleryImage h3 {
        margin-top: 6px
    }

        .galleryImage h3 a {
            font-size: 15px;
            color: #2b2b2b;
            line-height: 1px;
            -webkit-transition: -webkit-transform .35s;
            transition: transform .35s;
            -webkit-transform: translate3d(0,100%,0);
            transform: translate3d(0,100%,0)
        }

    .galleryImage:hover figcaption, .galleryImage:hover h3 {
        -webkit-transform: translate3d(0,0,0);
        transform: translate3d(0,0,0);
        -webkit-transition-delay: 50ms;
        transition-delay: 50ms
    }

.right-menu2 {
    padding: 10px 5px
}

.contact-icon {
    width: 40px;
    height: 40px;
    border: 1px solid #dbdbdb;
    border-radius: 4px
}

    .contact-icon i {
        font-size: 24px !important;
        display: block;
        line-height: 36px
    }

.contact-value {
    margin-top: 10px;
    display: block;
    margin-right: 5px
}

.maps-convas-contact {
    width: 100%;
    height: 300px;
    border: 5px solid #2778CB;
    border-radius: 4px
}

.social-network {
    color: #fff;
    margin-left: 1px;
    display: inline-block;
    background-color: #011e37;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    line-height: 43px
}

.socialNetworks {
    padding-top: 10px;
    margin-right: 19%
}

.social-network i {
    transition: .5s;
    -webkit-transition: .5s;
    -moz-transition: .5s;
    -ms-transition: .5s;
    -o-transition: .5s;
    padding-top: 7px;
    font-size: 18px
}

.social-network:hover {
    color: #fff
}

    .social-network:focus i, .social-network:hover i {
        transform: rotateY(180deg)
    }

.socialNetworks .social-network:nth-child(1):hover {
    background-color: #32AFED
}

.socialNetworks .social-network:nth-child(2):hover {
    background-color: #0956b5
}

.socialNetworks .social-network:nth-child(3):hover {
    background-color: #F96A23
}

.socialNetworks .social-network:nth-child(4):hover {
    background-color: #895D4B
}

.socialNetworks .social-network:nth-child(5):hover {
    background-color: #28D4F9
}

.block-title {
    margin-bottom: 0 !important
}

.sidebar-post {
    padding: 10px 3px;
    border-bottom: 1px solid #e1e1e1;
    overflow: hidden
}

    .sidebar-post:first-child {
        padding: 0 10px 10px
    }

    .sidebar-post:last-child {
        border: none !important
    }

    .sidebar-post .post-image {
        float: right;
        width: 110px;
        height: 75px;
        max-width: 100%
    }

        .sidebar-post .post-image a {
            width: 100%;
            height: 100%;
            display: block;
            border: 4px solid #e0e0e9;
            border-radius: 4px
        }

            .sidebar-post .post-image a img {
                width: 100%;
                height: 100%;
                transition: .5s;
                -webkit-transition: .5s;
                -moz-transition: .5s;
                -ms-transition: .5s;
                -o-transition: .5s
            }

            .sidebar-post .post-image a:hover img {
                opacity: .8
            }

    .sidebar-post .post-title {
        margin-right: 115px
    }

        .sidebar-post .post-title h3 a {
            color: #004d8f;
            font-size: 14px;
            margin-left: 10px
        }

            .colorRed, .sidebar-post .post-title h3 a:focus, .sidebar-post .post-title h3 a:hover {
                color: #ED1C24
            }

.left-icon-container .fa-file-pdf-o, .mail-icon i {
    font-size: 20px
}

.sidebar-post .post-title h3 {
    margin-bottom: 10px;
    margin-top: 0
}

.post-details {
    overflow: hidden
}

.mail-icon i {
    color: #FC0
}

.font16 {
    font-size: 16px
}

.tooltipButton .fa-print {
    font-size: 20px
}

.message-info {
    font-size: 12px;
    width: 70%
}

.gardeshgari-post {
    width: 100%;
    position: relative;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0,0,0,.24);
    margin-bottom: 20px
}

    .gardeshgari-post img {
        max-width: none;
        width: -webkit-calc(100% + 50px);
        width: calc(100% + 50px);
        -webkit-transition: -webkit-transform .35s;
        transition: transform .35s;
        -webkit-transform: translate3d(40px,0,0);
        transform: translate3d(40px,0,0);
        position: relative;
        display: block;
        height: 100%;
        -moz-transition: -moz-transform .35s;
        -ms-transition: -ms-transform .35s;
        -o-transition: -o-transform .35s;
        -ms-transform: translate3d(40px,0,0);
        -moz-transform: translate3d(40px,0,0);
        -o-transform: translate3d(40px,0,0)
    }

    .gardeshgari-post:hover img {
        transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
        -moz-transform: translate3d(0,0,0);
        -o-transform: translate3d(0,0,0)
    }

    .gardeshgari-post .img-more {
        width: 100%;
        height: 200px;
        display: block
    }

    .gardeshgari-post figcaption {
        padding: 5px 10px
    }

        .gardeshgari-post figcaption h3 {
            margin-top: 0
        }

            .gardeshgari-post figcaption h3 > a {
                color: #2b2b2b;
                font-size: 15px
            }

                .gardeshgari-post figcaption h3 > a:focus, .gardeshgari-post figcaption h3 > a:hover {
                    color: #F7CA17
                }

.maps-convas-project {
    width: 100%;
    height: 350px;
    border: 5px solid #e0e0e9;
    margin: 10px 0
}

.marquee {
    width: 100%;
    position: absolute;
    bottom: 4px;
    padding: 0 50px;
    color: #fff
}

    .marquee span {
        display: inline-block;
        margin-left: 10px
    }

.category-archive option:first-child {
    display: none
}

.category-archive {
    padding: 5px 5px 5px 30px !important;
    -moz-appearance: none;
    -webkit-appearance: none;
    -ms-apearance: none;
    background: url(../../Images/down-arrow.png) 5px 6px no-repeat;
    background-clip: border-box;
    background-position-x: 0;
    background-position-y: 0;
    background-size: 14px;
    color: #888
}

.archive-searchBox {
    border-bottom: 2px solid #004d8f;
    margin-bottom: 20px;
    padding-bottom: 10px
}

    .archive-searchBox h1 {
        font-size: 18px;
        color: #004d8f;
        display: inline-block
    }

    .archive-searchBox span {
        margin-right: 13px;
        font-size: 18px
    }

.my-form-control {
    border-radius: 4px;
    padding: 5px 10px;
    border: 1px solid #004d8f;
    color: #2b2b2b;
    margin-bottom: 5px
}

.archive-searchBox .btn-primary {
    padding: 4px 15px;
    font-size: 13px
}

#clock {
    font-size: 15px;
    display: inline-block;
    color: #004d8f;
    font-weight: 700
}

#meridiem {
    font-size: 12px;
    margin-left: 5px
}

.system137 h1 {
    text-shadow: 2px 4px 3px rgba(0,0,0,.3);
    font-size: 20px;
    margin-bottom: 30px
}

.btn-137, .btn-137-manage {
    padding: 8px 30px;
    font-size: 14px;
    text-align: center
}

.mt40 {
    margin-top: 40px
}

.btn-137 {
    background-color: #268cc4;
    color: #fff;
    margin-left: 5px;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    transition: .5s
}

    .btn-137:focus, .btn-137:hover {
        color: #fff;
        background-color: #2778cb
    }

.btn-137-manage {
    background-color: #fff;
    color: #268cc4;
    border: 2px solid #268cc4;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px
}

.font18 {
    font-size: 18px
}

.img-newspaper {
    width: 20px;
    height: 20px
}

.newspaper-ul {
    margin-top: 20px
}

    .newspaper-ul li {
        margin-bottom: 15px
    }

        .newspaper-ul li a {
            font-size: 16px;
            color: #004d8f;
            transition: .5s
        }

            .electronic-ul li a:focus, .electronic-ul li a:hover, .newspaper-ul li a:focus, .newspaper-ul li a:hover {
                border-bottom: 1px solid #004d8f
            }

.newspaper a {
    display: block;
    width: 250px;
    margin: auto;
    position: relative;
    overflow: hidden
}

.electronic-ul li {
    margin-bottom: 15px
}

    .electronic-ul li a {
        color: #004d8f;
        font-size: 15px;
        transition: .5s
    }

.logo-shahrdari2 {
    height: 93px;
    margin-top: 5px
}

.ribbon-gold {
    font-size: 13px;
    background-color: #004d8f;
    box-shadow: 0 3px 10px -5px rgba(0,0,0,1);
    position: absolute;
    width: 120px;
    float: right;
    text-align: center;
    right: -12px;
    top: 29px;
    color: #fff;
    padding: 4px 10px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg)
}

    .ribbon-gold:after, .ribbon-gold:before {
        position: absolute;
        content: "";
        width: 0;
        display: block
    }

    .ribbon-gold:before {
        top: -5px;
        left: -32px;
        border-top: 31px solid transparent;
        border-right: 33px solid #004d8f
    }

    .ribbon-gold:after {
        height: 20px;
        top: -4px;
        left: 117px;
        border-top: 30px solid transparent;
        border-left: 30px solid #004d8f
    }

.newspapersec {
    margin-top: 10px
}

.radio-effect {
    width: 100%;
    height: 220px;
    position: relative;
    overflow: hidden;
    background: #004d8f;
    box-shadow: 0 3px 11px -1px #737373;
    margin-bottom: 20px
}

    .radio-effect a {
        width: 100%;
        height: 100%;
        display: block
    }

    .radio-effect img {
        position: relative;
        height: 100%;
        width: 100%;
        opacity: .7
    }

    .radio-effect:hover img {
        opacity: .4
    }

    .radio-effect figcaption {
        padding: 2em;
        color: #fff;
        font-size: 1.25em;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        text-align: center
    }

        .radio-effect figcaption h3 {
            font-size: 20px;
            transform: translate3d(0,-10px,0);
            transition: transform .35s;
            top: 60px;
            position: relative
        }

    .radio-effect:hover figcaption h3 {
        transform: translate3d(0,0,0)
    }

    .radio-effect figcaption h3 a, .radio-effect figcaption h3 a:hover {
        color: #fff
    }

    .radio-effect figcaption::after, .radio-effect figcaption::before {
        position: absolute;
        top: 30px;
        right: 30px;
        bottom: 30px;
        left: 30px;
        content: '';
        opacity: 0;
        -webkit-transition: opacity .35s,-webkit-transform .35s;
        transition: opacity .35s,transform .35s
    }

    .radio-effect figcaption::before {
        border-top: 1px solid #fff;
        border-bottom: 1px solid #fff;
        -webkit-transform: scale(0,1);
        transform: scale(0,1)
    }

    .radio-effect figcaption::after {
        border-right: 1px solid #fff;
        border-left: 1px solid #fff;
        -webkit-transform: scale(1,0);
        transform: scale(1,0)
    }

    .radio-effect:hover figcaption::after, .radio-effect:hover figcaption::before {
        transform: scale(1);
        opacity: 1
    }

    .radio-effect:hover figcaption h3 {
        opacity: 1
    }

.radio-section {
    border: 1px solid #e0dfdf;
    overflow: hidden
}

.radio-pic img {
    width: 100%;
    height: 350px
}

.radio-section .col-sm-4, .radio-section .col-sm-8 {
    padding-left: 0
}

.audioSet {
    width: 100%
}

.citizenReporter {
    border-bottom: 1px solid #e0e0e9;
    padding-bottom: 10px
}

.tags {
    border-bottom: none;
    padding-bottom: 6px;
    padding-top: 10px
}

    .tags .tag-post {
        color: #333;
        background: #EAEAEA;
        padding: 3px 8px;
        text-align: center;
        margin: 1px;
        transition: .5s;
        border-radius: 4px
    }

        .tags .tag-post:focus, .tags .tag-post:hover {
            background-color: #2778cb;
            color: #fff
        }
.news-gallery2 {
   position: relative;
   overflow: hidden;
   width: 100%;
   height: 220px;
   margin-bottom: 20px;
   border: 4px solid #fff;
   box-shadow: 0 1px 6px -2px #000;
   -webkit-box-shadow: 0 1px 6px -2px #000;
   margin-top: 5px;
}
    .news-gallery2 a{
        display:flex;
        justify-content:center;
        align-items:center;width:100%;
        height:100%;
        text-align:center;
    }
    .news-gallery2 a img {
        max-width: 100%;
        max-height: 100%;
        transition: 0.5s;
        -webkit-transition: 0.5s;
        -moz-transition: 0.5s;
        -ms-transition: 0.5s;
        -o-transition: 0.5s;
    }
@media screen and (min-width:100px) and (max-width:500px) {
    .article-info h2, .post-info h3, .wiget-tabs ul li {
        text-align: center
    }
 
    .marquee {
        width: 100%;
        position: absolute;
        bottom: -144px;
        padding: 5px 10px;
        color: #fff;
        background-color: #004d8f;
        font-size: 11px
    }

    .panel-gallery .col-sm-6 {
        width: 100% !important
    }

    .accessLink {
        padding: 45px 0 0 !important
    }

    .Reg-headcurved {
        height: 0;
        background: 0 0
    }

    .blog-post .img-major {
        display: block;
        width: 100%;
        margin: 10px auto
    }

    .navigation li a {
        font-size: 12px
    }

    .mid-row span {
        font-size: 12px !important
    }

    .carousel-control.left, .carousel-control.right {
        opacity: 0 !important
    }

    #carouselMajor .carousel-inner > .item {
        height: 200px !important
    }

    .gallery-container .col-xs-6 {
        width: 100%
    }

    .galleryImage {
        width: 250px;
        margin: 0 auto 20px
    }

    #galleryCarousel .carousel-inner > .item {
        width: 100%;
        height: 230px
    }

    #galleryCarousel .carousel-control i {
        margin-top: 220%
    }

    #newsCarousel .col-xs-6 {
        width: 100%
    }

    .article-pic, .post-img {
        width: 100% !important;
        padding-top: 10px
    }

        .article-pic a, .post-img a {
            margin: 0 auto 10px
        }

    .article-info, .post-info {
        padding-right: 10px;
        clear: both
    }

    .wiget-tabs ul li {
        width: 100%
    }

    #newsCarousel .carousel-control.left, #newsCarousel .carousel-control.right {
        bottom: 0;
        top: 54%
    }

    #newsCarousel .carousel-control.right {
        right: 82%
    }

    .my-form-control {
        width: 100%
    }

    .archive-searchBox span {
        display: none
    }

    .Person-Job-info .contact-info ul {
        margin-right: 24% !important
    }

    .news-pannel .panel-heading {
        padding: 3px 15px !important
    }

        .news-pannel .panel-heading h1 span, .news-pannel .panel-heading h3 span {
            font-size: 12px
        }

    .btn-137, .btn-137-manage {
        display: block;
        width: 250px;
        margin: 5px auto
    }

    .closePopUp3 {
        top: 19px;
        right: 6px
    }

    #PopUpGallery .carousel-inner > .item {
        height: 250px !important
    }

    .img-overlay-newspaper img {
        height: 350px !important
    }
}

@media screen and (min-width:100px) and (max-width:767px) {
    .grid-gallery, .radio-pic img {
        height: 200px
    }

   .news-gallery2 {
      height: 200px;
   }
    .carousel {
        max-width: 100%
    }

    .radio-section .col-sm-8 {
        padding-right: 0
    }

    .radio-effect {
        width: 250px;
        margin: 20px auto
    }

    .gallery-school figcaption h3 a {
        font-size: 13px
    }

    .btn-137-manage {
        padding: 8px 27px
    }

    #carouselnewspaper .carousel-inner > .item a img {
        width: 250px;
        margin: auto
    }

    .newspaper-ul li a {
        font-size: 14px
    }

    .menu-header nav {
        margin-top: 0
    }

    .gallery-school, .news-gallery {
        width: 250px;
        margin: 10px auto
    }

    .contact-info h5, .quick-links h5 {
        text-align: right;
        margin-bottom: 20px
    }

    .closePopUp, .closePopUp2 {
        right: 6px
    }

    .share-links a {
        margin-left: 8px
    }

    .img-overlay img {
        height: 250px
    }

    #PopUpGallery .carousel-inner > .item {
        height: 450px
    }

    .menu-header {
        background: url(../../Images/logo-sari-xs.png) 10px 10px no-repeat;
        background-size: 100px
    }

    .logo-xs {
        width: 100px;
        float: right
    }

        .logo-xs a {
            display: inline-flex;
            margin-top: 10px
        }

            .logo-xs a img {
                width: 120px
            }

    #carousel-text {
        border: 1px solid #e0dfdf;
        border-bottom: none;
        height: 100%
    }

    .carousel-text {
        padding-left: 15px
    }

    #carousel-bounding-box {
        padding-right: 15px
    }

    .image-major img {
        height: 350px
    }

    .col-sm-8-0 {
        margin-right: 0 !important;
        width: 100%
    }

    .navbar-toggle {
        float: right !important
    }
}

@media screen and (max-width:600px) {
    .projects-container .title {
        font-size: 25px
    }

    .ih-item.circle.effect1 .info span {
        font-size: 11px
    }

    .person-tab .wiget-tabs .nav-tabs li a {
        padding: .7em .3em
    }
   .news-gallery2 {
      height: 165px;
   }
}

@media screen and (min-width:100px) and (max-width:768px) {
    .footer .contact-info ul, .footer .quick-links ul {
        margin-right: 0
    }

    .news-gallery {
        margin-bottom: 10px
    }

    .col-sm-2-5 {
        width: 100% !important
    }

    .menu-header .nav .dropdown-menu li a:before {
        right: -17px
    }

    .menu-header .nav .dropdown-menu li a:hover:before {
        right: -15px;
        opacity: 1
    }

    #carouselMajor .carousel-inner > .item {
        height: 330px
    }

    .mid-row span {
        font-size: 18px
    }

    #carouselMajor .carousel-control.left i, #carouselMajor .carousel-control.right i {
        font-size: 60px
    }

    .panel-gallery .col-sm-6 {
        width: 50%;
        float: right
    }

    .grid-gallery h4 a {
        font-size: 14px
    }

    .PageTittle h1 {
        font-size: 16px
    }

    .wiget-tabs .nav-tabs li a {
        padding: .7em 1.2em
    }
}

@media screen and (max-width:991px) {
    .navbar-header, .top-header .pull-left {
        float: none
    }
   .news-gallery2 {
      height: 200px;
   }
    .quick-box2 {
        width: 250px !important
    }

    .img-overlay-newspaper img {
        height: 530px
    }

    .Header, .background-header {
        height: auto;
        background: 0 0
    }

    .books, .send-pic {
        width: 250px;
        margin: 0 auto 10px
    }

    .projects-container {
        margin-top: 0
    }

    .footer .contact-info ul, .socialNetworks {
        margin-right: 0
    }

    .ml50 {
        margin-left: 0
    }

    .col-sm-2-5 {
        width: 33.33333333%
    }

    .contact-info h5, .quick-links h5 {
        font-size: 16px
    }

    .Person-Job-info .contact-info ul {
        margin-right: 40%
    }

    .ih-item.circle, .ih-item.circle .img {
        width: 160px;
        height: 160px
    }

        .ih-item.circle.effect1 .spinner {
            width: 170px;
            height: 170px
        }

        .ih-item.circle.effect1 .info span {
            padding: 29px 0 0
        }

    .menu-header .nav > li > a {
        padding: 8px
    }

    .menu-header .nav > li a:focus, .menu-header .nav > li a:hover {
        border-radius: 0 !important
    }

    .navbar-toggle {
        display: block;
        float: right
    }

    .navbar-collapse.in {
        overflow-y: auto !important
    }

    .navbar-collapse.collapse {
        display: none !important
    }

    .navbar-nav {
        float: none !important
    }

        .navbar-nav > li {
            float: none
        }

    .navbar-collapse.collapse.in {
        display: block !important
    }

    .shahrdar-info {
        margin-top: 10px
    }

    .accessLink {
        padding: 45px 0 25px
    }
}
@media screen and (min-width: 100px) and (max-width: 890px) {

   .news-gallery2 {
      height: 160px;
   }
}

@media screen and (min-width:768px) and (max-width:992px) {
   #carouselnewspaper {
      width: 35%
   }

   .col-sm-8-0 {
      margin-right: 0 !important;
      width: 70%
   }

   .logo-xs {
      width: 200px;
      float: right
   }

      .logo-xs a {
         display: flex;
         margin-bottom: 4px
      }

         .logo-xs a img {
            width: 200px;
            height: 87px
         }
}

@media (max-width:1200px) {
    .menu-header .nav > li > a {
        font-size: 12px
    }

    .accessLink .mb40 {
        margin-bottom: 77px
    }
}

@media screen and (max-width:1000px) {
    .send-pic .right-image svg {
        width: 57px !important;
        height: 104px !important;
        left: -26px !important;
        top: -14px !important
    }
}
@media screen and (min-width: 100px) and (max-width: 1200px) {
   .news-gallery2 {
      height: 188px;
   }
}
@media screen and (min-width: 100px) and (max-width: 1100px) {
   .news-gallery2 {
      height: 160px;
   }
}

   @media screen and (min-width:992px) and (max-width:1200px) {
      .img-overlay-newspaper img {
         height: 530px
      }

      .col-sm-8-0 {
         padding-left: 0;
         width: 87.333%;
         float: right;
         margin-right: 181px
      }

      .headerBanner img {
         width: 26%;
         top: -25px;
         right: -46px
      }

      #PopUpGallery .carousel-inner > .item {
         height: 472px
      }

      .accessLink {
         padding: 45px 0 25px
      }

      .contact-info h5, .quick-links h5 {
         font-size: 16px
      }

      .contact-info ul li, .footer .quick-links ul li a {
         font-size: 12px
      }
   }

   @media screen and (min-width:1200px) and (max-width:1210px) {
      .col-sm-8-0 {
         width: 80.333%;
         margin-right: 212px
      }

      .headerBanner img {
         width: 23%;
         top: -30px;
         right: -24px
      }
   }

@media screen and (min-width: 100px) and (max-width: 500px) {
    .row-gallery .col-xs-6 {
        width: 100%;
        float: none;
    }

    .news-gallery2 {
        width: 100%;
        max-width: 100%;
        height: 200px;
        margin: 10px auto;
        margin-bottom:20px;
    }
}