/*Responsive*/

        @media screen and (min-width:620px){
            ul.navbar li {
                display: inline-block;
            }
        }

         @media screen and (max-width:620px){
            .navbar{
                margin-bottom: 40px;
                position: relative;
            }
            ul.navbar li {
                display: block;
                border-bottom: 1px solid #8a9caf;
                text-align: center;                
            }

            .wrapper{
                width: 100% !important;
            }

            ul.navbar li,ul.navbar li a{
                padding: 2px;
            }
        }
        /*End Responsive*/


        a{
            text-decoration: none;
        }

        a,a:visited{
            color: #9a15bd;
        }

        ul a,ul a:visited{
            color: #efefef;
        }

        h3{
            margin: 0;
        }

        *{
            font-family:'b yekan',tahoma;
        }

        body{
            font-size:100%;
        }

        html,body{
            width:100%;
            height:100%;
            padding:0;
            border:0;
            margin:0;
            font-size:14px;
        }


        .fullpage{
            width:100%;
            height:100%;
            background-size:cover;
            background-position:50% 50%;
            background-attachment:fixed;
        }

        /*Pages*/
        .first{
            text-align: center;
            background-image:url("header.jpg");
        }


        .title{
            display:none;
            background-color: rgba(28, 28, 28, 0.70);
            text-align: center;
            font-size: 45px;
            color: #d2cbc5;
            text-shadow: 0px 0px 3px #66666e;
            direction: rtl;
            position: absolute;
            top: 40%;
            left:0;
            right:0;
            width: 100%; /* needed to add to fix horizontal positioning */

            /*Animation*/
            -webkit-animation-name: titleanime; /* Chrome, Safari, Opera */
            -webkit-animation-duration: 2s; /* Chrome, Safari, Opera */
            animation-name: titleanime;
            animation-duration: 2s;
            animation-iteration-count: infinite;
            -webkit-animation-iteration-count: infinite;
        }


        .apple{
            border-radius: 99999px;
            display: inline-block;
            padding: 5px 30px ;
        }

        .logo{
            position: absolute;
            display:block;
            top: 60%;
            margin: auto;
            left:0;
            right: 0;
            cursor: pointer;
        }


        .second{
            display: inline-block;
            background-image: url('bg.jpg');
            background-attachment: fixed;
            width:100%;
            text-align: center;
        }


        .ourproducts,.aboutus,.contactus{
            text-shadow: 1px 1px 5px black;
            display: inline-block;
            width:100%;
            margin: 20px 0px;
            border-top: #747474 solid 6px;
            border-bottom:#747474 solid 6px;
            background-color: rgba(111,111,111,.8);
            color:#efefef;
            font-size:45px;
        }

        .products{
            margin: 40px auto;
            text-align: center;
        }


        .product{
            cursor: pointer;
            border:groove 2px black;
            display: inline-block;
            width:300px;
            height: 400px;
            -float: right;
            margin: 50px;
            background-color: rgba(255,255,255,0.6);
            vertical-align: middle;
        }

        .productslide{
            width: 100%;
            display: inline-block;
        }

        .slide{
            margin: 3px;
            width:15px;
            height: 15px;
            border-radius: 50%;
            display: inline-block;
            background-color:gray;
        }


        .slide_current{
            background-color: #eb4a00;
            color:#eb4a00;
            box-shadow: 0px 0px 1px 5px inset;
        }

        .producttitle{
            width: 100%;
            display: inline-block;
            font-size:20px;
            color: #23282f;
        }

        .productdetail{
            height: 150px;
		direction:rtl;
font:'b yekan',tahoma;
        }

        .product img{
            display: inline-block;
        }


        .left {
            float: left;
        }

        .right{
            float: right;
        }

        ul.lists{
            list-style-type: none;
            overflow: hidden;
        }


        ul.lists li{
            color:#404040;
            font-size: 14px;
            direction: rtl;
            transition: .7s all;
            -webkit-transition: .7s all;
        }


        ul.lists li:hover{
            font-size: 18px;
            color:black;
            text-shadow: 0px 0px 3px #383838;
        }

        .second .left,.second .right{
            width:45%;
            max-width:45%;
            display: inline-block;
            margin: 20px;
        }

        .logorotL,.logorotR{
            cursor: pointer;
            display: inline-block;
            width:300px;
            height:308px;
            background-image: url('t2fix.png');
            background-repeat: no-repeat;
            background-position: bottom;
        }

        .logorotFL,.logorotFR{
            cursor: pointer;
            z-index: 999999999;
            position: absolute;
            display: inline-block;
            width:300px;
            height: 308px;
            background-image: url('t1fix.png');
            background-repeat: no-repeat;
            background-position: bottom;
        }


        .contact{
            width:100%;
        }


        .jobtitle{
            font-size: 25px;
            background-color: black;
            color:white;
            direction: rtl;
        }

        .address{
            font-size:20px;
            direction: rtl;
            text-shadow: 0px 0px 2px #484848;
            color:#222222;
            text-align: center;
            display: inline-block;
            border-left:4px dashed green;
            border-right:4px dashed green;
            padding: 10px;
            margin: 20px;
        }

        .address .manager{
            font-size:22px;
            text-shadow: 1px 1px 4px #383838;
            color:#686868;
        }

        .footer{
            font-size:16px;
            padding: 10px;
            background-color: #141414;
            color:rgb(153, 153, 153);
            text-shadow: 0px 0px 1px #505050;
            text-align: center;
        }
        /*End pages*/



        /*****Page Navigation*****/

        .navpage{
            display: inline-block;
            text-align: center;
            width: 100%;
            cursor: pointer;
        }

        .nextpage,.lastpage{
            display: inline-block;
            padding: 10px;
            border: #3498DB 2px solid ;
            background: #EEEEEE;
            color:#3498DB;
            font-size:16px;
            transition: all .2s;
            -webkit-transition: all .2s;
        }
        .nextpage:hover,.lastpage:hover{
            border:#3498DB 2px solid;
            background:#3498DB ;
            color:#EEEEEE;
        }
        /****End Page Navigation***/

        /*Navbar*/
        .navbar{
            color: #d3d3d3;
            margin-top: 0px !important;
            padding-left: 0px !important;
            z-index: 99999999999999;
            top:0;
            left:0;
            position:fixed;
            width:100%;
            height:40px;
            font-size:20px;
            -text-shadow: 5px 5px 2px gray;
            box-shadow:0px 0px 10px 3px black;
            line-height: 40px;
            border-bottom: solid 1px black;
        }

        ul.navbar{
            text-align: right ;
            background-color:#6C7A89;
            list-style: none;
        }

        ul.navbar li{
            font-size:20px;
            -display: inline-block;
            background-color:#6C7A89;
            list-style-type: none;
            cursor: pointer;
            padding: 0px 15px;
            transition: 1s all ease-out;
            -webkit-transition: .5s all ease-out;
        }

        ul.navbar li:hover{
            background-color: #454c58;
        }
        /*End Navbar*/


        .rotating {
            -webkit-animation: rotating 2s linear infinite;
            -moz-animation: rotating 2s linear infinite;
            -ms-animation: rotating 2s linear infinite;
            -o-animation: rotating 2s linear infinite;
            animation: rotating 2s linear infinite;
        }
        .rev {
            -webkit-animation-direction:reverse; /* Chrome, Safari, Opera */
            animation-direction: reverse;
        }


        .fade{
            opacity: 0;
        }


        /*Animations*/

        /*-----------------------Title--------------------*/

        /* Chrome, Safari, Opera */
        @-webkit-keyframes titleanime {
            50%  {text-shadow:0px 0px 30px #efefef;}
        }

        /* Standard syntax */
        @keyframes titleanime {
            50%  {text-shadow:0px 0px 30px #efefef;}
        }



        /*-------------------------Rotating-------------------*/
        @-webkit-keyframes rotating /* Safari and Chrome */ {
            from {
                -ms-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -webkit-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
            }
            to {
                -ms-transform: rotate(90deg);
                -moz-transform: rotate(90deg);
                -webkit-transform: rotate(90deg);
                -o-transform: rotate(90deg);
                transform: rotate(90deg);
            }
        }
        @keyframes rotating {
            from {
                -ms-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -webkit-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
            }
            to {
                -ms-transform: rotate(90deg);
                -moz-transform: rotate(90deg);
                -webkit-transform: rotate(90deg);
                -o-transform: rotate(90deg);
                transform: rotate(90deg);
            }
        }
        /*End Animations*/