body {
	text-rendering: auto;
	-webkit-font-smoothing: auto;
	font-size: 16px;
}

.zthree-col-container {
    text-align: left;
}
.zthree-col-inner a {
            color: inherit;
            display: block;
        }
.zthree-col-container:not(:last-child) {
    margin-bottom: 40px;
}
.zthree-col-inner ul {
    margin-top: 10px;
}
        .common-links {
            margin-top: 0;
        }

        .main {
            position: relative;
            text-align: center;
         }
        p {
        margin: 0 auto;
        }
        #fluid-banner {
            padding-top: 0px;
            padding-bottom: 30px;
        }

        .fluid-banner {
            position: relative;
            width: 100%;
            max-width: 990px;
margin:0 auto;
        }

        .fluid-banner img {
            z-index: 1;
            margin-top: 0px;
        }

        .fluid-banner span {
            position: absolute;
            background: url("../img/app-sprite.png") no-repeat 0 0;
            display: inline-block;
        }

        .fluid-banner .cloudBig {
            background-position: 0 0;
            width: 50px;
            height: 30px;
            top: 3%;
            left: 5%;
            z-index: -1;
            opacity: 0;
            animation: cloudBigAnimate 20s 1s infinite linear;
            -webkit-animation: cloudBigAnimate 20s 1s infinite linear;
        }
       

.zicon38 {
    background-position: 2px -240px;
}
.zicon37 {
    background-position: -385px -192px;
}

.zicon-mobile {
    background-image: url('../img/applications-sprite-2x.png');
    background-size: 960px auto;
}
        @keyframes cloudBigAnimate {
            0% {
                left: 5%;
                opacity: 0.2;
            }
            15% {
                opacity: 0.5;
            }
            95% {
                opacity: 0.5;
            }
            100% {
                left: 35%;
                opacity: 0;
            }
        }

        @-webkit-keyframes cloudBigAnimate {
            0% {
                left: 5%;
                opacity: 0;
            }
            5% {
                opacity: 0.5;
            }
            95% {
                opacity: 0.5;
            }
            100% {
                left: 35%;
                opacity: 0;
            }
        }

        .fluid-banner .aero {
            background-position: -50px 0;
            width: 70px;
            height: 30px;
            top: 29%;
            left: 5%;
            z-index: -1;
            opacity: 0;
            transform: rotate(-5deg);
            animation: aeroAnimate 12s 4s infinite linear;
            -webkit-animation: aeroAnimate 12s 4s infinite linear;
        }

        @keyframes aeroAnimate {
            0% {
                top: 29%;
                left: 5%;
                opacity: 0.2;
            }
            15% {
                opacity: 1;
            }
            95% {
                opacity: 1;
            }
            100% {
                top: 2%;
                left: 65%;
                opacity: 0;
            }
        }

        @-webkit-keyframes aeroAnimate {
            0% {
                top: 29%;
                left: 5%;
                opacity: 0.2;
            }
            15% {
                opacity: 0.5;
            }
            95% {
                opacity: 0.5;
            }
            100% {
                top: 2%;
                left: 65%;
                opacity: 0;
            }
        }

        .fluid-banner .cloudSmall {
            background-position: -118px 0;
            width: 50px;
            height: 30px;
            top: -1%;
            left: 65%;
            z-index: -1;
            opacity: 0;
            animation: cloudSmallAnimate 25s 1s infinite linear;
            -webkit-animation: cloudSmallAnimate 25s 1s infinite linear;
        }

        @keyframes cloudSmallAnimate {
            0% {
                left: 75%;
                opacity: 0.2;
            }
            15% {
                opacity: 0.5;
            }
            95% {
                opacity: 0.5;
            }
            100% {
                left: 90%;
                opacity: 0;
            }
        }

        @-webkit-keyframes cloudSmallAnimate {
            0% {
                left: 75%;
                opacity: 0.2;
            }
            15% {
                opacity: 0.5;
            }
            95% {
                opacity: 0.5;
            }
            100% {
                left: 90%;
                opacity: 0;
            }
        }

        .fluid-banner .wheel {
            background-position: 0 -138px;
            width: 156px;
            height: 145px;
            top: 16.2%;
            left: 80.6%;
            z-index: -1;
            opacity: 1;
            animation: wheelAnimate 25s 1s infinite linear;
            -webkit-animation: wheelAnimate 25s 1s infinite linear;
            transform-origin: 50% 50%;
            -webkit-transform-origin: 50% 50%;
        }

        @keyframes wheelAnimate {
            0% {
                transform: rotate(0deg);
            }
            100% {
                transform: rotate(360deg);
            }
        }

        @-webkit-keyframes wheelAnimate {
            0% {
                transform: rotate(0deg);
            }
            100% {
                transform: rotate(360deg);
            }
        }

        .clock-needle-large {
            top: 35.2%;
            left: 75%;
            width: 31px;
            height: 1.5px;
            z-index: -1;
            transform: rotate(90deg);
            background: linear-gradient(to right, #fff 50%, #ccc 50%) !important;
            animation: clockLargeAnimate 45s 1s infinite linear;
            -webkit-animation: clockLargeAnimate 45s 1s infinite linear;
            transform-origin: 50% 50%;
            -webkit-transform-origin: 50% 50%;
        }

        @keyframes clockLargeAnimate {
            0% {
                transform: rotate(90deg);
            }
            100% {
                transform: rotate(450deg);
            }
        }

        @-webkit-keyframes clockLargeAnimate {
            0% {
                transform: rotate(90deg);
            }
            100% {
                transform: rotate(450deg);
            }
        }

        .clock-needle-small {
            top: 35%;
            left: 76.7%;
            width: 13px;
            height: 2px;
            z-index: -1;
            background: #ccc !important;
        }

        .fluid-banner .app-icon1 {
            background-position: 0px -30px;
            width: 60px;
            height: 50px;
            top: 21%;
            left: 37%;
            animation: appIcon 0.5s 0.5s ease both;
            -webkit-animation: appIcon 0.5s 0.5s ease both;
        }

        .fluid-banner .app-icon2 {
            background-position: -50px -30px;
            width: 60px;
            height: 50px;
            top: 21%;
            left: 46%;
            animation: appIcon 0.5s 0.8s ease both;
            -webkit-animation: appIcon 0.5s 0.8s ease both;
        }

        .fluid-banner .app-icon3 {
            background-position: -100px -30px;
            width: 60px;
            height: 50px;
            top: 21%;
            left: 55%;
            animation: appIcon 0.5s 0.6s ease both;
            -webkit-animation: appIcon 0.5s 0.6s ease both;
        }

        .fluid-banner .app-icon4 {
            background-position: 0px -75px;
            width: 60px;
            height: 50px;
            top: 54%;
            left: 37%;
            animation: appIcon 0.5s 0.9s ease both;
            -webkit-animation: appIcon 0.5s 0.9s ease both;
        }

        .fluid-banner .app-icon5 {
            background-position: -50px -75px;
            width: 60px;
            height: 50px;
            top: 54%;
            left: 46%;
            animation: appIcon 0.5s 0.7s ease both;
            -webkit-animation: appIcon 0.5s 0.7s ease both;
        }

        .fluid-banner .app-icon6 {
            background-position: -100px -75px;
            width: 60px;
            height: 50px;
            top: 54%;
            left: 55%;
            animation: appIcon 0.5s 1s ease both;
            -webkit-animation: appIcon 0.5s 1s ease both;
        }

        @keyframes appIcon {
            0% {
                transform: scale(0.5);
                opacity: 0;
            }
            100% {
                transform: scale(1);
                opacity: 1;
            }
        }

        @-webkit-keyframes appIcon {
            0% {
                transform: scale(0.5);
                opacity: 0;
            }
            100% {
                transform: scale(1);
                opacity: 1;
            }
        }

        @media only screen and (max-width: 991px) {
            #fluid-banner {
                display: none;
            }          
        }
@media only screen and (max-width: 767px) {
     .zthree-col-inner{margin-bottom:25px;}
}

        @media only screen and (-webkit-min-device-pixel-ratio: 1.5),
        only screen and (min--moz-device-pixel-ratio: 1.5),
        only screen and (min-resolution: 240dpi) {
            .fluid-banner span {
                background: url("../img/app-sprite-2x.png") no-repeat 0 0;
                background-size: 211px auto;
            }
        }
/* Arabic Style Start */
.i18n-ar h1, .i18n-ar .zsection-banner p, .i18n-ar .zsection-nav-menu {
    text-align: center;
}
.i18n-ar .zthree-col-inner{
    float: right;
    margin: 2% 0% 1% 6%;
}
@media only screen and (max-width: 640px){
    .i18n-ar h2{
        text-align: right;
    }
    .i18n-ar .zthree-col-inner{
        margin: 2% 0% 10% 6%;
    }
}
/* Arabic Style End */