<?php
$float=$_GET['dir']=="ltr"?"left":"right";
$ofloat=$_GET['dir']=="ltr"?"right":"left";
$dir=$_GET['dir']=="ltr"?"ltr":"rtl";
$img_dir = $_GET['dir']=="ltr"?"_ltr":"";
header("Content-Type: text/css");
header("X-Content-Type-Options: nosniff");
header("Content-Type: text/css;X-Content-Type-Options: nosniff;");
?>
*{margin:0;padding:0;-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
input:focus,select:focus,textarea:focus,button:focus {outline: none;}

html{height:100%;}
body{text-align:<?=$_GET['tinystyle']?$float:"center"?>;width:100%;font-size: 14px; height:100%;background:<?=$_GET['tinystyle']?"#fff":"#000"?>;font-family:sans-serif,Roboto,Helvetica ,Arial}
img{border:0;}

a,a:link{text-decoration:none;cursor:pointer}
#media-container , #media-container *{margin:0;padding:0;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-tap-highlight-color: rgba(0,0,0,0);}
#media-container{position:absolute;top:0;right:0;left:0;bottom:0;overflow:hidden;}


#media-container .title-block{position:relative;height:10%;line-height:200%;width:100%;font-weight:bold;font-size:100%;position:relative;z-index:999;}
#media-container.smallmenu[rel="big"] .title-block{height:11%}
#media-container.smallmenu[rel="big"] .screen{top:11%}
#media-container[rel="big"] .title-block{height:19%;}
#media-container[rel="big"] .screen{top:20%}
#media-container[rel="big"]  #module-viewer{top:19%}


/* new menu and share box */
#media-container[menu="new"] .title-block .media-menu.newmenu{background-size:44%;border-radius:0 4px 4px 0;z-index:100;background-image:url('../webimages/new_menu.png');background-repeat:no-repeat;background-position:bottom 30% center;width:15%;height:7vh;background-color:#40454f;top:1.5vh;}
#media-container[menu="new"] .title-block .newcontact{background-size:44%;border-radius:0 4px 4px 0;z-index:100;background-image:url('../webimages/new_contact.png');background-repeat:no-repeat;background-position:bottom 40% center;position:absolute;top:9vh;margin:auto;left:0;width:15%;height:7vh;background-color:#40454f;}
#media-container[menu="new"] .title-block .newshare{background-size:32%;border-radius:0 4px 4px 0;z-index:100;background-image:url('../webimages/new_share.png');background-repeat:no-repeat;background-position:bottom 4px center;position:absolute;bottom:4px;left:0;width:15%;height:30%;background-color:#40454f;}
#media-container[menu="new"] .title-block .media-logo{width:100%;}
#media-container[menu="new"] .title-block > div > span{font-size:2vh;font-weight:normal;color:#fff;position: absolute;    top: 2px;    left: 0;    right: 0;    display: block;    line-height: initial;}


#media-container .title-block .media-menu{cursor:pointer;height:100%;width:15%; ;position:absolute;z-index:2;top:0;left:0;background-position:center center;background-size: 80% auto;background-repeat:no-repeat;background-color:#2cafe3;}
#media-container .title-block .media-logo{height:100%;position:relative;z-index:0;width:85%;float:right;background-size:contain;background-position:center center;background-color:#2cafe3;background-repeat:no-repeat;}
#media-container .screen{z-index:10;height:auto;width:100%;position:absolute;left:0;bottom:2%;top:10%;font-size:0; }
#media-container .screen ~ .screen{-ms-transform: translate3d(100%,0,0);-webkit-transform: translate3d(100%,0,0);transform: translate3d(100%,0,0);}
#media-container .screen , #media-container .screen *{-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
#media-container .screen .icon-block{position:relative;z-index:0;display:block;float:left;height:20%;width:25%; text-align:center;}
#media-container .screen .icon-block.big-block{width:100%;margin-bottom:1%;}
#media-container .screen .icon-block.big-block.x2{height:39%;}
#media-container .screen .icon-block.big-block.x3{height:59%;}
#media-container .screen .icon-block.big-block.x4{height:79%;}
#media-container .screen .icon-block.big-block.x5{height:99%;}

#media-container #module-viewer .front *{-webkit-user-select: text;-moz-user-select: text;-ms-user-select: text;user-select: text;}
#media-container.login *{-webkit-user-select: text;-moz-user-select: text;-ms-user-select: text;user-select: text;}


#media-container .screen .icon-block.parser{display:none;-webkit-animation-name: none;animation-name: none;}
#media-container .screen .icon-block .icon{ position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;}
#media-container .screen .icon-block > span{position:absolute;bottom:0;left:0;width:100%;z-index:99;}


#media-container .screen .icon-block .widget-container{height:100%;width:100%;position:relative;z-index:0;float:left;}
#media-container .screen .icon-block .widget-container.loading{background:url(../webimages/busy-module.gif) center center no-repeat;background-size:60px auto;background-color:rgba(0,0,0,0.1)}


#media-container #module-viewer{opacity:0;filter:alpha(opacity=0);height:1%;width:1%;position:absolute;top:36%;left:25%;z-index:0;-webkit-animation-duration: 0.4s;animation-duration: 0.4s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
#global_ruller{float:left;height:10%;width:10%;position:relative;z-index:0;}
.iconAnimationOpen, .iconAnimationOpen ~ span{-webkit-animation-name: flipOpen;animation-name: flipOpen;  -webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
.iconAnimationClose, .iconAnimationClose ~ span{-webkit-animation-name: flipClose;animation-name: flipClose;  -webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
#media-container #menu-container{position:absolute;z-index:999999;-webkit-transform: translate3d(-50%, 0px, 0px) rotate3d(0, 1, 0, -90deg);transform: translate3d(-50%, 0px, 0px) rotate3d(0, 1, 0, -90deg);}

#media-container #module-viewer .data-loading{display:none;opacity:0;filter:alpha(opacity=0);-webkit-transition:-webkit-transform 300ms linear;transition:all 300ms linear;position:absolute;z-index:999;background:url(../webimages/busy-module.gif) center center no-repeat #000; top:0;right:0;bottom:0;left:0;}

#media-container #module-viewer .preload{z-index:0;position:absolute;top:0;right:0;bottom:0;left:0;background:url(../webimages/loading-widget.gif) center center no-repeat #000;opacity:0.9;filter:alpha(opacity=90);}
#media-container #module-viewer .front{z-index:1;position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;filter:alpha(opacity=0;);-moz-transition: 0.5s linear;-ms-transition: 0.5s linear;-o-transition: 0.5s linear;-webkit-transition: 0.5s linear;transition: 0.5s linear;}
#media-container #module-viewer .front *{-moz-transition:none;-ms-transition:none;-o-transition:none;-webkit-transition:none;transition:none;}
#menu-container .menu-title{position:relative;z-index:10;height:10%;width:100%;float:left;}
#menu-container .menu-title img{float:right;height:100%;width:auto;cursor:pointer;}
#menu-container .menu-title .ttl{height:100%;float:right;margin-right:2%;}
#menu-container > ul{position:absolute;z-index:1;top:10%;right:0;bottom:0;left:0;overflow:auto;}
#menu-container ul li{list-style:none;overflow:hidden;width:94%;margin:0 3% 0 3%;padding-top:2%; }
#menu-container ul li ~ li{padding-top:0%;}
#menu-container ul li img{float:right;height:100%;width:auto;}
#menu-container ul li a,
#menu-container ul li span{float:right;display:block;height:100%;}
#menu-container ul li.expand{background:none;-moz-transition: 0.5s linear;-ms-transition: 0.5s linear;-o-transition: 0.5s linear;-webkit-transition: 0.5s linear;transition: 0.5s linear;}

#menu-container ul li.expand.open{max-height:100%;padding-bottom:4%;}
#menu-container ul li.expand > span{}
#menu-container ul li.expand.open > span{}

#menu-container > ul > li > ul{padding-right:8%;}
#menu-container > ul > li > ul > li{padding-top:0%;}
#menu-container > ul > li > ul > li ~ li{border-top:1px #999999 solid;}
#menu-container > ul > li > ul > li a,
#menu-container > ul > li > ul > li span{white-space:nowrap;background:none;line-height:160%;font-size:60%;padding-right:2%;}


#media-container #module-viewer .theme-button{width:40%;height:10%;border:1px #fff solid;background:#555;color:#fff;font-size:80%;text-align:center;cursor:pointer;border-radius:5px;margin:1%;padding:0 4%;}
#media-container #module-viewer .theme-submit{width:48%;height:10%;border:1px #fff solid;background:#050;color:#fff;font-size:80%;text-align:center;cursor:pointer;margin:1%;border-radius:5px;}

#media-container.rotate90deg{-ms-transform:rotate(-90deg) translateX(-100%);-ms-transform-origin: 0 0;-webkit-transform:rotate(-90deg) translateX(-100%);-webkit-transform-origin:  0 0;transform:rotate(-90deg) translateX(-100%);transform-origin: 0 0;-webkit-height:100vw;-ms-height:100vw;-webkit-width:100vh;-ms-width:100vh;height:100vw;width:100vh;}

#media-container #scn-line{font-size:0;z-index:11;text-align:center;overflow:visible;position:absolute;width:100%;height:4%;left:0;bottom:0;}
#media-container #scn-line .screncon{position:relative;width:8%;height:100%;display:inline-block;margin:0 0.5%;-webkit-transition:-webkit-transform 200ms linear;transition:all 200ms linear;}
#media-container #scn-line .screncon.mover{position:absolute;left:0;top:0;display:none;-webkit-transition:none;transition:none;}

#media-container #share-viewer{opacity:0;filter:alpha(opacity=0);height:1%;width:1%;position:absolute;top:36%;left:25%;z-index:0;-webkit-animation-duration: 0.4s;animation-duration: 0.4s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
#media-container #share-viewer .front{background:#eee;z-index:1;position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;filter:alpha(opacity=0;);-moz-transition: 0.5s linear;-ms-transition: 0.5s linear;-o-transition: 0.5s linear;-webkit-transition: 0.5s linear;transition: 0.5s linear;}
#media-container #share-viewer .front *{-moz-transition:none;-ms-transition:none;-o-transition:none;-webkit-transition:none;transition:none;}
#media-container #share-viewer.openWidgetTab .front{opacity:1;}


#media-container #scn-line .screncon .ascren{outline:1px #fff solid;border-radius:4px;background:url(../webimages/screen-glare-bg.png) center center;background-size:100% 100%;;opacity:0.5;filter:alpha(opacity=50);position:absolute;top:-120%;height:190%;width:100%;-webkit-transition:-webkit-transform 100ms linear;transition:all 100ms linear;}
#media-container #scn-line .screncon.active .ascren{opacity:1;filter:alpha(opacity=100);-webkit-box-shadow: 10px 10px 3px 0px rgba(0,0,0,0.75);-moz-box-shadow: 10px 10px 3px 0px rgba(0,0,0,0.75);box-shadow: 10px 10px 3px 0px rgba(0,0,0,0.75);top:-140%;}

#media-container #scn-line.front{height:3%}
#media-container #scn-line.front .screncon{width:6%;}
#media-container #scn-line.front .screncon .ascren{-webkit-box-shadow: 0 0 3px 0px rgba(0,0,0,0.75);-moz-box-shadow: 0 0 3px 0px rgba(0,0,0,0.75);box-shadow: 0 0 3px 0px rgba(0,0,0,0.75);outline:0;border-radius:100%;border:0;background:#ebebeb;opacity:1;filter:alpha(opacity=100);right:0;top:0;height:0;padding-bottom:65%;width:65%;left:0;margin:-30% auto 0 auto;}
#media-container #scn-line.front .screncon.active .ascren{background:#fff;border:1px #1390cf solid;top:-1px}

#media-container #scn-line.motion-view{padding-bottom:8%}
#media-container #scn-line.motion-view .screncon.mover{height:40%;opacity:1;filter:alpha(opacity=100)}

#media-container.login{background:url(../webimages/login-background.jpg) center center no-repeat;background-size:cover;}

#media-container.login form{top:0;right:0;bottom:0;left:0;margin:auto;position:absolute;width:300px;height:190px;border:1px #000 solid;
-webkit-box-shadow: 10px 10px 3px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 3px 0px rgba(0,0,0,0.75);
box-shadow: 10px 10px 3px 0px rgba(0,0,0,0.75);

background: #e4f5fc; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjZTRmNWZjIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTAlIiBzdG9wLWNvbG9yPSIjYmZlOGY5IiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iNTElIiBzdG9wLWNvbG9yPSIjOWZkOGVmIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzJhYjBlZCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
background: -moz-linear-gradient(-45deg, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#e4f5fc), color-stop(50%,#bfe8f9), color-stop(51%,#9fd8ef), color-stop(100%,#2ab0ed)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(-45deg, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(-45deg, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(-45deg, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%); /* IE10+ */
background: linear-gradient(135deg, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4f5fc', endColorstr='#2ab0ed',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */

}

#media-container.login form .login-title{width:260px;padding:0 20px;height:30px;line-height:30px;font-size:20px;text-align:right;margin-top:10px;}
#media-container.login form .login-field{width:240px;padding:0 10px;height:30px;line-height:30px;border:1px #000 solid;text-align:left;direction:ltr;margin-top:5px;font-size:20px;}
#media-container.login form .login-submit{width:50%;border:1px #000 solid;font-size:20px;height:40px;float:left;margin-left:20px;margin-top:20px;}


.notice{z-index:9999;margin:auto;height:0%;width:60%;opacity:0;filter:alpha(opacity=0);line-height:0;font-size:100%;color:#fff;position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,0.8);
-webkit-box-shadow: 0px 0px 50px 20px rgba(0,0,0,1);
-moz-box-shadow: 0px 0px 50px 20px rgba(0,0,0,1);
box-shadow: 0px 0px 50px 20px rgba(0,0,0,1);
-webkit-transition:-webkit-transform 800ms linear;transition:all 800ms linear;
}

.youtube-play{display:none;z-index:999;position:absolute;top:0;right:0;bottom:0;left:0; background:url(../webimages/busy-module.gif) center center no-repeat rgba(0,0,0,0.7);background-size:60px auto;opacity:0;filter:alpha(opacity=0);}
.youtube-play iframe{z-index:10;position:absolute;left:0;top:0;height:100%;width:100%;}
.youtube-play .theme-close{z-index:20;position:absolute;right:0;top:0;height:1;width:10%;padding-bottom:10%;background:url(../webimages/pl_close_button.png) center center no-repeat;background-size:auto 90%;}


#media-container .page-preloader{z-index:1000;position:absolute;top:0;right:0;bottom:0;left:0;background:rgba(255,255,255,0.7);-ms-transition:-webkit-transform 1000ms linear;-webkit-transition:-webkit-transform 1000ms linear;transition:all 1000ms linear;}
#media-container .page-preloader .logo-cont{position:absolute;top:5%;left:5%;right:5%;height:40%;background-position:center center;background-repeat:no-repeat;background-size:contain;}
#media-container .page-preloader .loading-cont{position:absolute;top:45%;left:0;right:0;height:40%;background:url(../webimages/white-preloader.gif) center center no-repeat;background-size:20% auto;}
#media-container .page-preloader .loading-text{position:absolute;top:85%;left:0;right:0;height:10%;color:#fff;font-size:100%;line-height:100%;}

#hand-gesture{opacity:0;filter:alpha(opacity:0);display:none;position:absolute;bottom:0;right:0;height:30%;width:50%;background:url(../webimages/annoying-hand.png) top center no-repeat;background-size:100% auto;z-index:999;-ms-transition:-webkit-transform 700ms ease-in-out;-webkit-transition:-webkit-transform 700ms ease-in-out;transition:all 700ms ease-in-out;}

#media-container #page-working{transform:translate(0,-100%);-webkit-transform:translate(0,-100%);z-index:1000;position:absolute;height:5%;right:0;top:0;background:url(../webimages/loading-widget.gif) 5% center no-repeat rgba(0,0,0,0.80);border-radius:0 0 0 20px;text-align:left;font-size:60%;line-height:160%;width:35%;padding-left:10%;background-size:auto 80%;color:#fff;-ms-transition:-webkit-transform 300ms linear;-webkit-transition:-webkit-transform 300ms linear;transition:all 300ms linear;}

@media   screen and (max-aspect-ratio:13/20) {
  #media-container .screen{bottom:10%}
  #media-container[rel="big"] .screen{bottom:0%}
}
@media   screen and (max-aspect-ratio:11/20) {
  #media-container .screen{bottom:30%}
  #media-container[rel="big"] .screen{bottom:20%}
}

@media   screen and (min-aspect-ratio:20/13) {
  #media-container .screen{bottom:10%}
  #media-container[rel="big"] .screen{bottom:0%}
}

@media   screen and (min-aspect-ratio:20/11) {
  #media-container .screen{bottom:15%}
  #media-container[rel="big"] .screen{bottom:5%}
}

@-webkit-keyframes flipOpen {
 0% {opacity:1;
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
  }
  80% { opacity:0.2;
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% { opacity:0.1;
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
  }
}
@keyframes flipOpen {
   0% {opacity:1;
            transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
            animation-timing-function: ease-out;
  }

  80% { opacity:0;
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
            animation-timing-function: ease-out;
  }

  100% { opacity:0;
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
            animation-timing-function: ease-in;
  }
}

@-webkit-keyframes flipClose{
  0% { opacity:0;
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
  }
    20% { opacity:0;
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
  }
  100% {opacity:1;
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
  }
}

@keyframes flipClose {

  0% { opacity:0;
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
            animation-timing-function: ease-in;
  }
   20% { opacity:0;
            transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
            animation-timing-function: ease-out;
  }
   100% {opacity:1;
            transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
            animation-timing-function: ease-out;
  }
}


@-webkit-keyframes openWidgetTab{
  0% {z-index:100;}
  30% {z-index:100;opacity: 0.5;}
  100% {z-index:100;opacity: 1;filter:alpha(opacity=100);top:10%;left:0;height:90%;width:100%;}
}
@keyframes openWidgetTab{
  0% {z-index:100;}
  30% {z-index:100;opacity: 0.5;}
  100% {z-index:100;opacity: 1;filter:alpha(opacity=100);top:10%;left:0; height:90%;width:100%;}
}
#media-container[rel="normal"] #module-viewer.openWidgetTab{-webkit-animation-name: openWidgetTab;animation-name: openWidgetTab;}

@-webkit-keyframes openWidgetTabBig{
  0% {z-index:100;}
  30% {z-index:100;opacity: 0.5;}
  100% {z-index:100;opacity: 1;filter:alpha(opacity=100);top:19%;left:0;height:81%;width:100%;}
}
@keyframes openWidgetTabBig{
  0% {z-index:100;}
  30% {z-index:100;opacity: 0.5;}
  100% {z-index:100;opacity: 1;filter:alpha(opacity=100);top:19%;left:0; height:81%;width:100%;}
}
#media-container[rel="big"] #module-viewer.openWidgetTab{-webkit-animation-name: openWidgetTabBig;animation-name: openWidgetTabBig;}


@-webkit-keyframes closeWidgetTab{
  0% {z-index:100;opacity: 1;filter:alpha(opacity=100);top:10%;left:0;height:90%;width:100%;}
  30% {z-index:100;opacity: 0.5;}
  100% {}
}
@keyframes closeWidgetTab{
  0% {z-index:100;opacity: 1;filter:alpha(opacity=100);top:10%;left:0; height:90%;width:100%;}
  30% {z-index:100;opacity: 0.5;}
  100% {}
}
.closeWidgetTab{-webkit-animation-name: closeWidgetTab;animation-name: closeWidgetTab;}


@-webkit-keyframes openMenuTab{
   0% {-webkit-transform:translate3d(-50%, 0px, 0px) rotate3d(0, 1, 0, -90deg);
	  -webkit-animation-timing-function: ease-in;}
  100% {-webkit-transform: translate3d(0%, 0px, 0px) rotate3d(0, 1, 0, 0deg);
	 -webkit-animation-timing-function: ease-in;}
}

@keyframes openMenuTab{
  0% {transform:translate3d(-50%, 0px, 0px) rotate3d(0, 1, 0, -90deg);
	animation-timing-function: ease-in;}
  100% {transform: translate3d(0%, 0px, 0px) rotate3d(0, 1, 0, 0deg);
	animation-timing-function: ease-in;}
}

#media-container #menu-container.openMenuTab{-webkit-animation-name: openMenuTab;animation-name: openMenuTab;-webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}

@-webkit-keyframes closeMenuTab{
    0% {-webkit-transform: translate3d(0%, 0px, 0px) rotate3d(0, 1, 0, 0deg);-webkit-animation-timing-function: ease-out;}
  100% {-webkit-transform:translate3d(-50%, 0px, 0px) rotate3d(0, 1, 0, -90deg);-webkit-animation-timing-function: ease-out;}
}
@keyframes closeMenuTab{
    0% {transform: translate3d(0%, 0px, 0px) rotate3d(0, 1, 0, 0deg);animation-timing-function: ease-out;}
  100% {transform:translate3d(-50%, 0px, 0px) rotate3d(0, 1, 0, -90deg);animation-timing-function: ease-out;}
}
#media-container #menu-container.closeMenuTab{-webkit-animation-name: closeMenuTab;animation-name: closeMenuTab;-webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}


@-webkit-keyframes fadeAlittle{
   0% {opacity:1;}
   100% {opacity:0.2}
}
@keyframes fadeAlittle{
  0% {opacity:1;}
  100% {opacity:0.2}
}
.fadeAlittle{-webkit-animation-name: fadeAlittle;animation-name: fadeAlittle;-webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}

@-webkit-keyframes fadeAlittleBack{
   0% {opacity:1;}
   100% {opacity:0.2}
}
@keyframes fadeAlittleBack{
  0% {opacity:1;}
  100% {opacity:0.2}
}
.fadeAlittleBack{-webkit-animation-name: fadeAlittleBack;animation-name: fadeAlittleBack;-webkit-animation-duration: 0.3s;animation-duration: 0.3s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}