.login-container {
    margin: 0 auto;
    display: block;
    background: 0 0;
    max-width: 480px;
    float: none;
    overflow: hidden;
    width: 100%;
}

.accountTabs {
  display: block;text-align: center;border: 2px solid #999999;border-bottom:0px;
}

.accountTabs a {
    padding: 15px;
    background: #fff;
        position: relative;
       border-bottom: 2px solid #eeeeee;
       display:block;
}
.accountTabs a.current {
    color: #000000;
    font-weight: 600;
    border-bottom: 2px solid #000000;
}

.account-tabs {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(50%) , 1fr));
    justify-content: center;
    text-align: center;border: 2px solid #999999;border-bottom:0px;
}
.account-tabs a {
    padding: 15px;
    background: #fff;
        position: relative;
       border-bottom: 2px solid #eeeeee;
       display:block;
}
.account-tabs a:first-child:after{
        content: " ";
    height: 25px;
    width: 2px;
    position: absolute;
    right: 0px;
    top: 14px;
    background: #000000;
    opacity: 0.1;
}
.account-tabs a.current {
    color: #000000;
    font-weight: 600;
    border-bottom: 2px solid #000000;
}


body{
 background-color: #fbfbfb;
 /* background-image: url(../images/backlogo.jpeg); */
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;    min-height: 800px;
}

div.wrapper{
 width: 100%;
 background-color: #FFFFFF;
 border-radius: 0px;
 box-shadow: 5px 5px 15px rgba(0,0,0,0.05);
 padding: 20px;    border: 2px solid #999;margin-top: -2px;
}

.input-text{
 width: 100%;
 height: 45px;
 border: none;
 padding: 10px;
 background-color: #eeeeee;
 color: #000000;
 outline: none;
 font-size: 15px;
 margin-bottom: 10px;
 transition: .5s;
 border-radius: 5px;
}
.input-group a{ margin-bottom: 10px;display: block;    transition: none;}
.input-group a:hover{    font-weight: 600;}
.website-logo{    margin: 20px 0;}
.website-logo img{max-width: 240px;}
.heading{
 color: #000000;
 margin-bottom: 10px;
}
.heading h2{ 
 margin:0; color: #000000;    font-size: 18px;
}
.heading p{ 
 color: #000000;
 margin:0;
}
.remembermelinks{margin-bottom:10px;}

.heading i{
 font-size: 30px;
 color: #4D61FC;
} 

label{
 color: #000000;
 font-weight: 500;
}

button{
 width: 100%;
 height: 45px;
 border: none;
 color: #FFFFFF;
 background-color: #428bca;
 border-radius: 5px;
 font-size: 17px;
 font-weight: 500;
 transition: 0.3s;
 border:none !important;
}

button:hover{
 background-color: #000000; color: #FFFFFF;
}
.sociallogin-block-title{
	margin: 20px 0 !important;
    text-align: center;
}
.sociallogin-block-title strong{
font-size:18px !important;
}
.row{
 min-width: 5px;
 min-height: 10px;
 display: flex;
 align-items: center;
 justify-content: space-between;
 margin-bottom: 10px;
 font-size: 15px;
}

.custom-checkbox{
 width: 17px;
 height: 17px;
 border-radius: 5px;
 background-color: #eeeeee;
 display: flex;
 align-items: center;
 justify-content: center; 
 font-size: 10px;
 margin-right: 5px;
}

input[type=checkbox]:checked ~ .custom-checkbox{
 background-color: #31285C;
}

input[type=checkbox]:checked ~ .custom-checkbox::before {
font-family: "Font Awesome 5 Free";
  content: "\f00c";
  display: inline-block;
  font-weight: 900;
  color: #ffffff;
}

footer{
 text-align: center;
 margin: 20px;
}
.errors{
    
}
.error-list {
            color: red;
            font-weight: bold;
            
        }
        .error-list li {
            margin-bottom: 5px;
        }

.customer-account-login .form-login .captcha button {
    width: auto;
    height: auto;
    border: none;
    color: #333;
    background-color: transparent;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 500;
    transition: 0.3s;
    border: none !important;
}



div.page.messages{
	    position: fixed;
    right: 15px;
    width: 25%;
}




.social-container{
	display: block;
    grid-template-columns: repeat(auto-fill, minmax(calc(50% - 5px) , 1fr));
    grid-gap: 5px;
}
.social{
  width: 100%;
  margin:0 0;
}
.social a.sociallogin-button{
	display: flex;
	align-items: center;
	border-radius: 5px;
	background-color: #ffffff;
	
    
    max-width: 100px;
    text-align: center;
    margin: 0 auto;
    
    gap: 10px;
    padding: 7px;
    font-size: 14px;
    font-weight: 500;
    text-transform: capitalize;
    border:1px solid;
    
}
.social a.sociallogin-button.register{
	background-color: #ffffff;
}
.social a.sociallogin-button:hover{
color:#000000;
background-color: #f7f7f7;
}

.social a.sociallogin-button img{
	max-width: 25px;
    max-height: 25px;
}
.social a.sociallogin-button span{
	font-weight: bolder;
}


.footer-links {display: flex;justify-content: center;    padding: 20px;font-size: 13px;line-height: 14px;}.footer-links a {padding: 0 5px;position: relative;font-size: 13px;}

.input-group{
width:100%;
}
.website-logo a{font-size: 30px;
    color: red;
    font-weight: 600;
    display: flex;
    gap: 2rem;text-decoration: none;}



@media only screen and (min-device-width: 480px) 
                   and (max-device-width: 896px) 
                   and (orientation: landscape) {

.social-container{display:block;}
}


@media (max-width:480px)  { 
.social-container{display:block;}
}





@media only screen and (min-device-width: 480px) 
                   and (max-device-width: 896px) 
                   and (orientation: landscape) {
div.page.messages{
	position: relative;
    right: 0;
    width: 100%;
}
.website-logo img {
		max-width: 240;
	}
	.login-container{
		padding: 10px !important;
	}
}


@media (max-width:480px)  { 
	.website-logo img {
		max-width: 160px;
	}
	.login-container{
		padding: 10px !important;
	}
	div.page.messages{
	position: relative;
    right: 0;
    width: 100%;
}
}