/*
* Zigza Theme
* Created by : mixdesigns
* website : www.mixdesigns.net
*/

/* Table of Content
==================================================
        - General -
        - Parallax -
        - margin spaces -
        - Header Section -
        - Top intro Section -
        - Clients Section-
        - services Section-
        - welcome Section -
        - video Section -
        - firstFeature -
        - about Section -
        - Numbers Section -
        - Team Section -
        - Skills  -
        - testimonials Section  -
        - Portfolio Section  -
        - fullwidth-slider Section -
        - textSection -
        - News Section  -
        - subscription-form -
        - Plans Section -
        - Download buttons -
        - Contact Section -
        - Footer Section -
        - Single Post Page -
        - Media - Responsive Style -
*/

/* - General ------------------------------------------------------- */
/* PRE LOADER */
.preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fefefe;
    z-index: 9999;
    height: 100%;
    width: 100%;
    overflow: hidden !important;
}

.status {
    width: 234px;
    height: 45px;
    position: absolute;
    left: 50%;
    top: 50%;
    background-image: url(../images/loader.gif);
    background-repeat: no-repeat;
    background-position: center;
    -webkit-background-size: cover;
    background-size: cover;
    margin: -30px 0 0 -45px;
}

/* top line LOADER */
.pace {
    -webkit-pointer-events: none;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
.pace-inactive {
    display: none;
}
.pace .pace-progress {
    background: #F45368;
    position: fixed;
    z-index: 99999;
    top: 0;
    right: 100%;
    width: 100%;
    height:5px;
}
/* Global Styles */
body,html {
    height: 100%;
    width: 100%;
    max-width: 100%;
}
body {
    direction: rtl;
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-size: 15px;
    background: transparent;
    color: #93989B;
    overflow-x: hidden;
    margin: auto;
    background: #161616;
    -webkit-font-smoothing: subpixel-antialiased;
}

h1,h2{
    font-size: 24px;
}
p{
    line-height: 2;
}

::-moz-selection{ color: #fff; background:#282B2D; }
::-webkit-selection{ color: #fff;    background:#282B2D; }
::selection{ color: #fff;    background:#282B2D; }

a:hover,a:focus{
    outline: none;
    text-decoration: none;
}
h1,h2,h3,h4,h5,h6 {
    font-family: 'Roboto', sans-serif;
    font-weight: 900;
    margin-bottom: 20px;
    line-height: 1.2;
    color: #282B2D;
}
.img-responsive{
    margin: 0 auto;
}
/* title Section */
.titleSection{
    clear: both;
    margin-bottom: 20px;
    text-align: center;
}
.titleSection p{
    width: 70%;
    margin: 20px auto 0px;
}
.titleSection h4{
    margin-bottom: 5px;
}
.titleSection h2{
    color: #F45368;
    margin-top: 0px;
    font-size: 40px;
    text-transform: uppercase;

}
.titleSection.text-left{
    text-align: right;
}
.titleSection.text-left .coloredLine{
    margin: 0px;
}
.titleSection.text-left p{
    width: 100%;
}
.hiddenHeader{
    display: none;
}
/* line */
.coloredLine{
    margin: auto;
    width: 80px;
    border-bottom: 1px dashed #ccc;
}
.dottedLine{
    border-top: 1px dashed #ccc;
    margin: auto;
    width: 300px;
}
hr{
    border-color: #e4e4e4;
}
/* custom list  */
.custom-list {
    list-style: outside none none;
    padding: 0px;
    margin-top: 20px;
}
.custom-list li{
    margin-bottom: 15px;
    width: auto;
    line-height: 25px;
    position: relative;
}
.custom-list li:last-child{
    margin-bottom: 0px;
}
.custom-list i {
    font-size: 12px;
    width: 20px;
    height: 20px;
    line-height: 24px;
    text-align: center;
    right: 0px;
    top: 0px;
    display: block;
    position: absolute;
    color: #282B2D; 
}
.custom-list-content-inner {
    padding-right: 30px;
    display: inline-block;
}

/* buttons */
.btn-new{
    max-width: 250px;
    vertical-align: middle;
    position: relative;
    z-index: 1;
    -webkit-backface-visibility: hidden;
    -moz-osx-font-smoothing: grayscale;       
    background: #F45368;
    display: inline-block;
    padding: 15px 30px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    color: #fff;
    font-size: 14px;
    font-weight:900;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    letter-spacing: 1px;
    cursor: pointer;
    line-height: 1.42857;
    text-align: center;
    white-space: nowrap;
    border: none;
}
.btn-new:hover,.btn-new:focus{
    background: #fc233f;
    color: #fff;
    text-decoration: none;
    outline: none;
}
.btn-large{
    font-size: 18px;
}
/* Moema */
.button--moema {
    -webkit-transition: background-color 0.3s, color 0.3s;
    transition: background-color 0.3s, color 0.3s;
}
.button--moema::before {
    content: '';
    position: absolute;
    top: -15px;
    left: -10px;
    bottom: -15px;
    right: -10px;
    background: inherit;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    z-index: -1;
    opacity: 0.8;
    -webkit-transform: scale3d(0.8, 0.5, 1);
    transform: scale3d(0.8, 0.5, 1);
}
.button--moema:hover {
    -webkit-transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
    transition: background-color 0.1s 0.3s, color 0.1s 0.3s;
    color: #fff;
    background-color: #e04257;
    -webkit-animation: anim-moema-1 0.3s forwards;
    animation: anim-moema-1 0.3s forwards;
}

.button--moema:hover::before {
    -webkit-animation: anim-moema-2 0.3s 0.3s forwards;
    animation: anim-moema-2 0.3s 0.3s forwards;
}
@-webkit-keyframes anim-moema-1 {
    60% {
    -webkit-transform: scale3d(0.8, 0.8, 1);
    transform: scale3d(0.8, 0.8, 1);
}
85% {
    -webkit-transform: scale3d(1.1, 1.1, 1);
    transform: scale3d(1.1, 1.1, 1);
}
100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}
}
@keyframes anim-moema-1 {
    60% {
    -webkit-transform: scale3d(0.8, 0.8, 1);
    transform: scale3d(0.8, 0.8, 1);
}
85% {
    -webkit-transform: scale3d(1.1, 1.1, 1);
    transform: scale3d(1.1, 1.1, 1);
}
100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}
}
@-webkit-keyframes anim-moema-2 {
    to {
    opacity: 0;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}
}
@keyframes anim-moema-2 {
    to {
    opacity: 0;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}
}

.button--moema::before {background-color:transparent\9\0; }  /* IE9 */

.light{
    font-weight: 400;
}
.bold{
    font-weight: 900;
}
.no-padding {
    padding: 0 !important;
}
.text-right{
    text-align: right;
}
/* Owl Carousel  style */
.owl-theme .owl-controls{
    text-align: center;
}
/* Styling Next and Prev buttons */
.owl-theme .owl-controls .owl-buttons div{
    display: inline-block;
    filter: Alpha(Opacity=80);
    opacity: 0.8;       
    position: absolute;
    top: 50%;
    margin-top: -30px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    font-size: 40px;
    text-align: center;
    color: rgba(0, 0, 0, 0.1);
    text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1);
    z-index: 6;
    transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;

}

.owl-prev{
    left: 0px;
}
.owl-next{
    right: 0px;
}
/* Clickable class fix problem with hover on touch devices */
/* Use it for non-touch hover action */
.owl-theme .owl-controls.clickable .owl-buttons div:hover{
    filter: Alpha(Opacity=100);
    opacity: 1;
    text-decoration: none;
}

/* Styling Pagination*/
.owl-theme .owl-controls .owl-page{
    display: inline-block;
    zoom: 1;
}
.owl-theme .owl-controls .owl-page span{
    display: block;
    width: 10px;
    height: 10px;
    margin:8px;
    filter: Alpha(Opacity=50);/*IE7 fix*/
    opacity: 0.5;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    background: #ccc;
}
.owl-pagination{
    padding-top: 20px;
}
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span{
    filter: Alpha(Opacity=100);/*IE7 fix*/
    opacity: 1;
}

/* circle Social */
.circleSocial {
    padding: 0;
    display: inline-block;
    margin: 0 auto;
}
.circleSocial li {
    list-style: none;
    float: left;
    margin: 2px;
    display: inline-block;
}
.circleSocial li a {
    width: 40px;
    height: 40px;
    background: transparent;
    border:2px solid #fff;
    color: #fff;
    -webkit-border-radius:50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    display: inline-block;
    text-align: center;
    line-height:36px;
    font-size: 16px;
    margin: 2px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.circleSocial li a:hover,.circleSocial li a:focus {
    border-color: #F45368;
    outline: none;
    color: #F45368;
}
/* parallax ------------------------------------------------------- */
.parallaxBg {
    background: url('../images/bg.jpg') no-repeat center center fixed #282B2D;
    background-attachment: fixed !important;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width: 100%;
    color: #fff;
}
.parallaxBg h1,.parallaxBg h2{
    font-size: 90px;
    color: #fff;
}
.parallaxBg-zigzag{
    background: url('../images/zigzag.jpg') repeat center center fixed #282B2D;
    background-attachment: fixed !important;
    width: 100%;
    color: #fff;
    text-align: center;
}
.overlay {
    background: none repeat scroll 0 0 rgba(255,255,255,0.1);
    width: 100%;
    height: 100%;
    padding: 100px 0px;
}
.mobile-device .parallaxBg,.mobile-device .parallaxBg-zigzag  {
    background-attachment: scroll !important;
    background-position: center center !important;
}
.blockText{
    display: table;
    height: 100%;
    position: relative;
    width: 100%;
}
.blockText p{
    display: table-cell;
    height: 100%;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    font-size: 90px;
    font-weight: 900;
    line-height: 90px;
    text-transform: uppercase;
    margin: 0px;
}
.blockText p span{
    display: inline-block;
    margin-top: 10px;
    padding: 15px;
    background: rgba(244,83,104,0.9);
}
/* margin spaces */
.space10 {
    margin-bottom: 10px;
}
.space20 {
    margin-bottom: 20px;
}
.space30 {
    margin-bottom: 30px;
}
.space40 {
    margin-bottom: 40px;
}
.space50 {
    margin-bottom: 50px;
}
.space60 {
    margin-bottom: 60px;
}
.space70 {
    margin-bottom: 70px;
}
.space80 {
    margin-bottom: 80px;
}
.space90 {
    margin-bottom: 90px;
}
.space100 {
    margin-bottom: 90px;
}

/* Header and nav --------------------------------------------------- */
.logo{
    display:inline-block;
}
.logo img{
    max-width: 100%;
}
.sticky-navigation {
    -webkit-transition: all .8s ease-in-out;
    -moz-transition: all .8s ease-in-out;
    -o-transition: all .8s ease-in-out;
    transition: all .8s ease-in-out;
    background: rgba(255, 255, 255, 0.9);
    border: none;
    border-bottom: 1px solid #eee;
    padding:5px 0 !important;
    margin-bottom: 0 !important;
    -webkit-backface-visibility: hidden;
    top:0px;
}
.nav-logo{
    padding: 0px 15px;
    height: 80px;
    overflow: hidden;
}
.nav-logo:focus{
    outline: none;
}
.navbar{
    margin-bottom: 0px;
    margin-top: 26px;
}
.navbar-nav {
    float: left;
    margin: 0px !important;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.navbar-nav li a {
    padding: 10px;
    line-height: 30px;
    font-size: 14px;
    color: #93989B;
    position: relative;
    background: transparent !important;
    font-weight: 400;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}
.navbar-nav li a:focus{
    outline: none;
}
.navbar-nav li.active a,.navbar-nav li a:hover {
    color:#282B2D;
}
header .btn-new{
    padding: 10px 20px;
    font-size: 12px;
    margin: 6px 10px 6px 0px;
}
.navbar-toggle{
    padding: 5px 10px;
    margin-right: 10px;
}
/* Top intro --------------------------------------- */

/* intro-parallax */
.intro-parallax {
    position: relative;
    text-align: left;
    height: 100%;
    min-height: 100%;
    text-align: center;
    display: table;
    vertical-align: middle;
}
.intro-parallax .intro-overlay{
    width: 100%;
    height: 100%;
    padding: 100px 0px;
    display: table-cell;
    vertical-align: middle;
    background: rgba(0,0,0,0.1);
}
.intro-parallax .cd-intro h2,.intro-parallax .cd-intro h3{
    margin: 0px;
    color: #fff;
}

/* intro full width slider */
/* fullwidth-slider style --------------------------------------------- */
.intro-fullwidth-slider{
    position: relative;
    background: #eee;
}
.intro-fullwidth-slider .item img{
    display: block;
    height: auto;
}
.intro-fullwidth-slider a{
    margin-top: 40px;
}
.intro-fullwidth-slider h2{
    font-size: 30px;
    margin-top: 40px;
    font-weight: 400;
}
.intro-fullwidth-slider .item{
    background-attachment: scroll;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width: 100%;
}
.intro-fullwidth-slider .item1{
    background-image: url('../images/full-width/bg1.jpg');
}
.intro-fullwidth-slider .item2{
    background-image: url('../images/full-width/bg2.jpg');
}
.intro-full-overlay {
    background: none repeat scroll 0 0 rgba(255,255,255,0.8);
    width: 100%;
    height: 100%;
    padding: 100px 0px;
}
.intro-fullwidth-slider .owl-pagination {
    display: block;
    width: 100%;
    position: absolute;
    bottom: 0px;
    left: 0px;
    text-align: center;
    z-index: 100 !important;
}

/* video image */
.video-bg{
    background-image: url('../images/bg-video.jpg');
}
.video-bg1{
    background-image: url('../images/bg-video1.jpg');
}
/* boxed version */
.wrapper{
    max-width: 1170px;
    margin:0px auto;
}
.intro-boxed .intro-overlay{
    padding: 250px 0px;
}
.intro-boxed{
    background-image: url('../images/bg-boxed.jpg');
}
.nav-boxed{
    max-width: 1170px;
    margin: auto;
}
/* minimal version */

.dark-overlay{
    background: none repeat scroll 0 0 rgba(40,43,45,0.8);
}
.bg1{
    background-image: url('../images/bg1.jpg');  
}
.bg2{
    background-image: url('../images/bg2.jpg');  
}
/* intro-carousel */
.intro-item {
    padding: 0px;
}

/* revolution slider */
.rev-intro{
    width: 100%;
    display: block;
    position: relative;
    overflow: hidden;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center center;
    background-size: cover;
    color: #fff;
    background-color: #222426;
}
.btn-white{
    background:rgba(255,255,255,0.2) !important;
}
.big-header {
    margin-top: 0px;
    position: relative;
    font-size: 50px;
    font-weight: 900;
    text-transform: uppercase;
    line-height: 1.2;
}
.small-header{
    margin-top: 0px;
    position: relative;
    font-size: 24px;
    font-weight: 300;
    line-height: 1.8;
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,0.2);
}
.small-header strong{
    text-transform: uppercase;
}
.tparrows.preview4 .tp-arr-titleholder{
    background: #282B2D;
}

/* Scroll down icon */
@-webkit-keyframes scroll-down-anim {
    0%{ bottom: 12px; }
50%{ bottom: 20px; }
100%{ bottom: 12px; }
}
@-moz-keyframes scroll-down-anim {
    0%{ bottom: 12px; }
50%{ bottom: 20px; }
100%{ bottom: 12px; }
}
@-o-keyframes scroll-down-anim {
    0%{ bottom: 12px; }
50%{ bottom: 20px; }
100%{ bottom: 12px; }
}
@keyframes scroll-down-anim {
    0%{ bottom: 12px; }
50%{ bottom: 20px; }
100%{ bottom: 12px; }
}
.scroll-down{
    width: 40px;
    height: 40px;
    margin-left: -20px;
    position: absolute;
    bottom: 20px;
    left: 50%;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 0 rgba(0,0,0, .25);
    color: rgba(255,255,255, .4);

    -webkit-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
    -moz-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
    -o-transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 
    transition: all 500ms cubic-bezier(0.250, 0.460, 0.450, 0.940); 

}
.scroll-down:hover,.scroll-down:focus{
    color: #fff;
}
.scroll-down-icon{
    display: block;
    width: 20px;
    height: 20px;
    margin-left: -10px;
    position: absolute;
    left: 50%;
    bottom: 4px;
    font-size: 32px;
    -webkit-animation: scroll-down-anim 1s infinite;
    -moz-animation: scroll-down-anim 1s infinite;
    -o-animation: scroll-down-anim 1s infinite;
    animation: scroll-down-anim 1s infinite; 
    z-index: 2;
}

/* social fixed right */
.fixedRight{
    position: absolute;
    right: 5px;
    top: 50%;
    margin-top: -115px;
    z-index: 3;
    height: 230px;
}
.circleSocial.fixedRight li{
    display: block;  
    float: none;
}
.circleSocial.fixedRight li a{
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;
}
/* --------------------------------
xrotate-2
-------------------------------- */
.cd-words-wrapper {
    display: inline-block;
    position: relative;
    text-align: left;
}
.cd-words-wrapper b {
    display: inline-block;
    position: absolute;
    white-space: nowrap;
    left: 0;
    top: 0;
}
.cd-words-wrapper b.is-visible {
    position: relative;
}
.no-js .cd-words-wrapper b {
    opacity: 0;
}
.no-js .cd-words-wrapper b.is-visible {
    opacity: 1;
}
.cd-headline.rotate-2 .cd-words-wrapper {
    -webkit-perspective: 300px;
    -moz-perspective: 300px;
    perspective: 300px;
    width:  auto !important;
}
.cd-headline.rotate-2 i, .cd-headline.rotate-2 em {
    display: inline-block;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    font-style: normal;
    font-weight: normal;
}
.cd-headline.rotate-2 b {
    opacity: 0;
}
.cd-headline.rotate-2 i {
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: translateZ(-20px) rotateX(90deg);
    -moz-transform: translateZ(-20px) rotateX(90deg);
    -ms-transform: translateZ(-20px) rotateX(90deg);
    -o-transform: translateZ(-20px) rotateX(90deg);
    transform: translateZ(-20px) rotateX(90deg);
    opacity: 0;
}
.is-visible .cd-headline.rotate-2 i {
    opacity: 1;
}
.cd-headline.rotate-2 i.in {
    -webkit-animation: cd-rotate-2-in 0.4s forwards;
    -moz-animation: cd-rotate-2-in 0.4s forwards;
    animation: cd-rotate-2-in 0.4s forwards;
}
.cd-headline.rotate-2 i.out {
    -webkit-animation: cd-rotate-2-out 0.4s forwards;
    -moz-animation: cd-rotate-2-out 0.4s forwards;
    animation: cd-rotate-2-out 0.4s forwards;
}
.cd-headline.rotate-2 em {
    -webkit-transform: translateZ(20px);
    -moz-transform: translateZ(20px);
    -ms-transform: translateZ(20px);
    -o-transform: translateZ(20px);
    transform: translateZ(20px);
}

.no-csstransitions .cd-headline.rotate-2 i {
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -ms-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 0;
}
.no-csstransitions .cd-headline.rotate-2 i em {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.no-csstransitions .cd-headline.rotate-2 .is-visible i {
    opacity: 1;
}

@-webkit-keyframes cd-rotate-2-in {
    0% {
    opacity: 0;
    -webkit-transform: translateZ(-20px) rotateX(90deg);
}
60% {
    opacity: 1;
    -webkit-transform: translateZ(-20px) rotateX(-10deg);
}
100% {
    opacity: 1;
    -webkit-transform: translateZ(-20px) rotateX(0deg);
}
}
@-moz-keyframes cd-rotate-2-in {
    0% {
    opacity: 0;
    -moz-transform: translateZ(-20px) rotateX(90deg);
}
60% {
    opacity: 1;
    -moz-transform: translateZ(-20px) rotateX(-10deg);
}
100% {
    opacity: 1;
    -moz-transform: translateZ(-20px) rotateX(0deg);
}
}
@keyframes cd-rotate-2-in {
    0% {
    opacity: 0;
    -webkit-transform: translateZ(-20px) rotateX(90deg);
    -moz-transform: translateZ(-20px) rotateX(90deg);
    -ms-transform: translateZ(-20px) rotateX(90deg);
    -o-transform: translateZ(-20px) rotateX(90deg);
    transform: translateZ(-20px) rotateX(90deg);
}
60% {
    opacity: 1;
    -webkit-transform: translateZ(-20px) rotateX(-10deg);
    -moz-transform: translateZ(-20px) rotateX(-10deg);
    -ms-transform: translateZ(-20px) rotateX(-10deg);
    -o-transform: translateZ(-20px) rotateX(-10deg);
    transform: translateZ(-20px) rotateX(-10deg);
}
100% {
    opacity: 1;
    -webkit-transform: translateZ(-20px) rotateX(0deg);
    -moz-transform: translateZ(-20px) rotateX(0deg);
    -ms-transform: translateZ(-20px) rotateX(0deg);
    -o-transform: translateZ(-20px) rotateX(0deg);
    transform: translateZ(-20px) rotateX(0deg);
}
}
@-webkit-keyframes cd-rotate-2-out {
    0% {
    opacity: 1;
    -webkit-transform: translateZ(-20px) rotateX(0);
}
60% {
    opacity: 0;
    -webkit-transform: translateZ(-20px) rotateX(-100deg);
}
100% {
    opacity: 0;
    -webkit-transform: translateZ(-20px) rotateX(-90deg);
}
}
@-moz-keyframes cd-rotate-2-out {
    0% {
    opacity: 1;
    -moz-transform: translateZ(-20px) rotateX(0);
}
60% {
    opacity: 0;
    -moz-transform: translateZ(-20px) rotateX(-100deg);
}
100% {
    opacity: 0;
    -moz-transform: translateZ(-20px) rotateX(-90deg);
}
}
@keyframes cd-rotate-2-out {
    0% {
    opacity: 1;
    -webkit-transform: translateZ(-20px) rotateX(0);
    -moz-transform: translateZ(-20px) rotateX(0);
    -ms-transform: translateZ(-20px) rotateX(0);
    -o-transform: translateZ(-20px) rotateX(0);
    transform: translateZ(-20px) rotateX(0);
}
60% {
    opacity: 0;
    -webkit-transform: translateZ(-20px) rotateX(-100deg);
    -moz-transform: translateZ(-20px) rotateX(-100deg);
    -ms-transform: translateZ(-20px) rotateX(-100deg);
    -o-transform: translateZ(-20px) rotateX(-100deg);
    transform: translateZ(-20px) rotateX(-100deg);
}
100% {
    opacity: 0;
    -webkit-transform: translateZ(-20px) rotateX(-90deg);
    -moz-transform: translateZ(-20px) rotateX(-90deg);
    -ms-transform: translateZ(-20px) rotateX(-90deg);
    -o-transform: translateZ(-20px) rotateX(-90deg);
    transform: translateZ(-20px) rotateX(-90deg);
}
}

/* clients -------------------------------------------------------- */
#clients{
    background: #282B2D;
    padding:20px 0px;
    position:relative;
    overflow: hidden;
    text-align: center;
}
.clientsLogos a{
    display: inline-block;
    margin: 5px 15px;
}
.imgClient{
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    max-height: 25px;
}
.imgClient:hover{
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;
}
/*services-------------------------------------- */
#services{
    background: #fff;
    padding: 100px 0px;
    position: relative;
    overflow: hidden;
}
#services .container{
    position: relative;
    z-index: 1;
}
.servicesList{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
.servicesList li{
    text-align: center;
    position: relative;
    margin-bottom: 40px;
}
.servicesList li .icon{
    display: inline-block;
    text-align: center;
    color: #F45368;
    border:2px solid #F45368;
    -webkit-border-radius:50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    font-size: 32px;
    width: 80px;
    height: 80px;
    line-height: 76px;
    margin: 0 auto 15px;
    text-align: center;
    position: relative;
    z-index: 3;
}
.servicesList li .icon::after {
    background-color: #F45368;
    border-radius: 50%;
    content: "";
    height:80px;
    left: -2px;
    margin-top: -40px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: scale(0);
    -webkit-transition: transform 0.4s ease 0s, opacity 0.3s ease 0s;
    -moz-transition:  transform 0.4s ease 0s, opacity 0.3s ease 0s;
    -o-transition: transform 0.4s ease 0s, opacity 0.3s ease 0s;
    transition:  transform 0.4s ease 0s, opacity 0.3s ease 0s;
    width: 80px;
    z-index: -1;
}
.servicesList li:hover .icon::after{
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity:1;
    transform: scale(1.1);
}
.servicesList li:hover .icon{
    color: #fff;
}
/* welcome ------------------------------------------- */
.welcome{
    border: 8px solid #282B2D;
    padding: 20px;
    width: 290px;
    position: relative;
    margin: 0 auto 40px;
}
.welcome h2{
    font-size: 60px;
    font-weight: 900;
    color: #282B2D;
    position: relative;
    line-height: 60px;
    z-index: 2;
    margin: 0px;
}
.welcome span{
    font-size: 250px;
    position: absolute;
    top: -90px;
    right: -50px;
    color: #F45368;
    font-weight: 300;

}
/* videoSection ------------------------------------------- */
video {
    max-width: 100%;
    height: auto;
}
iframe{
    border: none;
}
iframe,embed,object {
    max-width: 100%;
}
.video-container {
    background: transparent !important;
    margin: auto;
    text-align: center;
}
.video {
    background: transparent !important;
}
.BigIcon{
    position: absolute;
    left: -100px;
    bottom: -120px;
    font-size: 400px;
    color: #666;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
    filter: alpha(opacity=10);
    -moz-opacity: 0.1;
    -khtml-opacity: 0.1;
    opacity: 0.1;
    z-index: -1;
}


/* firstFeature section --------------------------------------------------*/
#firstFeature{
    background: #f4f4f4;
    padding: 100px 0px;
    overflow: hidden;
    border-top: 1px solid #E4E4E4;
}
.colorTitles{
    color: #fff;
    margin-bottom: 20px;
}
.colorTitles span{
    padding: 10px 20px;
    display: inline-block;
    font-size: 24px;
    clear: both;
    margin-bottom: 5px;
    font-weight: 400;
    background: #282B2D;
}
.mobile{
    margin: 0 auto;
}
.feature-mobile{
    position: relative;
}
#firstFeature .phones{
    position: relative;
    overflow: hidden;
    height: 650px;
}
#firstFeature .phone-back {
    height: 87%;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 180px;
    top: 7%;
    width: auto;
    z-index: 1;
}
#firstFeature .shadow-left {
    background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.5)));
    background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
    background: -o-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
    background: -ms-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
    background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0.5) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#80000000',GradientType=1 );
    height: 87%;
    left: 0;
    right: 140px;
    top: 7%;
    margin: 0 auto;
    position: absolute;
    width: 100px;
    z-index: 2;
}
#firstFeature .phone-front {
    bottom: 0;
    height: 100%;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: -120px;
    top: 0;
    width: auto;
    z-index: 3;
}
#firstFeature .btn-new{
    margin-top: 40px;
}

/* about section --------------------------------------------------*/
#about{
    background: #f4f4f4;
    padding: 100px 0px;
    border-top: 1px solid #eee;
}
ul.feature-list{
    margin: 0px;
    list-style: none;
    padding: 0px;
}
ul.feature-list li {
    padding-bottom: 25px;
    font-size: 18px;
}
ul.feature-list li span{
    display: inline-block;
    -webkit-border-radius:50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    color: #fff;
    margin-left: 5px;
    background: #282B2D;
    font-size: 14px;
    height: 25px;
    line-height:25px;
    text-align: center;
    width: 25px;
}
/* numbers --------------------------------------- */
#numbers{
    text-align: center;
    position: relative;
    background: #282B2D;
    margin: 0 auto;
}
ul.numbersList {
    margin: 0px auto;
    overflow: hidden;
    list-style: none;
    text-align: center;
}
ul.numbersList li{
    border:1px solid #222426;
    height:230px;
    overflow: hidden;
    padding-left:0px;
    padding-right: 0px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
ul.numbersList li img{
    width: 100%;
}
ul.numbersList li.number div{
    position: relative;
    top: 50%;
    margin-top: -50px;
}
.numberHeader div{
    position: relative;
    top: 50%;
    margin-top: -60px;
}
ul.numbersList h5{
    font-weight: 400;
    color: #F45368;
}
ul.numbersList span,ul.numbersList i{
    font-size: 40px;
    font-weight: 900;
    margin: 5px;
}
.darkNumber{
    background: #222426;
}
.numberHeader{
    font-size: 90px;
    font-weight: 900;
    text-align: center;
}
/*team style ---------------------------------------------------- */
#team{
    padding: 100px 0px ;
    background: #fff;
    position: relative;
    overflow: hidden;
}
#team .container{
    position: relative;
    z-index: 1;
}
.team-item {
    max-width: 300px;
    margin: auto;
}
.team-item img{
    transform: scale(1.1,1.1);
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;

}
.team-item:hover img{
    transform: scale(1,1);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;
}
.teamWrapper{
    position: relative;
    overflow: hidden;
    background: #000;
}
.team-overlay{
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjI5JSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjkzJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjg2Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC44NiIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 29%, rgba(0,0,0,0.7) 93%, rgba(0,0,0,0.7) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(29%,rgba(0,0,0,0)), color-stop(93%,rgba(0,0,0,0.7)), color-stop(100%,rgba(0,0,0,0.7))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 29%,rgba(0,0,0,0.7) 93%,rgba(0,0,0,0.7) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 29%,rgba(0,0,0,0.7) 93%,rgba(0,0,0,0.7) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 29%,rgba(0,0,0,0.7) 93%,rgba(0,0,0,0.7) 100%); /* IE10+ */
    background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 29%,rgba(0,0,0,0.7) 93%,rgba(0,0,0,0.7) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#db000000',GradientType=0 ); /* IE6-8 */
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}
.team-inner  {
    padding:10px 15px;
    position: absolute;
    bottom: 0px;
    right: 0px;
    left: 0px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.team-inner h4 {
    position: relative;
    color: #fff;
    margin: 0px;
    text-align: left;
}
.team-inner h4 strong{
    width: 100%;
    font-size: 30px;
    display: inline-block;
}
.team-inner h4 span {
    font-size: 11px;
    font-weight: 400;
    display: block;
    margin-top: 5px;
}
/* thumb overlay effect style */
.thumb-overlay ul {
    padding:0px;
    margin: 0px;
    margin-top: 10px;
    padding-top: 5px;
    border-top: 1px solid rgba(0,0,0,0.4);
    position: relative;
}
.thumb-overlay ul li{
    display: inline-block;
    margin-right: 10px;
    list-style:none;
    text-align: center;

}
.thumb-overlay ul li a{
    font-size: 16px;
    color:#F45368;
    display: inline-block;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
.thumb-overlay ul li a:hover,.thumb-overlay ul li a:focus{
    color: #E04257;
    outline: none;
}
/* Skills */
.skills-wrap {
    padding: 0;
    margin: 0px;
}

.skills-wrap li {
    list-style: none;
    margin-bottom:22px;
}

.skills-wrap h6 {
    font-size: 12px;
    margin: 0 0 5px;
    font-weight: 400;
}
.skills-wrap div {
    height: 2px;
    width: 100%;
    background: #ccc;
}
.skills-wrap div span {
    display: table;
    height: 2px;
    position: relative;
}
.expand {
    background: #F45368;
    position: absolute;
}
.photoshop,.html5,.wpress {
    width: 0;
    -webkit-transition: all .7s ease-in-out;
    -moz-transition: all .7s ease-in-out;
    -o-transition: all .7s ease-in-out;
    transition: all .7s ease-in-out;
}
.skills-wrap div span:before {
    content: "";
    height: 6px;
    width: 6px;
    -webkit-border-radius:50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: #282B2D;
    position: absolute;
    top: -3px;
    right: 0;
}
.skills-wrap div span em {
    position: absolute;
    left: -10px;
    top: -22px;
    font-style: normal;
    font-weight: 400;
    color: #282B2D;
    font-size: 11px;
}
#team .BigIcon{
    right: -100px;
    left: auto;
}
/* testimonials ---------------------------------------------- */
.testimonials{
    text-align: center;
}
.testimonials .overlay{
    padding: 0px;
}
.block{
    height: 500px;
}
.testimonialsSlider{
    background: #282B2D;
    padding: 100px;
}
#owl-carousel-testimonials img {
    margin: 10px auto;
    -webkit-border-radius:50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    width: 80px;
    height:80px;
}
#owl-carousel-testimonials h5{
    color: #F45368;
}
#owl-carousel-testimonials .owl-controls .owl-page span {
    background:#fff;
}
#owl-carousel-testimonials p{
    margin-bottom: 0px;
}

/*portfolio ---------------------------------------------------- */
#portfolio {
    padding: 100px 0px;
    background: #fff;
    text-align: center;
    clear: both;
}
.grid {
    position: relative;
    margin: 0 auto;
    list-style: none;
    text-align: center;
    overflow: hidden;
}
.grid .gridItem{
    padding-left: 1px;
    padding-right: 1px;
    margin-bottom: 2px;
}
/* Common style */
.grid figure {
    position: relative;
    overflow: hidden;
    width:100%;
    max-height: 350px;
    background: #282B2D;
    text-align: center;
    cursor: pointer;
    margin: 0 auto;
}
.grid figure img {
    position: relative;
    display: block;
    min-height: 100%;
    max-width: 100%;
    opacity: 0.8;
}
.grid figure figcaption {
    color: #fff;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.grid figure figcaption::before,
.grid figure figcaption::after {
    pointer-events: none;
}
.grid figure figcaption,
.grid figure figcaption > a {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
}
/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure figcaption > a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}
.grid figure h2 {
    word-spacing: -0.15em;
    font-weight: 400;
}

.grid figure h2 span {
    font-weight: 900;
}
.grid figure h2,
.grid figure p {
    margin: 0;
}
/* Lily effect */
figure.effect-lily img {
    max-width: none;
    width: -webkit-calc(100% + 50px);
    width: calc(100% + 50px);
    opacity: 0.9;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(40px,0, 0);
    transform: translate3d(40px,0,0);
}
figure.effect-lily figcaption {
    text-align: right;
}
figure.effect-lily figcaption > div {
    position: absolute;
    bottom:20px;
    right: 0;
    padding: 15px;
    width: 100%;
}
figure.effect-lily h2{
    color: #fff;
}
figure.effect-lily h2,
figure.effect-lily p {
    -webkit-transform: translate3d(0,40px,0);
    transform: translate3d(0,40px,0);
}

figure.effect-lily h2 {
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
}
figure.effect-lily p {
    color: rgba(255,255,255,0.8);
    opacity: 0;
    -webkit-transition: opacity 0.2s, -webkit-transform 0.35s;
    transition: opacity 0.2s, transform 0.35s;
}
figure.effect-lily:hover img{
    opacity: 0.7;
}
figure.effect-lily:hover p {
    opacity: 1;
}
figure.effect-lily:hover img,
figure.effect-lily:hover h2,
figure.effect-lily:hover p {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
figure.effect-lily:hover p {
    -webkit-transition-delay: 0.05s;
    transition-delay: 0.05s;
    -webkit-transition-duration: 0.35s;
    transition-duration: 0.35s;
}
.nivo-lightbox-next:focus,.nivo-lightbox-prev:focus{
    outline: none;
}
.nivo-lightbox-theme-default .nivo-lightbox-title{
    background: rgba(0,0,0,0.6);
}
/* fullwidth-slider style --------------------------------------------- */
.fullwidth-slider{
    position: relative;
    background: #eee;
}
.fullwidth-slider .item img{
    display: block;
    height: auto;
}
.fullwidth-slider a{
    margin-top: 40px;
}
.fullwidth-slider h2{
    font-size: 30px;
    margin-top: 40px;
    font-weight: 400;
}
.fullwidth-slider .item{
    background-attachment: scroll;
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    width: 100%;
}
.fullwidth-slider .item1{
    background-image: url('../images/full-width/bg1.jpg');
}
.fullwidth-slider .item2{
    background-image: url('../images/full-width/bg2.jpg');
}
.full-overlay {
    background: none repeat scroll 0 0 rgba(255,255,255,0.8);
    width: 100%;
    height: 100%;
    padding: 100px 0px;
}
.fullwidth-slider .owl-pagination {
    display: block;
    width: 100%;
    position: absolute;
    bottom: 60px;
    left: 0px;
    text-align: center;
    z-index: 100 !important;
}
/* textSection style --------------------------------------------------------*/
.textSection{
    padding: 100px 0px;
    background: #222426;
    text-align: center;
}
.textSection .titleSection h2,.textSection .titleSection h4{
    color: #fff;
}
.textSection .btn-new{
    margin-top: 40px;
}
/* news style --------------------------------------------------------*/
#news{
    padding: 100px 0px;
    background:  #F4F4F4;
    text-align: center;
}
.newsImage{
    padding:40px;
}
.newsImage.news1{
    background: url("../images/news/1.jpg") right center no-repeat;
}
.newsImage.news2{
    background: url("../images/news/2.jpg") left center no-repeat;
}
.newsImage.news3{
    background: url("../images/news/3.jpg") right center no-repeat;
}
.newsWrapper{
    border: 4px solid #e4e4e4;
    padding: 40px;
    margin: 0px;
    text-align: right;
}
.newsDate{
    background: #282B2D;
    display: inline-block;
    padding: 20px;
    margin-bottom: 20px;
    color: #93989B;
}
.newsDate h4{
    color: #F45368;
}
.newsDate span{
    font-size: 40px;
    font-weight: 900;
}
.newsDate .coloredLine{
    margin: 0px;
}
a.newsLink:hover h4,a.newsLink:focus h4{
    color:#F45368 ;
}
.postedBy{
    display: block;
    border-top: 1px dashed #ccc;
    padding-top: 10px;
    font-size: 12px;
}

/* subscription-form ---------------------------------------------------------------- */

#subscribe {
    padding: 20px 0px 40px;
    text-align: center;
    background: #282B2D;
}
#subscribe h2{
    color: #fff;
    font-weight: 400;
}
.subscription-form .input-box {
    width: 320px;
    -webkit-box-shadow: none;
    box-shadow: none;
    background: #FFF;
    border: 1px solid #FFF;
    margin: 0px;
}

.subscription-form .subscription-success,
.subscription-form .subscription-error {
    display: none;
}
.subscription-form h4{
    color: #fff;
}

/* plans style --------------------------------------------------------*/
#plans{
    padding: 100px 0px 0px;
    background: #fff;
    overflow: hidden;
}
#plans .item{
    background: #f4f4f4;
    border:1px solid #eee;
    text-align: center;
    padding: 20px 0px;
    z-index: 2;
}
#plans .item .package{
    font-weight: 900;
    font-size:30px;
}
#plans .item .price{
    height:100px;
    background: #f9f9f9;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin-bottom: 20px;
}
#plans .item .price p {
    color: #282B2D;
    display: inline-block;
    font-weight: 900;
    font-size:40px;
    height:100px;
    position: relative;
    margin: 0px;
    line-height: 100px;
}
#plans .item .price p span {
    line-height: normal;
    display: inline-block;
    font-size: 25px;
    font-weight: 900;
    position: absolute;
}
#plans .item .price p span.currency {
    right: -15px;
    top: 15px;
}
ul.plans-list{
    margin: 0px;
    padding: 30px 0px;
    list-style: none;
}
ul.plans-list li {
    padding: 10px 0px;
}
#plans .professional .item{
    background: #282B2D;
    border-color: #3C4144;
    z-index: 999;
}
#plans .professional{
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -o-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);
    z-index: 999;
}
#plans .professional .price{
    background: #33373A;
    border-color: #3C4144;
}
#plans .professional .price p{
    color: #F45368;
}
.themeImg{
    margin-top: 150px;
}
/* download style --------------------------------------------------------*/
#download{
    padding:20px 0px;
    background: #282B2D;
    color: #fff;
    text-align: center;
}
.logoDownload{
    margin-bottom: 15px;
}
.btn-app-download {
    padding: 15px 30px 15px 80px;
    position: relative;
    border:2px solid #93989B;
    display: inline-block;
    color: #93989B;
    margin: 5px;
    text-align: left;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}
.btn-app-download:hover,.btn-app-download:focus{
    color: #282B2D;
    outline: none;
    background: #93989B;
}
.btn-app-download i {
    font-size: 40px;
    left: 0;
    line-height: 1;
    margin: 15px 0 0 30px;
    position: absolute;
    top: 0;
}
.btn-app-download strong {
    display: block;
    font-weight: 900;
    margin-bottom: 6px;
}
.btn-app-download span {
    display: block;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.5px;
    margin-top: -3px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;
}
/* contact ----------------------------------------------------------- */
#contact {
    padding: 100px 0px;
    background: #f4f4f4;
    text-align: center;
}
.form-control{
    background: transparent;
    border: 1px solid #ddd;
    height: 50px;
    margin-bottom: 20px;
    padding:10px 20px;
    width: 100%;
    color:#282B2D;
    outline: none;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    font-size: 12px;
    box-shadow: none;
}
textarea.form-control{
    height: 100px;
    max-height: 120px;
    resize: none;
    margin-bottom:40px;
    overflow: hidden;
}
.form-control:focus{
    color: #000;
    font-weight: 900;
    border-color: #F45368;
    box-shadow: none;
    outline: none;
}
#contactForm .success,#contactForm .error {
    display: none;
    text-align: center;
    margin-bottom: 20px;
    padding: 20px;
}
/* #contactInfo ----------------------------------------------------------- */
#contactInfo{
    background: #eee;
    border-top: 1px solid #e4e4e4;
    padding: 100px 0px;
    text-align: center;
}
#contactInfo span{
    font-size:24px;
    color: #282B2D;
    display: block;
    margin-bottom: 10px;
}
#contactInfo h4{
    margin-bottom: 0px;
}
#contactInfo h5{
    font-weight: 400;
}
/* Footer ---------------------------------------------------------- */
footer {
    background:#282B2D;
    padding:100px 0;
    text-align: center;
}
footer hr{
    border-color: #1D1F21;
}
footer p{
    font-size: 11px;
    letter-spacing: 4px;
    text-transform: uppercase;
}
footer p a {
    font-weight: 900;
    color: #fff;
    color: #F45368;
}
footer p a:hover {
    color: #F45368;
}

/* inner pages ------------------------------------ */
.innerHeader{
    border-bottom: 1px solid #e4e4e4;
}
.innerHeader .overlay{
    padding: 160px 0px 100px;
}
.innerBg1{
    background-image: url('../images/inner/1.jpg');  
}
.innerBg1{
    background-image: url('../images/inner/1.jpg');  
}
.innerTitle{
    border: 2px solid #fff;
    padding: 30px;
    display: inline-block;
    background: rgba(255,255,255,0.4);
}
.innerHeader h1{
    text-align: center;
    font-size: 24px;
    font-weight: 300;
    margin-top: 0px;
    color: #282B2D;
}
.innerHeader h1 strong{
        text-transform: uppercase;
}
.innerTitle span{
    display: inline-block;
    background: rgba(255,255,255,0.8);
    font-size: 11px;
    padding:10px;
    color: #aaa;
}
.innerTitle span a{
    color: #666;
}
/*------------------------------------------------------------- 
                           THEME SWITCHER
--------------------------------------------------------------- */
#customizer {
    position: fixed;
    top: 100px;
    z-index: 999999;
    height: 100%;
}

.corner {
    display: block;
    cursor: pointer;
    width: 40px;
    height: 40px;
    -webkit-border-radius:0px 6px 6px 0px;
    -moz-border-radius:0px 6px 6px 0px;
    border-radius:0px 6px 6px 0px;
    background: url(../images/switcher/corner-open.png);
    position: absolute;
    top: 50px;
    right: -40px;
}

.s-close {
    left: -205px !important;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.s-open {
    left: 0 !important;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.corner.expanded {
    background: url(../images/switcher/corner.png);
}

#options {
    width: 205px;
    height:180px;
    background: #fff;
    padding: 0;
    position: relative;
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.heading {
    padding-bottom: 15px;
    margin-bottom: 20px;
}

#options h6 {
    color: #5c5c5c;
    margin-bottom: 10px;
    font-size: 13px;
}

.options-segment {
    margin-bottom: 20px;
}
.color-scheme {
    padding: 0;
}
.color-scheme li {
    float: left;
    list-style: none;
}
.color-scheme a {
    display: block;
    height: 30px;
    width: 30px;
    margin: 0 4.25px 10px;
}
.colors-sel {
    padding: 20px 25px 15px;
    margin-bottom: 0;
}
.gold a {
    background: url(../images/switcher/3.png);
}
.green a {
    background: url(../images/switcher/7.png);
}
.blue a {
    background: url(../images/switcher/1.png);
}
.red a {
    background: url(../images/switcher/8.png);
}
.pink a {
    background: url(../images/switcher/4.png);
}
.grey a {
    background: url(../images/switcher/6.png);
}
.yellow a {
    background: url(../images/switcher/5.png);
}
.violet a {
    background: url(../images/switcher/2.png);
}
.options-head {
    background: #000;
    color: #fff;
    text-align: center;
    text-transform: uppercase;
    font-size: 15px;
    font-weight: 900;
    line-height: 50px;
}

/* responsive style ----------------------------------------------------------------- */
/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

}
/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
    #services,#firstFeature,#about,#team,#portfolio,.textSection,#news,#contactInfo,#contact,footer{padding-top: 80px !important;padding-bottom: 80px !important}
    #plans{padding-top: 80px !important;}
    .themeImg {
        margin-top: 80px;
    }
    #about .titleSection{margin-top: 20px;}
    .blockText p{text-align: center;}
    .darkNumber{background: transparent;}
    ul.numbersList li{height: 190px;}

    .testimonials .block{
        height: auto;
        padding:50px !important;
    }
    .newsWrapper{background: rgba(255,255,255,0.7)}
}
/* Small Devices, Tablets */
@media only screen and (max-width : 767px) {

    .navbar-collapse {
        max-height: 355px !important;
        padding-bottom: 15px;
        padding-right: 15px;
        padding-left: 15px;
        overflow-x: visible;
        border-top: 1px solid transparent;
    }
    .navbar-nav{
        width: 100%;
    }
    ul.numbersList li{
        height: auto;
        padding: 40px 0px;
    }

    ul.numbersList li.number div,.numberHeader div{
        margin-top: 0px;
        top: 0px;
    }
    .subscription-form .input-box {
        margin: 0px auto 10px;
        width: 80%;
    }
    .rev-intro{margin-top: 60px;}
}
/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
    .logo,.circleSocial{float: none!important;margin-bottom: 20px}
    .circleSocial{width: 100%;text-align: center}
    .circleSocial li{float: none}
    #firstFeature .phones {
        height:250px;
        margin: 0 auto;
        width: 100%;
    }
    #firstFeature .phone-front{
        height: auto;
        width: 50%;
        right: 0px;
        left: 40%;
    }
    #firstFeature .phone-back{
        height: auto;
        width: 50%;
        left: 5%;
    }
    #firstFeature .shadow-left{
        height: 100%;
        right: 10%;
    }
    .newsImage{background-position:  center center !important;padding: 0px;}
    .newsWrapper{padding:15px;}
    .parallaxBg h2,.numberHeader,.blockText p{font-size: 50px;line-height: 50px;}
    .numberHeader{padding: 50px 0px;}
    .gridItem{width: 100%;}
    .owl-theme .owl-controls .owl-buttons div{
        display: none;
    }
}
/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {
    #firstFeature .phones {
        height: 200px;
    }
}


/*Header Popup*/
header .topBar a {background-color:#086a97; text-decoration: none; color: #fff; font-size: 18px;overflow: hidden;
    white-space: nowrap;direction: ltr;display: block;}
header .topBar a .carousel-content span {padding: 0 50px; }
#contactModal .formBox input:not(.btn), #contactModal .formBox textarea {width: 100%; direction: rtl; padding: 8px 10px; border-radius: 0; border: 1px solid #C2C2C2; color: #000;}
#contactModal .modal-dialog {display: flex; justify-content: center; align-items: center; height: 100%; margin: 0 auto;}
#contactModal .modal-content {width: 100%;max-width: 500px;}
#contactModal .modal-header {border:0;}
#contactModal .modal-body {padding-top: 0;}
#contactModal .formBox input:not(.btn)::placeholder, , #contactModal .formBox textarea::placeholder {color: #000;}
#contactModal .mainForm .formBox {width: 100%; max-width: 290px; margin: 0 auto;direction: rtl; text-align: center;}
#contactModal .mainForm .formTitle {font-size: 25px; font-weight: 700;color: #000; }
#contactModal .mainForm .formSubTitle {font-size: 20px;margin-bottom: 30px;color: #000;}
#contactModal .mainForm .btn {padding: 10px 62px;background-color: #086a97; color: #fff; border-radius: 32px; border: 0; font-size: 16px; cursor: pointer;}
#contactModal .modal-header .btn-close {opacity: 1;}

@media(max-width: 991px){    
    header .topBar a .carousel-content span {padding: 0 45px;} 
}