﻿body, html, * {
    font-family: "Segoe UI",Tahoma,Geneva,Verdana,sans-serif;
    font-size: 12px;
    margin: 0;
    padding: 0;
    
}
.companylogo_area{
    margin: auto;
    /*width: 340px;*/
    /*display: inline-block;*/
    /*width: 60%;*/
    /*padding: 15px; 
    height: 93%;*/
}

 .lang_area select {
     border-radius: 0px;
     vertical-align: middle;
 }
 .lang_area {
     margin: 0px auto 0 auto;
     padding: 0px 10px;
     position: fixed;
     right: 5px;
     top: 20px;
     z-index: 1;
 }



.container {
   
     position: relative;
    /*margin-top: 7%;*/
    display: table;
    width: 100%;
    height: calc(100vh);
}
.container_inner {
    display: table-cell;
    vertical-align: middle;
}
.client_logo
{
    display: block;
    max-width: 280px;
    margin: auto;
}
.credential_area
{
    border-radius: 15px;
    margin-top: 3%;
     min-width: 420px !important;
    width: 30%;
    min-height: 370px !important;
    /*height: 100%;*/
    background: #FFF;
    position: relative;
    margin: auto;
    padding: 20px 10px;
    box-shadow: 0px 18px 50px -10px #c1bfbf;
}

.login_msg
{
    font-size:13px;
    color:rgb(32, 127, 180);
    display:block;
    text-align:center;

}
/*.credential_area:before
{
	content:"";
    position:absolute; 
    z-index:-1;
     -webkit-box-shadow:0 0 10px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 10px rgba(0,0,0,0.8);
    box-shadow:0 0 10px rgba(0,0,0,0.8);
    top:50%;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:300px / 10px;
    border-radius:300px / 10px;
    
}

.credential_area:after
{
	content:"";
    position:absolute; 
    z-index:-1;
    -webkit-box-shadow:0 0 10px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 10px rgba(0,0,0,0.8);
    box-shadow:0 0 10px rgba(0,0,0,0.8);
    top:0;
    bottom:50%;
    left:10px;
    right:10px;
    -moz-border-radius:300px / 10px;
    border-radius:300px / 10px;
}*/
.wrench_logo
{
   margin: auto;
    width: 110px;
    opacity: 0.5;
    margin-top: 23px;
}
.sign_in
{	
   margin: auto;
    height: auto;
    width: 60%;
}
.side_arrow {
width: 7px;
height: 7px;
background: none repeat scroll 0% 0% #fff;
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
border-bottom:thin #CACACB solid;
border-right:thin #CACACB solid;
position:absolute;
right:351px;
margin-top:4px;
z-index:1;
	background: -webkit-linear-gradient(top,#ffffff,#FAFAFA)!important;	
	background: -moz-linear-gradient(top,#ffffff,#FAFAFA)!important;	
	background: linear-gradient(top,#ffffff,#FAFAFA)!important;	

}
.body_login {
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../Images/login-page-banner.jpg);
}
.show_icon
{
	border-right:thin #CACACB solid;
	float:left;
	padding:9px 9px 8px;
	background: -webkit-linear-gradient(top,#ffffff,#FAFAFA)!important;	
	background: -moz-linear-gradient(top,#ffffff,#FAFAFA)!important;	
	background: linear-gradient(top,#ffffff,#FAFAFA)!important;	
    background: -ms-linear-gradient(top,#ffffff,#FAFAFA)!important;	
}
.loginfield
{	
	border:none!important;
	position:relative!important;
	height:35px!important;
	outline:0!important;
	/*text-indent:20px!important;*/
	width: 80% !important;
    padding: 0 0!important;
    padding-left:10px!important;
    color:#000!important;
    font-size: 13px!important;

}

.signin_inputs
{
	margin:13px 0;
    /*width:225px;*/
}
.signin_inputs input[type=checkbox]
{
	position:relative;
	top:2px;
}
.homemessage_area
{
    width: 70%;
    text-align: center;
    overflow: hidden;
    position: relative;
    display: block;
    min-width: 456px !important;
    margin-left: auto;
    opacity: 0.8;
    margin-right: auto;
    background-color: #ffffff;
    border-bottom: 1px solid #f60f0f;
    border-top: 1px solid #f60f0f;
    padding: 5px 15px 5px 15px;
}
.into_wrench
{
   margin-left:0px;
	margin-top:10px;
	margin-bottom: 4px;
	background: -webkit-linear-gradient(top,#1a797b,#1a797b);
	background: -moz-linear-gradient(top,#1a797b,#1a797b);
    background: linear-gradient(top,#1a797b,#1a797b);
    color:#fff !important;
    font-weight:400;
	font-size:13px!important;
	height:34px !important;
	line-height:1px !important;
	width:80px;
	border: none!important; 
	moz-border-radius: 0px!important;
	-webkit-border-radius: 0px!important;
    /*border-radius: 6px!important;*/
	/*margin-left:50px;*/
    cursor:pointer;
   -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3);
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3);
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3);
            float:right;

}
.into_wrench:active
{
-webkit-box-shadow:0 1px 10px rgba(0, 0, 0, 0.0);
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.0);
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.0);
            }
            

.error
{
    font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    font-size:12px;
    color:red!important;
    width:inherit;
}
.input_border
{
   border: thin #22abad solid;
   /*border-radius: 5px;*/
}
#first_focus
{
    box-shadow: 0 0 5px #2677fd;
}


/*@media only screen and (min-width:150px) and (max-width:560px)
{
    .container
{
	width:99%;
    position: absolute;
    margin: 20px auto 0 auto;
}*/





.signin_inputs
{
	margin:12px 2px;
    width:100%;
}

.loginfield
{	
	width:82%;
}



.side_arrow {
display:none
}



}
#passwordPolicyPanel pre {
    border:thin solid #efefef;
    border: thin solid #C3C3C3;
    padding: 5px;
    font-family:'Segoe UI';
}
         #buttonSignIn.disableButton,#buttonAcceptPrivacyPolicy.disableButton  {
            cursor: not-allowed !important;
            pointer-events:none;
            opacity: 0.5;
        }
        .animateToAcceptPrivacy
        {
                    animation:blinkChangesRedCheckbox 0.3s 2;
        }
        .clickable
        {
            cursor:pointer;
        }
@keyframes blinkChangesRedCheckbox{
	    0%{		border:solid 1px #ffffff;
  box-shadow: 0 0 5px #ffffff;
      transform: scale(1);
      /*transform: rotate(30deg);*/
      }
	    25%{	border:solid 1px #1a797b;	
   box-shadow: 0 0 5px #2277c7;
   
      transform:  scale(1.2);
            /*transform: rotate(-30deg);*/

      }
	    50%{	border:solid 1px #1a797b;	
        box-shadow: 0 0 5px #2277c7;
        
      transform:  scale(1.5);
            /*transform: rotate(30deg);*/

} 60%{	border:solid 1px #1a797b;	
        box-shadow: 0 0 5px #2277c7;
        
      transform:  scale(1.7);
      /*transform: rotate(-30deg);*/
}
        75%{	border:solid 1px #1a797b;	
        box-shadow: 0 0 5px #2277c7;
        
      transform:  scale(1.5);
      /*transform: rotate(30deg);*/
}
	    90%{	border:solid 1px #1a797b;	
        box-shadow: 0 0 5px #2277c7;
        
      transform:  scale(1.3);
      /*transform: rotate(-30deg);*/
}
	    100%{	border:solid 1px #1a797b;
                 	  box-shadow: 0 0 5px #2277c7;
      transform:  scale(1.2);
      /*transform: rotate(0deg);*/
}
