﻿

/*----------------------------------------------------*/
/*font Variables*/
/*Color Variables*/
/*=================== fonts ====================*/
@import url("https://fonts.googleapis.com/css?family=Roboto:400,400i,500|Rubik:500,600");
@import url("https://fonts.googleapis.com/css?family=Archivo:400,500,600,700");
/*---------------------------------------------------- */
/*----------------------------------------------------*/
/*---------------------------------------------------- */
/*----------------------------------------------------*/
@charset "UTF-8";
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
/**
*
*	Name:			IRAN Sans-Serif Font
*	Version:		5.0
*	Author:			Moslem Ebrahimi (moslemebrahimi.com)"/assets/
*	Created on:		Dec 25, 2012
*	Updated on:		Sep 01, 2017
*	Website:		             http://fontiran.com
*	Copyright:		Commercial/Proprietary Software
--------------------------------------------------------------------------------------
فونت های ایران سن سریف یک نرم افزار مالکیتی محسوب می شود. جهت آگاهی از قوانین استفاده از این فونت ها لطفا به وب سایت (فونت ایران دات کام) مراجعه نمایید
--------------------------------------------------------------------------------------
IRAN Sans-serif fonts are considered a proprietary software. To gain information about the laws regarding the use of these fonts, please visit www.fontiran.com 
--------------------------------------------------------------------------------------
This set of fonts are used in this project under the license: D6NCT8
--------------------------------------------------------------------------------------
*	
**/
html {
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    /* 1 */
    -ms-text-size-adjust: 100%;
    /* 2 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
}

body {
    direction: ltr;
    text-align: justify;
    font-family: Archivo,Roboto !important;
    line-height: 25px;
    font-size: 16px;
    font-weight: 400;
    color: black;
    background: #f9f9f9;
}



h1, h2, h3, h4, h5, h6 {
    font-weight: bolder;
    /*font-size: 1.8rem;*/
}

html,
body,
.carousel {
    height: 80vh;
}


/* Required height of parents of the Half Page Carousel for proper displaying carousel itself */
html,
body {
    height: 100%;
}


.carousel .carousel-inner {
    height: 100%;
}

    .carousel .carousel-inner .carousel-item,
    .carousel .carousel-inner .active {
        height: 100%;
    }



/* Navbar animation */
/*           top menu            */

.navbar-brand img {
    max-height: 60px;
}
/*    */

.navbar {
    background-color: rgba(0, 0, 0, 0.2);
}

.top-nav-collapse {
    background-color: #929FBA;
}

.nav-link {
    font-weight: bold;
}

.headerifobox {
    clear: both;
    min-height: 200px;
    margin: 95px 0 0px 0;
}






.btn .fa {
    margin-left: 3px;
}



.btn-white {
    color: black !important;
}

h6 {
    line-height: 1.7;
}

.rgba-gradient {
    background: -moz-linear-gradient(45deg, rgba(42, 27, 161, 0.7), rgba(29, 210, 177, 0.7) 100%);
    background: -webkit-linear-gradient(45deg, rgba(42, 27, 161, 0.7), rgba(29, 210, 177, 0.7) 100%);
    background: -webkit-gradient(linear, 45deg, from(rgba(42, 27, 161, 0.7)), to(rgba(29, 210, 177, 0.7)));
    background: -o-linear-gradient(45deg, rgba(42, 27, 161, 0.7), rgba(29, 210, 177, 0.7) 100%);
    background: linear-gradient(to 45deg, rgba(42, 27, 161, 0.7), rgba(29, 210, 177, 0.7) 100%);
}

.bgblue-img {
    background-image: url('/Media/bg/background3.jpg');
}

.bgblue-gradient {
    background-color: blueviolet;
}

.bggreen-gradient {
    background-color: #009688;
}


/* service   */
.card-deck {
    margin-top: 60px;
}

.stepsHeader {
    margin: 30px;
}


/* Contact   */
.Contact {
    color: black;
    margin-top: 50px;
    text-align: right;
}


.md-form label {
    position: absolute;
    top: 0;
    right: 0;
    color: #757575;
}

.associated-all-logo {
    padding: 80px 0;
}

    .associated-all-logo h2 {
        margin-bottom: 30px;
    }

.bs-glyphicons div {
    /*height: 120px;*/
    margin: 5px;
    font-size: 10px;
    line-height: 1.4;
    text-align: center;
    background-color: #f7f7f7;
    border: 1px solid #fff;
}

    .bs-glyphicons div:hover {
        background-color: rgba(222, 222, 226, 0.70);
    }

    .bs-glyphicons div img {
        max-height: 115px;
        margin: 5px;
    }

.view img {
    width: 100%;
}

.videostyle {
    width: 100%;
    min-height: 70VH;
}

.videostyle2 {
    width: 100%;
    min-height: 400px;
}

.videostyle3 {
    width: 100%;
    min-height: 200px;
}

.video-js .vjs-big-play-button {
    height: 1.63332em;
    width: 1.63332em;
    position: relative;
    padding: .5rem 1rem;
    background-color: #dc3545;
    border-color: #dc3545;
}

.margin-t-50 {
    margin-top: 50px;
}
.margin-t-70 {
    margin-top: 70px;
}
.margin-t-85 {
    margin-top: 85px;
}
.margin-t-100 {
    margin-top: 100px;
}
.margin-t-150 {
    margin-top: 150px;
} 
.margin-t-200 {
    margin-top: 200px;
}

.margin-t-300 {
    margin-top: 200px;
}
.margin-t-400 {
    margin-top: 200px;
}
.margin-b-50 {
    margin-bottom: 50px;
}

.margin-b-70 {
    margin-bottom: 70px;
}

.margin-b-85 {
    margin-bottom: 85px;
}

.margin-b-100 {
    margin-bottom: 100px;
}

.margin-b-150 {
    margin-bottom: 150px;
}

.margin-b-200 {
    margin-bottom: 200px;
}



.padding-t-50 {
    padding-top: 50px;
}

.padding-t-70 {
    padding-top: 70px;
}

.padding-t-85 {
    padding-top: 85px;
}

.padding-t-100 {
    padding-top: 100px;
}

.padding-t-150 {
    padding-top: 150px;
}

.padding-t-200 {
    padding-top: 200px;
}

.padding-b-50 {
    padding: -bottom: 50px;
}

.padding-b-70 {
    padding-bottom: 70px;
}

.padding-b-85 {
    padding-bottom: 85px;
}

.padding-b-100 {
    padding-bottom: 100px;
}

.padding-b-150 {
    padding-bottom: 150px;
}

.padding-b-200 {
    padding-bottom: 200px;
}





@media (max-width: 768px) {
    html, body, .view {
        /*height: 50%;*/
    }

    .navbar-brand img {
        height: 40px;
        float: left;
    }

    .mt-100 {
        margin-top: 100px;
    }

    .videostyle {
        width: 100%;
        min-height: 250px;
    }

    .videostyle2 {
        width: 100%;
        min-height: 130px;
    }

    .videostyle3 {
        width: 100%;
        min-height: 130px;
    }
}

@media (min-width: 800px) and (max-width: 850px) {
    html,
    body,
    .view {
        height: 60%;
    }

    .mt-100 {
        margin-top: 100px;
    }
}

.card:hover {
    box-shadow: rgba(39,44,49,0.07) 8px 28px 50px, rgba(39, 44, 49, 0.04) 1px 6px 12px;
    transition: all 0.4s ease;
    transform: translate3D(0, -1px, 0) scale(1.02);
}

.h2, h2 {
    font-size: 1.5rem;
}


.gallery img:hover {
    box-shadow: rgba(39,44,49,0.07) 8px 28px 50px, rgba(39, 44, 49, 0.04) 1px 6px 12px;
    transition: all 0.4s ease;
    transform: translate3D(0, -1px, 0) scale(1.02);
}

.gallery img:hover {
    box-shadow: rgba(39,44,49,0.07) 8px 28px 50px, rgba(39, 44, 49, 0.04) 1px 6px 12px;
    padding: 10px;
    border: 1px solid rgba(0,0,0,.125);
}


/*   Post Feed
/* ---------------------------------------------------------- */
.listblog li.list-group-item {
    position: relative;
    display: block;
    margin-bottom: -1px;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.125);
}

.post-feed {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin: 0 -20px;
    padding: 40px 0 0 0;
}

.post-card {
    flex: 1 1 300px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    margin: 0 20px 40px;
    min-height: 300px;
    background: #fff center center;
    background-size: cover;
    border-radius: 5px;
    box-shadow: rgba(39,44,49,0.06) 8px 14px 38px, rgba(39, 44, 49, 0.03) 1px 3px 8px;
    transition: all 0.5s ease;
}

    .post-card:hover {
        box-shadow: rgba(39,44,49,0.07) 8px 28px 50px, rgba(39, 44, 49, 0.04) 1px 6px 12px;
        transition: all 0.4s ease;
        transform: translate3D(0, -1px, 0) scale(1.02);
    }

.post-card-image-link {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 5px 5px 0 0;
}

.post-card-image {
    width: 100%;
    height: 200px;
    background: var(--lightgrey) no-repeat center center;
    object-fit: cover;
}

.post-card-content-link {
    position: relative;
    flex-grow: 1;
    display: block;
    padding: 25px 25px 0;
    color: var(--darkgrey);
}

    .post-card-content-link:hover {
        text-decoration: none;
    }

.post-card-tags {
    display: block;
    margin-bottom: 4px;
    color: var(--midgrey);
    font-size: 1.2rem;
    line-height: 1.15em;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.post-card-title {
    margin-top: 0;
}

.post-card-content {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.post-card-excerpt {
    text-align: justify;
}

.post-card-meta {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 0 25px 25px;
}

.author-profile-image,
.avatar-wrapper {
    display: block;
    width: 100%;
    height: 100%;
    background: color(var(--lightgrey) l(+10%));
    border-radius: 100%;
    object-fit: cover;
}

.post-card-meta .profile-image-wrapper,
.post-card-meta .avatar-wrapper {
    position: relative;
}




.static-avatar {
    display: block;
    overflow: hidden;
    margin: 0 -5px;
    width: 34px;
    height: 34px;
    border: #fff 2px solid;
    border-radius: 100%;
}

.moving-avatar {
    display: block;
    overflow: hidden;
    margin: 0 -6px;
    width: 56px;
    height: 56px;
    border: #fff 2px solid;
    border-radius: 100%;
    transition: all 0.5s cubic-bezier(0.4, 0.01, 0.165, 0.99) 0.7s;
}





.reading-time {
    flex-shrink: 0;
    margin-left: 20px;
    color: var(--midgrey);
    font-size: 1.2rem;
    line-height: 33px;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

/* Special Styling for home page grid (below):

The first post in the list is styled to be bigger than the others and take over
the full width of the grid to give it more emphasis. Wrapped in a media query to
make sure this only happens on large viewports / desktop-ish devices.

 */

@media (min-width: 795px) {
    .post-card-large {
        flex: 1 1 100%;
        flex-direction: row;
    }

        .post-card-large .post-card-image-link {
            position: relative;
            flex: 1 1 auto;
            border-radius: 5px 0 0 5px;
        }

        .post-card-large .post-card-image {
            position: absolute;
            width: 100%;
            height: 100%;
        }

        .post-card-large .post-card-content {
            flex: 0 1 357px;
        }

        .post-card-large h2 {
            font-size: 1.8rem;
        }

        .post-card-large p {
            font-size: 1.8rem;
            line-height: 1.55em;
        }

        .post-card-large .post-card-content-link {
            padding: 30px 5px 0 20px;
        }

        .post-card-large .post-card-meta {
            padding: 0 40px 30px;
        }

    .videostyle {
        margin-top: 10px;
        width: 100%;
        min-height: 80VH;
    }
}

.home-template .site-header:after {
    display: none;
}


/* Adjust some margins for smaller screens */
@media (max-width: 650px) {
    .post-feed {
        padding-top: 5vw;
    }

    .post-card {
        margin: 0 20px 5vw;
    }
}




/* about  */

@media (min-width: 1030px) {
    .pc-item.sign-up .sign-up-bg-svg {
        right: -250px;
    }
}

@media (min-width: 768px) {
    .pc-item.sign-up .sign-up-bg-svg {
        right: -420px;
    }
}

.pc-item.sign-up .sign-up-bg-svg {
    position: absolute;
    top: 2.6rem;
}



/* 7.6. Koenig Styles
/* ---------------------------------------------------------- */

.post-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 920px;
}

/* .post-template .post-content > p:first-child {
    font-size: 1.25em;
    line-height: 1.5em;
} */

.post-full-content .kg-image {
    max-width: 100%;
}

/* Preventing full-width image overlap with post image.  */
.post-full-image + .post-full-content *:first-child .img {
    width: 100%;
}

.post-full-content p {
    text-align: justify;
    line-height: 2em;
}

.post-full-content img {
    max-width: 100%;
}

    .post-full-content img:hover {
        box-shadow: rgba(39,44,49,0.07) 8px 28px 50px, rgba(39, 44, 49, 0.04) 1px 6px 12px;
        transition: all 0.4s ease;
        transform: translate3D(0, -1px, 0) scale(1.02);
    }


.post-full-content figure {
    margin: 1.5em 0 3em;
}

    .post-full-content figure img {
        margin: 0;
    }

.post-full-content figcaption {
    margin: 1.0em 0 0;
    font-size: 80%;
    line-height: 1.6em;
    text-align: center;
}

.kg-width-full figcaption {
    padding: 0 1.5em;
}


@media (max-width: 1040px) {
    .post-full-content img {
        width: 100vw;
    }
}


/*             comment          */
/*https://bootsnipp.com/snippets/z1pD1*/
.comment-list .row {
    margin-bottom: 0px;
}

.comment-list .panel .panel-heading {
    padding: 4px 15px;
    position: absolute;
    border: none;
    /*Panel-heading border radius*/
    border-top-right-radius: 0px;
    top: 1px;
}

    .comment-list .panel .panel-heading.right {
        border-right-width: 0px;
        /*Panel-heading border radius*/
        border-top-left-radius: 0px;
        right: 16px;
    }

    .comment-list .panel .panel-heading .panel-body {
        padding-top: 6px;
    }

.comment-list figcaption {
    /*For wrapping text in thumbnail*/
    word-wrap: break-word;
}
/* Portrait tablets and medium desktops */
@media (min-width: 768px) {
    .comment-list .arrow:after, .comment-list .arrow:before {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        border-style: solid;
        border-color: transparent;
    }

    .comment-list .panel.arrow.left:after, .comment-list .panel.arrow.left:before {
        border-left: 0;
    }
    /*****Left Arrow*****/
    /*Outline effect style*/
    .comment-list .panel.arrow.left:before {
        right: 0px;
        top: 30px;
        /*Use boarder color of panel*/
        border-right-color: inherit;
        border-width: 16px;
    }
    /*Background color effect*/
    .comment-list .panel.arrow.left:after {
        right: 1px;
        top: 31px;
        /*Change for different outline color*/
        border-right-color: #FFFFFF;
        border-width: 15px;
    }
    /*****Right Arrow*****/
    /*Outline effect style*/
    .comment-list .panel.arrow.right:before {
        left: -16px;
        top: 30px;
        /*Use boarder color of panel*/
        border-left-color: inherit;
        border-width: 16px;
    }
    /*Background color effect*/
    .comment-list .panel.arrow.right:after {
        left: -14px;
        top: 31px;
        /*Change for different outline color*/
        border-left-color: #FFFFFF;
        border-width: 15px;
    }
}

.comment-list .comment-post {
    margin-top: 6px;
}

.h-min-240 {
    min-height: 240px;
}

/* Footer  */

.newsletter {
    /*padding: 30px 0;*/
    background: #19beda;
}

    .newsletter .content {
        max-width: 650px;
        margin: 0 auto;
        text-align: center;
        position: relative;
        z-index: 2;
    }

        .newsletter .content h2 {
            color: #243c4f;
            margin-bottom: 40px;
        }

        .newsletter .content .form-control {
            height: 50px;
            border-color: #ffffff;
            border-radius: 0;
            margin: auto;
        }

            .newsletter .content.form-control:focus {
                box-shadow: none;
                border: 2px solid #243c4f;
            }

        .newsletter .content .btn {
            border-radius: 0;
            background: #243c4f;
            color: #fff;
            font-weight: 600;
        }

    .newsletter .messagesub {
        min-height: 50px;
        margin: 5px 30px 0 30px;
        text-align: center;
    }

/* Footer color for sake of consistency with Navbar */
.page-footer {
    background-color: #929FBA;
}


    .page-footer .list-group-item {
        background-color: transparent;
    }




@media (min-width: 544px) {
    .content-info {
        margin-top: 8.75rem;
    }
}

.content-info {
    margin-top: 6.25rem;
    border-top: 1px solid #ebebeb;
}

    .content-info > .top {
        padding: 2.5rem 0;
    }

@media (min-width: 1030px) {
    .content-info > .top .footer-optin {
        padding: 1.5rem 2rem;
    }
}



@media (max-width: 740px) {

    html,
    body,
    .carousel {
        height: 100vh;
    }

    .navbar-brand {
        width: 70%;
    }
}

@media (min-width: 800px) and (max-width: 850px) {

    html,
    body,
    .carousel {
        height: 100vh;
    }
}

@media (min-width: 800px) and (max-width: 850px) {
    .navbar:not(.top-nav-collapse) {
        background: #929FBA !important;
    }
}
/* Adjustment for mobile devices*/
@media (max-width: 776px) {
    .carousel {
        height: 100%;
    }
}
/* Adding color to the Navbar on mobile */
@media only screen and (max-width: 768px) {
    .navbar {
        background-color: #929FBA;
    }
}
/* Adjustment for mobile devices*/
@media (max-width: 776px) {
    .carousel {
        height: 100%;
    }
}
/* Footer color for sake of consistency with Navbar */
.page-footer {
    background-color: #929FBA;
}


/* Adding color to the Navbar on mobile */
@media only screen and (max-width: 768px) {
    .navbar {
        background-color: #929FBA;
    }
}






/* Start Accordion Menu */

div.accordion-menu {
    background: none;
    margin: 7px 0;
    padding: 0;
}


    div.accordion-menu header {
        background-color: #DDD;
        border: 1px solid #CCC;
        cursor: pointer;
        padding: 20px 10px 2px 10px;
        transition: all 200ms ease;
        user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
    }

        div.accordion-menu header:hover {
            background-color: #CECECE;
            border-color: #C0C0C0;
        }

    div.accordion-menu section.content {
        border-bottom: 1px solid #CCC;
        border-left: 1px solid #CCC;
        border-right: 1px solid #CCC;
        max-height: 180px;
        overflow: hidden;
        padding: 20px;
        transition: all 200ms linear;
    }

        div.accordion-menu section.content p {
            margin: 0;
        }



div.closed section.content {
    max-height: 0;
    padding: 0 10px;
}

div.open header {
    /*background-color: #7cc80e;*/
    /*border: 1px solid #b02929;*/
}

    div.open header h3 {
        /*padding: 0 10px 2px 10px;*/
        /*color: #2780e3;*/
    }





.video-js {
    margin: 20px auto;
}

.vjs-default-skin {
    color: #888;
}






.timeline {
    position: relative;
    list-style: none;
    padding: 1rem 0;
    margin: 0;
}

    .timeline::before {
        content: '';
        position: absolute;
        right: 50%;
        top: 0;
        bottom: 0;
        width: 2px;
        margin-left: -1px;
        background-color: #50a1ff;
    }

.timeline-element {
    position: relative;
    width: 50%;
    padding: 1rem 0;
    padding-left: 2.5rem;
    text-align: right;
}

    .timeline-element::before {
        content: '';
        position: absolute;
        left: -8px;
        top: 1.35rem;
        display: inline-block;
        width: 16px;
        height: 16px;
        border-radius: 50%;
        border: 2px solid #50a1ff;
        background-color: #fff;
    }

    .timeline-element:nth-child(even)::before {
        left: auto;
        right: -8px;
    }

    .timeline-element:nth-child(even) {
        margin-right: 50%;
        padding-right: 2.5rem;
        padding-left: 0;
        text-align: right;
    }

@media (max-width: 767.98px) {
    .timeline::before {
        left: 8px;
    }
}

@media (max-width: 767.98px) {
    .timeline-element {
        width: 100%;
        text-align: right;
        padding-right: 2.5rem;
        padding-right: 0;
    }
}

@media (max-width: 767.98px) {
    .timeline-element::before {
        top: 1.25rem;
        right: 1px;
    }
}

@media (max-width: 767.98px) {
    .timeline-element:nth-child(even) {
        margin-right: 0rem;
    }
}

@media (max-width: 767.98px) {
    .timeline-element {
        width: 100%;
        text-align: right;
        padding-right: 2.5rem;
        padding-left: 0;
    }
}

@media (max-width: 767.98px) {
    .timeline-element:nth-child(even)::before {
        right: 1px;
    }
}

@media (max-width: 767.98px) {
    .timeline-element::before {
        top: 1.25rem;
    }
}




.over-layer-black,
.over-layer-black-2 {
    position: relative;
}

    .over-layer-black:before,
    .over-layer-black-2 {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.7);
    }

.over-layer-white,
.over-layer-white-1 {
    position: relative;
}

    .over-layer-white:before,
    .over-layer-white-1:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
    }

    .over-layer-white-1:before {
        background-color: rgba(255, 255, 255, 0.5);
    }

.over-layer-default {
    position: relative;
    background: no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding-top: 50px;
    padding-bottom: 50px;
}

.has-bg-img {
    position: relative;
}

.over-layer-default:after {
    content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: -1;
    opacity: 0.2; /* Here is your opacity */
}

.over-layer-defaultd:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    /*background-color: rgba(50, 50, 50, 0.8);*/
}

/*.preloader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 999999;
    background-color: #46a3e4;
    background-position: center center;
    background-repeat: no-repeat;
    background-image: url('../img/preloder/1.gif');
}*/


.list__item {
    width: 50%;
    float: right;
}

    .list__item img {
        padding: 4px;
        width: 100%;
        height: 120px;
        object-fit: cover;
        display: block;
    }


@media (min-width: 768px) {
    .list__item {
        width: 33%;
        float: right;
    }

        .list__item img {
            padding: 4px;
            max-width: 100%;
            height: 120px;
        }
}


@media (min-width: 992px) {
    .list__item {
        width: 25%;
        float: right;
    }

        .list__item img {
            padding: 4px;
            max-width: 100%;
            height: 200px;
        }
}
ul.gallery {
    float: left;
    clear: both;
}

.gallery__item--local {
    float: left;
    width: 30%;
    list-style-type: none;
    margin: 0;
    padding: 10px;
    max-height: 200px;
    overflow: hidden;
}
