/* Initial CSS */
[data-in='enter']{overflow-x:hidden;background-image:url('../img/bg/enter/default.jpg');background-repeat:repeat;background-size:cover;background-attachment:fixed;position:relative;min-height:100%;user-select:none;;}
[data-in='enter'][data-enterBg='1']{background-image:url('../img/bg/enter/1.jpg')}
[data-in='enter'][data-enterBg='2']{background-image:url('../img/bg/enter/2.jpg')}
[data-in='enter'][data-enterBg='3']{background-image:url('../img/bg/enter/3.jpg')}
[data-in='enter'][data-enterBg='4']{background-image:url('../img/bg/enter/4.jpg')}
[data-in='enter'][data-enterBg='5']{background-image:url('../img/bg/enter/5.jpg')}
[data-in='enter'][data-enterBg='6']{background-image:url('../img/bg/enter/6.jpg')}
[data-in='enter'][data-enterBg='7']{background-image:url('../img/bg/enter/7.jpg')}
[data-in='enter'][data-enterBg='8']{background-image:url('../img/bg/enter/8.jpg')}
[data-in='enter'][data-enterBg='9']{background-image:url('../img/bg/enter/9.jpg')}
[data-in='enter'][data-enterBg='10']{background-image:url('../img/bg/enter/10.jpg')}
[data-in='enter'][data-enterBg='11']{background-image:url('../img/bg/enter/11.jpg')}
[data-in='enter'][data-enterBg='12']{background-image:url('../img/bg/enter/12.jpg')}
[data-pwa] body[data-in='enter']{background-color:#c80a5a;}

/* Layout */
[data-in='enter'] #enterBox{width:20%;min-width:380px;max-width:450px;min-height:370px;margin:20px auto;margin:10vh auto 30px;padding:30px;background-color:rgba(255,255,255,0.2);border-radius:5px;box-shadow:0 3px 6px rgba(0,0,0,0.10), 0 3px 6px rgba(0, 0, 0, 0.05);transition:0.3s;color:#fff;}
[data-in='enter'] #enterBox.large{height:400px}
[data-in='enter'] .logo{margin:0}
[data-in='enter'] .logo a{display:block;border-radius:50%}
[data-in='enter'] .logo a:hover img{background-color:rgba(0,0,0,0.1);}
[data-in='enter'] .logo a:focus img{background-color:rgba(0,0,0,0.2);}
[data-in='enter'] .logo a:active img{background-color:rgba(0,0,0,0.3);}
[data-in='enter'] .logo img{display:block;max-width:100%;height:90px;width:90px;margin:0 auto;transition:0.3s;overflow:hidden;text-align:center;background-color:rgba(0,0,0,0.05);padding:2px;border-radius:50%;}
[data-in='enter'] .logo span{display:none !important}
[data-in='enter'] #enterBox h2{font-size:13px;overflow:hidden;margin:10px 0;text-align:center;color:#fff;line-height:17px;}
[data-in='enter'] #enterBox h2 abbr{cursor:pointer;}
[data-in='enter'] #enterBox .msg{font-size: 11px;}
[data-pwa] [data-in='enter'] #enterBox .msg{font-size: 10px;padding:5px 5px;}
[data-in='enter'] .text p{transition:0.3s;padding:0.5em}
[data-in='enter'] .text p:hover{background-color:rgba(0,0,0,0.1);}
[data-in='enter'] .text a{color:#eee;padding:10px 5px;display:inline-block;transition:0.3s;}
[data-in='enter'] .text a:hover{background-color:rgba(255,255,255,0.1);}
/* sessions style*/
[data-in='enter'] .sessions > div{font-size:11px;line-height:20px;margin-bottom:20px;transition:0.3s;padding:0.5em;position:relative;}
[data-in='enter'] .sessions > div:hover{background-color:rgba(0,0,0,0.1);}
[data-in='enter'] .sessions > div abbr{float:right;}
[data-in='enter'] .sessions .browser{font-weight:700;}
[data-in='enter'] .sessions .os{color:#eee}
[data-in='enter'] .sessions .ip{color:#ddd}
[data-in='enter'] .sessions .lastseen{color:#ddd;position:absolute;right:0.5em;top:0.5em;}
[data-in='enter'] .sessions a{background-color:#eee;opacity:0;padding:0.2em 10px;display:inline-block;color:#333;border:2px solid transparent;position:absolute;right:0.5em;bottom:0.5em;transition:0.3s}
[data-in='enter'] .sessions > div:hover a{opacity:0.5}
[data-in='enter'] .sessions a:hover{border-color:#cab530;opacity:0.6;}
[data-in='enter'] .sessions a:focus{border-color:#444;opacity:0.8;}
[dir="rtl"] [data-in='enter'] .sessions .lastseen{left:0.5em;right:inherit;}
[dir="rtl"] [data-in='enter'] .sessions a{left:0.5em;right:inherit;}


/* form new styles*/
[data-in='enter'] form{line-height:30px;font-size:18px;overflow:hidden;}
[data-in='enter'] form p{font-size:0.8em;}
[data-in='enter'] form .flex{border-radius:3px;height:50px;margin:10px 0;}
[data-in='enter'] form .flex.hide{display:none!important;}
[data-in='enter'] form .flex label{padding:0;border:none;direction:ltr;min-width:50px;width:50px;background-color:rgba(0,0,0,0.2);color:#ddd;transition:0.3s;text-align:center;font-size:0.8em;line-height:50px;outline:none;}
[data-in='enter'] form .flex label:hover{background-color:rgba(0,0,0,0.3);}
[data-in='enter'] form .flex label a:active{background-color:rgba(0,0,0,0.3);}
[data-in='enter'] form .flex label i{margin:0;display:block;}
[data-in='enter'] form .flex label a{color: #fff;display:block;line-height:50px;}
[data-in='enter'] form .flex input{padding:0 10px;line-height:50px;border:1px solid transparent;direction:ltr;width:100%;background-color:rgba(0,0,0,0.1);color:#eee;transition:0.3s;font-weight:100;}
[data-in='enter'] form .flex input.error{border-color:#ffa000;}
[data-in='enter'] form .flex input:disabled{opacity:0.8}
[data-in='enter'] form .flex input:hover{background-color:rgba(0,0,0,0.15);}
[data-in='enter'] form .flex input:focus{background-color:rgba(0,0,0,0.25);}
[data-in='enter'] form .flex input::-webkit-outer-spin-button, [data-in='enter'] form .flex input::-webkit-inner-spin-button{-webkit-appearance:none;}
[data-in='enter'] form .flex ::-webkit-input-placeholder{color:#ccc;}
[data-in='enter'] label{padding:10px 0;display:block;font-size:0.8em;}
[data-in='enter'] form textarea{min-height:120px;max-height:200px;padding:10px;line-height:20px;background-color:rgba(0,0,0,0.1);color:#eee;font-size:0.8em;min-width:100%;}
/* custom style for some inputs*/
[data-in='enter'] form #emobile label{
	font-size:30px;
	line-height:40px;
}
[data-in='enter'] form #eramz label,
[data-in='enter'] form #eramzNew label,
[data-in='enter'] form #displaynameBox label,
[data-in='enter'] form #eusername label{
	font-size:21px;
	line-height:50px;
}

[data-in='enter'] .agreement{
	background-color: rgba(0, 0, 0, 0.03);
	font-size: 11px;
	line-height: 20px;
	padding: 5px 10px;
	color: #ddd;
}
[data-in='enter'] .agreement a{color: #fff;font-weight: 700;}
[data-in='enter'] .agreement a:focus{color:#c80a5a;}

[data-in='enter'] form #email, [data-in='enter'] form #emailNew{font-size:0.8em;}

/* change style of autocomplete*/
[data-in='enter'] input:-webkit-autofill,[data-in='enter'] input:-webkit-autofill:hover,[data-in='enter'] input:-webkit-autofill:focus,[data-in='enter'] input:-webkit-autofill{border: none;-webkit-text-fill-color: #fff;-webkit-box-shadow: 0 0 0px 1000px #000 inset;transition: background-color 0.3 ease-in-out 0s;}
[data-in='enter'][data-loading-form]{cursor:progress;}
[data-in='enter'] form .flex button{line-height:30px;width:100%;padding:10px;cursor:pointer;border:none;border-radius:3px;outline:none;background-color:#0275d8;color:#fff;opacity:0.6;transition:0.3s}
[data-in='enter'] form .flex button:hover{opacity:0.8}
[data-in='enter'] form .flex button:focus{opacity:1}
[data-in='enter'] form .flex button:disabled{opacity:0.5;cursor:not-allowed;background-color:#0d3050;}
[data-in='enter'] form .link{color:#eee;font-size:11px;padding:5px 10px;transition:0.3s;display:block;}
[data-in='enter'] form .link:hover{background-color:rgba(0,0,0,0.1)}
[data-in='enter'] form .link:focus{background-color:rgba(0,0,0,0.2)}
[data-in='enter'] form .link:active{background-color:rgba(0,0,0,0.3);text-decoration:none;}


[data-in='enter'] hr{margin-bottom:10px;}
[data-in='enter'] #eMethods{font-size:10px;font-weight:100;}
[data-in='enter'] #eMethods p{font-size:14px;}
[data-in='enter'] #eMethods a{height:40px;line-height:40px;margin:5px 0;background-color:rgba(0,0,0,0.4);transition:0.3s;display:inline-block;color:#eee;border-radius:3px;overflow:hidden;min-width:40%;}
[data-in='enter'] #eMethods a:hover{opacity:0.8}
[data-in='enter'] #eMethods a:focus{opacity:0.7}
[data-in='enter'] #eMethods a i{width:40px;height:40px;min-width:40px;float:left;margin:0 10px 0 0;font-size:18px;}
[data-in='enter'] #eMethods a span{display:block;width:100%;height:100%;font-size:12px;}
[data-in='enter'] #eMethods a abbr{display:none}
[data-in='enter'] #eMethods a.active{background-color:rgba(0,0,0,0.8);display:none;}
[dir="rtl"] [data-in='enter'] #eMethods a i{float:right;margin:0 0 0 10px;}

[data-in='enter'] #eMethods #ebgoogle{min-width:150px;}
[data-in='enter'] #eMethods #ebgoogle i{background-color:#DD4B39;padding-top:3px;}
[data-in='enter'] #eMethods #ebmobile{min-width:150px;}
[data-in='enter'] #eMethods #ebmobile svg{margin:0;}
[data-in='enter'] #eMethods #ebusername{min-width:170px;}

[dir="rtl"] [data-in='enter'] #eMethods #ebgoogle{min-width:110px;}
[dir="rtl"] [data-in='enter'] #eMethods #ebmobile{min-width:120px;}
[dir="rtl"] [data-in='enter'] #eMethods #ebusername{min-width:160px;}

[data-in='enter'] .radio1{background-color: rgba(255,255,255,0.1);padding:5px 10px;margin-bottom:5px;}
[data-in='enter'] .radio1 label{font-size: 11px;font-weight:400;}
[data-in='enter'] .radio1 label:first-of-type::before{border-color: #eee;}
[data-in='enter'] .radio1 label:first-of-type:hover::before{border-color:#fff}
[data-pwa] [data-in='enter'] .radio1{padding-top:3px;padding-bottom:3px;}

/*langlist*/
[data-in='enter'] .langlist{position:absolute;bottom:0;left:0;padding:10px;display: none}
[data-in='enter'][data-page="home"] .langlist{display: block}
[dir="rtl"] [data-in='enter'] .langlist{left:inherit;right:0;}
[data-in='enter'] .langlist a{display:inline-block;padding:10px 20px;color:#fff;background-color:#000;transition:0.3s;opacity:0.3;margin:0 5px;}
[data-in='enter'] .langlist a:hover{opacity:0.6;}
[data-in='enter'] .langlist a:focus{opacity:8;background-color:#000;color:#fff;}
/*type effect*/
[data-in='enter'] .typed-cursor{opacity:1;-webkit-animation:blink 0.7s infinite;-moz-animation:blink 0.7s infinite;animation:blink 0.7s infinite}
@keyframes blink{ 0%{opacity:1} 50%{opacity:0} 100%{opacity:1} }
@-webkit-keyframes blink{ 0%{opacity:1} 50%{opacity:0} 100%{opacity:1} }
@-moz-keyframes blink{ 0%{opacity:1} 50%{opacity:0} 100%{opacity:1} }
[data-in='enter'] .typer__cursor--blink{-webkit-animation:blink 1s infinite;-moz-animation:blink 1s infinite;animation:blink 1s infinite}
@-webkit-keyframes blink{ 0%{opacity:1} 100%{opacity:0} }
@-moz-keyframes blink{ 0%{opacity:1} 100%{opacity:0} }
@keyframes blink{ 0%{opacity:1} 100%{opacity:0} }




[data-pwa] [data-in='enter'] #enterBox{min-width:300px;min-height:300px;padding:10px 15px;width:50%;margin:5vh auto 10px;}
[data-pwa] [data-in='enter'] form .flex{margin: 5px 0;height:40px;}
[data-pwa] [data-in='enter'] .langlist{position:absolute;}
[data-pwa] [data-in='enter'] #eMethods{display: none;}
[data-pwa] [data-in='enter'] #eMethods a{height:30px;line-height:30px;}
[data-pwa] [data-in='enter'] form .flex label{line-height: 40px;}
[data-pwa] [data-in='enter'] form .flex label a{line-height: 40px;}
[data-pwa] [data-in='enter'] form #eramz label, [data-pwa] [data-in='enter'] form #eramzNew label, [data-pwa] [data-in='enter'] form #displaynameBox label, [data-pwa] [data-in='enter'] form #eusername label{line-height:40px;}
[data-pwa] [data-in='enter'] form .flex button{padding:5px 10px;}
[data-pwa] [data-in='enter'] form .flex input{line-height:40px;}

/* Design for print */
@media print {
  [data-in='enter'] footer{display:none;}
}
