body {
    padding-top: 0px;
    padding-bottom: 0px;
    font-family: IRANSans !important;
    color: #444;
    font-size: 14px;
    line-height: 30px;
    font-weight: 500;
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: bold;
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Bold.eot');
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Bold.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff2/IRANSansWeb(FaNum)_Bold.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/woff/IRANSansWeb(FaNum)_Bold.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb(FaNum)_Bold.ttf') format('truetype');
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 500;
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Medium.eot');
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Medium.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff2/IRANSansWeb(FaNum)_Medium.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/woff/IRANSansWeb(FaNum)_Medium.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb(FaNum)_Medium.ttf') format('truetype');
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 300;
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Light.eot');
    src: url('../fonts/eot/IRANSansWeb(FaNum)_Light.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff2/IRANSansWeb(FaNum)_Light.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/woff/IRANSansWeb(FaNum)_Light.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb(FaNum)_Light.ttf') format('truetype');
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 200;
    src: url('../fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot');
    src: url('../fonts/eot/IRANSansWeb(FaNum)_UltraLight.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff2/IRANSansWeb(FaNum)_UltraLight.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/woff/IRANSansWeb(FaNum)_UltraLight.woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb(FaNum)_UltraLight.ttf') format('truetype');
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: normal;
    src: url('../fonts/eot/IRANSansWeb(FaNum).eot');
    src: url('../fonts/eot/IRANSansWeb(FaNum).eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('../fonts/woff2/IRANSansWeb(FaNum).woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('../fonts/woff/IRANSansWeb(FaNum).woff') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('../fonts/ttf/IRANSansWeb(FaNum).ttf') format('truetype');
}



@font-face {
    font-family: Lavanderia;
    font-style: normal;
    font-weight: normal;
    src: url('Lavanderia/Lavanderia Delicate.otf') format('otf');
}
/*---------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

p {
    font-size: 13px !important;
    line-height: 30px !important;
    margin: 0px;
}

blockquote, q {
    quotes: none;
}

    blockquote:before, blockquote:after,
    q:before, q:after {
        content: '';
        content: none;
    }

table {
    border-collapse: collapse;
    border-spacing: 0;
}

* {
    box-sizing: border-box;
    text-decoration: none;
}

.clf:before,
.clf:after {
    content: " ";
    display: table;
}

.clf:after {
    clear: both;
}

.clf {
    *zoom: 1;
}

.clr {
    clear: both;
}

/*---------------basic---------------*/
body {
    direction: rtl;
    font-family: IRANSans !important;
}

a {
    text-decoration: none;
    color: #fff;
}


.poshtiban2 {
    background-color: #f5f5f5;
    padding-top: 60px;
    padding-bottom: 60px;
}

.poshtiban3 {
    padding-top: 60px;
    padding-bottom: 60px;
}

.poshtiban4 {
    padding-top: 60px;
}

.poshtiban2 .list2 h4 {
    background-color: #fff;
    border: 1px solid #dedede;
    color: #b22025;
    font-weight: bold;
    padding: 8px 10px;
}

.poshtiban2 .list2 ul li::before {
    color: #aaa;
    content: "";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    margin: 7px;
    text-decoration: inherit;
}

.list2 ul li::before {
    color: #aaa;
    content: "";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    margin: 7px;
    text-decoration: inherit;
}

.list2 ul li::before {
    color: #aaa;
    content: "";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    margin: 7px;
    text-decoration: inherit;
}

.list1 .items {
    display: inline-block;
    float: right;
    margin: 10px;
    width: 100%;
}

.list1 ul li::before {
    color: #aaa;
    content: "";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    margin: 7px;
    text-decoration: inherit;
}

.item-page {
    margin: 22px;
}

#networkran .item-page li {
    font-size: 14px;
    line-height: 30px !important;
    padding-top: 10px;
    font-weight: 600;
}

#networkran > h2 {
    font-size: 20px !important;
    padding-bottom: 10px !important;
}
/*-----------------------*/
main > section {
    padding: 70px 0;
}
/*-----------------------------*/

/*----------------*/
@media screen and (max-width: 768px) {
    .box3 h3 {
        padding-top: 20px;
    }

    .list1 h4 {
        padding-top: 20px;
    }

    .list1 p {
        text-align: justify;
    }

    .navbar-toggle {
        position: relative;
        top: 20px;
    }

    #appsample .f1 {
        margin-top: 20px;
    }

    #appsample .f2 {
        margin-top: 20px;
    }

    #appsample .f3 {
        margin-top: 20px;
    }

    .change1 .tri-line {
        display: none;
    }

    .change2 .tri-line {
        display: none;
    }

    .change3 .tri-line {
        display: none;
    }

    .change4 .tri-line {
        display: none;
    }

    .change1 p {
        text-align: right;
    }

    .change2 p {
        text-align: right;
    }

    .change1 h4 {
        text-align: right;
    }

    .change2 h4 {
        text-align: right;
    }

    .change1 .fa {
        float: right;
        position: relative;
        bottom: 60px;
    }

    .change2 .fa {
        float: right;
        position: relative;
        bottom: 60px;
    }

    .change2 {
        position: relative;
        top: 60px;
    }

    .change5 img {
        position: relative;
        top: 50px;
    }

    .show {
        display: none;
    }

    .abouth {
        padding: 10px 40px;
        background: #A4136C none repeat scroll 0% 0%;
        color: #FFF;
        width: 80% !important;
        text-align: center;
        margin: auto;
        font-size: 20px;
    }

    .navbar {
        z-index: 2;
    }

    #navbar {
        width: 1000px;
    }

    .box1 {
        padding: 20px;
    }

    .box2 {
        padding: 20px;
    }

    .box3 {
        padding: 20px;
    }

    .box4 {
        padding: 20px;
    }
}

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

    .dropdown #larger {
        padding-top: 0px;
    }

    .dropdown .underline2 {
        color: black;
        border-bottom: 1px solid black;
        border-width: 2px;
        width: 120px !important;
        font-size: 13px;
        font-weight: bold;
        margin-bottom: 20px;
        text-align: center;
    }

    #t h3 {
        text-align: center;
    }

    #z h3 {
        text-align: center;
    }

    #t p {
        text-align: justify;
    }

    #y h3 {
        text-align: center;
    }

    #y p {
        text-align: justify;
    }

    #p p {
        text-align: justify;
    }

    #o p {
        text-align: justify;
    }

    #n p {
        text-align: justify;
    }

    #q p {
        text-align: justify;
    }

    .wrapper_boxed p {
        text-align: justify;
    }

    .box14 p {
        text-align: justify;
    }

    .box13 p {
        text-align: justify;
    }

    #contact1 .p1 {
        margin-top: 20px;
    }

    #contact1 .p2 {
        margin-top: 20px;
    }

    #contact1 .p3 {
        margin-top: 20px;
    }

    #contact1 .p4 {
        margin-top: 20px;
    }

    .navbar-fixed-top {
        background-color: white !important;
    }

        .navbar-fixed-top .nav > li > a {
            color: black !important;
        }

    .hide {
        display: block;
    }

    .show {
        display: none;
    }

    #service h5 {
        text-align: justify;
    }

    #service img {
        text-align: center;
        margin: auto;
        width: 100px;
        padding-top: 30px;
    }

    #service .fa1 {
        margin: auto;
        width: 100% !important;
        padding-top: 60px;
    }

    #service1 img {
        text-align: center;
        margin: auto;
        width: 100px;
        padding-top: 30px;
    }

    #service1 .fa1 {
        margin: auto;
        width: 100% !important;
    }
}
/*-*/
.back {
    border-bottom: 2px solid black !important;
    background-color: white !important;
}

.b {
    color: black !important;
}

.zedindex {
    z-index: 5;
}
/*application*/

.App {
    background: url('../img/apppic.jpg');
    background-position: center;
    background-size: cover;
    height: 100vh;
    color: white;
    width: 100%;
    padding-top: 140px;
    background-attachment: fixed;
}

.appimg {
    height: 500px;
    padding-right: 100px;
    padding-left: 0;
}

.App button:hover {
    background: #f1c40f !important;
    opacity: 0.9;
}

.App .btn {
    color: #ffffff !important;
    transition: all 0.4s ease-in-out;
    border-radius: 40px;
    border-color: white;
    border-width: 1px;
    width: 140px;
    background: none !important;
    margin-top: 20px;
}

.App.container .bold {
    color: white;
    padding-right: 10px;
    font-size: 40px;
}

#z {
    z-index: 0 !important;
}

.App.container h1 {
    color: white;
    padding-right: 10px;
    font-size: 20px;
}

.t-right {
    text-align: left;
}

.icons-style-1, .icons-style-2 {
    margin-bottom: 20px;
    position: relative;
    z-index: 99999;
}

    .icons-style-2 i {
        font-size: 35px;
        margin-bottom: 10px;
        border-bottom-style: solid;
        border-bottom-width: 3px;
        padding-bottom: 10px;
        display: inline-block;
        color: #9B9999;
    }

.tri-line.bottom-tri {
    -moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1);
    top: 34px;
}

.tri-line-left {
    left: -52px;
    right: auto !important;
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: 'FlipH';
}

.tri-line.bottom-tri {
    transform: scaleY(-1);
    top: 17px;
}

.t-right .bottom-tri.tri-line {
    left: -50px;
    top: 17px;
    transform: scale(-1,-1);
}

.icons-style-2 p {
    margin: 0 0 20px 0;
    line-height: 24px;
}

.tri-line {
    position: absolute;
    width: 50px;
    height: 30px;
    border-width: 1px 1px 0 0;
    border-style: solid solid none none;
    display: block;
    top: 63px;
    right: -52px;
}

.icons-style-2 .heading {
    border-bottom: 1px solid #DDD;
    padding: 5px;
}

.tri-line::before {
    position: absolute;
    width: 70px;
    height: 1px;
    display: inline-block;
    bottom: 0px;
    right: -70px;
    content: "";
    z-index: 9999;
    border: 1px solid;
}

.icons-style-2 i, .tri-line::before, .tri-line {
    border-color: #1695E0 !important;
}

.iso-box > a {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
/*-------------*/
.fusion-tabs.fusion-tabs-1 .nav-tabs {
    background-color: #ffffff;
}

.fusion-tabs .nav-tabs li {
    display: block;
    position: relative;
    float: none;
    text-align: center;
    margin: 0;
}

.fusion-tabs.classic .nav-tabs > li.active .tab-link, .fusion-tabs.classic .nav-tabs > li.active .tab-link:focus, .fusion-tabs.classic .nav-tabs > li.active .tab-link:hover, .fusion-tabs.vertical-tabs.classic .nav-tabs > li.active .tab-link {
    border-color: #007df2;
}

.rtl .fontawesome-icon {
    margin-right: 0;
    margin-left: 10px;
    float: right;
}

.fusion-tabs.fusion-tabs-1 .nav-tabs li a {
    border-top-color: #ebeaea;
    background-color: #ebeaea;
}
/****************/

/*.gray {
    background-color: rgb(245, 245, 245);
}*/
.list2 > img, .list1 > img {
    width: 100%;
}
/*-----------*/

.fusion-tabs.fusion-tabs-1 .nav-tabs {
    background-color: #ffffff;
}

fusion-tabs .nav-tabs li .tab-link .fa {
    float: none;
    color: inherit;
}
/*------------------*/
.box13 {
    padding-top: 40px;
    padding-bottom: 40px;
}

.box9 {
    padding-top: 40px;
    padding-bottom: 40px;
}

    .box9 span {
        /*background-color: #a0ce4e;*/
        font-size: 11.44px;
        height: 22.1px;
        width: 22.1px;
        margin-left: 9.1px;
        border-radius: 100px !important;
        /*padding:5px;*/
    }

.box14 {
    background-color: #fff;
    background-image: url(//www.pirasys.com/wp-content/uploads/2016/08/topbluebanner.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    padding-top: 100px;
    padding-right: 30px;
    padding-bottom: 0px;
    padding-left: 30px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
/*-----------------------------------*/
.rightbarbase {
    background: transparent url('../img/rightbar.png') no-repeat scroll 0% 0%;
    height: 200px;
    width: 7%;
    position: absolute;
    top: 10%;
    right: 0px;
    top: 5%;
}

.abouth {
    padding: 10px 40px;
    background: #A4136C none repeat scroll 0% 0%;
    color: #FFF;
    width: 30%;
    text-align: center;
    margin: auto;
    font-size: 20px;
}

.rightbarbasetop {
    background: transparent url('../img/rightbar2.png') no-repeat scroll 0% 0%;
    height: 200px;
    position: absolute;
    width: 9%;
}

#a {
    background: white;
    color: black;
    position: relative;
}

.padt40 {
    padding-top: 30px;
}

#a p {
    text-align: justify;
}

.clear40 {
    width: 100%;
    height: 40px;
}

.mojavez {
    border-right: 3px solid #ccc;
    list-style: none;
}

    .mojavez li {
        padding: 8px 2px;
    }

.nopad {
    margin: 0px !important;
    padding: 0px;
}
/*-----------------------*/
.disgin {
    background: url('../img/BACK.png');
    background-position: center;
    background-size: cover;
    height: 100vh;
    color: white;
    width: 100%;
    padding-top: 140px;
    background-attachment: fixed;
}

    .disgin button:hover {
        background: #f1c40f !important;
        opacity: 0.9;
    }

    .disgin .btn {
        color: #ffffff !important;
        transition: all 0.4s ease-in-out;
        border-radius: 40px;
        border-color: white;
        border-width: 1px;
        width: 140px;
        background: none !important;
        margin-top: 20px;
    }

    .disgin.container .bold {
        color: white;
        padding-right: 10px;
        font-size: 40px;
    }

    .disgin.container h1 {
        color: white;
        padding-right: 10px;
        font-size: 20px;
    }





#z {
    background: white;
    color: black;
}

    #z h4 {
        padding-top: 40px;
        padding-bottom: 90px;
        line-height: 40px;
    }

    #z .container .box img {
        padding-left: 100px;
        padding-top: 30px;
    }

    #z .container .box {
        padding-top: 40px;
    }

    #z p {
        line-height: 30px;
        text-align: justify;
    }

#w {
    background: white;
    color: black;
}

    #w .container .box img {
        padding-left: 100px;
    }

    #w .container .box {
        padding-top: 15px;
    }

.imglog {
    width: 50px;
    display: inline;
    margin-top: -20px;
    padding-left: 0px !important;
    padding-top: 0px !important;
}
/***********/
.eb-mod-head.mod-table.align-middle {
    position: absolute;
    top: 20px;
    z-index: 2;
    background: rgb(0,155,220);
    width: 92px !important;
    padding: 9px;
    float: right;
    border-radius: 50px 0 0 50px;
}

.reasons-col {
    position: relative;
    overflow: hidden;
}

    .reasons-col img {
        width: 100%;
        -moz-transition: all, 0.5s;
        -o-transition: all, 0.5s;
        -webkit-transition: all, 0.5s;
        transition: all, 0.5s;
    }

    .reasons-col .reasons-titles {
        position: absolute;
        bottom: 0;
        text-align: center;
        background: white;
        width: 100%;
        color: black;
        text-transform: uppercase;
        height: 125px;
        padding: 25px 0;
    }

    .reasons-col .reasons-title {
        font-weight: bold;
    }

    .reasons-col .on-hover {
        position: absolute;
        top: 0;
        bottom: 125px;
        width: 100%;
        padding: 25px;
        color: #fff;
        text-align: justify;
        /* background: rgba(31, 118, 189, 0.9);*/
        border-bottom: 1px solid #fff;
        visibility: hidden;
        opacity: 0;
        -moz-transition: all, 0.5s;
        -o-transition: all, 0.5s;
        -webkit-transition: all, 0.5s;
        transition: all, 0.5s;
    }

    .reasons-col:hover .on-hover {
        visibility: visible;
        opacity: 1;
        padding: 50px;
        -moz-transition: all, 1s;
        -o-transition: all, 1s;
        -webkit-transition: all, 1s;
        transition: all, 1s;
    }

    .reasons-col:hover img {
        -moz-transform: scale3d(1.1, 1.1, 1.1);
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }
/*------------------*/
.wrapper_boxed a {
    text-align: center;
    color: white;
    text-decoration: none;
}
/*------------------------------*/
.parallax-window {
    height: auto;
    padding-bottom: 70px;
    background: url('../img/Parallax.jpg');
}

    .parallax-window P {
        color: white;
        text-align: justify;
    }

    .parallax-window a.button {
        text-decoration: none;
        color: white;
    }

    .parallax-window h2 {
        color: white;
        line-height: 30px;
        font-size: 20px;
    }

.button {
    border: 0;
    color: #fff;
    margin-right: 30px;
    padding: 7px 20px 7px 20px;
    -webkit-transition: 0.3s all ease;
    -moz-transition: 0.3s all ease;
    -o-transition: 0.3s all ease;
    -ms-transition: 0.3s all ease;
    transition: 0.3s all ease;
    background-color: #1CB2FB !important;
    border: solid 1px #1CB2FB;
    font-size: 0.9em;
}

main .fasele {
    padding: 70px 0;
}

    main .fasele a {
        text-decoration: none;
    }

.nextStep img {
    border: 4px solid #d0cece;
    border-radius: 50%;
    padding: 2px;
    margin-top: -67px;
    background: #fff;
}

.nextStep .col-md-4 > div {
    background: #f5f5f5;
    padding: 15px;
    height: 350px;
    margin-bottom: 30px;
}


.dropdown .underline1 {
    color: black;
    border-bottom: 1px solid black;
    border-width: 2px;
    width: 160px;
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 20px;
    text-align: center;
}

.dropdown img {
    width: 55px;
}

.dropdown .underline2 {
    color: black;
    border-bottom: 1px solid black;
    border-width: 2px;
    width: 360px;
    font-size: 13px;
    font-weight: bold;
    margin-bottom: 20px;
    text-align: center;
}

#service3 img {
    width: 100px;
    margin-top: 40px;
}

#service img {
    width: 100px;
    margin-top: 40px;
}








section {
    height: 650px;
    position: relative;
}

.wrap {
    width: 960px;
    height: 100%;
    margin: 0 auto;
    position: relative;
}

.about .wrap, .home .story .wrap, .home .contact .wrap {
    display: table;
}


.content {
    display: table-cell;
    vertical-align: middle;
}

.about {
    position: relative;
}


/*====================scroll bulet=========================*/
.scroll-bullet {
    position: fixed;
    left: 60px;
    top: 50%;
    line-height: 1.2em;
    z-index: 1000;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: opacity .3s;
    -o-transition: opacity .3s;
    transition: opacity .3s;
    -webkit-transition-delay: .3s;
    -o-transition-delay: .3s;
    transition-delay: .3s;
}

    .scroll-bullet.home {
        left: 50px;
    }

    .scroll-bullet.gray li {
        border-color: #ccc;
        -webkit-transition-delay: .3s;
        -o-transition-delay: .3s;
        transition-delay: .3s;
    }

        .scroll-bullet.gray li a {
            color: #bbb;
            -webkit-transition-delay: .3s;
            -o-transition-delay: .3s;
            transition-delay: .3s;
        }

    .scroll-bullet li {
        width: 20px;
        height: 20px;
        border: 2px solid #fff;
        border-radius: 25px;
        margin-bottom: 10px;
        text-align: center;
        float: left;
        clear: left;
        cursor: pointer;
        overflow: hidden;
        -webkit-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
        -webkit-transition-delay: .3s;
        -o-transition-delay: .3s;
        transition-delay: .3s;
    }

.clf li a {
    text-decoration: none;
    color: white;
}

.scroll-bullet li a {
    display: block;
    font-size: .9em;
    opacity: 0;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    -webkit-transition-delay: .3s;
    -o-transition-delay: .3s;
    transition-delay: .3s;
}



.intro {
    background: url('../Pictures/elegam (5).jpg');
    background-position: center;
    background-size: cover;
    height: 100vh;
    color: white;
    width: 100%;
    background-attachment: fixed;
}

    .intro .item {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

        .intro .item video {
            width: 100%;
        }

.header .general-info {
    float: left;
    height: 35px;
    margin: 0 25px;
}

    .header .general-info a {
        display: inline-block;
        vertical-align: middle;
        line-height: 29px;
        height: 35px;
        padding: 0 12px;
        margin-left: 5px;
        border: 2px solid #fff;
        border-radius: 5px;
        font-size: 15px;
        position: relative;
        text-decoration: none;
        color: white;
    }

        .header .general-info a:after {
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            background-color: #FFF;
            opacity: 0;
            transition: all .3s;
        }

        .header .general-info a:hover:after {
            opacity: .2;
        }

        .header .general-info a.icon-home {
            width: 36px;
            height: 35px;
            background: url('../Pictures/elegam (1).png') no-repeat -104px -724px;
            text-indent: -9999px;
        }

/*menu dark*/
.header.dark .general-info a {
    border-color: #ccc;
    color: #ccc;
}

    .header.dark .general-info a:after {
        background-color: #ccc;
    }

    .header.dark .general-info a.icon-home {
        background-position: -150px -725px;
    }

.section {
    min-height: 600px;
}

    .section.intro {
        min-height: 500px;
    }

    .section.lifestyle {
        min-height: 400px;
    }

    .section.intro .content {
        position: absolute;
        right: 50px;
        bottom: 150px;
        color: #fff;
        width: 701px;
        line-height: 4;
        text-align: right;
        z-index: 300;
    }

.home .section.intro .content {
    bottom: 50px;
}

.intro .content h2.image {
    text-indent: -9999px;
}

.intro .content h3 {
    font-size: 32px;
    line-height: 58px;
}

.intro .content a.btn {
    font-size: 18px;
    line-height: 20px;
    height: 40px;
    color: #fff;
    position: relative;
    padding: 9px 40px 3px 20px;
    border-radius: 4px;
    border: 1px solid #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

    .intro .content a.btn:hover {
        background-color: rgba(255,255,255,0.2);
    }

    .intro .content a.btn::after {
        content: "";
        position: absolute;
        right: 0;
        top: 58%;
        margin-top: -15px;
        background: url('public-sprite.png') no-repeat;
        background-position: -306px -170px;
        width: 30px;
        height: 30px;
    }

.intro .content p {
    position: relative;
    font-size: 16px !important;
}

.intro .content a {
    font-size: .9em;
    color: #c7c7c7;
    position: relative;
}

.intro .content .logos {
    margin-top: 30px;
}

    .intro .content .logos li {
        display: inline-block;
        vertical-align: middle;
        margin-left: 25px;
        perspective: 600px;
        -moz-perspective: 600px;
        -webkit-perspective: 600px;
        -ms-perspective: 600px;
    }

        .intro .content .logos li:last-child {
            margin-left: 0;
        }

    .intro .content .logos a {
        width: 80px;
        height: 80px;
        display: block;
    }

        .intro .content .logos a:before {
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            background: url('../Pictures/elegam (1).png') no-repeat;
            transition: .3s;
        }

        .intro .content .logos a:hover:before {
            opacity: 0;
            -webkit-transform: translateY(-30px);
            -ms-transform: translateY(-30px);
            -o-transform: translateY(-30px);
            transform: translateY(-30px);
        }

        .intro .content .logos a:after {
            content: "";
            width: 100%;
            height: 100%;
            position: absolute;
            left: 0;
            top: 0;
            background: url('../Pictures/elegam (1).png') no-repeat;
            -webkit-transform: translateY(30px);
            -ms-transform: translateY(30px);
            -o-transform: translateY(30px);
            transform: translateY(30px);
            -webkit-transition: all .3s;
            -o-transition: all .3s;
            transition: all .3s;
            opacity: 0;
        }

        .intro .content .logos a:hover:after {
            opacity: 1;
            -webkit-transform: translateY(0px);
            -ms-transform: translateY(0px);
            -o-transform: translateY(0px);
            transform: translateY(0px);
            -webkit-transition-delay: .3s;
            -o-transition-delay: .3s;
            transition-delay: .3s;
        }

    .intro .content .logos li.aparat a:before {
        background-position: -576px -74px;
    }

    .intro .content .logos li.aparat a:after {
        background-position: -576px -165px;
    }

    .intro .content .logos li.filimo a:before {
        background-position: -480px -74px;
    }

    .intro .content .logos li.filimo a:after {
        background-position: -480px -165px;
    }

    .intro .content .logos li.lenzor a:before {
        background-position: -364px -74px;
    }

    .intro .content .logos li.lenzor a:after {
        background-position: -364px -165px;
    }

    .intro .content .logos li.cloob a {
        width: 125px;
    }

        .intro .content .logos li.cloob a:before {
            background-position: -249px -74px;
        }

        .intro .content .logos li.cloob a:after {
            background-position: -249px -165px;
        }

    .intro .content .logos li.mihan a:before {
        background-position: -161px -74px;
    }

    .intro .content .logos li.mihan a:after {
        background-position: -155px -165px;
    }

    .intro .content .logos li.sabavision a {
        width: 100px;
    }

        .intro .content .logos li.sabavision a:before {
            background-position: -33px -74px;
        }

        .intro .content .logos li.sabavision a:after {
            background-position: -33px -165px;
        }


/*-----------------------about----------------------*/

.about {
    text-align: center;
}

    .about h2 {
        font: 25px/60px 'IRANSans';
        /*margin-bottom: 30px;*/
        color: #4bb5e1;
        margin-bottom: 0;
    }

    .about .features .item {
        float: left;
        width: 33.33333%;
        height: 230px;
        border-right: 2px dashed #ccc;
        position: relative;
        overflow: hidden;
        cursor: pointer;
    }

        .about .features .item:last-child {
            border-right: none;
        }

        .about .features .item a {
            display: block;
            width: 100%;
            height: 100%;
            padding: 0 22px;
        }

            .about .features .item a:before {
                display: block;
                background: url('../Pictures/elegam (1).png') no-repeat;
                margin: 35px auto 20px;
                -webkit-transition: all 0.5s;
                -o-transition: all 0.5s;
                transition: all 0.5s;
            }

    .about .features .views a:before {
        content: "";
        background-position: -318px -580px;
        width: 72px;
        height: 106px;
    }

    .about .features .idea a:before {
        content: "";
        background-position: -438px -586px;
        width: 68px;
        height: 106px;
    }

    .about .features .swift a:before {
        content: "";
        background-position: -664px -586px;
        width: 94px;
        height: 106px;
    }
/*.about .content img{

   width: 226px;
 
    text-align: center;*/

}

#popup .icon .views:before {
    content: "\e60a";
}

#popup .icon .idea:before {
    content: "\e602";
}

#popup .icon .swift:before {
    content: "\e601";
}

#popup .icon .icon-remote {
    text-align: center;
}

    #popup .icon .icon-remote:before {
        content: "";
        width: 120px;
        height: 120px;
        background: url('../Pictures/elegam (1).png') no-repeat;
        background-position: -817px -576px;
        display: inline-block;
    }

.about .features .item h3 {
    font-size: 1.3em;
    font-weight: bold;
    margin-bottom: 10px;
    color: #4bb5e1;
    transition: all .5s;
}

.about .features .item p {
    visibility: hidden;
    opacity: 0;
    color: #a0a0a0;
    font-size: .9em;
    line-height: 1.3;
    margin-top: 60px;
    transition: all .5s;
}

.about .features .item a:hover p {
    visibility: visible;
    opacity: 1;
    margin-top: 0;
}

.about .features .item a:hover:before {
    margin-top: 0px;
    margin-bottom: 7px;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
}

.about .features .item a:hover h3 {
    margin-bottom: 7px;
}

.about .features .popup {
    position: fixed;
    top: 0;
    left: 0;
    background-color: #4bb5e1;
    width: 100%;
    height: 100%;
    visibility: hidden;
    opacity: 0;
    display: table;
    transition: all .5s;
}

    .about .features .popup .container {
        display: table-cell;
        vertical-align: middle;
    }

.about .features .popup-close {
    display: block;
    width: 50px;
    height: 50px;
    background: url('close.png') no-repeat;
    position: absolute;
    top: 90px;
    right: 310px;
    cursor: pointer;
}

.about .features .popup h3 {
    color: #fff;
    margin-bottom: 10px;
}

    .about .features .popup h3:before {
        display: block;
        margin: 0 auto 15px;
        font-size: 3em;
        font-weight: 400;
        position: relative;
        opacity: 0;
        transition: all .4s;
    }

    .about .features .popup h3 span {
        display: block;
        position: relative;
        opacity: 0;
        transition: all .4s;
        transition-delay: .3s;
    }

.about .features .views .popup h3:before {
    content: '\e60a';
}

.about .features .swift .popup h3:before {
    content: '\e601';
}

.about .features .idea .popup h3:before {
    content: '\e602';
}

.about .lightbox .icon.icon-lamp {
    content: '\e60a';
}

.about .lightbox .icon {
}

    .about .lightbox .icon.icon-lamp {
    }

.about .features .popup p {
    visibility: visible;
    opacity: 0;
    color: #fff;
    width: 500px;
    margin: 0 auto;
    line-height: 1.5;
    transition: all .4s;
    transition-delay: .6s;
}

.about .features .popup.active h3:before,
.about .features .popup.active h3 span {
    opacity: 1;
}

.about .features .popup.active p {
    opacity: 1;
}


.about .more {
    background-color: #4bb5e1;
    width: 255px;
    margin: 40px auto 0;
    height: 60px;
    line-height: 40px;
    border-radius: 5px;
    font-size: 1.2em;
}

    .about .more a {
        width: 90%;
        height: 40px;
        margin: 10px 0;
        vertical-align: middle;
        display: inline-block;
        position: relative;
        padding-right: 35px;
        -webkit-transition: all .4s;
        -o-transition: all .4s;
        transition: all .4s;
        text-decoration: none;
        color: white;
    }

        .about .more a:hover {
            opacity: .6;
        }
        /*.about .more a.icon-book {*/
        /*border-left: 2px dashed #fff;*/
        /*}*/
        .about .more a.icon-book:before {
            content: "";
            width: 48px;
            height: 50px;
            display: block;
            position: absolute;
            right: 10px;
            top: -4px;
            background: url('../Pictures/elegam (1).png') no-repeat -38px -715px;
        }

        .about .more a.icon-remote:before {
            content: "";
            background: url('sprite.png') no-repeat;
            background-position: -230px -575px;
            width: 50px;
            height: 50px;
            display: block;
            position: absolute;
            right: 15px;
            top: -2px;
        }

/*---------------products---------------*/

.home .products {
    background-color: #ddd;
}

    .home .products .item {
        overflow: hidden;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
    }

    .home .products > div {
        width: 33.3333333333%;
        height: 50%;
        float: right;
        position: relative;
        text-align: center;
    }

    .home .products a.bg {
        position: absolute;
        display: block;
        width: 100%;
        height: 100%;
        z-index: 101;
        left: 0;
        top: 0;
    }

    .home .products > div:before {
        content: '';
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: #000;
        opacity: .5;
        transition: all .5s;
        z-index: 100;
    }

    .home .products .name {
        position: absolute;
        z-index: 120;
        top: 50%;
        width: 100%;
        text-align: center;
        font-size: 2em;
        color: #000;
        opacity: 0;
        -webkit-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        -webkit-transition: all .5s;
        -o-transition: all .5s;
        transition: all .5s;
    }

    .home .products .item:hover .name {
        opacity: 1;
        -webkit-transform: translateY(10px);
        -ms-transform: translateY(10px);
        -o-transform: translateY(10px);
        transform: translateY(10px);
    }

    .home .products .link {
        position: absolute;
        bottom: 18px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 90%;
        z-index: 120;
    }

    .home .products .link {
        margin: 0 auto;
        margin-top: 66px;
        transition: all .7s;
        perspective: 600px;
    }

        .home .products .link a:first-child {
            display: inline-block;
            width: 35%;
            height: 35px;
            background-color: #ec145a;
            font-size: 1.1em;
            vertical-align: middle;
            line-height: 33px;
            opacity: 0;
            -webkit-transform: translateY(50px);
            -ms-transform: translateY(50px);
            -o-transform: translateY(50px);
            transform: translateY(50px);
            -webkit-transition: all .3s;
            -o-transition: all .3s;
            transition: all .3s;
            -webkit-transition-delay: .1s;
            -o-transition-delay: .1s;
            transition-delay: .1s;
        }

    .home .products .item:hover .link a:first-child {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }

    .home .products .link a:first-child:after {
        content: '\e616';
        display: inline-block;
        margin-right: 10px;
        font-size: 1.7em;
        line-height: 33px;
        vertical-align: middle;
    }

    .home .products .link a:last-child {
        display: inline-block;
        background-color: #000;
        height: 35px;
        width: 65%;
        margin-right: -4px;
        text-align: left;
        font-size: 1.2em;
        letter-spacing: 2px;
        vertical-align: middle;
        line-height: 33px;
        padding-left: 15px;
        opacity: 0;
        -webkit-transform: translateY(50px);
        -ms-transform: translateY(50px);
        -o-transform: translateY(50px);
        transform: translateY(50px);
        -webkit-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
    }

    .home .products .item:hover .link a:last-child {
        -webkit-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        opacity: 1;
    }

    .home .products .link a:last-child:before {
        content: '\e60d';
        display: inline;
        vertical-align: middle;
        margin-right: 10px;
        -webkit-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
        -webkit-transition-delay: .2s;
        -o-transition-delay: .2s;
        transition-delay: .2s;
    }

    .home .products .item:hover .link a:last-child:before {
    }

    .home .products .item:hover:before {
        background-color: rgba(34,172,221,.7);
        opacity: 1;
    }

    .home .products a:hover .name, .home .products a:hover .link {
        opacity: 1;
    }

    .home .products .item {
        text-align: center;
    }

        .home .products .item .logo {
            width: 128px;
            height: 128px;
            position: absolute;
            left: 50%;
            top: 50%;
            margin: -64px 0 0 -64px;
            z-index: 110;
        }

            .home .products .item .logo:before {
                content: "";
                position: absolute;
                background: url('../Pictures/elegam (1).png');
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                transition: all .5s;
            }

        .home .products .item:hover .logo:before {
            -webkit-transform: translateY(-30px);
            -ms-transform: translateY(-30px);
            -o-transform: translateY(-30px);
            transform: translateY(-30px);
            opacity: 0;
        }

    .home .products .logo:after {
        content: "";
        position: absolute;
        background: url('../Pictures/elegam (1).png');
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        -webkit-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -o-transform: translateY(-30px);
        transform: translateY(-30px);
        -webkit-transition: all .5s;
        -o-transition: all .5s;
        transition: all .5s;
        opacity: 0;
    }

    .home .products .item:hover .logo:after {
        -webkit-transform: translateY(-60px);
        -ms-transform: translateY(-60px);
        -o-transform: translateY(-60px);
        transform: translateY(-60px);
        opacity: 1;
    }

    .home .products .aparat .logo:before {
        background-position: -779px -285px;
    }

    .home .products .aparat .logo:after {
        background-position: -779px -422px;
    }

    .home .products .cloob .logo:before {
        background-position: -316px -285px;
        width: 140px;
    }

    .home .products .cloob .logo:after {
        background-position: -316px -422px;
        width: 140px;
    }

    .home .products .filimo .logo:before {
        background-position: -493px -285px;
    }

    .home .products .filimo .logo:after {
        background-position: -493px -422px;
    }

    .home .products .mihan .logo:before {
        background-position: -165px -285px;
    }

    .home .products .mihan .logo:after {
        background-position: -165px -422px;
    }

    .home .products .lenzor .logo:before {
        background-position: -651px -285px;
    }

    .home .products .lenzor .logo:after {
        background-position: -651px -422px;
    }

    .home .products .sabavision .logo:before {
        background-position: -24px -285px;
    }

    .home .products .sabavision .logo:after {
        background-position: -24px -422px;
    }
/*---------------------Main slider--------------------*/

.home .story {
    text-align: center;
    position: relative;
    display: table;
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
}

    .home .story h2 {
        text-align: center;
        font-size: 1.8em;
        background-color: #4bb5e1;
        display: inline-block;
        padding: 5px 35px 10px;
        margin-top: 50px;
        border-radius: 43px;
        font-weight: 900;
        color: #fff;
        position: relative;
        z-index: 1000;
    }

    .home .story .content {
        width: 100%;
        padding: 50px 0;
    }

    .home .story .timeline {
        width: 780px;
        margin-top: -240px;
    }

    .home .story .wrap {
        width: auto;
        overflow: hidden;
    }

    .home .story .slider img {
        width: 100%;
    }

    .home .story .slider {
        /*width: 700px;*/
        width: 70%;
        height: 400px;
        position: relative;
        margin: 15px auto 0;
    }

        .home .story .slider .item {
            position: absolute;
            z-index: 1;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            transition: all .5s;
        }

            .home .story .slider .item img {
            }

    .home .story .pointer-wrap {
        width: 792px;
        margin: 0 auto;
        position: relative;
        top: 92px;
        display: none;
    }

    .home .story .pointer {
        position: absolute;
        right: 110px;
        bottom: 90px;
        width: 220px;
        text-align: right;
        z-index: 100;
        opacity: 0;
    }

        .home .story .pointer.active {
            transition-delay: 1.3s;
            transition-duration: .3s;
            transition-property: opacity, transform;
            -webkit-transform: translateX(-20px);
            -ms-transform: translateX(-20px);
            -o-transform: translateX(-20px);
            transform: translateX(-20px);
            opacity: 1;
        }

        .home .story .pointer.reverse {
            text-align: left;
            right: auto;
            left: 20px;
        }

    .home .story .timeline .item .pointer.reverse a:after {
        left: -33px;
        right: auto;
    }

    .home .story .timeline .item .pointer h3 {
        font-size: 18px;
        color: #3dacdd;
    }

    .home .story .timeline .item .pointer p {
        font-size: 12px;
        line-height: 18px;
        color: #555;
        margin: 5px 0 3px;
    }

    .home .story .timeline .item .pointer a {
        font-size: 13px;
        line-height: 18px;
        color: #3dacdd;
        position: relative;
        opacity: 0;
        -webkit-transition: all .5s;
        -o-transition: all .5s;
        transition: all .5s;
    }

        .home .story .timeline .item .pointer a:after {
            content: "";
            width: 25px;
            height: 25px;
            background: url('../Pictures/elegam (1).png') no-repeat 0 0;
            position: absolute;
            right: -33px;
            top: 0;
        }

    .home .story .item .pointer.active a {
        transition-delay: 1.6s;
        opacity: 1;
    }

    .home .story .timeline .item .line {
        position: absolute;
        right: 128px;
        bottom: -12px;
        width: 2px;
        height: 0;
        background-color: #2daae1;
        text-align: right;
        z-index: 100;
        visibility: hidden;
        transition: .5s;
    }

        .home .story .timeline .item .line.active {
            transition-delay: 1s;
            height: 90px;
            visibility: visible;
        }

        .home .story .timeline .item .line:after {
            content: "";
            width: 8px;
            height: 8px;
            background-color: #2daae1;
            position: absolute;
            top: 0;
            right: -3px;
            border-radius: 5px;
        }

    .home .story .slider .prev,
    .home .story .slider .next {
        font-size: 3em;
        font-weight: 900;
        color: #c7c7c7;
        position: absolute;
        top: 50%;
        z-index: 1000;
        margin-top: -20px;
        cursor: pointer;
        transition: color .4s;
    }

        .home .story .slider .prev:hover,
        .home .story .slider .next:hover {
            color: #4bb5e1;
        }

    .home .story .slider .prev {
        left: -40px;
    }

    .home .story .slider .next {
        right: -40px;
    }

    .home .story .slider .prev:before {
        content: '\e610';
    }

    .home .story .slider .next:before {
        content: '\e615';
    }



    .home .story .slider .slide a {
        color: #4bb5e1;
        position: absolute;
        border: 0;
        right: 0;
        bottom: 0;
    }

        .home .story .slider .slide a:before {
            content: '\e618';
            font-size: 1.6em;
            font-weight: 900;
            position: absolute;
            left: 81px;
            top: -3px;
        }

    .home .story .timeline {
        width: 815px;
        margin: 0 auto;
        margin-top: -240px;
        /*overflow: hidden;*/
        position: relative;
        z-index: 100;
        -webkit-transition: all .5s;
        -o-transition: all .5s;
        transition: all .5s;
    }

        .home .story .timeline .wraper {
            width: 9999px;
            padding: 200px 0 30px;
            float: right;
            text-align: right;
            font-size: 0;
        }

        .home .story .timeline .item {
            width: 130px;
            padding: 0 7px;
            text-align: left;
            display: inline-block;
            vertical-align: bottom;
            position: relative;
            cursor: pointer;
        }

            .home .story .timeline .item p {
                font-size: 1.2em;
                margin-bottom: 5px;
                font-weight: 600;
                line-height: 1.4;
                font-size: 16px;
                transition: all .2s;
            }

                .home .story .timeline .item p i {
                    font-size: 10px;
                    line-height: 16px;
                    display: block;
                }

            .home .story .timeline .item span {
                color: #a7a7a7;
                transition: all .2s;
                font-size: 13px;
            }

    .home .story .progress {
        width: 100%;
        height: 12px;
        margin: 0 auto;
        position: relative;
        top: 11px;
        overflow: hidden;
        /*right: -48px;*/
        -webkit-transition: all .5s;
        -o-transition: all .5s;
        transition: all .5s;
    }

        .home .story .progress .back {
            width: 9999px;
            height: 110%;
            background: url('/line-gray.png') repeat-x right;
            position: absolute;
            top: -1px;
            right: 7px;
        }

        .home .story .progress .front {
            width: 130px;
            height: 100%;
            background: url('/line-blue.png') repeat-x right;
            position: absolute;
            top: 0;
            right: 7px;
            transition: all 1s;
            transition-delay: .3s;
        }
/*---------------------loction------------------------*/
.home .lifestyle {
    overflow: hidden;
    position: relative;
}

    .home .lifestyle .pagination li {
        display: inline-block;
        width: 20px;
        height: 20px;
        border: 2px solid #f2ebe3;
        border-radius: 10px;
        margin: 3px;
        cursor: pointer;
        transition: all .5s;
    }

        .home .lifestyle .pagination li.active {
            background-color: #FFF;
        }

    .home .lifestyle > .wrap {
        height: auto;
    }

    .home .lifestyle .slider {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
    }

.home .section.slider .slide-wrap {
    width: 100%;
    left: 0;
    margin: 0;
}

.home .lifestyle .slider:before {
    content: '';
    display: block;
    width: 100%;
    height: 135px;
    /*background: -webkit-linear-gradient(top, rgba(0,0,0,.6) 0%, transparent 100%);*/
    position: relative;
    z-index: 999;
}

.home .lifestyle .item {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0;
    z-index: 1;
    visibility: hidden;
    -webkit-transition: all 1s;
    -o-transition: all 1s;
    transition: all 1s;
}

    .home .lifestyle .item.active {
        opacity: 1;
        visibility: visible;
    }

.home .lifestyle .slider img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.home .lifestyle .content h2 {
    font-size: 2em;
    font-weight: bold;
    color: #fff;
    margin-bottom: 15px;
    position: relative;
    top: -30px;
    transition: all .7s;
}

.home .lifestyle .slider .item.active .content h2 {
    top: 0;
}

.home .lifestyle .content p {
    font-size: 1.1em;
    color: #fff;
    margin-bottom: 15px;
    position: relative;
    top: -20px;
    transition: all .7s;
    transition-delay: .1s;
}

.home .lifestyle .slider .item.active .content p {
    top: 0;
}

.home .lifestyle .content a {
    border: 2px solid;
    padding: 5px 18px 10px;
    font-size: 1.1em;
    border-radius: 4px;
    display: inline-block;
    position: relative;
    opacity: 0;
    transition: all .5s;
    transition-delay: .2s;
}

    .home .lifestyle .content a:after {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: #FFF;
        opacity: 0;
        transition: all .3s;
    }

    .home .lifestyle .content a:hover:after {
        opacity: .2;
    }

.home .lifestyle .slider .item.active .content a {
    opacity: 1;
}


/*------------------------contact---------------------*/
.home .contact {
    overflow: hidden;
    position: relative;
    background: url('/map-bg.jpg') no-repeat center bottom;
    background-size: cover;
    text-align: center;
    color: #fff;
    display: table;
    width: 100%;
}

    .home .contact img {
        display: block;
        width: 100%;
    }

    .home .contact p {
        line-height: 75px;
    }

    .home .contact span.phone {
        margin-left: 20px;
    }

    .home .contact span.fax {
    }

        .home .contact span.phone:before,
        .home .contact span.fax:before {
            display: inline-block;
            font-size: 1.5em;
            color: #fff;
            line-height: 1;
            margin-left: 5px;
            vertical-align: middle;
        }

    .home .contact span.phone:before {
        content: '\e614';
    }

    .home .contact span.fax:before {
        content: '\e608';
    }


    .home .contact p.email {
        font: 22px/30px 'myriad pro',arial;
        letter-spacing: 5px;
    }

        .home .contact p.email:after {
            content: "";
            display: block;
            line-height: 1;
            margin: 10px auto 0;
            background: url('sprite.png' ) no-repeat;
            background-position: -118px -577px;
            width: 78px;
            height: 58px;
        }

    .home .contact .wrap p:first-child:before {
        content: "";
        background: url(sprite.png) no-repeat;
        background-position: -547px -596px;
        width: 94px;
        height: 79px;
        display: block;
        margin: 0 auto 10px;
    }

    .home .contact form {
        margin: 20px 0 0;
        position: relative;
        display: inline-block;
        border-radius: 100px;
    }

    .home .contact input[type="text"] {
        width: 463px;
        height: 40px;
        padding-right: 25px;
        border: 1px solid #fff;
        border-radius: 100px;
        color: #4bb5e1;
        outline: none;
    }

    .home .contact input[type="submit"] {
        position: absolute;
        font-size: 12px;
        top: 5px;
        left: 3px;
        border: none;
        width: 100px;
        height: 34px;
        border-radius: 100px;
        color: #fff;
        background-color: #f85900;
        outline: none;
        cursor: pointer;
        -webkit-transition: all 0.5s;
        -o-transition: all 0.5s;
        transition: all 0.5s;
    }

        .home .contact input[type="submit"]:hover {
            background-color: #d94f00;
        }

    .home .contact p.warn {
        font: 18px/20px 'myriad pro',arial;
        margin: 15px auto;
    }



.lightbox {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(34,172,221,.9);
    z-index: 10000;
    display: table;
    visibility: hidden;
    opacity: 0;
    transition: all .5s;
}

    .lightbox .content {
        display: table-cell;
        vertical-align: middle;
        padding: 0 25%;
        color: #fff;
    }

        .lightbox .content .icon {
            font-size: 8em;
            color: #fff;
            margin: 0 auto 15px;
            position: relative;
            top: -10px;
            opacity: 0;
            transition: all .3s;
        }

        .lightbox .content .title {
            font-size: 22px;
            line-height: 30px;
            padding: 10px 0 20px 0;
            position: relative;
            top: -10px;
            opacity: 0;
            transition: all .3s;
            transition-delay: .3s;
        }

        .lightbox .content .body {
            font-size: 14px;
            line-height: 20px;
            position: relative;
            top: -10px;
            opacity: 0;
            transition: all .3s;
            transition-delay: .7s;
        }

    .lightbox.active .icon {
        top: 10px;
        opacity: 1;
    }

    .lightbox.active .title {
        top: 10px;
        opacity: 1;
    }

    .lightbox.active .body {
        top: 10px;
        opacity: 1;
    }

    .lightbox .close {
        width: 41px;
        height: 41px;
        display: block;
        position: absolute;
        top: 50px;
        left: 50px;
        background: url('/close.png') no-repeat;
        cursor: pointer;
        /* -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0);*/
        -webkit-transition: all .6s;
        -o-transition: all .6s;
        transition: all .6s;
        z-index: 10;
    }

    .lightbox.active .close {
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }

.page-wrap {
    position: relative;
}

.section-wrap {
    width: 95%;
    margin: 0 auto;
    height: 100%;
    /*max-width: 1200px;*/
    background-color: white;
    text-align: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

    .section-wrap::after {
        content: "";
        width: 1px;
        height: 100%;
        display: inline-block;
        vertical-align: middle;
    }


.intro .bg .image {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 50%;
    margin-left: -50%;
    background-size: 60%;
}

.intro::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 150%;
    height: 50%;
    z-index: 100;
    background: -webkit-linear-gradient(top,rgba(0,0,0,0.5),transparent 100%);
    background: -o-linear-gradient(bottom,rgba(0,0,0,0.5),transparent 100%);
    background: -moz-linear-gradient(bottom,rgba(0,0,0,0.5),transparent 100%);
    background: linear-gradient(to bottom,rgba(0,0,0,0.5),transparent 100%);
    -webkit-transform-origin: left top;
    -moz-transform-origin: left top;
    -ms-transform-origin: left top;
    -o-transform-origin: left top;
    transform-origin: left top;
}

.intro::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 60%;
    z-index: 100;
}


.intro .footer {
    position: absolute;
    width: 95%;
    height: 180px;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 200;
}

    .intro .footer .image {
        position: absolute;
        width: 100%;
        height: 100px;
        bottom: 0;
        left: 0;
    }

    .intro .footer .btn {
        position: absolute;
        bottom: 80px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        background: url('img/public-sprite.png') no-repeat; /*arrow down icon*/
        background-position: -306px -2px;
        width: 64px;
        height: 64px;
        cursor: pointer;
    }

.section .header.space {
    padding: 50px 60px;
}

.section .content {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    width: 800px;
    margin: 0 auto;
}

.section-wrap .content {
    display: inline-block;
}

.section .lightbox .content {
    width: 100%;
}

.section.about .content .image {
    display: inline-block;
    /*margin: 10px 0;*/
    /*margin-top: 50px;*/
}

.section.about .content h4 {
    color: #b9b9b9;
    font-size: 26px;
    line-height: 40px;
    margin-bottom: 10px;
}

.section.about .content h5 {
    color: #4bc0d1;
    font-size: 18px;
    line-height: 27px;
}

.section.about .content p {
    line-height: 30px;
    text-align: justify;
}

.section.about .content .wrap.pattern1 {
    display: block;
    width: 100%;
    /*margin: 20px 111px 24px 24px;*/
}

    .section.about .content .wrap.pattern1 .item {
        display: inline-block;
        margin: 10px 22px;
    }

        .section.about .content .wrap.pattern1 .item span {
            display: block;
        }

        .section.about .content .wrap.pattern1 .item .title {
            font-size: 24px;
            line-height: 43px;
        }

        .section.about .content .wrap.pattern1 .item .info {
            font-size: 16px;
            line-height: 24px;
        }


.section.specs .content .title {
    display: inline-block;
    color: #fff;
    padding: 5px 40px 10px;
    font-size: 26px;
    height: 46px;
    line-height: 30px;
    border-radius: 23px;
    margin-bottom: 35px;
    font-weight: bold;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.section.specs .content .wrap {
    text-align: center;
    width: 100%;
}

.section.specs .content .item {
    display: inline-block;
    vertical-align: top;
    margin: 0 5px;
}

    .section.specs .content .item h5 {
        font-size: 16px;
        line-height: 24px;
        font-weight: bold;
    }

    .section.specs .content .item p {
        line-height: 20px;
        font-size: 14px;
    }

.section.specs .content.pattern1 .item {
    text-align: center;
    border-radius: 15px;
    border: 1px solid #cecfce;
    width: 350px;
    height: 240px;
    margin-top: 10px;
    padding: 20px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}



.section.children .content .title {
    display: inline-block;
    color: #fff;
    padding: 5px 40px 10px;
    font-size: 23px;
    height: 46px;
    line-height: 30px;
    border-radius: 23px;
    margin-bottom: 35px;
    font-weight: bold;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.section.children .content .wrap {
    text-align: center;
    width: 100%;
}

.section.children .content .item {
    display: inline-block;
    vertical-align: top;
    margin: 0 5px;
}

    .section.children .content .item h5 {
        font-size: 16px;
        line-height: 24px;
        font-weight: bold;
    }

    .section.children .content .item p {
        line-height: 26px;
    }
/*.section.children .content.pattern4 .item{*/
/*text-align: center;*/
/*border-radius: 15px;*/
/*border:1px solid #cecfce;*/
/*width: 220px;*/
/*padding: 20px;*/
/*-webkit-box-sizing: border-box;*/
/*-moz-box-sizing: border-box;*/
/*box-sizing: border-box;*/
/*}*/

.section.specs .content.pattern1 .item .image {
    display: inline-block;
    width: 100%;
    margin-bottom: 5px;
}

.section.specs .content.pattern2 {
    width: 910px;
}

    .section.specs .content.pattern2 .item {
        text-align: right;
        border-radius: 15px;
        border: 1px solid #cecfce;
        width: 380px;
        min-height: 120px;
        height: 138px;
        padding: 20px;
        margin: 0 10px 20px;
        vertical-align: top;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

        .section.specs .content.pattern2 .item .des {
            margin-right: 85px;
        }

        .section.specs .content.pattern2 .item .image {
            display: inline-block;
            width: 100%;
            margin-left: 15px;
            float: right;
        }






.section.children .content.pattern4 {
    width: 910px;
}

    .section.children .content.pattern4 .item {
        text-align: right;
        border-radius: 15px;
        text-align: justify;
        border: 1px solid #cecfce;
        width: 430px;
        min-height: 120px;
        height: 160px;
        padding: 20px;
        margin: 0 10px 10px;
        vertical-align: top;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

        .section.children .content.pattern4 .item .des {
            margin-right: 85px;
        }

        .section.children .content.pattern4 .item .image {
            display: inline-block;
            width: 100%;
            margin-left: 15px;
            float: right;
        }

.section.specs .content .pattern3 {
    border-radius: 15px;
    border: 2px solid #cfcfcf;
}

    .section.specs .content .pattern3 .item {
        width: 23%;
        margin: 20px 0;
    }

        .section.specs .content .pattern3 .item h5 {
            font-size: 14px;
            line-height: 21px;
        }

        .section.specs .content .pattern3 .item .image {
            background: url('/mihanblog-sprite.png') no-repeat;
            margin: 10px auto;
            height: 55px;
        }

        .section.specs .content .pattern3 .item:nth-child(1) .image {
            background-position: -478px -170px;
            width: 44px;
            /*height: 45px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(2) .image {
            background-position: -540px -170px;
            width: 52px;
            /*height: 44px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(3) .image {
            background-position: -606px -170px;
            width: 52px;
            /*height: 44px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(4) .image {
            background-position: -668px -170px;
            width: 49px;
            /*height: 52px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(5) .image {
            background-position: -730px -170px;
            width: 52px;
            /*height: 52px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(6) .image {
            background-position: -798px -173px;
            width: 52px;
            /*height: 58px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(7) .image {
            background-position: -472px -228px;
            width: 40px;
            /*height: 53px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(8) .image {
            background-position: -526px -228px;
            width: 48px;
            /*height: 45px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(9) .image {
            background-position: -585px -235px;
            width: 52px;
            /*height: 36px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(10) .image {
            background-position: -479px -285px;
            width: 40px;
            /*height: 52px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(11) .image {
            background-position: -531px -285px;
            width: 52px;
            /*height: 52px;*/
        }

        .section.specs .content .pattern3 .item:nth-child(12) .image {
            background-position: -594px -285px;
            width: 40px;
            /*height: 52px;*/
        }

.section.slider .slide-wrap {
    position: absolute;
    width: 95%;
    height: 100%;
    left: 50%;
    margin-left: -47.5%;
    top: 0;
}

    .section.slider .slide-wrap::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 50%;
        z-index: 100;
        background: -webkit-linear-gradient(top,#171716,transparent);
        background: -o-linear-gradient(bottom,#171716,transparent);
        background: -moz-linear-gradient(bottom,#171716,transparent);
        background: linear-gradient(to bottom,#171716,transparent);
        -webkit-transform-origin: left top;
        -moz-transform-origin: left top;
        -ms-transform-origin: left top;
        -o-transform-origin: left top;
        transform-origin: left top;
    }


    .section.slider .slide-wrap .slides .item {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-repeat: no-repeat;
        /*background-position: inherit;*/
        background-position: center center;
        /*background-size: contain;*/
        background-size: cover;
        text-align: right;
        opacity: 0;
        -webkit-transition: all 1s;
        -o-transition: all 1s;
        transition: all 1s;
    }

        .section.slider .slide-wrap .slides .item.active {
            opacity: 1;
        }

    .section.slider .slide-wrap .item .info {
        position: absolute;
        color: #fff;
        right: 70px;
        bottom: 50px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 10px;
        z-index: 10;
    }

        .section.slider .slide-wrap .item .info h4 {
            font-size: 26px;
            line-height: 30px;
            font-weight: bold;
            margin-bottom: 5px;
        }

        .section.slider .slide-wrap .item .info p {
            font-size: 16px;
            line-height: 24px;
            margin-bottom: 20px;
        }

        .section.slider .slide-wrap .item .info a {
            font-size: 18px;
            line-height: 27px;
            height: 27px;
            padding: 0 10px;
            border-radius: 4px;
            border: 2px solid #fff;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            -webkit-transition: all 0.3s;
            -o-transition: all 0.3s;
            transition: all 0.3s;
        }

            .section.slider .slide-wrap .item .info a:hover {
                background-color: rgba(255,255,255,0.2);
            }

.section.slider .slide-bullets {
    position: absolute;
    padding: 10px;
    width: 300px;
    height: 50px;
    /*bottom: 50px;*/
    bottom: 100px;
    left: 40px;
    z-index: 100;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

    .section.slider .slide-bullets .item {
        position: relative;
        display: inline-block;
        margin: 0 4px;
        float: left;
        cursor: pointer;
        width: 22px;
        height: 22px;
        border-radius: 11px;
        border: 2px solid #f2ebe3;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

        .section.slider .slide-bullets .item:hover,
        .section.slider .slide-bullets .item.active {
            background-color: #f2ebe3;
        }


.section.app .section-wrap::after {
    content: none;
}

.section.app .detail {
    background-color: #000;
    color: #fff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 50px 10%;
}

    .section.app .detail:after {
        content: "";
        display: inline-block;
        vertical-align: middle;
        width: 1px;
        height: 100%;
    }

    .section.app .detail .col-12 {
        vertical-align: middle;
        display: inline-block;
        width: 45%;
        margin: 0 2%;
    }

        .section.app .detail .col-12.right {
            text-align: right;
            padding: 0 20px;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
        }

            .section.app .detail .col-12.right h4 {
                font-size: 26px;
                line-height: 30px;
                font-weight: bold;
                margin-bottom: 10px;
            }

            .section.app .detail .col-12.right p {
                font-size: 16px;
                line-height: 24px;
                margin-bottom: 30px;
                text-align: justify;
            }

    .section.app .detail a {
        border: 1px solid #bbbdbc;
        border-radius: 5px;
        display: inline-block;
        position: relative;
        -webkit-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

        .section.app .detail a:hover {
            -webkit-filter: invert(.1);
            filter: invert(.1);
        }

    .section.app .detail .googleplay {
        background: url('/google.png') no-repeat; /*googleplay button*/
        width: 152px;
        height: 53px;
        margin-left: 10px;
    }

    .section.app .detail .appstore {
        background: url('/apstore.png') no-repeat; /*appstore button*/
        width: 152px;
        height: 53px;
    }

    .section.app .detail .winstore {
        /* background: url('/winstore.png') no-repeat;/*appstore button*/
        width: 152px;
        height: 53px;
        margin-right: 80px;
        margin-top: 10px;
    }


    .section.app .detail .devices {
        width: 100%;
        height: 160px;
        position: relative;
    }

        .section.app .detail .devices .item {
            position: absolute;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
        }

            .section.app .detail .devices .item.active img {
                opacity: 1;
            }

            .section.app .detail .devices .item img {
                opacity: 0;
                max-height: 160px;
                max-width: 100%;
                -webkit-transition: all .5s;
                -o-transition: all .5s;
                transition: all .5s;
            }


    .section.app .detail .device-btns {
        margin-top: 30px;
        list-style: none;
    }

        .section.app .detail .device-btns .item {
            background: url('/lenzor-sprite.png') no-repeat;
            margin: 0 10px;
            display: inline-block;
            cursor: pointer;
            -webkit-transition: all 0.3s;
            -o-transition: all 0.3s;
            transition: all 0.3s;
        }

            .section.app .detail .device-btns .item:hover {
                opacity: 1;
            }

            .section.app .detail .device-btns .item.active {
                opacity: 1;
            }

        .section.app .detail .device-btns .desktop {
            background-position: -144px 0;
            width: 59px;
            height: 35px;
            opacity: 0.4;
        }

        .section.app .detail .device-btns .tablet {
            background-position: -209px 0;
            width: 30px;
            height: 36px;
            opacity: 0.4;
        }

        .section.app .detail .device-btns .mobile {
            background-position: -252px 0;
            width: 22px;
            height: 36px;
            opacity: 0.4;
        }


.section.app .other-products {
    padding: 60px 30px 160px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

    .section.app .other-products h4 {
        font-size: 26px;
        line-height: 30px;
        font-weight: bold;
        color: #000;
        margin-bottom: 20px;
    }

    .section.app .other-products .wrap {
        width: 100%;
    }

    .section.app .other-products .item {
        background: url(/public-sprite.png) no-repeat;
        display: inline-block;
        margin: 0 10px;
        vertical-align: bottom;
    }


        .section.app .other-products .item.aparat {
            background-position: 0 -213px;
            width: 142px;
            height: 50px;
        }

        .section.app .other-products .item.filimo {
            background-position: -137px -167px;
            width: 117px;
            height: 42px;
        }

        .section.app .other-products .item.lenzor {
            background-position: -6px -164px;
            width: 109px;
            height: 42px;
        }

        .section.app .other-products .item.cloob {
            background-position: -8px -113px;
            width: 175px;
            height: 39px;
        }

        .section.app .other-products .item.mihanblog {
            background-position: -223px -77px;
            width: 125px;
            height: 76px;
        }

        .section.app .other-products .item.sabavision {
            background-position: -6px -68px;
            width: 194px;
            height: 33px;
        }


.page-wrap footer.footer {
    position: absolute;
    background-color: #000;
    color: #fff;
    width: 100%;
    padding: 20px 50px;
    left: 0;
    bottom: 0;
    font-size: 13px;
    line-height: 20px;
    z-index: 100;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

    .page-wrap footer.footer a.page-to-top {
        width: 50px;
        height: 50px;
        border-radius: 25px;
        background-color: #000;
        position: absolute;
        left: 50%;
        bottom: 20px;
        border: 2px solid #fff;
        margin-left: -25px;
        background: url('sprite.png') no-repeat -196px -715px #000;
    }

.page-wrap.home footer.footer {
    position: absolute;
}

.page-wrap footer.footer::after {
    content: "";
    display: block;
    clear: both;
}

.page-wrap .footer .copy {
    float: right;
    text-align: right;
}

    .page-wrap .footer .copy p span {
        font-size: 24px;
    }

    .page-wrap .footer .copy ul li {
        display: inline-block;
        height: 20px;
        border-left: 1px solid #51bbe7;
        padding: 0 5px;
    }

        .page-wrap .footer .copy ul li a {
            color: #51bbe7;
            -webkit-transition: all 0.3s;
            -o-transition: all 0.3s;
            transition: all 0.3s;
        }

            .page-wrap .footer .copy ul li a:hover {
                color: #449cc2;
            }

        .page-wrap .footer .copy ul li:first-child {
            padding-right: 0;
        }

        .page-wrap .footer .copy ul li:last-child {
            border: none;
        }

.page-wrap .footer .sign {
    text-align: left;
    vertical-align: top;
    display: inline-block;
    float: left;
    direction: ltr;
}

    .page-wrap .footer .sign p {
        font-size: 15px;
        line-height: 22px;
    }

    .page-wrap .footer .sign span,
    .page-wrap .footer .sign span a {
        color: #c2c2c2;
    }


.home .intro .bg .image {
    background: url('/intro-home.jpg') center no-repeat;
    left: 0;
    top: 0;
    -webkit-background-size: cover;
    background-size: cover;
    margin: 0;
}

.home .intro::after {
    height: 80%;
    background: -webkit-linear-gradient(bottom,rgba(0,0,0,0.7),transparent);
    background: -o-linear-gradient(top,rgba(0,0,0,0.7),transparent);
    background: -moz-linear-gradient(top,rgba(0,0,0,0.7),transparent);
    background: linear-gradient(to top,rgba(0,0,0,0.7),transparent);
}

.home .intro .content {
    line-height: 22px;
}

    .home .intro .content h2 {
        font-size: 32px;
        line-height: 48px;
        font-weight: bold;
    }

    .home .intro .content p,
    .home .intro .content .link {
        font-size: 16px;
        line-height: 24px;
        text-align: justify;
    }


.home .about .content,
.home .story .content {
    display: table-cell;
    vertical-align: middle;
}

.home .lifestyle .content {
    text-align: right;
    padding: 0 70px 50px 0;
    position: absolute;
    width: 100%;
    bottom: 0;
    z-index: 1000;
    /*background: -webkit-linear-gradient(bottom, rgba(0,0,0,.6) 10%, transparent 100%);*/
}

.home .lifestyle .pagination {
    left: 50px;
    bottom: 50px;
    position: absolute;
    z-index: 1000;
}


.lenzor .section {
    background-color: #4bc0d1;
}

.lenzor .intro .content h2.image {
    background: url('/lenzor-logo.png') no-repeat; /*lenzor logo*/
    width: 248px;
    height: 104px;
}

.lenzor .intro .bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url('/lenzor-intro-1024.png') center center no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}

.lenzor .intro::after {
    background: -webkit-linear-gradient(bottom,rgba(0,0,0,0.5),transparent 100%);
    background: -o-linear-gradient(top,rgba(0,0,0,0.5),transparent 100%);
    background: -moz-linear-gradient(top,rgba(0,0,0,0.5),transparent 100%);
    background: linear-gradient(to top,rgba(0,0,0,0.5),transparent 100%);
}

.lenzor .intro .footer .image {
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 0;
}

    .lenzor .intro .footer .image img {
        width: 100%;
        display: block;
    }

.lenzor .about .header .menu-btn,
.lenzor .about .header .menu-btn::after,
.lenzor .about .header .menu-btn::before {
    background-color: #e5e5e5;
}

.lenzor .about .content .logo {
    background: url('/lenzor-logo-color.png') no-repeat; /*lenzor colored logo*/
    width: 253px;
    height: 98px;
}

.lenzor .about .content .camera {
    background: url('/lenzor-sprite.png') no-repeat; /*camera icon*/
    background-position: -406px 0;
    width: 84px;
    height: 69px;
}

.lenzor .specs .header .menu-btn,
.lenzor .specs .header .menu-btn::after,
.lenzor .specs .header .menu-btn::before {
    background-color: #e5e5e5;
}

.lenzor .specs .content .title {
    background-color: #4abecf;
}

.lenzor .specs .content .item .image {
    background: url(/lenzor-sprite.png) no-repeat;
}

.lenzor .specs .content .item:nth-child(1) .image {
    background-position: -74px -51px;
    width: 58px;
    height: 44px;
}

.lenzor .specs .content .item:nth-child(2) .image {
    background-position: 0 0;
    width: 58px;
    height: 44px;
}

.lenzor .specs .content .item:nth-child(3) .image {
    background-position: -73px 0;
    width: 58px;
    height: 44px;
}

.lenzor .specs .content .item:nth-child(4) .image {
    background-position: -2px -51px;
    width: 58px;
    height: 44px;
}

.lenzor .about .content .item .image {
    background: url('/lenzor-sprite--2.png') no-repeat;
    display: block;
    margin: 0 auto;
}

.lenzor .about .content .item:nth-child(1) .image {
    background-position: -496px -16px;
    width: 104px;
    height: 109px;
}

.lenzor .about .content .item:nth-child(2) .image {
    background-position: -361pX -19px;
    width: 103px;
    height: 103px;
}

.lenzor .about .content .item:nth-child(3) .image {
    background-position: -237pX -17px;
    width: 104px;
    height: 103px;
}

.lenzor .about .content .item:nth-child(4) .image {
    background-position: -114pX -16px;
    width: 103px;
    height: 103px;
}


.lenzor .about .content .item .title {
    color: #4bc0d1;
}

.lenzor .about .content .item .info {
    color: #b7b7b7;
}




.lenzor .section.app .detail .col-12.right h4 {
    color: #4bc3d4;
}


.aparat .main-nav {
    background-color: rgba(237,20,91,0.9);
}

.aparat .section {
    background-color: #ed145a;
}

.aparat .intro::after {
    background: -webkit-linear-gradient(bottom,#ed145a,transparent);
    background: -o-linear-gradient(top,#ed145a,transparent);
    background: -moz-linear-gradient(top,#ed145a,transparent);
    background: linear-gradient(to top,#ed145a,transparent);
}

.aparat .intro .bg {
    background: url('/intro-aparat-1024.jpg') center no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    margin: 0;
}

.aparat .intro .content h2.image {
    background: url('/aparat-logo.png') no-repeat; /*aparat logo*/
    width: 342px;
    height: 104px;
}

.aparat .intro .footer .image {
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 0;
}

    .aparat .intro .footer .image img {
        width: 100%;
        display: block;
    }




.aparat .about .header .menu-btn,
.aparat .about .header .menu-btn::after,
.aparat .about .header .menu-btn::before {
    background-color: #e5e5e5;
}

.aparat .about .content .logo {
    background: url('/aparat-logo-color.png') no-repeat; /*aparat colored logo*/
    width: 269px;
    height: 81px;
}

.aparat .about .content .item .image {
    background: url('/aparat-sprite.png') no-repeat;
    display: block;
    margin: 0 auto;
}

.aparat .about .content .item:nth-child(1) .image {
    background-position: -491px -105px;
    width: 104px;
    height: 109px;
}

.aparat .about .content .item:nth-child(2) .image {
    background-position: -237px -203px;
    width: 103px;
    height: 103px;
}

.aparat .about .content .item:nth-child(4) .image {
    background-position: -484px -446px;
    width: 104px;
    height: 103px;
}

.aparat .about .content .item:nth-child(3) .image {
    background-position: -353px -209px;
    width: 103px;
    height: 103px;
}

.aparat .about .content .item:nth-child(5) .image {
    background-position: -484px -446px;
    width: 103px;
    height: 103px;
}

.aparat .about .content .item .title {
    color: #ed145a;
}

.aparat .about .content .item .info {
    color: #b7b7b7;
}



.aparat .specs .header .menu-btn,
.aparat .specs .header .menu-btn::after,
.aparat .specs .header .menu-btn::before {
    background-color: #e5e5e5;
}

.aparat .specs .content .title {
    background-color: #e91457;
}

.aparat .specs .content .item .image {
    background: url('/aparat-sprite.png') no-repeat;
}

.aparat .specs .content .item:nth-child(1) .image {
    background-position: 0 -125px;
    width: 73px;
    height: 59px;
}

.aparat .specs .content .item:nth-child(2) .image {
    background-position: -91px -125px;
    width: 65px;
    height: 68px;
}

.aparat .specs .content .item:nth-child(3) .image {
    background-position: -169px -125px;
    width: 67px;
    height: 67px;
}

.aparat .specs .content .item:nth-child(4) .image {
    background-position: -253px -121px;
    width: 60px;
    height: 68px;
}

.aparat .specs .content .item:nth-child(5) .image {
    background-position: -334px -127px;
    width: 67px;
    height: 59px;
}

.aparat .specs .content .item:nth-child(6) .image {
    background-position: -426px -115px;
    width: 48px;
    height: 67px;
}




.aparat .children .header .menu-btn,
.aparat .children .header .menu-btn::after,
.aparat .children .header .menu-btn::before {
    background-color: #e5e5e5;
}

.aparat .children .content .title {
    background-color: #e91457;
}

.aparat .children .content .item .image {
    background: url(/aparat-sprite.png) no-repeat;
}

.aparat .children .content .item:nth-child(1) .image {
    background-position: -127px -225px;
    width: 73px;
    height: 59px;
}

.aparat .children .content .item:nth-child(2) .image {
    background-position: -266px -357px;
    width: 65px;
    height: 68px;
}

.aparat .children .content .item:nth-child(3) .image {
    background-position: -497px -357px;
    width: 67px;
    height: 67px;
}

.aparat .children .content .item:nth-child(4) .image {
    background-position: -386px -357px;
    width: 60px;
    height: 68px;
}

.aparat .children .content .item:nth-child(5) .image {
    background-position: -150px -359px;
    width: 67px;
    height: 59px;
}

.aparat .children .content .item:nth-child(6) .image {
    background-position: -41px -227px;
    width: 48px;
    height: 67px;
}


.aparat .children .header .menu-btn,
.aparat .children .header .menu-btn::after,
.aparat .children .header .menu-btn::before {
    background-color: #e5e5e5;
}

/*.aparat .children .content .image{*/
/*background: url(/aparat-logo-koodak.png) no-repeat;*/
/*width: 219px;*/
/*height: 85px;*/
/*margin: 10px auto*/
/*}*/
.aparat .children .content h4 {
    color: #b9b9b9;
    font-size: 26px;
    line-height: 40px;
    margin-bottom: 10px;
}

.aparat .children .content p {
    line-height: 23px;
    margin-bottom: 50px;
}

.aparat .children .content a.btn {
    position: relative;
    font-size: 18px;
    line-height: 20px;
    height: 20px;
    color: #afafaf;
    padding: 0px 40px 3px 20px;
    border-radius: 4px;
    border: 1px solid #afafaf;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

    .aparat .children .content a.btn:hover {
        background-color: rgba(0,0,0,0.2);
        color: #fff;
    }

    .aparat .children .content a.btn::after {
        content: "";
        position: absolute;
        right: 3px;
        top: 55%;
        margin-top: -15px;
        background: url('/public-sprite.png') no-repeat; /*link icon*/
        background-position: -349px -172px;
        width: 30px;
        height: 30px;
        -webkit-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

    .aparat .children .content a.btn:hover::after {
        -webkit-filter: brightness(20);
        filter: brightness(20);
    }

.aparat .section.slider .slide-wrap::before {
    content: none;
}

.aparat .section.app .detail .col-12.right h4 {
    color: #ed145a;
}
/*.aparat .section.app .section-wrap {height: auto !important;min-height:auto;}*/


.cloob .main-nav {
    background-color: rgba(59,170,52,0.9);
}

.cloob .section {
    background-color: #3aa935;
}

.cloob .intro::after {
    background: -webkit-linear-gradient(bottom,#3aa935,transparent);
    background: -o-linear-gradient(top,#3aa935,transparent);
    background: -moz-linear-gradient(top,#3aa935,transparent);
    background: linear-gradient(to top,#3aa935,transparent);
}

.cloob .intro .content h2.image {
    background: url('/cloob-logo.png') no-repeat; /*cloob logo*/
    width: 275px;
    height: 60px;
}

.cloob .intro .footer .image {
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 0;
}

    .cloob .intro .footer .image img {
        width: 100%;
        display: block;
    }

.cloob .intro .bg {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: url('/cloob-intro-1024.png') center no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}

.cloob .about .header .menu-btn,
.cloob .about .header .menu-btn::after,
.cloob .about .header .menu-btn::before {
    background-color: #e5e5e5;
}

.cloob .about .content .logo {
    background: url('/cloob-logo-color.png') no-repeat; /*cloob colored logo*/
    width: 268px;
    height: 59px;
    margin-top: 65px;
}

.cloob .about .content .item .image {
    background: url('/cloob-sprite.png') no-repeat;
    display: block;
    margin: 0 auto;
}

.cloob .about .content .item:nth-child(1) .image {
    background-position: -6px -137px;
    width: 104px;
    height: 103px;
}

.cloob .about .content .item:nth-child(2) .image {
    background-position: -402px 0px;
    width: 103px;
    height: 103px;
}

.cloob .about .content .item:nth-child(3) .image {
    background-position: -115px -138px;
    width: 104px;
    height: 104px;
}

.cloob .about .content .item:nth-child(4) .image {
    background-position: -228px -138px;
    width: 104px;
    height: 104px;
}

.cloob .about .content .item .title {
    color: #3aa935;
}

.cloob .about .content .item .info {
    color: #b7b7b7;
}



.cloob .specs .header .menu-btn,
.cloob .specs .header .menu-btn::after,
.cloob .specs .header .menu-btn::before {
    background-color: #e5e5e5;
}

.cloob .specs .content .title {
    background-color: #3aa935;
}

.cloob .specs .content .item .image {
    background: url('/cloob-sprite.png') no-repeat;
}

.cloob .specs .content .item:nth-child(1) .image {
    background-position: -391px -148px;
    width: 48px;
    height: 62px;
}

.cloob .specs .content .item:nth-child(2) .image {
    background-position: -334px -148px;
    width: 48px;
    height: 62px;
}

.cloob .specs .content .item:nth-child(3) .image {
    background-position: -452px -148px;
    width: 48px;
    height: 62px;
}

.cloob .section.specs .content .item {
    min-height: 210px;
    height: 210px;
    width: 375px;
    vertical-align: top;
}

.cloob .section.slider .slide-wrap::before {
    content: none;
}

/*.cloob .section.app {height: auto !important; min-height: auto;}*/

.cloob .section.app .detail .col-12.right h4 {
    color: #3aa935;
}

.cloob .specs .content.pattern2 .item .des {
    margin-right: 65px;
}

.filimo .main-nav {
    background-color: rgba(249,185,0,0.9);
}

.filimo .section {
    background-color: #faba00;
}

.filimo .intro::after {
    background: -webkit-linear-gradient(bottom,#faba00,transparent);
    background: -o-linear-gradient(top,#faba00,transparent);
    background: -moz-linear-gradient(top,#faba00,transparent);
    background: linear-gradient(to top,#faba00,transparent);
}

.filimo .intro .content .image {
    background: url('/filimo-logo.png') no-repeat; /*filimo logo*/
    width: 306px;
    height: 143px;
}

.filimo .intro .footer .image {
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 0;
}

    .filimo .intro .footer .image img {
        width: 100%;
        display: block;
    }

.filimo .intro .bg {
    background: url('/filimo-intro-1024.jpg') center no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    margin: 0;
}

.filimo .about .header .menu-btn,
.filimo .about .header .menu-btn::after,
.filimo .about .header .menu-btn::before {
    background-color: #e5e5e5;
}

.filimo .about .content .logo {
    background: url('/filimo-logo-color.png') no-repeat; /*filimo colored logo*/
    width: 253px;
    height: 107px;
}

.filimo .about .content .copyright {
    position: relative;
    font-size: 20px;
    line-height: 30px;
    display: inline-block;
    color: #b2b2b2;
    border-radius: 15px;
    border: 2px dashed #b2b2b2;
    padding: 8px 60px 10px 10px;
    margin-top: 20px;
}

    .filimo .about .content .copyright::after {
        content: "";
        position: absolute;
        background: url('/filimo-sprite.png') no-repeat;
        background-position: -316px -54px;
        width: 39px;
        height: 36px;
        right: 10px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

.filimo .specs .header .menu-btn,
.filimo .specs .header .menu-btn::after,
.filimo .specs .header .menu-btn::before {
    background-color: #e5e5e5;
}

.filimo .specs .content .title {
    background-color: #faba00;
}

.filimo .section.specs .content .item {
    min-height: 170px;
    height: 235px;
    vertical-align: top;
    margin-bottom: 10px;
    padding: 20px;
}

.filimo .specs .content .item .image {
    background: url('/filimo-sprite.png') no-repeat;
}

.filimo .specs .content .item:nth-child(1) .image {
    background-position: -4px -107px;
    width: 56px;
    height: 48px;
}

.filimo .specs .content .item:nth-child(2) .image {
    background-position: -68px -115px;
    width: 52px;
    height: 50px;
}

.filimo .specs .content .item:nth-child(3) .image {
    background-position: -132px -114px;
    width: 52px;
    height: 51px;
}

.filimo .specs .content .item:nth-child(4) .image {
    background-position: -194px -114px;
    width: 44px;
    height: 48px;
}

.filimo .specs .content .item:nth-child(5) .image {
    background-position: -251px -117px;
    width: 44px;
    height: 43px;
}

.filimo .specs .content .item:nth-child(6) .image {
    background-position: -310px -115px;
    width: 47px;
    height: 46px;
}


.filimo .section.app .detail .col-12.right h4 {
    color: #faba00;
}

.filimo .about .content .item .image {
    background: url('/filimo-sprite.png') no-repeat;
    display: block;
    margin: 0 auto;
}

.filimo .about .content .item:nth-child(1) .image {
    background-position: -329px -208px;
    width: 104px;
    height: 103px;
}

.filimo .about .content .item:nth-child(2) .image {
    background-position: -364px -91px;
    width: 103px;
    height: 103px;
}

.filimo .about .content .item:nth-child(3) .image {
    background-position: -364px 12px;
    width: 104px;
    height: 104px;
}

.filimo .about .content .item .title {
    color: #faba00;
}

.filimo .about .content .item .info {
    color: #b7b7b7;
}




.mihanblog .main-nav {
    background-color: rgba(0,139,206,0.9);
}

.mihanblog .section {
    background-color: #008bcf;
}

.mihanblog .intro::after {
    background: -webkit-linear-gradient(bottom,#008bcf,transparent);
    background: -o-linear-gradient(top,#008bcf,transparent);
    background: -moz-linear-gradient(top,#008bcf,transparent);
    background: linear-gradient(to top,#008bcf,transparent);
}

.mihanblog .intro .content h2.image {
    background: url('/mihan-logo.png') no-repeat; /*mihanblog logo*/
    width: 262px;
    height: 159px;
}

.mihanblog .intro .footer .image {
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 0;
}

    .mihanblog .intro .footer .image img {
        width: 100%;
        display: block;
    }

.mihanblog .intro .bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: url('/mihanblog-intro-1024.png') center no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
}

.mihanblog .about .header .menu-btn,
.mihanblog .about .header .menu-btn::after,
.mihanblog .about .header .menu-btn::before {
    background-color: #e5e5e5;
}

.mihanblog .about .content .logo {
    background: url('/mihan-logo-color.png') no-repeat; /*mihanblog colored logo*/
    width: 255px;
    height: 155px;
}

.mihanblog .about .content .item .image {
    background: url('/mihanblog-sprite.png') no-repeat;
    display: block;
    margin: 0 auto;
    margin-top: 40px;
}

.mihanblog .about .content .item:nth-child(1) .image {
    background-position: -23px -3px;
    width: 103px;
    height: 103px;
}

.mihanblog .about .content .item:nth-child(2) .image {
    background-position: -381px 0px;
    width: 103px;
    height: 103px;
}

.mihanblog .about .content .item:nth-child(3) .image {
    background-position: -268px -1px;
    width: 103px;
    height: 103px;
}

.mihanblog .about .content .item:nth-child(4) .image {
    background-position: -24px -112px;
    width: 103px;
    height: 103px;
}

.mihanblog .about .content .item:nth-child(5) .image {
    background-position: -20px -217px;
    width: 103px;
    height: 103px;
}


.mihanblog .about .content .item .title {
    color: #008bcf;
}

.mihanblog .about .content .item .info {
    color: #b7b7b7;
}


.mihanblog .specs .content {
    width: 700px;
}

.mihanblog .specs .header .menu-btn,
.mihanblog .specs .header .menu-btn::after,
.mihanblog .specs .header .menu-btn::before {
    background-color: #e5e5e5;
}

.mihanblog .specs .content .title {
    background-color: #008bcf;
}


/*.mihanblog .section.app .section-wrap{border-bottom: 2px solid #008bcf;}*/
.mihanblog .section.app .detail .col-12.right h4 {
    color: #008bcf;
}






.sabavision .main-nav {
    background-color: rgba(0,167,109,0.9);
}

.sabavision .section {
    background-color: #00a86d;
}

.sabavision .intro::after {
    background: -webkit-linear-gradient(bottom,#00a86d,transparent);
    background: -o-linear-gradient(top,#00a86d,transparent);
    background: -moz-linear-gradient(top,#00a86d,transparent);
    background: linear-gradient(to top,#00a86d,transparent);
}

.sabavision .intro .content h2.image {
    background: url('/saba-logo.png') no-repeat; /*sabavision logo*/
    width: 341px;
    height: 55px;
}

.sabavision .intro .footer .image {
    width: 100%;
    height: auto;
    position: absolute;
    bottom: 0;
}

    .sabavision .intro .footer .image img {
        width: 100%;
        display: block;
    }

.sabavision .intro .bg {
    background: url('/sabavision-intro-1024.jpg') center no-repeat;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-background-size: cover;
    background-size: cover;
}

.sabavision .about .header .menu-btn,
.sabavision .about .header .menu-btn::after,
.sabavision .about .header .menu-btn::before {
    background-color: #e5e5e5;
}

.sabavision .about .content {
    width: 800px;
}

    .sabavision .about .content .logo {
        background: url('/saba-logo-color.png') no-repeat; /*sabavision colored logo*/
        width: 268px;
        height: 44px;
    }

    .sabavision .about .content .wrap {
        width: 100%;
        margin: 20px 0;
    }

        .sabavision .about .content .wrap .item {
            display: inline-block;
            background: url('/sabavision-sprite.png') no-repeat;
            margin: 0 10px;
            vertical-align: bottom;
            text-indent: -9999px;
        }



.sabavision .content .pattern1 {
    display: block;
    width: 102%;
    margin: 20px 0 0 0;
}

    .sabavision .content .pattern1 .item {
        display: inline-block;
        margin: 0 20px;
    }

        .sabavision .content .pattern1 .item span {
            display: block;
        }

        .sabavision .content .pattern1 .item .title {
            font-size: 24px;
            line-height: 36px;
            color: #00a86d;
        }

        .sabavision .content .pattern1 .item .info {
            font-size: 16px;
            line-height: 24px;
            color: #b7b7b7;
        }

.sabavision .about .content .item .image {
    background: url('/sabavision-sprite.png') no-repeat;
    display: block;
    margin: 0 auto;
}

.sabavision .about .content .item:nth-child(1) .image {
    background-position: -565px -235px;
    width: 104px;
    height: 109px;
}

.sabavision .about .content .item:nth-child(2) .image {
    background-position: -308px -240px;
    width: 103px;
    height: 103px;
}

.sabavision .about .content .item:nth-child(3) .image {
    background-position: -437px -240px;
    width: 104px;
    height: 103px;
}

.sabavision .about .content .item:nth-child(4) .image {
    background-position: -185px -245px;
    width: 103px;
    height: 103px;
}



.sabavision .about .content .wrap .aparat {
    background-position: -1px 0;
    width: 185px;
    height: 56px;
}

.sabavision .about .content .wrap .cloob {
    background-position: 0 -87px;
    width: 235px;
    height: 55px;
}

.sabavision .about .content .wrap .mihanblog {
    background-position: -564px -11px;
    width: 204px;
    height: 55px;
}
/*.sabavision .about .content .info{*/
/*display: inline-block;*/
/*color: #fff;*/
/*font-size: 16px;*/
/*line-height: 25px;*/
/*padding: 5px 40px 10px;*/
/*background-color: #00a86d;*/
/*border-radius: 20px;*/
/*margin-top: 10px;*/
/*}*/



.sabavision .specs .header .menu-btn,
.sabavision .specs .header .menu-btn::after,
.sabavision .specs .header .menu-btn::before {
    background-color: #e5e5e5;
}

.sabavision .specs .content .title {
    background-color: #00a86d;
}

.sabavision .section.specs .content .item {
    height: 170px;
    width: 250px;
    vertical-align: middle;
    margin-bottom: 10px;
    padding: 20px;
}

.sabavision .specs .content .item .image {
    background: url('/sabavision-sprite.png') no-repeat;
    background-color: white;
}

.sabavision .specs .content .item:nth-child(1) .image {
    background-position: -312px 0;
    width: 56px;
    height: 48px;
}

.sabavision .specs .content .item:nth-child(2) .image {
    background-position: -471px -12px;
    width: 52px;
    height: 50px;
}

.sabavision .specs .content .item:nth-child(3) .image {
    background-position: -471px -85px;
    width: 52px;
    height: 51px;
}

.sabavision .specs .content .item:nth-child(4) .image {
    background-position: -387px -90px;
    width: 44px;
    height: 48px;
}

.sabavision .specs .content .item:nth-child(5) .image {
    background-position: -386px -3px;
    width: 44px;
    height: 43px;
}

.sabavision .specs .content .item:nth-child(6) .image {
    background-position: -296px -87px;
    width: 47px;
    height: 46px;
}

.sabavision .specs .content .item:nth-child(7) .image {
    background-position: -627px -87px;
    width: 47px;
    height: 46px;
}

.sabavision .specs .content .item:nth-child(8) .image {
    background-position: -547px -87px;
    width: 47px;
    height: 46px;
}

.sabavision .specs .content .info {
    position: relative;
    width: 780px;
    margin: 0 auto;
    text-align: right;
    background-color: #e0e0e0;
    color: #000;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 25px 100px 25px 25px;
    border-radius: 15px;
}

    .sabavision .specs .content .info h5 {
        font-size: 16px;
        line-height: 24px;
        font-weight: bold;
    }

    .sabavision .specs .content .info p {
        line-height: 18px;
    }

    .sabavision .specs .content .info::after {
        content: "";
        position: absolute;
        right: 25px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        background: url('/sabavision-sprite.png') no-repeat;
        background-position: -233px -5px;
        width: 49px;
        height: 46px;
    }


.sabavision .customers .header .menu-btn,
.sabavision .customers .header .menu-btn::after,
.sabavision .customers .header .menu-btn::before {
    background-color: #e5e5e5;
}

.sabavision .customers .content h4 {
    display: inline-block;
    color: #fff;
    background-color: #00a86d;
    padding: 5px 40px 10px;
    font-size: 26px;
    height: 46px;
    line-height: 30px;
    border-radius: 23px;
    margin-bottom: 10px;
    font-weight: bold;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.sabavision .customers .content p {
    color: #b9b9b9;
    font-size: 16px;
    line-height: 24px;
}

.sabavision .customers .slide-wrap {
}

.sabavision .customers .slides {
    margin: 20px 0;
    position: relative;
    height: 500px;
}

    .sabavision .customers .slides .item {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        -webkit-transition: all 1s;
        -o-transition: all 1s;
        transition: all 1s;
    }

        .sabavision .customers .slides .item.active {
            opacity: 1;
            z-index: 5;
        }

.sabavision .section-wrap .content {
    /*width: 960px;*/
}

.sabavision .stack {
    display: none;
}

.sabavision .customers .slides .item .icon {
    display: inline-block;
    margin: 5px 40px;
    width: 70px;
    height: auto;
    opacity: 0.9;
    /*-webkit-filter:grayscale(1);*/
    /*filter:grayscale(1);*/
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

    .sabavision .customers .slides .item .icon img {
        width: 100%;
        height: auto;
    }

    .sabavision .customers .slides .item .icon:hover {
        -webkit-filter: grayscale(0);
        filter: grayscale(0);
        opacity: 1;
    }

.sabavision .customers .slide-bullets {
    margin: 10px 0;
}

    .sabavision .customers .slide-bullets .item {
        display: inline-block;
        margin: 0 7px;
        width: 18px;
        height: 18px;
        border-radius: 9px;
        border: 1px solid #d2d2d2;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
        cursor: pointer;
    }

        .sabavision .customers .slide-bullets .item:hover,
        .sabavision .customers .slide-bullets .item.active {
            background-color: #00a86d;
            border-color: #00a86d;
        }

.sabavision .specs .content .title {
    background-color: #00a86d;
}

.sabavision .slider .slide-wrap::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40%;
    /*z-index: 100;*/
    background: -webkit-linear-gradient(bottom,rgba(0,0,0,0.7),transparent);
    background: -o-linear-gradient(top,rgba(0,0,0,0.7),transparent);
    background: -moz-linear-gradient(top,rgba(0,0,0,0.7),transparent);
    background: linear-gradient(to top,rgba(0,0,0,0.7),transparent);
}

/*.sabavision .section.app .section-wrap{border-bottom: 2px solid #00a86d;}*/
.sabavision .section.app .detail .col-12.right h4 {
    color: #00a86d;
}
/*.sabavision .section.app {height:  auto !important; min-height: auto;}

.section.app {height:  auto !important; min-height: auto;}*/



.home .section.contact .content {
    margin-top: 30px;
}






/*
=============================================
***************** Jobs Page *****************
=============================================
*/



/********** Jobs: Section 1 ********* */

.jobs .intro .bg {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-background-size: cover;
    background-size: cover;
}

.jobs .intro .content {
    bottom: 40px;
    width: 700px;
    line-height: 28px;
    text-align: justify;
}

    .jobs .intro .content h2 {
        font-size: 30px;
    }


/********** Jobs: Section 2 ********* */

.jobs .coop-us {
    text-align: center;
}

    .jobs .coop-us::after {
        content: "";
        display: inline-block;
        vertical-align: middle;
        width: 1px;
        height: 100%;
    }

    .jobs .coop-us .header .lang {
        color: #000;
    }

        .jobs .coop-us .header .lang::after {
            -webkit-filter: invert(1);
            filter: invert(1);
        }

    .jobs .coop-us .header .menu-btn,
    .jobs .coop-us .header .menu-btn::after,
    .jobs .coop-us .header .menu-btn::before {
        background-color: #ccc;
    }

    /*.jobs .coop-us .general-info a{
  color: #000;
  border: 2px solid #000;
}*/

    .jobs .coop-us .content {
        display: inline-block;
        vertical-align: middle;
        width: 700px;
        margin: 0 auto;
    }

        .jobs .coop-us .content h3 {
            font-size: 26px;
            color: #25aae5;
            margin-bottom: 20px;
        }

        .jobs .coop-us .content .info {
            line-height: 23px;
        }

/********** Jobs: Section 3 ********* */

.jobs .join-team {
    text-align: center;
}

    .jobs .join-team::after {
        content: "";
        display: inline-block;
        vertical-align: middle;
        width: 1px;
        height: 100%;
    }

    .jobs .join-team .header .menu-btn,
    .jobs .join-team .header .menu-btn::after,
    .jobs .join-team .header .menu-btn::before {
        background-color: #ccc;
    }

    .jobs .join-team .content {
        display: inline-block;
        vertical-align: middle;
    }

        .jobs .join-team .content h3 {
            display: inline-block;
            color: #fff;
            background-color: #25aae5;
            font-size: 22px;
            height: 46px;
            border-radius: 23px;
            margin: 30px 0;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            padding: 10px 19px 10px;
        }

        .jobs .join-team .content .wrap {
            width: 100%;
        }

        .jobs .join-team .content .item {
            display: inline-block;
            vertical-align: top;
            text-align: center;
            border-radius: 15px;
            border: 2px solid #cecfce;
            width: 235px;
            margin: 0 5px 10px;
            padding: 20px;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            height: 170px;
        }

        .jobs .join-team .content .image {
            display: inline-block;
            margin-bottom: 5px;
            background: url('/jobs-sprite.png') no-repeat;
        }

        .jobs .join-team .content .item.time .image {
            width: 55px;
            height: 55px;
            background-position: 0 0;
        }

        .jobs .join-team .content .item.envrmnt .image {
            width: 40px;
            height: 60px;
            background-position: -95px 0;
        }

        .jobs .join-team .content .item.crtve .image {
            width: 40px;
            height: 60px;
            background-position: -180px 0;
        }

        .jobs .join-team .content .item.fun .image {
            width: 60px;
            height: 45px;
            background-position: -257px 0;
        }

        .jobs .join-team .content .item.learn .image {
            width: 61px;
            height: 45px;
            background-position: -356px 0;
        }

        .jobs .join-team .content .item.frndship .image {
            width: 47px;
            height: 42px;
            background-position: -453px 0;
        }


        .jobs .join-team .content .des {
        }

            .jobs .join-team .content .des h5 {
                color: #0ca0df;
                font-size: 16px;
                margin-bottom: 5px;
                line-height: 1.5;
            }

            .jobs .join-team .content .des p {
                color: #c0c0c0;
                line-height: 1.3;
            }

/********** Jobs: Section 4 ********* */

.jobs .evir .slider {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

    .jobs .evir .slider .item {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-repeat: no-repeat;
        background-size: cover;
        opacity: 0;
        z-index: 1;
        visibility: hidden;
        -webkit-transition: all 1s;
        -o-transition: all 1s;
        transition: all 1s;
    }

        .jobs .evir .slider .item.active {
            opacity: 1;
            visibility: visible;
        }

    .jobs .evir .slider img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
    }

    .jobs .evir .slider .pagination {
        left: 60px;
        bottom: 50px;
        position: absolute;
        z-index: 1000;
    }

        .jobs .evir .slider .pagination li {
            display: inline-block;
            width: 20px;
            height: 20px;
            border: 2px solid #f2ebe3;
            border-radius: 10px;
            margin: 3px;
            cursor: pointer;
            transition: all .5s;
        }

            .jobs .evir .slider .pagination li.active {
                background-color: #FFF;
            }
/********** Jobs: Section 5 ********* */

.jobs .join-oprts {
    background-color: #25aae3;
    /*background-color: #333;*/
    text-align: center;
}

    .jobs .join-oprts::after {
        content: "";
        width: 1px;
        height: 100%;
        display: inline-block;
        vertical-align: middle;
    }

    .jobs .join-oprts .content {
        display: inline-block;
        vertical-align: middle;
    }

    .jobs .join-oprts .wrap {
        width: 100%;
    }

    .jobs .join-oprts .content h3 {
        display: inline-block;
        color: #25aae3;
        background-color: #fff;
        font-size: 26px;
        height: 40px;
        border-radius: 20px;
        margin: 0 0 30px 0;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        padding: 7px 15px 10px;
    }

    .jobs .join-oprts .content .item {
        cursor: pointer;
        position: relative;
        display: inline-block;
        vertical-align: top;
        text-align: center;
        width: 235px;
        margin: 10px 0;
        padding: 20px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        height: 230px;
    }

        .jobs .join-oprts .content .item::after {
            content: "";
            /*position: absolute;*/
            width: 5px;
            height: 90%;
            left: 0;
            top: 50%;
            -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            transform: translateY(-50%);
            background: url('/dash-v.png');
            background-repeat: repeat-y;
        }

        .jobs .join-oprts .content .item::before {
            content: "";
            position: absolute;
            width: 90%;
            height: 5px;
            bottom: -10px;
            left: 50%;
            margin-left: -45%;
            background: url('/dash-h.png');
            background-repeat: repeat-x;
        }

        .jobs .join-oprts .content .item:hover .image {
            margin-top: 5px;
            margin-bottom: 5px;
        }

        .jobs .join-oprts .content .item:hover .des h5 {
            margin-bottom: 5px;
        }

        .jobs .join-oprts .content .item:hover .des p {
            margin-bottom: 0;
            opacity: 1;
            visibility: visible;
        }

        .jobs .join-oprts .content .item .wrapper {
            position: absolute;
            width: 90%;
            left: 50%;
            top: 50%;
            overflow: hidden;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }

        .jobs .join-oprts .content .item:nth-child(3n)::after {
            content: none;
        }

    .jobs .join-oprts .content .image {
        display: inline-block;
        margin-bottom: 20px;
        background: url('/jobs-sprite.png') no-repeat;
        -webkit-transition: all 0.5s;
        -o-transition: all 0.5s;
        transition: all 0.5s;
    }

    .jobs .join-oprts .content .item.web .image {
        width: 79px;
        height: 66px;
        background-position: 0 -93px;
    }

    .jobs .join-oprts .content .item.mobile .image {
        width: 39px;
        height: 68px;
        background-position: -122px -93px;
    }

    .jobs .join-oprts .content .item.graphic .image {
        width: 76px;
        height: 75px;
        background-position: -194px -93px;
    }

    .jobs .join-oprts .content .item.saleexpert .image {
        width: 79px;
        height: 66px;
        background-position: -316px -110px;
    }

    .jobs .join-oprts .content .item.pr .image {
        width: 79px;
        height: 66px;
        background-position: -367px -196px;
    }

    .jobs .join-oprts .content .item.business .image {
        width: 79px;
        height: 66px;
        background-position: -213px -196px;
    }

    .jobs .join-oprts .content .item.marketingexpert .image {
        width: 79px;
        height: 66px;
        background-position: -282px -196px;
    }

    .jobs .join-oprts .content .item.sell::before {
        content: none;
    }

    .jobs .join-oprts .content .item.sell .image {
        width: 80px;
        height: 79px;
        background-position: -325px -93px;
    }

    .jobs .join-oprts .content .item.ablty::before {
        content: none;
    }

    .jobs .join-oprts .content .item.ablty .image {
        width: 66px;
        height: 61px;
        background-position: 0 -200px;
    }

    .jobs .join-oprts .content .item.accnt .image {
        width: 77px;
        height: 66px;
        background-position: -115px -200px;
    }


    .jobs .join-oprts .content .des {
        color: #fff;
    }

        .jobs .join-oprts .content .des h5 {
            font-size: 16px;
            margin-bottom: 0;
            line-height: 1.5;
            -webkit-transition: all 0.5s;
            -o-transition: all 0.5s;
            transition: all 0.5s;
        }

        .jobs .join-oprts .content .des p {
            line-height: 1.3;
            height: 140px;
            margin-bottom: -110px;
            opacity: 0;
            visibility: hidden;
            -webkit-transition: all 0.5s;
            -o-transition: all 0.5s;
            transition: all 0.5s;
        }

.more_btn {
    color: #25aae3;
    font-size: 15px;
    font-family: custom;
    padding: 2px 6px;
    /* line-height: 34px; */
    background-color: #ffffff !important;
    border-radius: 4px;
    cursor: pointer;
    text-decoration: none !important;
}

/********** Jobs: Section 6 ********* */

.jobs .resume {
    min-height: 1px;
    height: auto !important;
    background-color: #fff;
    text-align: center;
}

    .jobs .resume::after {
        /*content: "";
    width: 1px;
    height: 100%;
    display: inline-block;
    vertical-align: middle;*/
    }

    .jobs .resume .content {
        display: inline-block;
        margin: 60px 0;
    }

        .jobs .resume .content p {
            color: #c0c0c0;
            margin-bottom: 40px;
            line-height: 22px;
        }

.send-resume {
    font-size: 16px;
    background-color: #25aae3 !important;
    color: #fff !important;
    height: 50px;
    width: 330px;
    line-height: 50px;
    padding: 0 50px 0 20px;
    text-align: center;
    display: inline-block;
    position: relative;
    border-radius: 30px;
    opacity: .9;
    text-decoration: none !important;
    -webkit-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

    .send-resume a {
    }

    .send-resume:hover {
        opacity: 1;
    }

    .send-resume:before {
        content: "";
        width: 40px;
        height: 40px;
        position: absolute;
        right: 20px;
        top: 10px;
        background: url('/icon-mail.png') no-repeat 0 0;
    }

.jobs .resume .footer {
    position: static;
}

/********** lightbox ********* */

.lightbox.video {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    z-index: 1000;
    display: none;
    opacity: 1;
    visibility: visible;
    background: transparent;
    -webkit-transition: none;
    -o-transition: none;
    transition: none;
}

    .lightbox.video .content {
        display: block;
        padding: 0;
    }

    .lightbox.video .bg {
        content: "";
        width: 100%;
        height: 100%;
        position: fixed;
        left: 0;
        top: 0;
        background: #000;
        z-index: 110;
        opacity: .8;
    }

    .lightbox.video .content .close {
        width: 30px;
        height: 30px;
        position: absolute;
        z-index: 140;
        background: #000;
        cursor: pointer;
        border-radius: 25px;
        -moz-border-radius: 25px;
        -webkit-border-radius: 25px;
        -ms-border-radius: 25px;
        left: -15px;
        top: -15px;
    }

    .lightbox.video .content {
        position: fixed;
        left: 50%;
        top: 50%;
        width: 640px;
        height: 360px;
        margin: -180px 0 0 -320px;
        z-index: 120;
        background-color: #333;
    }

        .lightbox.video .content iframe {
            border: none;
            display: none;
        }

/*story*/

.story .intro .bg .image {
    background-position: center;
    -webkit-background-size: cover;
    background-size: cover;
}

.storysec {
    padding: 0;
}

.storyholder {
    background-color: #FFF;
}

.storywrap {
    margin: auto;
    height: 18800px;
    max-width: 1100px;
    padding: 80px 0;
    background-position: center;
    background-repeat: repeat-y;
    background-image: url('/story_bg.png');
}

.l_img {
    margin-right: 20%;
}

.r_img {
    margin-left: 20%;
}

.righ_img {
    float: left;
    margin-top: 20px;
}

.story_date {
    color: #828282;
    font-size: 12px;
    font-weight: bold;
    padding: 10px;
    line-height: normal;
    /*margin: 30px -40px 0;*/
    display: inline-block;
    border-bottom: 2px solid #25AEE1;
}

.story_dscr {
    color: #A5A4A4;
    font-size: 13px;
    font-weight: 400;
    line-height: normal;
    /*margin: 30px -40px 0;*/
    display: inline-block;
    /*border-bottom: 1px solid #25AEE1;*/
}

.story_part img {
    overflow: hidden;
    border-radius: 4px;
    display: inline-block;
    background-color: #FFF;
}

.story_part.scsh img {
    /*border: 2px solid #FFF;*/
    /*box-shadow: 0 0 0 1px #DDD;*/
}

.story_part h4 {
    color: #000;
    font-size: 18px;
    /*float: right;*/
    margin-right: 20px;
    padding: 2px;
    font-weight: bold;
    /*border-radius: 4px;*/
    /*padding: 20px 0 0 0;*/
    line-height: 30px;
    /*display: inline-block;*/
    /*margin: 20px 0px 10px;*/
    /*background-color: #FFF;*/
}

.arrow {
    /*background-image: url("<?=$siteAdr?>/images/saba_story_imgs/date_bg.png");*/
    background-repeat: no-repeat;
    background-position: center;
}

.story_part h4 strong {
    font-weight: 400;
}

.story_part h2 {
    margin: 0;
    color: #FFF;
    border: none;
    display: block;
    font-size: 50px;
    font-weight: 400;
    padding: 5px 25px;
    border-radius: 4px;
    line-height: normal;
    font-family: "OpenSans";
    background-color: #25AEE1;
}

.story_part .btn {
    margin-top: 10px;
    margin-right: 20px;
}

.story_item {
    width: 470px;
    display: block;
    margin: -25px 98px;
}



    .story_item.mas_r {
        float: right;
        text-align: left;
    }


        .story_item.mas_r h2,
        .story_item.mas_r img {
            float: left;
            clear: both;
        }

        .story_item.mas_r h4 {
            /*float: left;*/
            clear: both;
            /*text-align: right;*/
        }

    .story_item.mas_l {
        float: left;
        text-align: right;
    }

        .story_item.mas_l img {
            float: right;
        }

    .story_item img {
        float: left;
    }

    .story_item.mas_r ul {
        float: left;
        margin-top: 20px;
        width: 295px;
        margin-left: 20px;
    }

        .story_item.mas_r ul li {
            text-align: center;
        }

            .story_item.mas_r ul li a {
                text-align: center;
                margin-top: 10px;
            }

    .story_item.mas_l ul {
        float: right;
        width: 350px;
        margin-left: 20px;
    }

        .story_item.mas_l ul li {
            text-align: center;
        }

            .story_item.mas_l ul li a {
                text-align: center;
                margin-top: 10px;
            }


    .story_item.mas_l h2,
    .story_item.mas_l img {
        float: right;
        clear: both;
        margin-bottom: 25px;
    }


/*.left_list ul{*/
/*float: right;*/
/*margin-right: 100px;*/
/*}*/
/*.left_list div{*/
/*float: right;*/
/*background-image: url("http://localhost/git/sabaideaplus/images/saba_story_imgs/date_bg.png");*/
/*background-repeat: no-repeat;*/
/*}*/

.whitebg {
    background-color: rgba(255,255,255,1);
}

.btn {
    color: #FFF;
    font-size: 15px;
    cursor: pointer;
    font-weight: 400;
    padding: 5px 15px;
    border-radius: 4px;
    line-height: normal;
    display: inline-block;
    /*background-color: #555;*/
    font-family: "IRANSans";
    /*box-shadow: 0 1px 0 0 #FFF;*/
    text-shadow: 0 -1px 0 rgba(0,0,0,.2);
    transition: background-color .2s ease-in-out, box-shadow .2s ease-in-out;
    -moz-transition: background-color .2s ease-in-out, box-shadow .2s ease-in-out;
    -webkit-transition: background-color .2s ease-in-out, box-shadow .2s ease-in-out;
}

.button {
    color: #2DB3DD;
    font-size: 15px;
    /*cursor: pointer;*/
    font-weight: 400;
    padding: 5px 15px;
    border: 1px dashed #ABA9A9;
    border-radius: 4px;
    line-height: normal;
    display: inline-block;
    /*background-color: #555;*/
    /*font-family: "IRANSans";*/
    /*box-shadow: 0 1px 0 0 #FFF;*/
    text-shadow: 0 -1px 0 rgba(0,0,0,.2);
    transition: background-color .2s ease-in-out, box-shadow .2s ease-in-out;
    -moz-transition: background-color .2s ease-in-out, box-shadow .2s ease-in-out;
    -webkit-transition: background-color .2s ease-in-out, box-shadow .2s ease-in-out;
}
/*******************/

.whitebg {
    background-color: rgba(255,255,255,1);
}

.greybg {
    background-color: rgba(255,255,255,.6);
}

.bluebg {
    /*background-image: url("images/bg-blue.png");*/
}

.slide section {
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    /*background-color: rgba(0,0,0,.3);*/
}

.slide h2,
.slide p {
    color: #FFF;
    /*font-size: 30px;*/
    text-shadow: none;
}

.slide section img {
    width: 70%;
    padding-right: 0;
}

.prods {
    padding: 20px 0;
    text-align: center;
}

    .prods li {
        display: inline-block;
    }

.prods_logo {
    width: 200px;
    margin: 10px;
    height: 200px;
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center center;
}

    .prods_logo.home {
        background-size: 100%;
        transition: background .2s ease-in-out, margin .2s ease-in-out;
        -moz-transition: background .2s ease-in-out, margin .2s ease-in-out;
        -webkit-transition: background .2s ease-in-out, margin .2s ease-in-out;
    }

    .prods_logo.large {
        width: 100%;
        width: 300px;
        margin: auto;
        height: 160px;
        display: block;
        background-size: 100%;
    }

.home-about a {
    margin: 5px;
}

.prod_sec h2 {
    padding: 0;
    font-size: 26px;
}

    .prod_sec h2 span {
        padding: 0;
        border: none;
    }

.prods_intro .prod_intro_info {
    clear: both;
    margin: auto;
    display: block;
    text-align: center;
    width: 85%;
}

    .prods_intro .prod_intro_info p {
        text-align: justify;
    }

    .prods_intro .prod_intro_info img {
        width: 200px;
        height: auto;
        vertical-align: middle;
    }

    .prods_intro .prod_intro_info h4 {
        color: #25aae1;
        font-size: 20px;
        line-height: 28px;
    }

    .prods_intro .prod_intro_info h1 {
        display: block;
    }

    .prods_intro .prod_intro_info h4 a {
        color: #25aae1;
        font-size: 20px;
        line-height: 28px;
    }

    .prods_intro .prod_intro_info .btn {
        color: #25aae1;
    }

    .prods_intro .prod_intro_info .table-info {
        margin: 0 auto 20px;
    }

    .prods_intro .prod_intro_info .table-part {
        padding: 10px;
    }

    .prods_intro .prod_intro_info a {
        margin: 10px 2px;
    }
/* ==========================================================================
footer section
========================================================================== */


/* ==========================================================================
contact section
========================================================================== */
#contact1 {
    background: url('../img/contact-bg.jpg') no-repeat;
    padding-bottom: 20px;
    background-position: center;
    background-size: cover;
    height: auto;
    color: white;
    width: 100%;
    padding-top: 140px;
    background-attachment: fixed;
}

    #contact1 a {
        text-decoration: none;
        color: #1b6d85;
    }

#seww p .fa {
    color: #00c6d7;
}

input {
    color: #ffffff !important;
    background: none !important;
}

textarea {
    background: none !important;
    color: #ffffff !important;
}

.form-group label {
    color: #FE980F;
}

#contact-page {
    color: white !important;
}

    #contact-page p {
        padding-top: 40px;
        font-size: 16px !important;
    }

/* ==========================================================================
contact section
========================================================================== */
#map img {
    padding-bottom: 20px;
}

#map p {
    padding-bottom: 40px;
}

#map {
    padding-top: 10px;
}

/* ==========================================================================
 section
========================================================================== */
.active {
    background-color: #f1c40f;
}

.goals ul li {
    display: inline-block;
    padding-left: 10px;
    position: relative;
}

    .goals ul li p {
        text-align: center !important;
        font-size: 12px !important;
    }

.values ul li {
    display: inline-block;
}

    .values ul li p {
        text-align: center !important;
        font-size: 12px !important;
    }

.vision-header p {
    text-align: center !important;
    font-size: 22px;
    color: #3c3c3c;
    margin-bottom: 27px;
}

.main h2 {
    color: #000000;
    font: 18px/40px 'IRANSans' !important;
    font-weight: bold;
}

.mission p {
    text-align: center !important;
    border-bottom: 1px ridge #d6d6d6;
    width: 55%;
    margin: 0 auto;
    padding-bottom: 20px !important;
}

.mission {
    margin-top: 10px;
    margin-bottom: 10px;
}

.vision-header {
    margin-top: 30px;
}

.main p {
    line-height: 25px !important;
}

.goals li img {
    width: 65px;
    height: 65px;
}

.values li img {
    width: 65px;
    height: 65px;
}
/*---------------------*/
.navbar-default .navbar-brand {
    color: black;
    padding: 0;
    font-size: 27px;
    line-height: 55px;
    font-weight: 600;
}

.navbar-brand a:hover {
    color: black !important;
}

/****************** NAVIGATION STYLES *************************/
/*#navigation,
.navbar-brand,
.navbar-toggle,
.navbar-nav > li > a,
.search-form > #search-sub {
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -ms-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
    color:white;

}
#navigation{
    padding-bottom: 10px;


}



.animated-nav .navigation .navbar-nav > li > a {

}



.animated-nav#navigation > .container {
    border-bottom: none;
}

.navbar-brand {
    height: inherit;
    padding-right: 30px;
    padding-left: 30px;
}

.navbar-brand a {
    display: block;
}
.navbar-brand a img{
    max-height: 51px;
}
.navbar-toggle{
    background: none !important;
    border: 1px solid white;
}
.navbar-toggle .icon-bar{
    background:white!important;
}
.navigation .navbar-nav > li > a {
    color: #fff;
    font-size: 14px;
    margin-top: 25px;
    text-transform: uppercase;
}



.animated-nav .navigation .navbar-nav > li.current > a {
    color: #fff;
    border-bottom: 1px solid #fff;
}

.navigation .navbar-nav > li > a:focus,
.navigation .navbar-nav > li > a:hover {
    background-color: transparent;
}
.navigation .navbar-nav > li > a {
    color: #fff !important;
    font-size: 14px;
    margin-top: 25px;
    text-transform: uppercase;
}
.broswer li {
    margin-right: 50px;
}
.navbar-static .navbar-toggle{
    text-align: right;
}

.navbar-static .navbar-toggle {
    background: none !important;
    text-align:left;
}
.dropdown-large {
    position: static !important;


}
.dropdown-menu-large {
    margin-left: 100px;
    margin-right: 16px;
    padding: 20px 0px;
}
.dropdown-menu-large > li > ul {
    padding: 0;
    margin: 0;
}
.dropdown-menu-large > li > ul > li {
    list-style: none;
}
.dropdown-menu-large > li > ul > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;

    line-height: 1.428571429;
    color: #333333;
    font-weight: 600;
    white-space: normal;
}
.dropdown-menu-large > li ul > li > a:hover,
.dropdown-menu-large > li ul > li > a:focus {
    text-decoration: none;
    color: #262626;
    background-color: #f5f5f5;
}
.dropdown-menu-large .disabled > a,
.dropdown-menu-large .disabled > a:hover,
.dropdown-menu-large .disabled > a:focus {
    color: #999999;
}
.dropdown-menu-large .disabled > a:hover,
.dropdown-menu-large .disabled > a:focus {
    text-decoration: none;
    background-color: transparent;
    background-image: none;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    cursor: not-allowed;
}
.dropdown-menu-large .dropdown-header {
    color: white;
    font-size: 18px;
}
@media (max-width: 768px) {
    .dropdown-menu-large {
        margin-left: 0 ;
        margin-right: 0 ;
    }
    .dropdown-menu-large > li {
        margin-bottom: 30px;
    }
    .dropdown-menu-large > li:last-child {
        margin-bottom: 0;
    }
    .dropdown-menu-large .dropdown-header {
        padding: 3px 15px !important;
    }
}
*/

.navbar-main {
    margin-bottom: 0;
    color: white;
    height: 80px !important;
}

.navbar {
    background: transparent;
    border: transparent;
}

.navbar-main .navbar-nav > li > a {
    color: #fff;
    font-size: 14px;
    line-height: 20px;
    margin-top: 15px;
    text-transform: uppercase;
    font-weight: 800;
}

.navbar .navbar-brand img {
    height: 50px;
    margin-top: 20px;
    margin-right: 30px;
}

.navbar-main a:hover,
.navbar-main a:active,
.navbar-main a:focus,
.navbar-main a.is-active {
    background: none !important;
    color: white;
}

.navbar-main .dropdown-menu li a:hover {
    color: black !important;
    /* border-bottom: 1px solid #303030; */
    text-decoration: none;
}

.nav > .dropdown.active > a:hover,
.nav > .dropdown.active > a:focus {
    cursor: pointer;
}




/*.navbar .nav li .dropdown-menu {
    z-index:1000;
}*/


.navbar .nav > li > .dropdown-menu:before {
    position: absolute;
    top: -7px;
    left: 9px;
    display: inline-block;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #ccc;
    border-left: 7px solid transparent;
    border-bottom-color: rgba(0, 0, 0, 0.2);
    content: '';
}

.navbar .nav > li > .dropdown-menu:after {
    position: absolute;
    top: -6px;
    left: 10px;
    display: inline-block;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #ffffff;
    border-left: 6px solid transparent;
    content: '';
}

.dropdown-menu {
    *border-right-width: 0;
    *border-bottom-width: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

    .dropdown-menu .dropdown i {
        position: absolute;
        right: 0;
        margin-top: 3px;
        padding-left: 20px;
    }

.dropdown-submenu > .dropdown-menu {
    -webkit-border-radius: 0 0 0 0;
    -moz-border-radius: 0 0 0 0;
    border-radius: 0 0 0 0;
}



.navbar .nav > a i[class^="icon-"] {
    color: #fdfdfd;
}

ul.nav li.dropdown a {
    /*z-index:1000;*/
    display: block;
}

ul.nav li.dropdown ul li ul.dropdown-menu {
    margin-left: 0px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

ul.nav li.dropdown ul li i {
    margin-right: 20px;
}

select.selectmenu {
    display: none;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 180px;
    padding: 0;
    margin: 2px 0 0;
    list-style: none;
    background-color: white;
    border: none;
    border: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    /*border:2px solid #302f2f;*/
    border-top: none;
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px;
}

    .dropdown-menu li {
        margin: 0;
        padding: 0;
    }

        .dropdown-menu li a {
            color: black;
            font-size: 10px;
            font-weight: 700;
            margin: 0;
            text-shadow: none;
            /*border-bottom:1px solid #303030;*/
            text-decoration: none;
        }

        .dropdown-menu li > a:hover,
        .dropdown-menu li > a:focus,
        .dropdown-submenu:hover > a,
        .dropdown-menu .active > a,
        .dropdown-menu .active > a:hover {
            text-decoration: none;
            background-image: none;
            background-image: none;
            background-image: none;
            background-image: none;
            background-image: none;
            filter: none;
        }

    .dropdown-menu .sub-menu-level1, .dropdown-menu .sub-menu-level2 {
        left: 100%;
        position: absolute;
        top: 0;
        visibility: hidden;
        margin-top: 0;
    }

    .dropdown-menu li:hover .sub-menu-level1 {
        visibility: visible;
    }

    .dropdown-menu li li:hover .sub-menu-level2 {
        visibility: visible;
    }


.navbar-main li:hover .submenu {
    top: 62px;
    visibility: visible;
    -moz-transition: all, 0.25s;
    -o-transition: all, 0.25s;
    -webkit-transition: all, 0.25s;
    transition: all, 0.25s;
}

.navbar-main .icon-bar {
    background: black;
}

.navbar-main .navbar-toggle {
    border: 1px solid black;
}
/*---------------*/
main > section {
    padding: 70px 0;
}

#about1 {
    background: url('../img/about1.jpg');
    background-position: center;
    background-size: cover;
    height: 100vh;
    color: white;
    width: 100%;
    padding-top: 160px;
    background-attachment: fixed;
}

#about h1 {
    color: white;
}

#h {
    background: white;
    color: black;
    padding-bottom: 40px;
    padding-top: 20px;
}

    #h p {
        line-height: 30px;
    }
/*-------------------------*/
@media screen and (min-width: 779px) {

    .box3 {
        direction: rtl;
        /* display: inline-block; */
        /* float: right; */
        height: 200px;
        text-align: right;
        /* width: 600px; */
        background: none 0px 0px repeat scroll rgb(255, 255, 255);
        border-width: 1px;
        border-style: solid;
        border-color: rgb(221, 221, 221);
        border-image: initial;
        margin: 20px;
        padding: 10px;
    }

        .box3 .pic {
            float: right;
            width: 204px;
            border-width: 1px;
            border-style: solid;
            border-color: rgb(221, 221, 221);
            border-image: initial;
            padding: 5px;
        }

            .box3 .pic img {
                width: 100%;
            }

        .box3 .txt {
            float: right;
            margin-right: 10px;
            width: 362px;
            padding: 5px;
        }

            .box3 .txt h3 {
                color: rgb(178, 32, 37);
                line-height: 24px;
                margin: 0px;
                padding: 0px;
            }

    .list1 {
        direction: rtl;
        text-align: right;
        margin: 0px auto;
    }


    #a .padt40 {
        padding-right: 60px;
        padding-top: 70px;
    }
}

#larger {
    padding-top: 42px;
}


.hide {
    display: none;
}

.mas {
    margin-right: 250px;
}

#poz {
    position: absolute;
    width: 130vh;
    height: auto;
    right: 5px;
    padding-right: 40px;
    padding-left: 40px;
    padding-top: 20px;
    overflow: hidden;
    padding-bottom: 20px;
}

#poz1 {
    position: absolute;
    width: 105vh;
    height: auto;
    right: 5px;
    /*padding-right: 40px;
    padding-left: 40px;*/
    padding-top: 20px;
    overflow: hidden;
    padding-bottom: 20px;
}

}

@media screen and (max-width: 768px) {
    .poshtiban1 p {
        text-align: justify;
    }

    .box h3 {
        text-align: center;
    }

    #larger {
        padding: 0 px;
    }

    #t h3 {
        text-align: center;
    }

    .navbar-fixed-top .nav {
        background-color: white !important;
    }

    .navbar-brand img {
        margin-top: 20px !important;
    }

    .dropdown-menu {
        position: absolute;
        top: 100%;
        left: 0;
        display: none;
        float: left;
        min-width: 180px;
        padding: 0;
        margin: 2px 0 0;
        list-style: none;
        background-color: white;
        border: none;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        /*border:2px solid #302f2f;*/
        border-top: none;
        z-index: 100000;
        -webkit-border-radius: 0 0 6px 6px;
        -moz-border-radius: 0 0 6px 6px;
        border-radius: 0 0 6px 6px;
    }

        .dropdown-menu li a {
            color: black !important;
            font-size: 12px;
            font-weight: 700;
            padding: 10px 15px 10px 15px;
            margin: 0;
            text-shadow: none;
            /*border-bottom:1px solid #303030;*/
            text-decoration: none;
        }

    .navbar-main {
        margin-bottom: 0;
        background-color: white;
    }

        .navbar-main .nav {
            margin-bottom: 0;
            background-color: white;
        }

        .navbar-main .navbar-brand img {
            margin-top: 0px;
        }

    .navbar-fixed-top .navbar-nav > li > a {
        color: black !important;
        font-size: 14px !important;
        margin-top: 25px;
        text-transform: uppercase;
        font-weight: 800;
    }

    .dropdown-menu li > a:hover,
    .dropdown-menu li > a:focus,
    .dropdown-submenu:hover > a,
    .dropdown-menu .active > a,
    .dropdown-menu .active > a:hover {
        text-decoration: none;
        background-image: none;
        background-image: none;
        color: black;
        filter: none;
    }

    .navbar-collapse {
        height: auto;
    }
}


.mtxxl {
    margin-top: 75px;
}

@media (max-width: 767px) {
    .logo_container,
    .mobile-check,
    .splash2,
    .splash3,
    .splash4,
    .i4,
    .payment,
    .billing,
    .conv,
    .support {
        display: none;
    }
}

p .ptn,
.pvn,
.pan {
    padding-top: 0;
}

.ptx,
.pvx,
.pax {
    padding-top: 3px;
}

.pts,
.pvs,
.pas {
    padding-top: 5px;
}

.ptm,
.pvm,
.pam {
    padding-top: 10px;
}

.ptl,
.pvl,
.pal {
    padding-top: 20px;
}

.prn,
.phn,
.pan {
    padding-right: 0;
}

.prx,
.phx,
.pax {
    padding-right: 3px;
}

.prs,
.phs,
.pas {
    padding-right: 5px;
}

.prm,
.phm,
.pam {
    padding-right: 10px;
}

.prl,
.phl,
.pal {
    padding-right: 20px;
}

.pbn,
.pvn,
.pan {
    padding-bottom: 0;
}

.pbx,
.pvx,
.pax {
    padding-bottom: 3px;
}

.pbs,
.pvs,
.pas {
    padding-bottom: 5px;
}

.pbm,
.pvm,
.pam {
    padding-bottom: 10px;
}

.pbl,
.pvl,
.pal {
    padding-bottom: 20px;
}

.pln,
.phn,
.pan {
    padding-left: 0;
}

.plx,
.phx,
.pax {
    padding-left: 3px;
}

.pls,
.phs,
.pas {
    padding-left: 5px;
}

.plm,
.phm,
.pam {
    padding-left: 10px;
}

.pll,
.phl,
.pal {
    padding-left: 20px;
}

.mtn,
.mvn,
.man {
    margin-top: 0px;
}

.mtx,
.mvx,
.max {
    margin-top: 3px;
}

.mts,
.mvs,
.mas {
    margin-top: 5px;
}

.mtm,
.mvm,
.mam {
    margin-top: 10px;
}

.mtl,
.mvl,
.mal {
    margin-top: 20px;
}

.mrn,
.mhn,
.man {
    margin-right: 0px;
}

.mrx,
.mhx,
.max {
    margin-right: 3px;
}

.mrs,
.mhs,
.mas {
    margin-right: 5px;
}

.mrm,
.mhm,
.mam {
    margin-right: 10px;
}

.mrl,
.mhl,
.mal {
    margin-right: 20px;
}

.mbn,
.mvn,
.man {
    margin-bottom: 0px;
}

.mbx,
.mvx,
.max {
    margin-bottom: 3px;
}

.mbs,
.mvs,
.mas {
    margin-bottom: 5px;
}

.mbm,
.mvm,
.mam {
    margin-bottom: 10px;
}

.mbl,
.mvl,
.mal {
    margin-bottom: 20px;
}

.mln,
.mhn,
.man {
    margin-left: 0px;
}

.mlx,
.mhx,
.max {
    margin-left: 3px;
}

.mls,
.mhs,
.mas {
    margin-left: 5px;
}

.mlm,
.mhm,
.mam {
    margin-left: 10px;
}

.mll,
.mhl,
.mal {
    margin-left: 20px;
}

body,
p,
ul {
    font-size: 15px;
    line-height: 1.72222;
    margin: 0 0 12.5px;
    /* color: #404041 !important;
       font-family: 'Open Sans', sans-serif;*/
}






/* Custom, iPhone Retina */


@media only screen and (min-width: 1440px) {
    .big-wrap {
        width: 95%;
        position: relative;
        max-width: 1440px;
        height: 100%;
        margin: 0 auto;
    }

    .section.slider .slide-wrap {
        width: 100%;
        left: 0;
        margin: 0;
    }

    .page-wrap.cloob footer.footer,
    .page-wrap.sabavision footer.footer {
        position: static;
    }
}

@media only screen and (min-width: 1051px) and (max-width: 1130px) {
    .home .products .link span:first-child::after {
        content: none;
    }
}

@media only screen and (min-width: 801px) and (max-width: 1050px) {

    .scroll-bullet {
        left: 40px;
    }

        .scroll-bullet.home {
            left: 30px;
        }

        .scroll-bullet li.active,
        .scroll-bullet li:hover {
            background-color: #FF9900;
        }

            .scroll-bullet li.active a,
            .scroll-bullet li:hover a {
                opacity: 0;
            }

        .scroll-bullet.gray li:hover,
        .scroll-bullet.gray li.active {
            background-color: #ccc;
        }

    .section.intro .content {
        right: 30px;
    }

        .section.intro .content p {
            width: 600px;
        }

    .section .content {
        width: 650px;
    }

    .page-wrap footer.footer {
        padding: 20px 30px;
    }

    .page-wrap .footer .right {
        padding-right: 0;
    }

    .page-wrap .footer .left {
        padding-left: 0;
    }

    .wrap {
        width: 100%;
    }


    .about h2 {
        font-size: 30px;
    }

    .about .features .item h3 {
        font-size: 16px;
    }

    .section.about .content h4 {
        font-size: 24px;
    }

    .section.about .content .wrap.pattern1 .item .title {
        font-size: 20px;
        line-height: 30px;
    }


    .section.slider .section-wrap {
        position: relative;
    }

    .section.slider .header {
        padding: 40px 2.5%;
    }

    .section.slider .slide-wrap {
        width: 100%;
        left: 0;
        margin: 0;
    }

        .section.slider .slide-wrap .item .info {
            right: 10px;
        }


    .home .section-wrap.intro .content {
        width: auto;
    }

    .home .products .link span:first-child {
        font-size: 10px;
    }

    .home .products .link span:last-child {
        font-size: 10px;
    }

    .home .lifestyle .content {
        padding: 0 30px 50px 0;
    }

    .home .lifestyle .pagination {
        left: 100px;
    }

    .section .lightbox .content {
        width: 100%;
    }

    .cloob .section.specs .content .item {
        height: 230px;
    }

    .mihanblog .about .content .item .image {
        margin-top: 0;
    }

    .mihanblog .specs .content {
        width: 650px;
    }

    .sabavision .about .content p {
        width: 650px;
        margin: 0 auto;
    }

    .sabavision .about .content .wrap .item {
        margin: 0 5px;
    }

    .sabavision .specs .content .info {
        width: 84%;
    }

    .sabavision .customers {
        height: auto !important;
    }

        .sabavision .customers .slides .item .icon {
            margin: 3px 30px;
        }

        .sabavision .customers .content {
            width: 710px;
            padding: 150px 0 50px 0;
        }

            .sabavision .customers .content h4 {
                padding: 5px 30px 10px;
            }
}

@media only screen and (min-width: 541px) and (max-width: 800px) {


    .header .general-info,
    .scroll-bullet {
        display: none !important;
    }

    .section.intro .content {
        padding: 0;
        left: 40px;
        width: 470px;
        margin: 0;
    }

    .intro .content .logos li {
        width: 13%;
        margin-left: 0;
    }

    .intro .content h3 {
        font-size: 30px;
    }

    .intro .content .logos li a {
        margin: 0 auto;
    }

    .intro .content .logos li.cloob {
        width: 20%;
    }

    .wrap {
        width: 100%;
    }

    .about h2 {
        font-size: 32px;
        line-height: 48px;
    }

    .about .features {
        width: 60%;
        margin: 0 auto;
    }

        .about .features .item {
            width: 100%;
            height: 260px;
            border: 0;
            border-bottom: 2px dashed #ccc;
        }

            .about .features .item a:hover::before {
                margin: 10px auto;
            }

    .page-wrap footer.footer {
        padding: 20px 40px;
        bottom: -80px;
    }

    .page-wrap .footer .right,
    .page-wrap .footer .left {
        padding: 0;
    }

    .section .header.space {
        padding: 40px 30px;
    }

    .section .content {
        width: 100%;
        padding: 0 30px;
    }


    .section.about .content {
        padding: 100px 20px 50px;
    }

        .section.about .content h4 {
            font-size: 24px;
        }


        .section.about .content .wrap.pattern1 .item {
            width: 30%;
            margin-bottom: 10px;
        }

            .section.about .content .wrap.pattern1 .item .title {
                font-size: 20px;
                line-height: 30px;
            }


    .section.specs .content.pattern2,
    .section.specs .content.pattern1 {
        width: 100%;
        padding: 100px 20px 50px;
    }

    .section.specs .content .title {
        font-size: 24px;
        padding: 5px 30px 10px;
    }

    .section.slider .section-wrap {
        position: relative;
    }

    .section.slider .header {
        padding: 40px 20px;
    }

    .section.slider .slide-wrap {
        width: 100%;
        left: 0;
        margin: 0;
    }

        .section.slider .slide-wrap .item .info {
            right: 10px;
        }

            .section.slider .slide-wrap .item .info h4 {
                font-size: 24px;
            }

    .section.slider .slide-bullets {
        left: 10px;
    }


    .home .section.intro .content {
        width: 100%;
        padding: 30px;
        /*bottom: 30px;*/
        right: 0;
    }

    .home .section.about {
        height: 1170px !important;
    }

        .home .section.about .content {
            padding: 80px 0;
        }

        .home .section.about .lightbox .content {
            display: block;
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            width: 60%;
        }

    .home .lightbox {
        position: fixed;
    }

    .home .products .link span:first-child {
        display: none;
    }

    .home .products .link span:last-child {
        width: 100%;
        margin: 0;
        font-size: 14px;
        text-align: center;
    }

    .home .products .name {
        color: #fff;
    }

    .home .products .item .logo::before {
        -webkit-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -o-transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 0;
    }

    .home .products .item .logo::after {
        -webkit-transform: translateY(-60px);
        -ms-transform: translateY(-60px);
        -o-transform: translateY(-60px);
        transform: translateY(-60px);
        opacity: 1;
    }

    .home .products .item .link span {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }

    .home .products .item .name {
        -webkit-transform: translateY(10px);
        -ms-transform: translateY(10px);
        -o-transform: translateY(10px);
        transform: translateY(10px);
        opacity: 1;
    }

    .home .products a:hover {
        background-color: transparent;
    }



    .home .lifestyle .content {
        padding-right: 40px;
    }

    .home .lifestyle .pagination {
        left: 40px;
    }

    /*.home .contact{height: auto !important;min-height: auto;}*/
    .home .contact .content {
        width: 100%;
        padding: 50px 40px;
    }

    .home .contact input[type="text"] {
        width: 380px;
    }

    .home .contact .wrap {
        margin-top: 50px;
    }

    .home.page-wrap footer.footer {
        position: static;
    }

    .aparat .section.about,
    .aparat .section.specs {
        height: auto !important;
    }

    .aparat .section.children .content {
        position: absolute;
        left: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 100%;
    }

        .aparat .section.children .content h4 {
            font-size: 24px;
        }


    .cloob .section.about .content .wrap.pattern1 .item {
        width: auto;
        margin: 0 4%;
    }
    /* .cloob .section.specs{height: auto !important;min-height:auto;}*/


    .filimo .section.specs {
        height: auto !important;
    }

        .filimo .section.specs .content .item {
            width: 45%;
        }


    .lenzor .section.about .content {
        position: absolute;
        padding: 0 20px;
        left: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .lenzor .section.specs {
        height: auto !important;
    }

        .lenzor .section.specs .content.pattern1 .item {
            width: 300px;
            margin: 0 auto 10px;
            display: block;
        }

    .cloob .section.specs .content .item {
        width: 46%;
        min-height: 230px;
    }

    .mihanblog .section.about,
    .mihanblog .section.specs {
        height: auto !important;
    }

        .mihanblog .section.about .content .wrap.pattern1 .item {
            width: 26%;
            margin: 0 3%;
        }

    .mihanblog .about .content .item {
        vertical-align: top;
    }

        .mihanblog .about .content .item .image {
            margin-top: 0;
        }

    .mihanblog .section.specs .content {
        width: 100%;
        padding: 100px 20px 50px;
    }

    .sabavision .section.about .content {
        position: absolute;
        width: 100%;
        left: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        padding: 0 20px;
        margin-top: 10px;
    }

        .sabavision .section.about .content .item {
            margin-bottom: 10px;
        }

    .sabavision .section.specs {
        height: auto !important;
    }

        .sabavision .section.specs .content .item {
            width: 45%;
        }

        .sabavision .section.specs .content .info {
            width: 93%;
        }

    .sabavision .customers {
        height: auto !important;
    }

        .sabavision .customers .content {
            padding: 150px 0 50px 0;
        }

        .sabavision .customers .slides .item {
        }

            .sabavision .customers .slides .item .icon {
                width: 21%;
                margin: 5px 2%;
            }
}


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

    .section.intro {
        min-height: 600px;
    }

    .intro .content .logos li {
        width: 30%;
        margin: 5px 0;
    }

        .intro .content .logos li.cloob {
            width: 30%;
        }

    .intro .content .logos {
        text-align: center;
        border-top: 3px solid #fff;
        padding-top: 20px;
        margin-top: 20px;
    }

    .home .products .item {
        width: 50%;
    }

    .home .products .link span:first-child {
        display: none;
    }

    .home .products .link span:last-child {
        width: 100%;
        margin: 0;
        padding: 0;
        text-align: center;
    }

    .page-wrap footer.footer {
        text-align: center;
    }

    .page-wrap .footer .copy {
        float: none;
        text-align: center;
    }

    .page-wrap .footer .sign {
        text-align: center;
        float: none;
    }

    .page-wrap .footer .right {
        text-align: center;
        margin-bottom: 20px;
    }

    .page-wrap .footer .left {
        float: none;
        display: block;
        text-align: center;
    }

        .page-wrap .footer .left p {
            display: none;
        }

    .cloob .section.specs .content .item {
        width: 80%;
        min-height: 120px;
    }

    .news .section {
        min-height: 500px;
    }

    .news .media .item.flat a {
        width: 35%;
    }

    .page-wrap footer.footer,
    .page-wrap.cloob footer.footer,
    .page-wrap.sabavision footer.footer {
        bottom: -120px;
    }

    .jobs .join-team .content {
        padding: 0;
    }
}

@media only screen and (max-width: 440px) {
    .home .products .item {
        width: 100%;
    }

    .jobs .resume .form {
        width: 100%;
    }

        .jobs .resume .form .input-text {
            width: 100%;
            padding: 0 80px 0 20px;
            text-align: left;
            font-size: 14px;
        }
}

@media only screen and (max-width: 400px) {
    .intro .content .logos li,
    .intro .content .logos li.cloob {
        width: 49%;
    }

    .mihanblog .section.specs .content .pattern3 .item {
        width: 48%;
    }

    .section.specs .content.pattern2 .item {
        text-align: center;
    }

        .section.specs .content.pattern2 .item .image {
            float: none;
            margin: 0 0 10px 0;
        }

        .section.specs .content.pattern2 .item .des {
            margin: 0;
        }

    .section.children .content.pattern4 .item {
        text-align: center;
    }

        .section.children .content.pattern4 .item .image {
            float: none;
        }

        .section.children .content.pattern4 .item .des {
            margin: 0;
        }

    .filimo .about .content .copyright {
        text-align: right;
    }

        .filimo .about .content .copyright::after {
            top: 30px;
        }
}


@media only screen and (max-width: 540px) {
    /*.section-wrap{

        min-height: auto;

    }*/
    .header .general-info,
    .scroll-bullet {
        display: none !important;
    }


    .intro .content h3 {
        font-size: 30px;
        line-height: 45px;
    }

    .intro .footer .btn {
        bottom: 40px;
    }

    .intro .content .logos a {
        margin: 0 auto;
    }

    .intro .content .logos {
        text-align: center;
        border-top: 3px solid #fff;
        padding-top: 20px;
        margin-top: 20px;
    }

    .wrap {
        width: 100%;
    }

    .about h2 {
        font-size: 30px;
        line-height: 45px;
    }

    .about .wrap { /*display: block;*/
    }

    .about .features {
        width: 80%;
        margin: 0 auto;
    }

        .about .features .item {
            width: 100%;
            height: 280px;
            border: 0;
            border-bottom: 2px dashed #ccc;
        }

            .about .features .item a:hover::before {
                margin: 10px auto;
            }

    .about .more {
        width: 53%;
        height: 63px;
    }

        .about .more a {
            font-size: 15px;
            width: 100%;
            margin-left: 10px;
        }

            .about .more a.story {
                border: 0;
                border-bottom: 2px dashed #fff;
            }

                .about .more a.story::after {
                    content: none;
                }


    .page-wrap footer.footer {
        font-size: 10px;
        padding: 20px;
    }

    .page-wrap .footer .right {
        padding: 0;
    }


    .section .content {
        width: 100%;
        padding: 80px 10px 20px;
    }

    .section.intro .content {
        right: 0;
        /*bottom: 40px;*/
        width: 100%;
        padding: 0 20px;
    }

    .section.intro.res .content {
        left: 0;
        /*bottom: 40px;*/
        width: 100%;
        padding: 0 20px;
    }

    .section .header.space {
        padding: 20px 25px;
    }

    .section.about .content h4 {
        font-size: 22px;
        line-height: 33px;
    }

    .section.specs .content.pattern2 {
        width: 100%;
    }

    .section.children .content.pattern4 {
        width: 100%;
    }

        .section.children .content.pattern4 h4 {
            font-size: 19px;
        }

    .section.specs .content.pattern2 .item {
        width: 95%;
        height: auto;
        margin-bottom: 10px;
        padding: 6px;
    }

    .section.children .content.pattern4 .item {
        width: 80%;
        margin-bottom: 10px;
        height: auto;
    }

    .section.specs .content.pattern1 .item {
        width: 80%;
        margin-bottom: 10px;
    }

    .section.specs .content .title {
        font-size: 22px;
        line-height: 33px;
        margin-bottom: 15px;
        margin-top: 76px;
    }

    .section.slider .section-wrap {
        position: relative;
    }

    .section.slider .slide-wrap {
        width: 100%;
        left: 0;
        margin: 0;
    }

        .section.slider .slide-wrap .item .info {
            padding: 0;
            right: 15px;
            bottom: 100px;
        }

    .section.slider .slide-bullets {
        right: 15px;
        padding: 0;
        left: 0;
        bottom: 60px;
        height: auto;
        width: 90%;
    }

        .section.slider .slide-bullets .item {
            float: right;
        }


    .section.app {
        height: auto !important;
    }

        .section.app .detail {
            padding: 5% 20px;
            height: auto !important;
        }

            .section.app .detail .col-xs-1 {
                width: 100%;
            }

            .section.app .detail .col-12.right {
                margin: 0 0 20px 0;
            }

            .section.app .detail .col-12.left {
                margin: 0;
            }

            .section.app .detail .googleplay {
                width: 48%;
                height: 60px;
                margin-left: 2%;
                background-position: center;
                background-size: 100%;
            }

            .section.app .detail .appstore {
                width: 48%;
                height: 60px;
                background-position: center;
                background-size: 100%;
            }

            .section.app .detail .winstore {
                width: 48%;
                height: 60px;
                background-position: center;
                background-size: 100%;
                margin-right: 57px;
            }

        .section.app .other-products h4 {
            font-size: 22px;
            line-height: 33px;
        }

        .section.app .other-products .item {
            margin-bottom: 20px;
            vertical-align: middle;
        }


    .home .header {
        padding: 30px 30px;
    }

    .home .section.intro {
        min-height: 600px;
    }

    .home .intro .content h2 {
        font-size: 30px;
        line-height: 45px;
    }

    .home .intro .content p {
        font-size: 14px;
    }

    .home .section.about {
        height: auto !important;
    }

        .home .section.about .content {
            width: 100%; /*padding: 100px 20px;*/
            display: block;
        }

        .home .section.about .lightbox .content {
            display: block;
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            -o-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            width: 90%;
        }

    .home .lightbox {
        position: fixed;
    }

        .home .lightbox .close {
            top: 40px;
            left: 20px;
        }

    .home .map img {
        width: 100%;
    }

    .home .products .link span:first-child {
        display: none;
    }

    .home .products .link span:last-child {
        width: 100%;
        margin: 0;
        font-size: 14px;
        text-align: center;
    }

    .home .products .name {
        color: #fff;
    }

    .home .products .item .logo::before {
        -webkit-transform: translateY(-30px);
        -ms-transform: translateY(-30px);
        -o-transform: translateY(-30px);
        transform: translateY(-30px);
        opacity: 0;
    }

    .home .products .item .logo::after {
        -webkit-transform: translateY(-60px);
        -ms-transform: translateY(-60px);
        -o-transform: translateY(-60px);
        transform: translateY(-60px);
        opacity: 1;
    }

    .home .products .item .link span {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
    }

    .home .products .item .name {
        -webkit-transform: translateY(10px);
        -ms-transform: translateY(10px);
        -o-transform: translateY(10px);
        transform: translateY(10px);
        opacity: 1;
    }

    .home .products a:hover {
        background-color: transparent;
    }

    .home .lifestyle .content {
        padding: 0 20px 100px 0;
    }

    .home .lifestyle .pagination {
        bottom: 60px;
        right: 20px;
        left: 0;
    }

    .home .contact {
        display: block;
        /* min-height: auto;*/
        height: auto !important;
    }


        .home .contact .wrap {
            margin-top: 50px;
        }

        .home .contact .content {
            padding: 50px 20px 40px;
        }

        .home .contact p:first-child::before {
            font-size: 4em;
        }

        .home .contact p,
        .home .contact form ~ p {
            font-size: 16px;
        }

            .home .contact p.email {
                font-size: 18px;
            }

        .home .contact .phone {
            display: block;
            margin: 0 0 10px 0;
        }

        .home .contact form {
            width: 100%;
        }

        .home .contact input[type="text"] {
            width: 100%;
        }

    .home.page-wrap footer.footer {
        position: static;
    }


    .aparat .section.intro {
        min-height: 500px;
    }

    .aparat .intro .content h2.image {
        width: 250px;
        height: 80px;
        background-size: 250px;
    }

    .aparat .about .content .image {
        width: 180px;
        height: 65px;
        background-size: 180px;
    }

    .aparat .about,
    .aparat .specs {
        height: auto !important;
    }

    .aparat .children .content h4 {
        font-size: 22px;
        line-height: 33px;
    }

    .aparat .children .content .image {
        width: 180px;
        height: 70px;
        background-size: 180px;
    }

    .aparat .section.children .content {
        position: absolute;
        padding: 0 20px;
        top: 55%;
        left: 0;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

        .aparat .section.children .content p {
            display: none;
        }
    /*.section.children .content.pattern4 .item{*/

    /*height: auto;*/
    /*padding: 20px 80px;*/

    /*}*/

    .section.about .content .wrap.pattern1 .item {
        margin: 0px;
        width: 155px;
        display: inline-table;
    }

    .sabavision .content .pattern1 .item {
        margin: 0px;
        width: 155px;
        display: inline-table;
    }

    .filimo .about .content {
        position: absolute;
        top: 52%;
        left: 0;
        padding: 0 10px;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .filimo .section.specs {
        height: auto !important;
    }

    .filimo .intro .content h2.image {
        width: 250px;
        height: 120px;
        background-size: 250px;
    }

    .filimo .about .content .image {
        width: 180px;
        height: 80px;
        background-size: 180px;
    }
    /*  .section{
          min-height: auto;

      }*/
    .cloob .intro .content h2.image {
        background-size: 250px;
        width: 250px;
    }

    .cloob .about {
        height: auto !important;
    }

    .cloob .specs {
        height: auto !important;
        min-height: 550px;
    }

    .cloob .section.about .content .wrap.pattern1 .item {
        margin-bottom: 20px;
    }

    .cloob .section.specs .content.pattern2 .item {
        width: 90%;
    }

    .lenzor .intro .content h2.image {
        background-size: 250px;
        width: 250px;
        height: 100px;
    }

    .lenzor .about .content {
        position: absolute;
        padding: 0 10px;
        top: 55%;
        left: 0;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
    }

        .lenzor .about .content .logo {
            background-size: 220px;
            width: 220px;
            height: 88px;
        }

    .lenzor .about {
        min-height: 1300px;
    }

    .lenzor .specs {
        height: auto !important;
    }

    .mihanblog .intro .content h2.image {
        background-size: 250px;
        width: 250px;
        height: 153px;
    }

    .mihanblog .about .content .logo {
        background-size: 220px;
        width: 220px;
        height: 135px;
    }

    .mihanblog .about,
    .mihanblog .specs {
        height: auto !important;
    }

        .mihanblog .specs .content {
            width: 100%;
        }

        .mihanblog .about .content .item .image {
            margin-top: 0;
        }

        .mihanblog .about .content .wrap.pattern1 .item {
            margin-bottom: 10px;
        }

        .mihanblog .specs .content .pattern3 .item {
            width: 32%;
        }

    .sabavision .intro .content h2.image {
        background-size: 250px;
        width: 250px;
        height: 77px;
    }

    .sabavision .about {
        height: auto !important;
        min-height: 500px;
    }

    .sabavision .specs {
        height: auto !important;
    }

    .sabavision .about .content {
        width: 100%;
    }

        .sabavision .about .content .logo {
            background-size: 220px;
            width: 220px;
            height: 62px;
        }

        .sabavision .about .content .info {
            padding: 5px 20px 10px;
            margin-top: 0;
        }

        .sabavision .about .content .wrap .item {
            margin-bottom: 10px;
        }

    .sabavision .specs .content .info {
        width: 80%;
        padding: 80px 25px 25px 25px;
        text-align: center;
    }

        .sabavision .specs .content .info::after {
            right: 50%;
            top: 20px;
            -webkit-transform: translateX(50%);
            -ms-transform: translateX(50%);
            -o-transform: translateX(50%);
            transform: translateX(50%);
        }

    .sabavision .customers {
        height: auto !important;
    }

        .sabavision .customers .content {
            padding: 150px 0 50px 0;
        }


    /*   .news .intro .content h2{font-size: 30px;line-height: 45px;}
       .news .intro .content h3{font-size: 24px;line-height: 36px;}
       .news .section.intro .content{bottom: 40%;}

       .news .media .item{text-align: center;height: auto;padding: 0px;}
       .news .media .item.flat{height: auto;}
       .news .media .col-m-1{width: 100%;}
       .news .media .item .play{
           bottom: 180px;
           height: 90px;
           width: 90px;
           float: none;
           display: inline-block;
           background-size: 60px;
       }
       .news .media .item.col-12 .play{bottom: 165px;}
       .news .media .item.col-1 .play{
           height: 90px;
           width: 90px;
           float: none;
           display: inline-block;
           background-size: 60px;
       }
     .news .media .item.col-1 .play:hover,
       .news .media .item .play:hover{background-size: 60px;}
       .news .media .item .info{
           top: 100px;
           right: 50%;
           width: 100%;
           -webkit-transform: translate(50%,0);
           -ms-transform: translate(50%,0);
           -o-transform: translate(50%,0);
           transform: translate(50%,0);
           bottom: 25px;
           text-align: center;
       }
       .news .media .item.col-1 .info{width: auto;}
       .news .media .item .info h4,
       .news .media .item.col-12 .info h4{width: auto;}
       .news .media .item .info p{font-size: 13px;line-height: 20px;}
       .news .media .item .report{display: none;}
       .news .media .item.flat .report{display: block;}
       .news .media .item.flat{text-align: center;}
       .news .media .item.flat .info{
           right: 0;
           left: 0;
           -webkit-transform: none;
           -ms-transform: none;
           -o-transform: none;
           transform: none;
           width: 100%;
           text-align: center;
       }
       .news .media .item.flat a{width: 60%;}


       /*.jobs .intro .content{bottom: 200px;}*/
    /*.jobs .intro .content h2{font-size: 30px;line-height: 1.5;}
    .jobs .join-team .content{padding: 80px 10px 0;}
    .jobs .evir .slider .pagination{left: auto;right: 20px;}
    .jobs .join-oprts .content{padding: 0 50px;margin-top: 120px;}
    .jobs .join-oprts .content .item:nth-child(2n)::after,
    .jobs .join-oprts .content .item:nth-child(2n+1)::after{content: none;}
    .jobs .join-oprts .content .item:nth-child(2n)::before,
    .jobs .join-oprts .content .item:nth-child(2n+1)::before{content: "";}
    .jobs .join-oprts .content .item:last-child::before{content: none;}
    .jobs .join-team .content h3{
        margin-top: 70px;
    }
    .jobs .join-oprts .content h3{margin-top: 30px;}
    .jobs .resume .content{padding: 0 20px;}
    .jobs .join-oprts .content .item{height: 300px;}*/
    .filimo .about {
        min-height: 1240px;
    }

    .aparat .children {
        min-height: 1210px;
    }
}

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

    .filimo .about {
        min-height: 1220px;
    }
}

@media only screen and (max-width: 375px) {
    .lenzor .about {
        min-height: 1345px;
    }

        .lenzor .about .content {
            top: 40%;
        }

        .lenzor .about .content {
            top: 52%;
        }

    .filimo .about {
        min-height: 1260px;
    }
}

@media only screen and (max-width: 350px) {
    .lenzor .about {
        min-height: 1780px;
    }

        .lenzor .about .content {
            top: 52%;
        }

    .filimo .about {
        min-height: 1560px;
    }

    .jobs .intro .content {
        bottom: 3px;
    }

    .aparat .children {
        min-height: 1185px;
    }

    .about .more a {
        font-size: 13px;
    }

        .about .more a.icon-book:before {
            width: 47px;
            height: 45px;
            top: -4px;
            left: 6px;
        }
}



@media only screen and (max-width: 1050px) {
    .home .story {
        width: 100%;
    }

        .home .story .wrap {
            overflow: hidden;
        }

        .home .story .content {
            width: 100%;
            padding: 50px 0;
        }

        .home .story .slider {
            width: 70%;
        }

        .home .story .timeline {
            width: 780px;
            margin-top: -240px;
        }

    .jobs .join-team {
        height: auto !important;
        padding-bottom: 20px;
    }

    .jobs .join-oprts {
        height: auto !important;
    }
}

@media only screen and (max-width: 800px) {
    .home .story .timeline {
        width: 637px;
    }

    .home .story .slider img {
        width: 80%;
    }

    /* .jobs .coop-us .content{width: 98%;}
     .jobs .join-oprts .content .item .image{margin: 5px 0;}
     .jobs .join-oprts .content .des h5{margin-bottom: 5px;}
     .jobs .join-oprts .content .des p{
         margin-bottom: 0;
         opacity: 1;
         visibility: visible;
         line-height: 20px;
         height: 170px;
     }*/
}

@media only screen and (max-width: 800px) {
    /*.aparat .intro .bg {background-image: url(../media/intro-aparat-800.jpg);}
    .cloob .intro .bg  {background-image: url(../media/cloob-intro-800.png);}
    .filimo .intro .bg {background-image: url(../media/filimo-intro-800.jpg);}
    .lenzor .intro .bg {background-image: url(../media/lenzor-intro-800.png);}
    .mihanblog .intro .bg {background-image: url(../media/mihanblog-intro-800.png);}
    .sabavision .intro .bg {background-image: url(../media/sabavision-intro-800.jpg);}
    .jobs .intro .bg {background-image: url(../media/home-slide2.jpg);}*/

    .cloob .intro .content h2.image {
        display: none;
    }
}

@media only screen and (max-width: 635px) {
    .home .story .timeline {
        width: 512px;
    }

    .home .story .slider img {
        width: 90%;
    }
}

@media only screen and (min-width: 540px) and (max-width: 635px) {
    .jobs .join-oprts .content {
        padding: 0;
    }
}

@media only screen and (max-width: 515px) {
    .home .story .timeline {
        width: 387px;
    }

    .home .story .slider img {
        width: 90%;
    }
}

@media only screen and (max-width: 400px) {
    .home .story .timeline {
        width: 300px;
    }

    .home .story .slider img {
        width: 100%;
    }

    .home .story .pointer {
        right: 50%;
    }

    .home .story .timeline .wraper {
        padding-top: 150px;
    }
}

@media only screen and (max-width: 330px) {
    .news .media .item {
        height: auto;
        padding: 0px;
    }

        .news .media .item.flat {
            height: auto;
        }

        .news .media .item .play {
            bottom: 210px;
        }
}

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

    .prlx_slide {
    }

    .btn {
        font-size: 16px;
        padding: 8px 15px;
        line-height: 34px;
    }

    .story_date {
        background-color: #FFF;
    }

    .storywrap {
        margin: auto;
        max-width: 400px;
        background-image: none;
    }

    .story_part img:nth-child(2) {
        display: none;
    }

    .arrow {
        display: none;
    }

    .story_part img {
        /*padding: 10px;*/
        /*border-radius: 14px;*/
        /*height: auto;*/
        max-width: 300px;
    }

    .r_img {
        margin-left: 0;
    }

    .l_img {
        margin-right: 0;
    }

    .story_part img {
        margin-left: 0px;
    }

    .story_item.mas_r ul {
        margin: 0;
        width: 100%;
    }

    .story_item.mas_l ul {
        margin: 0;
        width: 100%;
    }

    .story_item {
        margin: 0;
        width: 100%;
        display: block;
    }

    .story_part h4 {
        padding: 10px 0;
    }

    .story_item h2 {
        padding: 5px 20px;
    }

    .story_item.mas_r {
        text-align: center;
    }

    .story_item.mas_l {
        text-align: center;
    }

        .story_item.mas_r h4,
        .story_item.mas_r h2,
        .story_item.mas_r img,
        .story_item.mas_r a,
        .story_item.mas_l h4,
        .story_item.mas_l h2,
        .story_item.mas_l img,
        .story_item.mas_l a {
            float: none;
            text-align: center;
            display: inline-block !important;
        }

    .story_item em {
        width: 100%;
        clear: both;
        display: block;
    }
}


.green {
    background: #089885 !important;
}

/***managesoftware**/

.headerdesign img {
    width: 100%;
    height: auto;
}

.hover-image {
    text-align: center;
    background-color: #00364D;
    width: 100%;
    position: relative;
    height: auto;
    max-height: 200px;
    /*top: -170px;*/
    padding: 30px 0px 20px;
    opacity: 0.75;
}

    .hover-image h1 {
        padding-right: 60px;
    }

    .hover-image p {
        padding-right: 60px;
        color: white;
    }

.tringleright {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 0 30px 25px;
    border-color: transparent transparent transparent #007bff;
}

.tringleleft {
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 30px 20px 30px 0px;
    border-color: transparent #007BFF transparent transparent;
}

.boxbody {
    width: 76%;
    height: 60px;
    background: #007bff;
    color: #fff;
    position: relative;
}

.circlenumber {
    width: 66px;
    height: 66px;
    float: right;
    border-radius: 50%;
    border: 3px solid #3A82CF;
    left: 10%;
    z-index: 1000;
    background: #FFF none repeat scroll 0% 0%;
    padding: 18px 28px;
    font-size: 18px;
    position: absolute;
}

.circlenumberleft {
    width: 66px;
    height: 66px;
    border-radius: 50%;
    border: 3px solid #3A82CF;
    right: 10%;
    z-index: 1000;
    background: #FFF none repeat scroll 0% 0%;
    padding: 18px 28px;
    font-size: 18px;
    position: absolute;
    float: left;
}

#software {
    /*margin-top:-160px;*/
    direction: rtl;
    margin-top: 30px;
    margin-bottom: 30px;
}

.fontboxl {
    position: absolute;
    width: 70%;
    right: 30px;
    padding-top: 20px;
}

.arrowsoftware {
    border: solid #fff;
    border-width: 0 6px 6px 0;
    display: inline-block;
    padding: 26px;
    margin-right: 10%;
}

.arrowsoftwareleft {
    border-style: solid;
    border-color: #FFF;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    border-width: 6px 0px 0px 6px;
    display: inline-block;
    padding: 26px;
    margin-left: 10%;
    float: left;
}

.row20 {
    margin: 15px 0px !important;
}

.rightb {
    float: right;
}

.leftb {
    float: left;
}

.rightarrow {
    transform: rotate(-45deg) skew(0deg);
    -webkit-transform: rotate(-45deg) skew(0deg);
}

.leftarrow {
    transform: rotate(-45deg) skew(-0deg);
    -webkit-transform: rotate(-45deg) skew(-0deg);
}

.fontbox {
    position: absolute;
    width: 70%;
    right: 50px;
    padding-top: 20px;
}

.backblue {
    background: #ddd !important;
    border-color: #ddd !important;
}
/**********gym************/
.headerdesign {
    width: 100%;
    height: auto;
}

    .headerdesign img {
        width: 100%;
        height: auto;
    }

.hover-image h1 {
    padding-right: 60px;
    color: white;
}

/*****************/
.t1 li {
    line-height: 13px;
    list-style-type: none;
    padding-top: 20px;
}
/*---------slider----------*/
/*@media screen and (min-width: 779px) {
    #myCarousel .carousel-inner > .item > img, .carousel-inner > .item > a > img {
        display: block;
        height: 500px;
        max-width: 100%;
        line-height: 1;
        width: 100% !important;
    }

    #myCarousel .carousel-indicators li {
        width: 20px;
        height: 20px;
    }

    #myCarousel .carousel-indicators .active {
        width: 20px;
        height: 20px;
        margin: 0;
        background: #089885 !important;
    }

    #myCarousel .carousel-indicators li :hover {
        background-color: #089885;
    }

    #myCarousel .carousel {
        position: relative;
        height: 500px;
    }
}*/
.container {
    margin-top: 20px;
}

/* Carousel Styles */
.carousel-indicators .active {
    background-color: #2980b9;
}

.carousel-inner img {
    width: 100%;
    height: auto;
}

.carousel-control {
    width: 0;
}

    .carousel-control.left,
    .carousel-control.right {
        opacity: 1;
        filter: alpha(opacity=100);
        background-image: none;
        background-repeat: no-repeat;
        text-shadow: none;
    }

        .carousel-control.left span {
            padding: 15px;
        }

        .carousel-control.right span {
            padding: 15px;
        }

    .carousel-control .glyphicon-chevron-left,
    .carousel-control .glyphicon-chevron-right,
    .carousel-control .icon-prev,
    .carousel-control .icon-next {
        position: absolute;
        top: 45%;
        z-index: 5;
        display: inline-block;
    }

    .carousel-control .glyphicon-chevron-left,
    .carousel-control .icon-prev {
        left: 0;
    }

    .carousel-control .glyphicon-chevron-right,
    .carousel-control .icon-next {
        right: 0;
    }

    .carousel-control.left span,
    .carousel-control.right span {
        background-color: #000;
    }

        .carousel-control.left span:hover,
        .carousel-control.right span:hover {
            opacity: .7;
            filter: alpha(opacity=70);
        }

/* Carousel Header Styles */
.header-text {
    position: absolute;
    top: 20%;
    left: 1.8%;
    right: auto;
    width: 96.66666666666666%;
    color: #fff;
}

    .header-text h2 {
        font-size: 40px;
    }

        .header-text h2 span {
            background-color: #2980b9;
            padding: 10px;
        }

    .header-text h3 span {
        background-color: #000;
        padding: 15px;
    }

.btn-min-block {
    min-width: 170px;
    line-height: 26px;
}

.btn-theme {
    color: #fff;
    background-color: transparent;
    border: 2px solid #fff;
    margin-right: 15px;
}

    .btn-theme:hover {
        color: #000;
        background-color: #fff;
        border-color: #fff;
    }











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

    .abouth {
        width: 100% !important;
    }

    .row20 {
        margin: 20px 0px !important;
    }


    .backblue {
        margin-top: 80px !important;
    }

    .boxsoft {
        margin-top: 80px !important;
    }

    .paddt45 img {
        width: 200px;
    }
}
/*hardeware*/
.hardware {
    background: url(../img/hardware.jpg);
    background-position: center;
    background-size: cover;
    height: 100vh;
    color: white;
    width: 100%;
    padding-top: 140px;
    background-attachment: fixed;
}

.boxhardware {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 50px;
    border: 1px solid #EDEDED;
    margin-bottom: 20px;
    border-radius: 5px 5px;
    box-shadow: 2px 2px #EDEDED;
    padding-top: 30px;
    padding: 10px;
}

.hardwarimg {
    background: #f4f4f4;
    padding: 20px;
    margin-left: 20px;
}

    .hardwarimg img {
        width: 100%;
        height: auto;
    }

.boxhardware .title {
    position: relative;
    width: 95%;
    height: auto;
    padding: 10px;
    background: #f4f4f4;
}

.boxhardware .description {
    width: 100%;
    padding: 5% 0% 5% 5%;
    height: auto;
}

.description ul {
    padding: 0;
    margin: 0;
}

.description li {
    padding-top: 10px;
}

.boxhardware .buttonhold {
    width: 100%;
    float: left;
    height: 60px;
}

.btnleft {
    float: left;
    margin-left: 5%;
}

.btn {
    text-decoration: none;
    color: white !important;
    background: #009FDE !important;
    border: none !important;
}

#seo {
    background: url('../img/services-marketing.jpg');
    background-position: center;
    background-size: cover;
    height: 100vh;
    color: white;
    width: 100%;
    padding-top: 160px;
    background-attachment: fixed;
}
/*************************/
footer a:hover {
    color: #fff;
    border-bottom-color: #777;
}

.footer__menus {
    width: 100%;
    float: right;
    margin-right: 0;
    margin-left: 0;
}

@media (min-width: 37.5em) {
    .footer__menu {
        width: 47.05882%;
        float: right;
        margin-left: 5.88235%;
    }
}

.footer__menu, .footer__menus {
    width: 100%;
    float: right;
    margin-right: 0;
    margin-left: 0;
}

footer__menu ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

@media (min-width: 37.5em) {
    .footer__menu a, .footer__menu li {
        text-align: right;
    }
}

@media (min-width: 37.5em) {
    footer__menu a, .footer__menu li {
        text-align: right;
    }
}

.footer__menu a {
    padding: .3em .5em;
    text-decoration: none;
}

footer a {
    display: inline-block;
    white-space: nowrap;
    border-bottom: 1px solid transparent;
    color: #ccc !important;
    text-decoration: none;
    transition: all .4s;
}

@media (min-width: 37.5em) {
    .footer__socials {
        width: 40%;
        float: left;
        margin-left: 0;
        margin: 3em 0;
        padding: 0;
    }
}

.footer__socials {
    width: 100%;
    float: right;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 3em;
}

@media (min-width: 37.5em) {
    .footer__socials ul {
        float: left;
        margin: 0;
    }
}

.footer__socials ul {
    width: 290px;
    margin: 0 auto;
    padding: 0;
    list-style: none;
}

.footer__socials .fa-twitter {
    border-color: #55acee;
    background-color: #55acee;
}

.footer__socials .fa-instagram {
    border-color: #3f729b;
    background-color: #3f729b;
}

.footer__socials .telegram {
    border-color: #08c;
    background-color: #08c;
}

.footer__socials a {
    position: relative;
    overflow: hidden;
    z-index: 1;
    display: block;
    float: left;
    width: 42px;
    height: 42px;
    margin-right: 6px;
    padding: 5px;
    line-height: 0;
    border-radius: 50%;
    transition: all .2s;
}

footer {
    text-align: center;
    padding-top: 60px;
}

footer {
    position: relative;
    clear: both;
    display: block;
    background-color: #242c39;
    color: #fff;
}

    footer .container a {
        text-decoration: none;
    }

    footer p {
        color: white;
      
        text-transform: capitalize;
    }

#head {
    height: 80px;
    background: #039785;
    margin-top: 30px;
    width: 100%;
    padding-right: 60px;
    padding-top: 20px;
}

#head0 p {
    font-size: 16px !important;
    text-align: justify;
}

#head h4 {
    color: white;
}

#head1 img {
    width: 100px !important;
    text-align: center;
}

#head0 img {
    width: 100%;
    text-align: center;
}

#head3 {
    position: relative;
}

    #head3 .triangle-0 {
        position: absolute;
        left: 71px;
        top: 20px;
        width: 60px;
        height: 60px;
        border-bottom: solid 30px #f5eb28;
        border-right: solid 30px #f5eb28;
        border-left: solid 30px transparent;
        border-top: solid 30px transparent;
    }

    #head3 .triangle-2 {
        width: 60px;
        height: 60px;
        position: absolute;
        right: 71px;
        top: 20px;
        border-bottom: solid 30px #f5eb28;
        border-right: solid 30px #f5eb28;
        border-left: solid 30px transparent;
        border-top: solid 30px transparent;
        transform: rotate(90deg);
    }

    #head3 #hr {
        position: absolute;
        right: 19px;
        top: 72px;
        border: 4px solid #f5eb28 !important;
        width: 100px;
    }

    #head3 #hr0 {
        position: absolute;
        left: 19px;
        top: 72px;
        border: 4px solid #f5eb28 !important;
        width: 100px;
    }

    #head3 img {
        width: 100px;
    }

    #head3 hr {
        border: 4px solid #f5eb28 !important;
        width: 900px;
    }

    #head3 h4 {
        padding-right: 130px;
    }

    #head3 a {
        text-decoration: none;
        color: black;
    }

#head5 .fa {
    color: #079366 !important;
    margin-left: 10px;
    font-size: 20px;
    font-weight: bold;
}

#head5 .triangle-1 {
    position: absolute;
    left: 321px;
    top: 18px;
    width: 60px;
    height: 60px;
    border-bottom: solid 30px #f5eb28;
    border-right: solid 30px #f5eb28;
    border-left: solid 30px transparent;
    border-top: solid 30px transparent;
}

#head5 #hr {
    position: absolute;
    left: 29px;
    top: 70px;
    border: 4px solid #f5eb28 !important;
    width: 300px;
}

#head4 h4 {
    padding-bottom: 20px;
    font-weight: bold;
}

#head5 #hr0 {
    position: absolute;
    right: 29px;
    top: 70px;
    border: 4px solid #f5eb28 !important;
    width: 300px;
}

#head5 .triangle-2 {
    width: 60px;
    height: 60px;
    position: absolute;
    right: 321px;
    top: 18px;
    border-bottom: solid 30px #f5eb28;
    border-right: solid 30px #f5eb28;
    border-left: solid 30px transparent;
    border-top: solid 30px transparent;
    transform: rotate(90deg);
}

#head5 li {
    line-height: 60px;
}

#head5 hr {
    border: 4px solid #f5eb28 !important;
    width: 400px;
}

#head6 {
    height: 80px;
    background: #039785;
    margin-top: 30px;
    width: 100%;
    padding-right: 60px;
    padding-top: 20px;
}

    #head6 h4 {
        color: white;
        text-align: center;
    }

#head4 img {
    width: 40px;
}

#head4 .col-md-4 {
    border-right: #f5ed7b solid 2px;
    height: 160px;
}

.l1 li {
    line-height: 40px;
}
/*******************/
.social-icon li img {
    /* width: 30px !important; */
    height: 32px;
    /* padding-bottom: 6px; */
    /* padding-top: 10px; */
    margin-top: -7px;
}

.social-icon {
    color: black;
}

    .social-icon li {
        list-style: none;
        display: inline-block;
    }

        .social-icon li a {
            color: black;
            font-weight: 600;
        }

            .social-icon li a:hover {
                background: none !important;
                border-radius: 100% !important;
            }

        .social-icon li a {
            border: 2px solid #6d894c;
            font-size: 20px;
            width: 40px;
            height: 40px;
            border-radius: 100%;
            text-align: center;
            text-decoration: none;
            padding-top: 9px;
        }

.headercrm {
    background: url(../img/backsite2.jpg);
    background-position: center;
    background-size: cover;
    height: auto;
    color: white;
    width: 100%;
    height: 100%;
}

.backcontent {
    margin-top: 20px;
}

.backcontent {
    padding-top: 30px !important;
}

    .backcontent h1 {
        color: #000;
        font-size: 24px;
        margin-top: 10px;
    }

.pad15 {
    padding-bottom: 15px;
}

.catalog {
    background: rgb(255, 165, 0) none repeat scroll 0% 0% !important;
    color: rgb(255, 255, 255) !important;
    margin-left: 20px;
}
/*******************/
#services {
    background-color: #f5f5f5;
    min-height: 600px;
    padding-top: 30px;
    padding-bottom: 30px;
}

section h2.section-heading {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 30px;
}

section h2.section-heading {
    margin-top: 0;
    margin-bottom: 20px;
    font-size: 30px;
    text-align: center !important;
}

.hearttitle {
    margin-top: 0px;
    margin-bottom: 20px;
    text-align: center !important;
    display: block;
}

.intro_single_practice {
    width: 55%;
    text-align: justify;
    margin: 0px auto;
    line-height: 1.75em;
}

.drright {
    direction: rtl;
}

#wmt_header {
    margin: 0 0 0 0;
    padding-top: 0px;
}

.padr15 {
    padding-right: 18px;
}

.padt30 {
    padding-top: 30px;
}

#wmt_header .inner {
    height: 590px;
    background: url(../img/screen1.png) no-repeat bottom center;
    position: relative;
}

#wmt_header ul.wmt_icons {
    margin: 0 auto;
    padding: 0;
    display: block;
    position: relative;
    width: 1079px;
    height: 592px;
}

#wmt_header ul li {
    display: block;
    position: absolute;
    text-align: center;
}

    #wmt_header ul li.wmt_li1 {
        top: 62px;
        left: 230px;
    }

    #wmt_header ul li.wmt_li2 {
        top: 170px;
        left: 135px;
    }

    #wmt_header ul li a {
        color: #666;
        font-size: 14px;
        font-weight: 300;
        text-align: right;
        direction: rtl;
        float: right;
    }

    #wmt_header ul li.wmt_li3 {
        top: 267px;
        left: 97px;
    }

    #wmt_header ul li.wmt_li4 {
        top: 394px;
        left: 165px;
    }

    #wmt_header ul li.wmt_li5 {
        top: 492px;
        left: 240px;
    }

    #wmt_header ul li.wmt_li6 {
        top: 62px;
        left: 640px;
    }

    #wmt_header ul li.wmt_li7 {
        top: 170px;
        left: 727px;
    }

    #wmt_header ul li.wmt_li8 {
        top: 267px;
        left: 747px;
    }

    #wmt_header ul li.wmt_li9 {
        top: 394px;
        left: 730px;
        padding-left: 26px;
    }

    #wmt_header ul li.wmt_li10 {
        top: 492px;
        left: 665px;
    }

    #wmt_header ul li a:hover {
        color: #3dabf6;
        text-decoration: none;
    }

    #wmt_header ul li span {
        position: absolute;
        display: block;
        height: 112px;
        width: 112px;
        top: -35px;
        left: -125px;
    }

    #wmt_header ul li.wmt_li1 span {
        background: url(../img/dental_buttons.png) 6px -18px no-repeat !important;
    }

    #wmt_header ul li.wmt_li2 span {
        background: url(../img/dental_buttons.png) 0px -135px no-repeat !important;
        top: -40px;
        left: -115px;
    }

    #wmt_header ul li.wmt_li3 span {
        background: url(../img/dental_buttons.png) -17px -254px no-repeat !important;
        top: -10px;
        left: -100px;
    }

    #wmt_header ul li.wmt_li4 span {
        background: url(../img/dental_buttons.png) -17px -370px no-repeat !important;
        top: -10px;
        left: -100px;
    }

    #wmt_header ul li.wmt_li5 span {
        background: url(../img/dental_buttons.png) -17px -489px no-repeat !important;
        top: -10px;
        left: -95px;
    }

    #wmt_header ul li.wmt_li6 span {
        background: url(../img/dental_buttons.png) -188px -23px no-repeat !important;
        left: 155px;
    }

    #wmt_header ul li.wmt_li7 span {
        background: url(../img/dental_buttons.png) -178px -143px no-repeat !important;
        left: 186px;
        top: -40px;
    }

    #wmt_header ul li.wmt_li8 span {
        background: url(../img/dental_buttons.png) -178px -259px no-repeat !important;
        left: 210px;
        top: -10px;
    }

    #wmt_header ul li.wmt_li9 span {
        background: url(../img/dental_buttons.png) -178px -375px no-repeat !important;
        left: 185px;
        top: -10px;
    }

    #wmt_header ul li.wmt_li10 span {
        background: url(../img/dental_buttons.png) -178px -494px no-repeat !important;
        left: 145px;
        top: -10px;
    }

    #wmt_header ul li.wmt_li11 span {
        background: url(../img/dental_buttons.png) 5px -600px no-repeat !important;
        left: 115px;
        top: -20px;
    }

    #wmt_header ul li.wmt_li1 span:hover {
        background: url(../img/dental_buttons.png) -313px -18px no-repeat !important;
    }

    #wmt_header ul li.wmt_li2 span:hover {
        background: url(../img/dental_buttons.png) -319px -135px no-repeat !important;
    }

    #wmt_header ul li.wmt_li3 span:hover {
        background: url(../img/dental_buttons.png) -335px -254px no-repeat !important;
    }

    #wmt_header ul li.wmt_li4 span:hover {
        background: url(../img/dental_buttons.png) -335px -370px no-repeat !important;
    }

    #wmt_header ul li.wmt_li5 span:hover {
        background: url(../img/dental_buttons.png) -335px -489px no-repeat !important;
    }

    #wmt_header ul li.wmt_li6 span:hover {
        background: url(../img/dental_buttons.png) -505px -23px no-repeat !important;
    }

    #wmt_header ul li.wmt_li7 span:hover {
        background: url(../img/dental_buttons.png) -495px -143px no-repeat !important;
    }

    #wmt_header ul li.wmt_li8 span:hover {
        background: url(../img/dental_buttons.png) -495px -259px no-repeat !important;
    }

    #wmt_header ul li.wmt_li9 span:hover {
        background: url(../img/dental_buttons.png) -497px -375px no-repeat !important;
    }

    #wmt_header ul li.wmt_li10 span:hover {
        background: url(../img/dental_buttons.png) -496px -494px no-repeat !important;
    }

    #wmt_header ul li.wmt_li11 span:hover {
        background: url(../img/dental_buttons.png) -313px -600px no-repeat !important;
    }
/**************/
#feature3 {
    background: #0d99d6 url(../img/wew.png) top center;
    background-size: cover;
    padding-bottom: 50px;
    padding-top: 50px;
}

.left_your_data {
    text-align: center;
    margin: 0 auto;
    font-size: 14px;
    line-height: 30px;
    padding-top: 20px;
}
/*************/
#Multi_Practices {
    background-color: #fff;
    padding-bottom: 50px;
    padding-top: 80px;
    height: auto;
}

    #Multi_Practices h1, strong {
        font-size: 24px;
    }

.chart {
    position: relative;
    display: inline-block;
    width: 110px;
    height: 110px;
    margin-top: 50px;
    text-align: center;
    background: url(../img/canvas.png);
}

    .chart canvas {
        position: absolute;
        top: 0;
        left: 0;
    }
/**************/
#fe {
    padding-bottom: 50px;
    padding-top: 80px;
}

#fe1 {
    padding-bottom: 20px;
    padding-top: 20px;
}

#fe2 {
    padding-bottom: 20px;
    padding-top: 20px;
}

#fe3 {
    padding-bottom: 20px;
    padding-top: 20px;
}

.boxfeature {
    display: flex;
    background-color: #F0F2F6;
    margin-bottom: 10px;
    color: #333;
    border-radius: 5px;
}

.contentf {
    display: inline;
    float: right;
    padding-right: 22px;
    padding-top: 20px;
}
/*****************/
.whimg {
    width: 120px;
    display: block;
    margin: 0px auto;
    height: 120px;
    border: 1px solid #ccc;
    transition: all 0.2s ease-in-out 0s;
}

.contentf {
    display: inline;
    float: right;
    padding-right: 22px;
    padding-top: 20px;
}

.imgfeature {
    width: 80px;
    display: inline-block;
    float: right;
}

.boxfeature {
    display: flex;
    background-color: #F0F2F6;
    margin-bottom: 10px;
    color: #333;
    border-radius: 5px;
}

.featur li {
    text-align: justify;
    list-style: none;
    font-size: 15px;
    padding: 4px;
}

.whimg {
    width: 120px;
    display: block;
    margin: 0px auto;
    height: 120px;
    border: 1px solid #ccc;
    transition: all 0.2s ease-in-out 0s;
}

    .whimg:hover {
        cursor: pointer;
    }

.i1 {
    background: url(../img/b1.png) no-repeat scroll center;
}

.i2 {
    background: url(../img/b2.png) no-repeat scroll center;
}

.i3 {
    background: url(../img/b3.png) no-repeat scroll center;
}

.i4 {
    background: url(../img/b4.png) no-repeat scroll center;
}

.i5 {
    background: url(../img/b5.png) no-repeat scroll center;
}

.i6 {
    background: url(../img/b6.png) no-repeat scroll center;
}

.i7 {
    background: url(../img/b7.png) no-repeat scroll center;
}

.i8 {
    background: url(../img/b8.png) no-repeat scroll center;
}

.i9 {
    background: url(../img/b9.png) no-repeat scroll center;
}

.i10 {
    background: url(../img/b10.png) no-repeat scroll center;
}

.i11 {
    background: url(../img/b11.png) no-repeat scroll center;
}

.i12 {
    background: url(../img/b12.png) no-repeat scroll center;
}

/*.i1:hover {
    background: url(../img/b1w.png) no-repeat scroll center #089785;
}

.i2:hover {
    background: url(../img/b2w.png) no-repeat scroll center #089785;
}

.i3:hover {
    background: url(../img/b3w.png) no-repeat scroll center #089785;
}

.i4:hover {
    background: url(../img/b4w.png) no-repeat scroll center #089785;
}

.i5:hover {
    background: url(../img/b5w.png) no-repeat scroll center #089785;
}

.i6:hover {
    background: url(../img/b6w.png) no-repeat scroll center #089785;
}

.i7:hover {
    background: url(../img/b7w.png) no-repeat scroll center #089785;
}

.i8:hover {
    background: url(../img/b8w.png) no-repeat scroll center #089785;
}

.i9:hover {
    background: url(../img/b9w.png) no-repeat scroll center #089785;
}

.i10:hover {
    background: url(../img/b10w.png) no-repeat scroll center #089785;
}

.i11:hover {
    background: url(../img/b11w.png) no-repeat scroll center #089785;
}

.i12:hover {
    background: url(../img/b12w.png) no-repeat scroll center #089785;
}*/
.hoverbox p {
    text-align: center;
}

.hover-image > strong {
    padding-right: 60px;
    color: white !important;
}
/*****************/
.table thead tr th {
    padding: 15px;
    border: none;
    font-family: IRANSans, "Montserrat", "Open Sans", "Helvetica Neue", Helvetica, sans-serif;
    font-size: 11px !important;
    font-weight: 400 !important;
    text-transform: uppercase;
    color: #fff;
}

.table > thead > tr > th {
    vertical-align: bottom;
    border-bottom: 2px solid #ddd;
}

.table thead {
    border: none;
    background: #111;
}

.table-responsive {
    min-height: .01%;
    overflow: unset !important;
}
/******************/
/* fallback */
@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: local('Material Icons'), local('MaterialIcons-Regular'), url('../fonts/material.woff2') format('woff2');
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}
/*moduls*/
.modules {
    padding-top: 50px;
    padding-bottom: 80px;
}

.column {
    padding: 0 0.9375rem;
    box-sizing: border-box;
}

.modules li {
    position: relative;
    text-align: left;
    vertical-align: top;
    background: #f5f5f5;
    padding: 14px 10px 8px 10px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    box-sizing: border-box;
    cursor: pointer;
    margin-bottom: 10px;
}

    .modules.expanded li.open, .modules li div {
        -webkit-box-shadow: 0 2px 2px rgba(24, 24, 24, 0.25);
        -moz-box-shadow: 0 2px 2px rgba(24, 24, 24, 0.25);
        box-shadow: 0 2px 2px rgba(24, 24, 24, 0.25);
    }

        .modules li:before, .modules li div:before {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            width: 3px;
            height: 100%;
            -webkit-border-bottom-left-radius: 3px;
            -moz-border-bottom-left-radius: 3px;
            border-top-bottom-radius: 3px;
        }

.modules [class^=icon-] {
    background-image: url(../Upload/icons.svg);
    background-size: 50px auto;
    background-repeat: no-repeat;
    vertical-align: bottom;
    min-width: 52px;
    height: 48px;
    margin-left: 0.625rem;
    float: right;
}

.icon-intramural {
    background-position: 0% 33%;
}

.modules .modules-open-icon {
    position: absolute;
    left: 0.9375rem;
    top: 76px;
    display: block;
    cursor: pointer;
    opacity: 1;
    color: #9e9e9e;
    font-size: 16px;
    border: 2px solid #9e9e9e;
    -webkit-border-radius: 1rem;
    -moz-border-radius: 1rem;
    border-radius: 1rem;
}

.modules-red li:before, .modules-red li div:before {
    background: #f26c6b;
}

.modules-blue li:before, .modules-blue li div:before {
    background: #0084cb;
}

.modules-green li:before, .modules-green li div:before {
    background: #12b28e;
}

.modules-purple li:before, .modules-purple li div:before {
    background: #8372b2;
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

.margb30 {
    margin-bottom: 30px;
}

.margb45 {
    margin-bottom: 45px;
}

.modules li > p {
    color: #1e1e1e;
    height: 88px;
    font-size: 16px;
    overflow: hidden;
    text-align: right;
    margin-bottom: 10px;
    margin-left: 20px;
    font-weight: 500;
}

.modules li small {
    white-space: normal;
}

.modules li.open div, .modules li small {
    display: block;
    font-size: 14px;
    color: #5a5a5a;
    padding-top: 0.3125rem;
}

.modules li div {
    display: none;
    position: absolute;
    top: 100px;
    left: 0;
    right: 0;
    background: #f5f5f5;
    z-index: 99;
    padding: 0.3125rem 0.3125rem 0.3125rem 0.825rem;
}

.nav > li > a:hover, .nav > li > a:focus {
    background: none !important;
}

.modules li div > p {
    padding-top: 10px;
    padding-right: 5px;
    text-align: right;
    direction: rtl;
}

.mrg100 {
    margin-top: -100px;
}

.materialdemo {
    position: absolute;
    right: 32%;
    margin-top: 0px;
}

.materiala {
    width: 160px;
    height: 40px;
    border: 1px solid;
    padding-top: 10px;
    margin-top: 20px;
}

    .materiala:hover {
        background: #ccc;
        color: #fff;
    }

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

.modules li:after {
    content: '';
    display: block;
    clear: both;
}

.text-center {
    text-align: center;
}
/*icon*/
[class^="clients-"], [class^="all-clients-"] {
    display: inline-block;
    width: 150px;
    height: 100px;
    background-image: url("../Upload/clients-small.png");
    background-repeat: no-repeat;
    background-size: 912px auto;
    margin-bottom: 0.3125rem;
    position: relative;
    margin-left: 50%;
}

.clients-stanford {
    background-position: 0px 0px;
}

.icon-membership {
    background-position: 50% 0px;
}

.icon-facility {
    height: 29px;
    background-position: -0.5% 8.5%;
}

.icon-fac-scheduling {
    height: 29px;
    background-position: 20% 16.5%;
}

.icon-locker {
    height: 28px;
    padding-top: 1px;
    background-position: 30% 24.75%;
}

.icon-intramural {
    background-position: 0% 33%;
}

.icon-club {
    background-position: 0% 41%;
}

.icon-personal {
    background-position: 0% 49%;
}

.icon-class {
    background-position: 0% 57.5%;
}

.icon-event {
    background-position: 0% 66%;
}

.icon-sale {
    background-position: 0% 74.1%;
}

.icon-equipment {
    background-position: 9% 82.75%;
    min-height: 52px;
}

.icon-employees {
    background-position: 30% 90.75%;
}

.icon-reports {
    width: 22px;
    background-position: 30% 99.5%;
}

.material-icons span {
    font-size: 13px !important;
}
/******************/
.advantages, .testimonials {
    color: #FFF;
    line-height: 30px;
}

.advantages {
    padding-top: 30px;
    padding-bottom: 30px;
    background-image: url(../img/hd-advantages.jpg);
}

    .advantages ul li {
        padding-top: 30px;
        margin-top: 20px;
    }

        .advantages ul li h4 {
            padding-top: 30px;
            margin-top: 20px;
        }
/******************/
#service3 img {
    width: 100px;
    height: 100px;
    margin: 0 auto;
}

#service3 a {
    text-decoration: none;
    color: black !important;
    padding-top: 20px;
    text-align: center;
}

#service3 {
    padding-bottom: 60px;
    padding-top: 30px;
}
/**************/
#footer .fa .fa-angle-left {
    margin-left: 5px !important;
}

#footer {
    border: 2px solid repeating-linear-gradient(270deg,#9079e1 0,#2cd6aa 10%,#28aff8 20%,#9079e1 30%);
}

.social-icon li a:hover {
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    background: none;
}

#footer a:hover {
    color: #fff;
    border-bottom-color: #777;
}

.social-icon .fa-twitter {
    border-color: #55acee;
    background: #55acee !important;
}

.social-icon .fa-instagram {
    border-color: #3f729b;
    background: #3f729b !important;
}

.social-icon .fa-linkedin {
    border-color: #08c;
    background: #08c !important;
}

.social-icon .fa-google-plus {
    border-color: #ea2d2d;
    background: #ea2d2d !important;
}

/**********************/
#drop li {
    padding-top: 20px;
}

    #drop li a {
        font-weight: 500;
        padding-right: 5px;
    }

    #drop li img {
        font-weight: 500;
        margin-left: 10px;
    }
/*************/
#service1 img {
    width: 120px;
}
/*************/
#footer .fa-angle-left {
    padding-left: 5px;
}

.ui.button {
    cursor: pointer;
    display: inline-block;
    min-height: 1em;
    outline: 0;
    border: none;
    vertical-align: baseline;
    background: #E0E1E2;
    color: rgba(0,0,0,.6);
    font-family: IRANSans !important;
    margin: 0 .25em 0 0;
    padding: .78571429em 1.5em;
    text-transform: none;
    text-shadow: none;
    font-weight: 700;
    line-height: 1em;
    font-style: normal;
    text-align: center;
    text-decoration: none;
    border-radius: .28571429rem;
    box-shadow: 0 0 0 1px transparent inset, 0 0 0 0 rgba(34,36,38,.15) inset;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: opacity .1s ease,background-color .1s ease,color .1s ease,box-shadow .1s ease,background .1s ease;
    transition: opacity .1s ease,background-color .1s ease,color .1s ease,box-shadow .1s ease,background .1s ease;
    will-change: '';
    -webkit-tap-highlight-color: transparent;
}
/*************/
#h3 {
    font-size: 22px;
    margin-top: 80px;
    margin-bottom: 80px;
}

.khalaghiyat {
    font-weight: 600;
    display: inline;
}

#text {
    margin-top: 20px;
    margin-bottom: 40px;
}

.font {
    font-size: 18px;
}
/*************************/
.bg-grey {
    background: #ececec;
    margin-top: 80px;
}

p.title {
    font-size: 20px !important;
    margin-bottom: 0 !important;
    margin-top: 30px !important;
}

#we-do h2 {
    margin-bottom: 50px !important;
}

h2.heading {
    margin-bottom: 50px;
}

.we-do .do-wrap {
    text-align: center;
}

.we-do .do-wrap, .white-box {
    background: #fff;
    -webkit-box-shadow: 0 1px 1px 0 #ddd;
    -ms-box-shadow: 0 1px 1px 0 #ddd;
    box-shadow: 0 1px 1px 0 #ddd;
}


    .we-do .do-wrap > span {
        width: 100%;
        height: 72px;
        display: block;
    }


    .we-do .do-wrap i {
        border-radius: 100px;
        color: #fff;
        display: inline-block;
        font-size: 40px;
        height: 100px;
        line-height: 99px;
        margin-bottom: 40px;
        margin-top: -50px;
        width: 100px;
    }

    .we-do .do-wrap p, .white-box p {
        font-size: 14px !important;
        margin: 45px 45px 45px;
        text-align: justify !important;
    }

.we-do > div:nth-child(1) > .do-wrap > span, .we-do > div:nth-child(1) > .do-wrap > i {
    background: #31AAE1;
}

.we-do > div:nth-child(2) > .do-wrap > span, .we-do > div:nth-child(2) > .do-wrap > i {
    background: #c183d6;
}

.we-do > div:nth-child(3) > .do-wrap > span, .we-do > div:nth-child(3) > .do-wrap > i {
    background: #ec768c;
}

.we-do > div:nth-child(4) > .do-wrap > span, .we-do > div:nth-child(4) > .do-wrap > i {
    background: #74c8b8;
}
/******************/
#responsive {
    padding-top: 50px;
    padding-bottom: 40px;
}

    #responsive .responsive-pic > .col-md-6 > img {
        margin-top: 10px;
    }

    #responsive .r-test h3, #responsive .r-test h4 {
        color: #222222;
    }

    #responsive .r-test h3 {
        margin-bottom: 22px;
    }

.r-test ul.r-feature li {
    color: #1b1d1f;
    display: inline-block;
    font-size: 18px;
    padding-right: 30px;
    text-transform: capitalize;
    width: 48%;
    margin-bottom: 15px;
}

    .r-test ul.r-feature li:before {
        display: inline-block;
        margin-right: -30px;
        vertical-align: middle;
        margin-left: 10px;
    }

.responsive-pic .fa-check-circle {
    color: forestgreen !important;
    font-size: 20px !important;
    margin-left: 10px;
}

.screens .fa {
    font-size: 60px !important;
}

h1, h2, h3, h4, h5, h6 {
    font-family: IRANSans !important;
}
/**********ALFANO*******/
#home1 .container img {
    margin: 0 auto;
    width: 487px;
    padding-top: inherit;
    padding-bottom: inherit;
}

#home2 .container img {
    padding-top: inherit;
    margin: 0 auto;
    width: 487px;
    height: 310px;
    padding-bottom: inherit;
}

#home3 .container img {
    padding-top: inherit;
    margin: 0 auto;
    width: 477px;
    height: 402px;
    padding-bottom: inherit;
}

#home4 .container img {
    padding-top: inherit;
    margin: 0 auto;
    padding-bottom: inherit;
    height: 380px;
}

#home1 {
    text-align: center;
    background: url('../img/pattern.png')#30bdbb;
    padding-top: 10%;
    padding-bottom: 10%;
    background-position: center;
    height: auto;
    color: white;
    width: 100%;
}




    #home1 h3 {
        color: white;
        margin-bottom: 30px;
    }

#home2 {
    text-align: center;
    background: url('../img/pattern.png') #f0de1d;
    padding-top: 10%;
    padding-bottom: 10%;
    background-position: center;
    height: auto;
    color: white;
    width: 100%;
}

    #home2 h3 {
        color: white;
        margin-bottom: 30px;
    }

#home3 {
    text-align: center;
    background: url('../img/pattern.png') #1ba0ec;
    padding-top: 10%;
    padding-bottom: 10%;
    background-position: center;
    height: auto;
    color: white;
    width: 100%;
}

    #home3 h3 {
        color: white;
        margin-bottom: 30px;
    }

#home4 {
    text-align: center;
    background: url('../img/pattern.png') #d05a51;
    padding-top: 10%;
    padding-bottom: 10%;
    background-position: center;
    height: auto;
    color: white;
    width: 100%;
}

    #home4 h3 {
        color: white;
        margin-bottom: 30px;
    }


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

    .custom-navbar .navbar-brand img {
        height: 50px;
        margin-right: 0px;
        margin-left: 0px;
    }

    #home1 {
        padding-top: 35%;
        padding-bottom: 35%;
    }




    #home2 {
        padding-top: 35%;
        padding-bottom: 35%;
    }


    #home3 {
        padding-top: 35%;
        padding-bottom: 35%;
    }


    #home4 {
        padding-top: 35%;
        padding-bottom: 35%;
    }
}


@media screen and (max-width: 320px) {
    .custom-navbar .navbar-brand img {
        height: 50px;
        margin-right: 0px;
        margin-left: 0px;
    }

    #home1 {
        padding-top: 35%;
        padding-bottom: 35%;
    }




    #home2 {
        padding-top: 35%;
        padding-bottom: 35%;
    }


    #home3 {
        padding-top: 35%;
        padding-bottom: 35%;
    }


    #home4 {
        padding-top: 35%;
        padding-bottom: 35%;
    }

    #subnav {
        display: block !important;
        position: absolute !important;
        bottom: -50% !important;
        left: 50% !important;
        margin-left: -16px !important;
        width: 34px !important;
        height: 66px !important;
        cursor: pointer !important;
    }
}


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

    #home4 .container img {
        margin: 0 auto;
        height: 250px;
    }

    #home {
        padding-top: 320px;
        padding-bottom: 320px;
    }

        #home h1 {
            font-size: 22px;
        }

        #home h3 {
            font-size: 16px;
            padding-bottom: 20px;
        }

    #home1 h3 {
        font-size: 16px;
        padding-bottom: 20px;
    }

    #home2 h3 {
        font-size: 16px;
        padding-bottom: 20px;
    }

    #home3 h3 {
        font-size: 16px;
        padding-bottom: 20px;
    }

    #home4 h3 {
        font-size: 16px;
        padding-bottom: 20px;
    }

    #home1 {
        padding-top: 35%;
        padding-bottom: 35%;
    }


    #home2 {
        padding-top: 35%;
        padding-bottom: 35%;
    }


    #home3 {
        padding-top: 35%;
        padding-bottom: 35%;
    }


    #home4 {
        padding-top: 35%;
        padding-bottom: 35%;
    }
}

@media screen and (max-width: 768px) {
    #head5 hr {
        display: none;
    }

    #head3 hr {
        display: none;
    }

    #head3 .triangle-0 {
        display: none;
    }

    #head3 .triangle-2 {
        display: none;
    }

    #head3 h4 {
        padding: 0px !important;
    }

    #head3 #hr {
        display: none;
    }

    #head3 #hr0 {
        display: none;
    }

    #head5 .triangle-1 {
        display: none;
    }

    #head5 .triangle-2 {
        display: none;
    }

    #head5 #hr0 {
        display: none;
    }

    #head5 #hr {
        display: none;
    }

    .shool {
        text-align: center !important;
    }

    .navbar-toggle {
        background: #079581 !important;
    }

    #mc-embedded-subscribe {
        height: 41px;
        border: none !important;
        border-radius: 4px 0 0 4px !important;
        background: #56c45f !important;
        position: absolute !important;
        top: 70px !important;
        left: 68px !important;
        width: 28% !important;
        font-size: 10px;
    }

    #head1 img {
        width: 100px !important;
        text-align: center !important;
    }

    #home1 {
        padding-top: 35%;
        padding-bottom: 35%;
    }




    #home2 {
        padding-top: 35%;
        padding-bottom: 35%;
    }


    #home3 {
        padding-top: 35%;
        padding-bottom: 35%;
    }


    #home4 {
        padding-top: 35%;
        padding-bottom: 35%;
    }
}

#w .container .box {
    padding-top: 15px;
    padding-bottom: 60px;
}

.roemove {
    visibility: hidden;
}

.gradient-bar {
    position: relative;
    bottom: 62px;
    height: 3px;
    background-image: repeating-linear-gradient(270deg,#9079e1 0,#2cd6aa 25%,#28aff8 50%,#9079e1);
}

/*.userlogin::after, .userlock::after {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: #f3f3f3 none repeat scroll 0 0;
    border-image: none;
    border-style: none solid solid none;
    border-width: medium 0 1px medium;
    bottom: 18px;
    content: " ";
    display: block;
    height: 12px;
    position: absolute;
    right: 44px;
    transform: rotate(45deg);
    width: 12px;
    z-index: 1;
}



.userlogin {
    background: #f3f3f3 none repeat scroll 0 0;
    border: 1px solid #ccc;
    font-size: 24px;
    line-height: 48px;
    padding-left: 15px;
    padding-right: 15px;
    position: absolute;
}*/
#mce-EMAIL {
    border: 1px solid #e4e4e4 !important;
    border-radius: 4px;
    color: #fff !important;
    box-shadow: none;
    font-size: 13px;
    font-weight: normal;
    padding: 10px !important;
    width: 70% !important;
}

#mc-embedded-subscribe {
    height: 41px;
    border: none !important;
    border-radius: 4px 0 0 4px !important;
    background: #56c45f !important;
    position: absolute;
    top: 70px;
    left: 98px;
}

#footer {
    position: relative;
}

.social-icon {
    position: relative;
}

@media screen and (min-width: 779px) {
    #digit {
        margin-right: 100px;
    }
}

#blog {
    background: url('../img/workspace-with-laptop-tablet-and-notebook_1088-500.jpg');
    background-position: center;
    background-size: cover;
    height: 100vh;
    color: white;
    width: 100%;
    padding-top: 140px;
    background-attachment: fixed;
}

.margtb50 {
    margin-top: 50px;
    margin-bottom: 50px;
}

.blogcontent {
    margin-bottom: 30px;
    position: relative;
}

.footerblog1 {
    background: #242c39;
    height: 60px;
    position: relative;
    bottom: 42px;
}

    .footerblog1 p {
        color: white !important;
        text-align: right;
        padding-right: 10px;
        padding-top: 14px;
    }

.footerblog2 p {
    color: white !important;
    text-align: right;
    padding-right: 10px;
    padding-top: 14px;
}

.footerblog3 p {
    color: white !important;
    text-align: right;
    padding-right: 10px;
    padding-top: 14px;
}

.footerblog2 {
    background: #242c39;
    height: 60px;
    position: relative;
    bottom: 42px;
}

.footerblog3 {
    background: #242c39;
    height: 60px;
    position: relative;
    bottom: 42px;
}
/*************************/
#loginpage {
    background-attachment: fixed;
    background-image: url("../img/login-bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}

.padt200 {
    padding-top: 200px;
}
/*****************************************/
/*blog******************************/
#blogArchive .feed {
    /*display: -webkit-box;
    display: -ms-flexbox;
    display: flex;*/
    flex-direction: row;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

#blogArchive .articlepanel {
    margin-bottom: 30px;
    float: right;
}

.thumbnails {
    width: 100%;
}

.bloga {
    font-size: 18px;
    color: #222;
    padding: 8px 30px;
    border: 1px solid #222;
}

    .bloga:hover {
        cursor: pointer;
    }

#blogArchive .feed .basein {
    display: block;
    width: 100%;
    -webkit-transition: .3s ease-out;
    transition: .3s ease-out;
    border-radius: 0 0 8px 8px;
    background-color: white;
}

#blogArchive .feed img {
    height: 233px !important;
    border-radius: 8px 8px 0 0;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

#blogArchive .feed .caption {
    position: relative;
    padding: 26px 26px 40px;
    border-width: 0 1px;
    border-style: solid;
    border-color: #e5e5e5;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 2px 0 rgba(0,2,3,.1);
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

    #blogArchive .feed .caption span {
        font-size: 13px;
        position: absolute;
        bottom: 26px;
        left: 26px;
        text-transform: uppercase;
        color: #9d9d9d;
    }

#blogArchive .feed .thumbnail {
    display: block;
    margin-bottom: 20px;
    line-height: 1.42857;
    border-radius: 4px;
    transition: border 0.2s ease-in-out 0s;
    background: none;
    border: none;
    padding: 0px;
    margin-bottom: 0px;
}


#blogArchive .feed .basein:hover {
    color: #000;
    box-shadow: 0 18px 24px rgba(1,3,4,.1);
}
/*blog responsive*/
@media (min-width: 1025px) {
    #blogArchive .articlepanel {
        width: 33.3333% !important;
    }

    #blogArchive h6 {
        font-size: 20px;
        margin: 0 0 12px;
    }
}

@media (min-width: 768px) {
    #blogArchive .articlepanel {
        /*display: -webkit-box;
        display: -ms-flexbox;
        display: flex;*/
        width: 50%;
        padding: 0 35px;
        -ms-flex-item-align: stretch;
        align-self: stretch;
    }

        #blogArchive .articlepanel .basein {
            /*display: -webkit-box;
        display: -ms-flexbox;
        display: flex;*/
            flex-direction: column;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
            -ms-flex-direction: column;
        }
}
/****************/
.mbody {
    margin-top: 150px;
    min-height: 400px;
}

.margnew {
    margin-top: 50px;
}

.boxnews {
    border: 1px solid #ccc;
    box-shadow: 2px 2px #ccc;
    padding: 10px;
    margin-bottom: 20px;
    border-radius: 15px;
}

.divkhabarnew {
    min-height: 200px;
    padding-top: 20px;
    background-color: #FFFFFF;
}

.divkhabar {
    height: 155px;
    overflow: hidden;
    text-align: justify;
    padding-top: 8px;
}

.divkhabarnew img {
    border-radius: 6px;
    box-shadow: -3px 3px 3px #454545;
    margin-left: 10px;
    max-height: 150px;
}

.divkhabar img {
    border-color: Silver;
    height: 125px;
    width: 125px;
    border-width: 0px;
    border-radius: 50%;
    box-shadow: -3px 3px 3px #454545;
    margin-left: 10px;
}

.boxnews p {
    line-height: 30px;
    padding: 20px;
    text-align: justify;
}

.truncate {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/************/

/*hardeware*/
.boxhardware {
    position: relative;
    width: 100%;
    height: auto;
    margin-top: 50px;
    border: 1px solid #EDEDED;
    margin-bottom: 20px;
    border-radius: 5px 5px;
    box-shadow: 2px 2px #EDEDED;
    padding-top: 30px;
    padding: 10px;
}

.hardwarimg {
    background: #f4f4f4;
    padding: 20px;
    margin-left: 20px;
}

    .hardwarimg img {
        width: 100%;
        height: auto;
    }

.boxhardware .title {
    position: relative;
    width: 95%;
    height: auto;
    padding: 10px;
    background: #f4f4f4;
}

.boxhardware .description {
    width: 100%;
    padding: 5% 0% 5% 5%;
    height: auto;
}

.description ul {
    padding: 0;
    margin: 0;
}

.description li {
    padding-top: 10px;
}

.boxhardware .buttonhold {
    width: 100%;
    float: left;
    height: 60px;
}

.btnleft {
    float: left;
    margin-left: 5%;
}

#cwithe {
    height: 45px;
    border-bottom-left-radius: 50px;
    border-top-right-radius: 50px;
    border-top-left-radius: 50px;
    margin: 10px;
    width: 120px;
    border: 1px solid #fff;
}

#contact1 p {
    font-size: 15px !important;
}

#web {
    background-color: #000000;
    text-align: center;
    padding-top: 100px;
    background-position: center;
    height: auto;
    color: white;
    width: 100%;
    background-attachment: fixed;
}

    #web img {
        width: 100%;
        transition: all 0.4s ease-in-out;
    }

        #web img:hover {
            opacity: 0.5;
        }
/* FILTER CSS */

.filter-wrapper {
    width: 100%;
    margin: 40px 0 24px 0;
    overflow: hidden;
    text-align: center;
}

    .filter-wrapper li {
        display: inline-block;
        margin: 4px;
    }

        .filter-wrapper li a {
            color: #999999;
            font-size: 13px;
            font-weight: bold;
            letter-spacing: 2px;
            text-transform: uppercase;
            padding: 8px 17px;
            display: block;
            text-decoration: none;
            transition: all 0.4s ease-in-out;
        }

            .filter-wrapper li .selected,
            .filter-wrapper li a:focus,
            .filter-wrapper li a:hover {
                color: #00c6d7;
                outline: none;
            }

/* ISOTOPE BOX CSS */
.iso-box-section {
    width: 100%;
}

.iso-box-wrapper {
    width: 100%;
    padding: 0;
    /*  clear: both;*/
    position: relative;
}

.iso-box {
    position: relative;
    min-height: 50px;
    float: left;
    overflow: hidden;
    margin-bottom: 20px;
}

    .iso-box > a {
        display: block;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .iso-box > a {
        display: block;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

.fluid-img {
    width: 100%;
    display: block;
}

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

    .owl-carousel.owl-rtl .owl-item .item img {
        margin: auto;
        width: 100% !important;
        height: 200px;
    }

    div.column {
        width: 100% !important;
        padding: 30px;
        padding-right: 12px !important;
        float: right;
        background-color: #0ec72a;
        text-align: justify;
        height: auto !important;
        direction: rtl;
        color: white;
        font-size: 17px;
        margin-top: unset !important;
    }

    .owl-carousel.owl-rtl .owl-item .item img {
        margin: auto;
        width: 100% !important;
        height: 200px;
    }

    .carousel-inner > .item > img, .carousel-inner > .item > a > img {
        line-height: 1;
        width: 100%;
        height: auto !important;
    }

    .carousel-control .fa-chevron-right {
        right: 10px !important;
        width: 38px;
        height: 38px;
        margin-top: -15px;
        font-size: 16px;
        padding-top: 8px;
        color: #fff;
        border: 3px solid #ffffff;
        -webkit-border-radius: 23px;
        -moz-border-radius: 23px;
        border-radius: 53px;
    }

    .owl-carousel.owl-rtl .owl-item .item img {
        margin: auto;
        width: 100% !IMPORTANT;
        height: 200px;
    }

    .con {
        width: 100% !important;
    }

    .carousel-control .fa-chevron-left {
        right: 10px !important;
        width: 38px;
        height: 38px;
        margin-top: -15px;
        font-size: 16px;
        padding-top: 8px;
        color: #fff;
        border: 3px solid #ffffff;
        -webkit-border-radius: 23px;
        -moz-border-radius: 23px;
        border-radius: 53px;
    }

    .search-wrapper .input-holder {
        position: absolute;
        top: -65px;
        right: -35px;
    }
}

.btn-min-block {
    min-width: 170px;
    line-height: 26px;
}

.btn-clear {
    color: #FFF;
    background-color: transparent;
    border-color: #FFF;
    margin-right: 15px;
}

    .btn-clear:hover {
        color: #000;
        background-color: #FFF;
    }


/* Carousel Styles */
.carousel-indicators .active {
    background-color: #2980b9;
}


.carousel-fade .carousel-inner .item {
    -webkit-transition-property: opacity;
    transition-property: opacity;
}

.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
    opacity: 0;
}

.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
    opacity: 1;
}

    .carousel-fade .carousel-inner .next,
    .carousel-fade .carousel-inner .prev,
    .carousel-fade .carousel-inner .active.left,
    .carousel-fade .carousel-inner .active.right {
        left: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

.carousel-fade .carousel-control {
    z-index: 2;
}

.carousel-control .fa-chevron-right, .carousel-control .fa-chevron-left {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-block;
}



.carousel-control .fa-chevron-right {
    right: 50%;
    width: 38px;
    height: 38px;
    margin-top: -15px;
    font-size: 16px;
    padding-top: 8px;
    color: #fff;
    border: 3px solid #ffffff;
    -webkit-border-radius: 23px;
    -moz-border-radius: 23px;
    border-radius: 53px;
}

.carousel-control .fa-chevron-left {
    right: 50%;
    width: 38px;
    height: 38px;
    margin-top: -15px;
    font-size: 16px;
    padding-top: 8px;
    color: #fff;
    border: 3px solid #ffffff;
    -webkit-border-radius: 23px;
    -moz-border-radius: 23px;
    border-radius: 53px;
}

.carousel-control.right {
    background: none !important;
    border: none !important;
}

.carousel-control.left {
    background: none !important;
    border: none !important;
}

.carousel-control {
    opacity: 1;
    filter: alpha(opacity=100);
}

.carousel-inner > .item > img, .carousel-inner > .item > a > img {
    line-height: 1;
    width: 100%;
    height: 500px;
}
/* ==========================================================================

/**websample*/
#websample {
    background-color: #000;
    text-align: center;
    padding-top: 150px;
    background-position: center center;
    height: auto;
    color: #FFF;
    width: 100%;
    background-attachment: fixed;
    float: right;
    margin-top: -100px;
}

    #websample .samples {
        width: 33%;
        float: right;
        position: relative;
        text-align: center;
        display: block;
        outline: 0px none !important;
        overflow: hidden;
    }

        #websample .samples .work-overlay {
            position: absolute;
            top: 0px;
            right: 0px;
            width: 101%;
            height: 101%;
            background-color: #ccc;
            opacity: 0;
            z-index: -1;
            transition: opacity 0.3s linear 0s;
            overflow: hidden;
        }

        #websample .samples img {
            -webkit-transition: all 0.5s linear;
            transition: all 0.5s linear;
            -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
            height: 280px;
        }

        #websample .samples:hover img {
            -webkit-transform: scale3d(1.2, 1.2, 1);
            transform: scale3d(1.2, 1.2, 1);
            cursor: pointer;
        }

@media only screen and (max-width: 1024px) {
    #websample .samples {
        width: 33.3333%;
    }
}

@media only screen and (max-width: 640px) {
    #websample .samples {
        width: 100%;
    }
}

#blog {
    background: url('../img/Blog.png');
    background-position: center;
    background-size: cover;
    height: 100vh;
    color: white;
    width: 100%;
    padding-top: 140px;
    background-attachment: fixed;
}

.margtb50 {
    margin-top: 50px;
    margin-bottom: 50px;
}
/********************************/
.renderbody {
    min-height: 392px;
    background: #f3f3f3 !important;
}

.sub-menu > li {
    list-style-type: disc !important;
}

    .sub-menu > li > a {
        display: block;
        width: 100%;
        background-color: white !important;
        color: #999;
        padding: 5px 10px;
    }

        .sub-menu > li > a :hover {
            text-decoration: none !important;
        }

.sub-menu {
    padding-right: 30px;
}

.body-content {
    width: 100%;
    margin: 0px !important;
}

.breadcrumb_container {
    background: #f3f3f3;
    /* padding-top: 30px; */
    margin-top: 15px;
}
/***************************/
.basecontainerResult {
    width: 100%;
    position: relative;
    /*background: #e2e2e2;*/
    padding: 1%;
}

.pad0 {
    padding: 0 !important;
}

.rightside {
    padding: 0 15px 0 0;
    text-align: right;
    border-right: 1px solid #cacaca;
    border-top: 1px solid #cacacaca;
    min-height: 400px;
}

.headeside {
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid #e3e3e3;
}

    .headeside .itemfilter {
        padding: 11px 15px 6px;
    }

        .headeside .itemfilter span {
            top: 20px;
            position: absolute;
        }

label {
    display: inline-block;
    margin-bottom: 5px;
    font-weight: 400 !important;
    font-size: 13px;
}

/*label input[type="checkbox"] {
                display: inline-block !important;


                vertical-align: middle;
                margin-right: 20px;
                cursor: pointer;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-left: 5px;
                border: 1px solid;
            }*/

.checkboxx-filter input {
    float: right;
}

input[type='checkbox'] {
    vertical-align: middle;
    border-radius: 4px;
    padding: 7px 7px 7px 12px;
    margin: 10px 0px 10px 7px;
    width: 20px;
    height: 20px;
}

.product-panel {
    /* box-shadow: 0 1px 2px 0 rgba(0,0,0,.1); */
    background: #fff;
    /* border: 1px solid #ebeced; */
    padding: 20px 0px 0px 0px;
    margin: 0px 0px 30px 0px;
    position: relative;
}


.nav-tabs > li > a:hover {
    background: none !important;
}

.options {
    padding: 0px 20px 5px;
    border-bottom: 1px solid #e3e3e3;
    height: 80px;
    line-height: 16px;
}

.firsttap {
    float: right;
    width: auto;
    display: inline-block;
    line-height: 36px;
}

.tab-content {
    padding-top: 20px;
}

.titleProd {
    position: relative;
    float: right;
    height: 35px;
    padding-left: 8px;
    font-size: 16px;
    font-weight: 500;
}

.secondtap {
    display: inline-block;
    padding-right: 15px;
    vertical-align: 15px;
    position: relative;
}

.options__internal-search {
    display: inline-block;
    border-right: 1px solid #ccc;
    padding-right: 15px;
    vertical-align: 15px;
    position: relative;
}

    .options__internal-search input {
        display: block;
        padding: 4px 10px;
        width: 100%;
        color: #777;
        width: 190px;
    }

.searchinputbox {
    position: absolute;
    color: #999;
    left: 8px;
    top: 8px;
}

.sorting {
    position: absolute;
    float: left;
    left: 0px;
    top: 60px;
}

    .sorting ul {
        float: left;
        margin-right: 20px;
        line-height: 8px;
    }

    /*.sorting li.activeshopsearch {
                border-bottom: 2px solid #2196f3;
            }*/

    .sorting li {
        display: inline-block;
        vertical-align: top;
        text-align: center;
        font-size: 14px;
        padding: 0px 12px 9px;
        cursor: pointer;
    }

        .sorting li a {
            color: #000 !important;
            font-size: 13px !important;
        }

.nav-tabs {
    border-bottom: none !important;
}

.productbox {
    margin-bottom: 10px;
    position: relative;
    padding: 15px 0px;
    height: 350px;
}

    .productbox:hover {
        box-shadow: 0 3px 10px 2px rgba(0,0,0,.15);
    }

.productbox {
    margin-bottom: 10px;
    position: relative;
    padding: 15px 0px;
    height: 350px;
}

.products__item-wrapper {
    display: inline-block;
    transition: box-shadow .15s ease;
    position: relative;
    top: 0;
    background-color: #fff;
    width: 100%;
}

.products__item-image-wrapper {
    display: block;
    position: relative;
    margin: 15px 0px;
    height: 200px;
}

.products__item-info {
    display: block;
    color: #4d4d4d;
    padding: 0 10px;
    font-size: 13px;
    line-height: 20px;
    max-height: 80px;
    min-height: 50px;
    overflow-y: hidden;
    text-align: center;
}

    .products__item-info a {
        color: #222;
        display: block;
    }

.products__item-image-wrapper img {
    display: block;
    height: 100%;
    max-width: 100%;
    margin: auto;
}

.sorting__title {
    position: absolute;
    top: 14px;
    right: -26%;
    font-size: 13px;
}

.paging-warpaper {
    text-align: center;
}

.pagination > li > a, .pagination > li > span {
    background-color: #ffffff;
    color: #000 !important;
}

.pagination > li {
    display: inline;
    font-size: 1.45rem;
}

    .pagination > li:hover {
        border: none !important;
    }

.bodyside {
    padding-top: 15px;
    padding-right: 15px;
}

/*************************/
.Menu > li > ul > li {
    /* border-bottom: 1px solid #d0cccc; */
    padding-top: 5px;
    padding-bottom: 5px;
    display: inline-block !important;
    padding-right: 10px !important;
}

.Menu > .sub-menu {
    padding-right: 0px !important;
}

.Menu > li > ul > li a {
    height: 30px;
    /* background: red; */
    border: 1px solid rgba(195, 177, 177, 0.05);
    border-radius: 100%;
    width: 30px !important;
}

.fite_btn {
    display: inline;
    height: 38px;
    /* margin-top: 15px; */
    background-color: #2196f3;
    color: #fff;
    line-height: 38px;
    border: none !important;
    font-size: 13px;
    /* margin: auto; */
    text-align: center;
    width: 60%;
    margin: 0px 50px;
}

.shadowfont {
    text-shadow: 2px 2px rgb(5, 4, 4);
}

.mix-grid .mix {
    border: medium none;
    width: 47%;
    margin-left: 3%;
    margin-top: 40px;
    padding-bottom: 15px;
    float: right;
    position: relative;
}

.portfolio-slider header {
    text-align: center;
    color: #fff;
    padding-bottom: 20px;
}

.mix-grid .mix .mix-inner.portfolio-slider-wrap {
    position: absolute;
    margin: auto;
    width: 74%;
    right: -2px;
    top: 153px;
    left: 0.5px;
}

    .mix-grid .mix .mix-inner.portfolio-slider-wrap img {
        width: 99.6%;
        max-height: 240px;
        height: 240px;
        padding-right: 10px;
    }

}

.frame {
    width: 100%;
    display: block;
}

    .frame img {
        height: 340px;
    }

@media screen and (min-width: 779px) {

    #contact1 .col-md-3 {
        width: 20% !important;
    }

    #mf {
        position: absolute;
        right: 22%;
    }
}

.CheckBoxBase {
    float: right;
    height: auto;
    background-color: #fff;
    margin-top: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 20px;
}


.header-image {
    background: radial-gradient(circle farthest-corner at left bottom,#ffd08a 0,#ffa376 28%,#d26578 52%,#682a84 79%,#241668 100%);
    height: 100vh;
    padding-bottom: 20px;
    background-position: center;
    background-size: cover;
    /* height: auto; */
    color: white;
    width: 100%;
    padding-top: 150px;
    background-attachment: fixed;
    padding-bottom: 100px;
}

    .header-image img {
        height: 200px;
        width: 100%;
    }

        .header-image img:hover {
            box-shadow: 0 2px 6px 0 rgba(0,0,0,.5);
            transform: scale(1.05);
            transition: .3s ease;
        }

    .header-image .iso-box :hover {
    }

    .header-image h4 {
        text-align: right;
        margin: 30px 0;
        font-size: 1em !important;
        color: #fff;
    }


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

    #testForm {
        margin: 8px !important;
    }

    section {
        height: auto !important;
        position: relative;
    }

    #vision {
        margin-top: 5% !important;
    }

    #mf {
        display: none !important;
    }

    .header-image {
        background: radial-gradient(circle farthest-corner at left bottom,#ffd08a 0,#ffa376 28%,#d26578 52%,#682a84 79%,#241668 100%);
        height: auto !important;
        padding-bottom: 20px;
        background-position: center;
        background-size: cover;
        /* height: auto; */
        color: white;
        width: 100%;
        padding-top: 150px;
        background-attachment: fixed;
        padding-bottom: 100px;
    }

    .entry-title a {
        color: #000 !important;
        text-decoration: none !important;
        font-size: 14px !important;
    }
}


@keyframes crescendoo {
    0% {
        background-color: #ccc;
        color: #000;
    }

    100% {
        background: #4caf50;
        color: #fff;
    }
}


@keyframes crescendo {
    0% {
        background-color: red;
    }

    100% {
        background: #4caf50;
    }
}

.quadrado {
    width: 300px;
    height: 40px;
    animation: crescendo 1.5s alternate infinite ease-in;
}


.side-box {
    position: fixed;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 999;
}

    .side-box .side-button {
        text-align: center;
        padding: 2px 5px;
        background: rgba(215,25,32,.9);
        color: #fefefe;
        font-size: .9em;
        display: block;
        margin: 0 0 15px;
    }



        .side-box .side-button span {
            display: block;
            padding: 5px 0 3px;
            text-decoration: none;
        }

            .side-box .side-button span :hover {
                text-decoration: none !important;
            }

    .side-box .side-button {
        text-align: center;
        padding: 2px 5px !important;
        background: rgba(215,25,32,.9) !important;
        color: #fefefe;
        font-size: .9em;
        display: block;
        margin: 0 0 15px;
        font-weight: 100;
        text-decoration: none;
    }

a {
    transition: color .3s ease,background-color .3s ease;
}

* {
    line-height: inherit;
    text-decoration: none;
}
/**********************/
/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 7% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

    .close:hover,
    .close:focus {
        color: black;
        text-decoration: none;
        cursor: pointer;
    }
/******************************/
#darkhst .form-group {
    margin-bottom: 22px;
}

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

    #myModal .close {
        float: left;
        top: 10%;
        position: absolute;
        left: 10px;
        font-size: 30px !important;
    }

    #darkhst .close {
        font-size: 50px !important;
    }

    #myModal .modal-content {
        height: auto;
        width: 100% !important;
        border-radius: 0;
        margin: 0;
    }

        #myModal .modal-content .col-md-6 {
            border-left: none !important;
        }

    .home .products {
        background-color: #ddd;
        display: none;
    }


    #darkhst .modal-content {
        height: auto;
        width: 100% !important;
        border-radius: 0;
        margin: 0px;
    }


    .mix-grid .mix {
        border: medium none;
        width: 100% !important;
        margin-left: 3%;
        margin-top: 0px !important;
        padding-bottom: 15px;
        float: right;
        position: relative;
    }
}

@media screen and (min-width: 779px) {

    #myModal .modal-content {
        height: 400px;
        width: 50% !important;
        border-radius: 0;
    }

    #darkhst .modal-content {
        height: 400px;
        width: 50% !important;
        border-radius: 0;
    }
}

@media screen and (max-width: 768px) {
    .services2 .item {
        float: right;
        text-align: right;
        width: 100% !important;
        font-size: 120%;
        margin: 25px 0px 0 4%;
        padding: 0px 70px 0 0;
    }

    .classcollapse button {
        background: #fff !important;
        color: #878787;
        border: 3px solid #277ba6;
        font-size: 16px;
        font-size: 1rem;
        font-weight: 600;
        margin: 0;
        position: relative;
        display: block;
        width: 100%;
        height: 300px !important;
    }

    .featuresvoip .item {
        float: right;
        width: 100% !important;
        display: inline-block;
        margin: 25px 0 0 0;
    }

        .featuresvoip .item .right {
            width: 100% !important;
            float: left;
        }

    .services2 {
        background: url(iconvoip/pattern-background.png) #2f4052;
        padding: 50px 0px 60px;
        height: 100vh !important;
    }

    #t1, #t3 {
        height: auto !important;
        background: white;
        /* height: 100vh !important; */
        padding-bottom: 100px;
        clear: both;
    }
}

/**************************************/
.mainvoip {
    padding: 50px 0px;
    background: #f2f5f7;
    margin-top: 80px;
}

    .mainvoip h2 {
        font-size: 22px;
        padding: 0px 0px 0px 0px;
        text-align: center;
        color: #222222;
    }

    .mainvoip h3 {
        padding: 0px 0px 15px 0px;
        text-align: center;
        color: gray;
        font-size: 13px;
    }

    .mainvoip p {
        font-size: 12px;
    }

    .mainvoip h3 span {
        background: url('iconvoip/top-arrow.gif') no-repeat bottom center;
        padding: 10px 0px 13px;
    }

#row3 {
    margin: 10px auto 10px;
    text-align: center;
}

    #row3 h3 {
        font-size: 16px;
    }

    #row3 .img1 {
        background-position: -920px -1360px;
        height: 80px;
        width: 80px;
        display: block;
        background: url('iconvoip/icons.png') no-repeat;
    }

    #row3 .img2 {
        background-position: -840px -1360px;
        height: 80px;
        width: 80px;
        display: block;
        background: url('iconvoip/icons.png') no-repeat;
    }

    #row3 .img3 {
        background-position: -760px -1360px;
        height: 80px;
        width: 80px;
        display: block;
        background: url('iconvoip/icons.png') no-repeat;
    }

    #row3 .img4 {
        background-position: -680px -1360px;
        height: 80px;
        width: 80px;
        display: block;
        background: url('iconvoip/icons.png') no-repeat;
    }

    #row3 .img5 {
        background-position: -600px -1360px;
        height: 80px;
        width: 80px;
        display: block;
        background: url('iconvoip/icons.png') no-repeat;
    }

    #row3 .img6 {
        background-position: -520px -1360px;
        height: 80px;
        width: 80px;
        display: block;
        background: url('iconvoip/icons.png') no-repeat;
    }

    #row3 .img7 {
        background-position: -440px -1360px;
        height: 80px;
        width: 80px;
        display: block;
        background: url('iconvoip/icons.png') no-repeat;
    }

    #row3 .img8 {
        background-position: -360px -1360px;
        height: 80px;
        width: 80px;
        display: block;
        background: url('iconvoip/icons.png') no-repeat;
    }


.bluedotted {
    background: #1abb9c;
    height: 100px;
    padding-top: 8px;
}

#wrapper {
    width: 1200px;
    margin: 0px auto;
}

.tabsbutton {
    padding: 10px 0px 0px;
    background: none !important;
}

    .tabsbutton a.t1 {
        background: #32ccae;
    }

    .tabsbutton .active {
        background-color: white !important;
        color: #444;
        opacity: 1 !important;
    }

    .tabsbutton a {
        display: block;
        border-radius: 3px 3px 0px 0px;
        float: right;
        padding: 8px 30px;
        margin: 0px 0px 0px 20px;
        color: white;
    }

        .tabsbutton a.t2 {
            background: #32ccae;
        }

        .tabsbutton a.t4 {
            background: #32ccae;
        }

.tabscontent {
    padding: 50px 0px 50px;
    background: white;
    height: 350px;
}

    .tabscontent .col1 {
        float: right;
        border-right: 3px solid #eee;
        padding: 0 18px 0 45px;
        width: 70%;
        margin: 8px 0 0;
    }

    .tabscontent .col2 {
        float: right;
        padding: 0px 0px 0px;
        margin: -18px 0 0;
        width: 342px;
    }

        .tabscontent .col2 img {
            width: 342px;
        }

.stepbar {
    background: url('iconvoip/navbar.gif') repeat-x 20px;
    padding: 10px 0px;
}

    .stepbar .step, .stepbox1, .stepbox2, .stepbox3, .stepbox4 {
        float: right;
        width: 24%;
        float: right;
        margin: 0px 0px 0px 1%;
        text-align: center;
    }

    .stepbar span {
        padding: 5px 20px;
        border-radius: 50px;
        border: 2px solid #ced7e0;
        color: #506a85;
        background: #ffffff;
    }

.stepbox h3 {
    font-size: 17px;
    color: #222222;
    margin: 5px 0px 3px;
}

.stepbox .icon1, .stepbox .icon2, .stepbox .icon3, .stepbox .icon4 {
    background: url('iconvoip/icons.png');
    height: 65px;
    width: 128px;
    display: block;
    margin: 18px auto 10px;
}

.stepbox .icon1 {
    background-position: right -1230px;
}

.stepbox .icon2 {
    background-position: -744px -1230px;
}

.stepbox .icon3 {
    background-position: -616px -1230px;
}

.stepbox .icon4 {
    background-position: -488px -1230px;
}

.services2 {
    background: url(iconvoip/pattern-background.png) #2f4052;
    padding: 50px 0px 60px;
    height: 300px;
}

    .services2 h2 {
        font-size: 22px;
        padding: 0px 0px 0px 0px;
        text-align: center;
        color: #ffffff;
    }

    .services2 p {
        color: #ffffff;
    }

    .services2 h3.zirnevis {
        font: normal 16px/24px IRANSans, Tahoma;
        padding: 0px 0px 15px 0px;
        text-align: center;
        color: #cccccc;
    }

    .services2 .item1 {
        background: url('iconvoip/2.png') no-repeat right 5px;
    }

    .services2 .item2 {
        background: url('iconvoip/1.png') no-repeat right 5px;
    }

    .services2 .item3 {
        background: url('iconvoip/3.png') no-repeat right 5px;
    }

    .services2 .item {
        float: right;
        text-align: right;
        width: 30%;
        font-size: 120%;
        margin: 25px 0px 0 4%;
        padding: 0px 70px 0 0;
    }

        .services2 .item h3 {
            font-size: 115%;
            color: #ffffff;
            margin: 0 0px 1px;
            padding: 0px 0px 0;
            font: normal 18px/2 IRANSans, tahoma;
        }

        .services2 .item.last {
            margin: 25px 0 0 0;
        }

.featuresvoip {
    background: #ffffff;
    padding: 50px 20px 90px;
}


    .featuresvoip h2 {
        font-size: 22px;
        padding: 0px 0px 0px 0px;
        text-align: center;
        color: #222222;
    }

    .featuresvoip h3.zirnevis {
        font: normal 16px/24px IRANSans, Tahoma;
        padding: 0px 0px 15px 0px;
        text-align: center;
        color: gray;
    }

    .featuresvoip h3 span {
        background: url('iconvoip/top-arrow.gif') no-repeat bottom center;
        padding: 10px 0px 13px;
    }

    .featuresvoip ul {
        margin: 10px 0 0;
        list-style: none;
    }

    .featuresvoip .item {
        float: right;
        width: 48%;
        display: inline-block;
        margin: 25px 0 0 0;
    }



        .featuresvoip .item .right {
            width: 510px;
            float: left;
        }

        .featuresvoip .item h4 {
            color: #333;
            margin: 0x 0px 0;
            padding: 0px 0px 0;
            font: normal 17px/2 IRANSans, tahoma;
        }

        .featuresvoip .item p {
            color: #333;
            margin: 1px 0px 0;
            padding: 0px 0px 0;
            font: normal 13px/27px IRANSans, tahoma;
        }


    .featuresvoip .item1 .icon {
        background: url('iconvoip/icon/1.png') no-repeat center center;
        border-radius: 50px;
        border: 2px solid #1abb9c;
        width: 100px;
        height: 100px;
        margin: 8px 0 0 0;
        float: right;
    }

    .featuresvoip .item2 .icon {
        background: url('iconvoip/icon/2.png') no-repeat center center;
        border-radius: 50px;
        border: 2px solid #1abb9c;
        width: 100px;
        height: 100px;
        margin: 8px 0 0 0;
        float: right;
    }

    .featuresvoip .item3 .icon {
        background: url('iconvoip/icon/3.png') no-repeat center center;
        border-radius: 50px;
        border: 2px solid #1abb9c;
        width: 100px;
        height: 100px;
        margin: 8px 0 0 0;
        float: right;
    }


    .featuresvoip .item4 .icon {
        background: url('iconvoip/icon/4.png') no-repeat center center;
        border-radius: 50px;
        border: 2px solid #1abb9c;
        width: 100px;
        height: 100px;
        margin: 8px 0 0 0;
        float: right;
    }

    .featuresvoip .item5 .icon {
        background: url('iconvoip/icon/5.png') no-repeat center center;
        border-radius: 50px;
        border: 2px solid #1abb9c;
        width: 100px;
        height: 100px;
        margin: 8px 0 0 0;
        float: right;
    }


    .featuresvoip .item6 .icon {
        background: url('iconvoip/icon/6.png') no-repeat center center;
        border-radius: 50px;
        border: 2px solid #1abb9c;
        width: 100px;
        height: 100px;
        margin: 8px 0 0 0;
        float: right;
    }

.featuresvoip {
    padding-bottom: 30px;
}

@media screen and (max-width: 768px) {
    .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
        max-height: 400px !important;
    }
    .proud {
    background-color: #fafaff;
    padding: 20px 0px !important;
    text-align: right;
}
.my-player-dimensions {
    width: 320px !important;
    height: 267px !important;
}

.bluedotted {
    background: #1abb9c;
    height: 120px;
    padding-top: 8px;
}
#featuresvoip  H2  strong {
    font-size: 20px;
}
.stepbar .step, .stepbox1, .stepbox2, .stepbox3, .stepbox4 {
    float: right;
    width: 100%;
    float: right;
    margin: 0px 0px 0px 1%;
    text-align: center;
}
.tabscontent .col1 {
    float: right;
    border-right: 3px solid #eee;
    padding: 0 18px 0 45px;
    width: 100%;
    margin: 8px 0 0;
}
.tabscontent h5 {
    background: #079885;
    width: 100% !important;
    padding: 15px 6px;
    color: #fff;
    text-align: center;
    border-radius: 2px;
}
.tabscontent {
    padding: 50px 0px 50px;
    background: white;
     height: auto; 
}
}