﻿

html,body,form {height:100%;}
body {margin:0px;overflow-x:hidden;direction:rtl;}

#divLoading {position:fixed;width:100%;height:100%;overflow:hidden;left:0px;top:0px;background-color:#fff;z-index:200;}
#divLoading .loading-line {position:absolute;width:0.15%;height:100%;background-color:#232323;left:50%;z-index:210;}
#divLoading .loader {position:absolute;width:100%;height:50%;z-index:220;left:0px;background-color:#fff;}
#divLoading #loading-up {top:0px;}
#divLoading #loading-dn {bottom:0px;}

section {overflow:auto !important;}

.side {position:fixed;width:50%;height:100%;z-index:10;overflow:hidden;}
#divEngSide {left:0px;background-color:#fff;font-weight:500;}
#divPerSide {right:0px;background-color:#323232;}

.menu-wrapper {position:fixed;z-index:20;width:160px;height:100%;}
.menu-wrapper-eng {text-align:left;left:30px;}
.menu-wrapper-per {text-align:right;right:30px;}
.menu-wrapper ul {list-style-type:none;margin:0px;overflow:hidden;position:absolute;z-index:20;padding:10px;width:100%;}
.menu-wrapper ul li {height:30px;position:relative}
.menu-wrapper ul li a {line-height:25px;text-decoration:none;}
.menu-wrapper-eng ul {left:0px;}
.menu-wrapper-per ul {right:0px;}
.menu-wrapper-eng ul li a {color:#232323;padding-right:8px;font-size:14px;letter-spacing:1px;}
.menu-wrapper-per ul li a {color:#fff;padding-left:8px;font-size:16px;}
.menu-wrapper ul li a:hover {color:red !important;}
.menu-wrapper .line-sep {height:10px;width:70px;}

.menu-wrapper li a.active:before {content:' ';width:0px;height:0px;position:absolute;border:solid 14px Transparent;
                                   z-index:1000;}
.menu-wrapper-per li a.active:before {right:-18px;border-right-color:#232323;}
.menu-wrapper-eng li a.active:before {left:-18px;border-left-color:#fff;}
.menu-wrapper-per li a:hover {color:Red;}

.menu-icon {position:absolute;top:15px;font-size:18px;z-index:50;display:none;}
.side:hover .menu-icon, .menu-icon:hover {color:Red;}
.eng .menu-icon {color:#232323;left:6px;}
.per .menu-icon {color:#ffffff;right:6px;}

.footer {position:absolute;bottom:40px;z-index:30;padding:10px;}
.footer span {display:block;}
.per .footer {width:100%;color:#fff;font-size:12px;}
.eng .footer {color:#333;font-size:10.5px;text-align:left;line-height:30px;}
.per .footer #divLogo {direction:rtl;text-align:right;}
.per .footer #divLogo img {width:150%;}
.eng .footer span:nth-of-type(1) {letter-spacing:2.2em;}
.eng .footer span:nth-of-type(2) {letter-spacing:1.15em;}
.eng .footer span:nth-of-type(3) {letter-spacing:1.55em;}
.eng .footer:hover span::first-letter {color:red;}
.eng .footer:hover label {color:red;font-weight:bold;}
.eng .footer span::first-letter,
	.eng .footer label {font-weight:bold;}

#divImage {position:absolute;height:100%;top:0px;left:0px;z-index:15;text-align:right;}
#divImage img {height:100%;}


.page {display:none;height:100%;overflow:hidden;position:absolute;top:0px;box-sizing:border-box;}
.poster-wrapper img {width:100%;}
.page-eng {background-color:#232323;color:#fff;right:0px;}
.page-eng h1 {font-weight:normal;}
.page-per {background-color:#fff;color:#333;left:0px;}
.page-per .submenu span {display:inline-block;margin-right:30px;font-size:16px;}
.page-eng .submenu span {display:inline-block;margin-left:30px;font-size:16px;}

.menu-close {display:none;}

#divError {position:fixed;width:100%;height:100%;z-index:1000;background-color:rgba(0,0,0,0.6);display:none;text-align:center;
           padding-top:100px;overflow:hidden;}
#divError span {background-color:#f2f2f2;padding:30px;box-shadow:0px 5px 15px #000;}
.loading-tag {display:block;color:#d4d4d4;position:absolute;left:48%;width:4%;}

body.page-per-open {background-color:#fff;}
body.page-per-open #divMenuEng {z-index:5;}
body.page-per-open #divMenuPer {z-index:10;}
body.page-per-open .menu-wrapper-per a {color:#232323;}
body.page-per-open #divEngSide, 
	body.page-per-open .menu-wrapper-eng, 
	body.page-per-open .footer {display:none;}
body.page-per-open .per .menu-icon {display:inline-block;}
body.page-per-open #divPerSide {width:30px;}
body.page-per-open #divImage {display:none;}


body.page-eng-open {background-color:#232323;}
body.page-eng-open #divMenuEng {z-index:10;}
body.page-eng-open #divMenuPer {z-index:5;}
body.page-eng-open .menu-wrapper-eng a {color:#fff;}
body.page-eng-open #divPerSide, 
	body.page-eng-open .menu-wrapper-per, 
	body.page-eng-open .footer {display:none;}
body.page-eng-open .eng .menu-icon {display:inline-block;}
body.page-eng-open #divEngSide {width:30px;}
body.page-eng-open #divImage {display:none;}


#divPower {position:relative;font-size:12px;text-align:center;position:fixed;left:35px;bottom:10px;z-index:150;padding:5px;}
#divPower #spnCopy {font-size:16px;cursor:pointer;}
#divPower #spnPower {display:none;position:absolute;z-index:2000;text-align:left;width:200px;top:0px;direction:ltr;color:#999;
                     padding:5px;padding-left:40px;left:0px;}
.eng #spnPower {left:70%;}
.per #spnPower {right:70%;}
#divPower a {font-weight:bold;color:#000;display:inline;}


@media (max-width: 768px) 
{	
	.menu-wrapper {height:100%;}
	.menu-wrapper ul {padding:0px;}
	.menu-wrapper-per {background-color:#323232;}
	.menu-wrapper-eng {background-color:#fff;}
	
	#divImage {display:none;}
	
	#divLoading .loading-line {width:0.7%;}
	.footer {padding:0px;}
	.per .footer {text-align:right;}
	.per .footer #divLogo img {width:90%;}
	
	.eng .footer span:nth-of-type(1) {letter-spacing:1em;}
	.eng .footer span:nth-of-type(2) {letter-spacing:0.38em;}
	.eng .footer span:nth-of-type(3) {letter-spacing:0.61em;}
	
	.menu-close {position:absolute;top:5px;padding:5px;z-index:60;color:#fff;display:inline;cursor:pointer;display:none;}
	.per .menu-close {left:5px;}
	.eng .menu-close {right:5px;}
	.menu-close i {font-size:10px;}
	
	body.page-per-open .menu-wrapper-per a {color:#fff;}
	body.page-eng-open .menu-wrapper-eng a {color:#232323;}
	
	.loading-tag {left:46%;width:8%;}
	
	#divPower {left:25px;}
	
}