@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');

.wrapper-user{
	position:relative;
	display:block;
	border:2px solid red;
	min-height:100%;
	padding:90px 0 0;
	font-family: 'Montserrat', sans-serif!important;
}


.login-block{
	width:55%;
	display:inline-block;
	border:0px solid green;
	vertical-align:top;
	margin-left:3%;
	margin-top:1.5%;
}



/****************************************/



.wrapper-support{
	position:absolute;
	width:100%!important;
	height:100%!important;
	display:block;
	top:-0px;
	left:-0px;
	background:#fff;
	border:0px solid red;
	min-height:100vh;
	padding:0;
	margin:-0px;
	overflow:hidden;
	font-family: 'Montserrat', sans-serif!important;
}

.wrapper-support .red-side-support{
	display:inline-block;
	width:45%;
	height:100%;
	background:#FFCC66!important;
	box-shadow:1px 2px 7px #FFCC66;
	float:left;
	z-index:9;
	position:relative;
}

.wrapper-support .white-side-support{
	display:inline-block;
	width:55%;
	height:100%;
	background:#fff;
	float:right;
	z-index:9;
}

.wrapper-support .login-block{
	display:block;
	margin:19% 0 0 7%;
	width:90%;
}

.wrapper-support .login-block h3{
	line-height:1;
	font-weight:700;
	font-size:5.45em;
	letter-spacing:.5px;
	display:block;
	margin-bottom:11px;
	color:#232323;
	width:90%;
	margin:0 auto;
}

.wrapper-support .user-login-form{
	position:relative;
	display:block;
	margin:5.5% auto;
	padding:0;
	width:90%;
}

.wrapper-support .user-login-form label{
	display:block!important;
	color:#000!important;
	font-size:.95em!important;
	margin-bottom:5px!important;
	font-weight:700!important;
	font-family: 'Montserrat', sans-serif!important;
}

.wrapper-support .user-login-form .description{
	display:block;
	color:#555;
	font-size:.85em;
	margin-bottom:21px;
}

.wrapper-support .user-login-form input{
	width:420px!important;
	padding:12px 6px;
	font-family: 'Montserrat', sans-serif!important;
	border:1px solid #ccc!important;
	margin-bottom:5px;
	
	border-radius:0px;
}

.wrapper-support input#edit-submit{
    border:0px solid #232429!important;
    width: 415px!important;
    cursor: pointer!important;
    background: #FFCC66!important;
    color: #232323;
    letter-spacing:.7px!important;
    padding:12.5px 10px 12px!important;
    margin: 11px auto 0!important;
    position: relative;
    display: inline-block;
    font-size:.95em!important;
	font-family: 'Montserrat', sans-serif!important;
    font-weight: 500;
	text-transform:none!important;
	border-radius:0px!important;
	background:#000;
	border-radius:0px!important;
	box-shadow:2px 2px 4px #ccc;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s;
    -ms-transition: all .4s;
    transition: all .4s;
}

.wrapper-support input#edit-submit:hover{
      background:#232323!important;
	  border: 0px solid #104d84!important;
	  color:#ffff;
	  
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    -o-transition: all .4s;
    -ms-transition: all .4s;
    transition: all .4s;
}

.wrapper-support .gnome-hello{
	text-align:center;
	border:0px solid blue;
	position:relative;
	display:block;
	margin:9% 0 0;
}

.wrapper-support .gnome-hello img{
	height:400px;
	width:auto;
}

.wrapper-support .support{
	display:block;
	width:90%;
	border:0px solid #fff;
	text-align:left;
	margin:10.7% auto 0!important;
}

.wrapper-support .support h2{
	font-weight:600;
	font-size:3.9em;
	letter-spacing:1px;
	display:block;
	color:#232323;
	margin-bottom:36px;
	line-height:1;
}

.wrapper-support .support span{
	display:block;
	text-transform:uppercase;
	font-size:1em;
	font-weight:700;
	margin-bottom:21px;
}
.wrapper-support .support label{
	display:inline-block;
	text-transform:uppercase;
	font-size:.945em;
	font-weight:500;
	color:#232323;
	letter-spacing:1px;
}
.wrapper-support .support a{
	display:inline-block;
	font-size:1.32em;
	font-weight:600;
	color:#232323;
	letter-spacing:1px;
	margin-left:6px;
	text-transform:lowercase;
	
	 -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

.wrapper-support .support a:hover{
	color:#104d84;
	
	 -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}


@media only screen and (max-width:1660px){

.wrapper-support .gnome-hello img {
  height: 320px;
  width: auto;
}

.wrapper-support .support h2 {
    font-weight: 600;
    font-size: 3.1em;
}

.wrapper-support .support label {
    display: inline-block;
    text-transform: uppercase;
    font-size: .845em;
}

.wrapper-support .support a {
    font-size: 1.1em;
}

.wrapper-support .login-block{
	display:block;
	margin:13% 0 0 7%;
	width:90%;
}

.wrapper-support .login-block h3 {
    line-height: 1;
    font-weight: 700;
    font-size: 4.35em;
}

.wrapper-support .user-login-form label {
    display: block!important;
    color: #000!important;
    font-size: .85em!important;

}

.wrapper-support .user-login-form .description {
    display: block;
    color: #555;
    font-size: .8em;
    margin-bottom: 21px;
}

}

@media only screen and (max-width:1370px){

.wrapper-support .gnome-hello img {
  height:280px;
  width: auto;
}

.wrapper-support .support span {
  margin-bottom: 14px;
}

.wrapper-support .login-block h3 {
    line-height: 1;
    font-weight: 700;
    font-size: 3.75em;
}

.wrapper-support .user-login-form input {
    width: 390px;
    padding: 10px 6px;
    margin-bottom: 4px;
}

.wrapper-support .user-login-form .description {
    font-size: .75em;
    margin-bottom: 21px;
}

.wrapper-support input#edit-submit {
    padding: 9.5px 10px 10.5px!important;
    margin: 11px auto 0!important;
}
	
}

@media only screen and (max-width:1285px) and (max-height:580px){

.wrapper-support .gnome-hello{
	text-align:center;
	border:0px solid blue;
	position:relative;
	display:block;
	margin:5% 0 0;
}

.wrapper-support .gnome-hello img {
  height:250px;
  width: auto;
}

.wrapper-support .support{
	display:block;
	width:90%;
	border:0px solid #fff;
	text-align:left;
	margin:5.7% auto 0!important;
}

.wrapper-support .support h2 {
    display:none!important;
}

}

@media only screen and (max-width:1195px){
.wrapper-support .red-side-support{
		display:none;
}

.wrapper-support .white-side-support {
    display:block;
    width:97%;
    height: 100%;
    background: #fff;
    float:none;
	margin:0 auto;
    z-index: 9;
}

}