/**

 * 2007-2017 Leotheme

 *

 * NOTICE OF LICENSE

 *

 * Leo Quick Login And Social Login For Prestashop 1.7 

 *

 * DISCLAIMER

 *

 *  @Module Name: Leo Quick Login

 *  @author    leotheme <leotheme@gmail.com>

 *  @copyright 2007-2017 Leotheme

 *  @license   http://leotheme.com - prestashop template provider

 */

/*******************DONGND CSS FOR QUICKLOGIN FORM BEGIN*****************************/



.leo-dropdown-wrapper

{

	display: block;

	-webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

	-ms-transition: all 0.3s ease;

	-o-transition: all 0.3s ease;

	transition: all 0.3s ease;

	padding: 20px 20px 0 20px;

	opacity: 0;

	display:none;

	visibility: hidden;

	

	width:350px;

	right: 0px;

    left: auto;

}

.dropdown .leo-dropdown-wrapper

{

	margin-top: 50px;

}



.dropup .leo-dropdown-wrapper

{

	margin-bottom: 50px;

}

.dropdown.open .leo-dropdown-wrapper, .dropup.open .leo-dropdown-wrapper

{

	display:block;

	opacity: 1;

	visibility: visible;

}



.dropdown.open .leo-dropdown-wrapper

{

	margin-top: 10px;

}



.dropup.open .leo-dropdown-wrapper

{

	margin-bottom: 10px;

}

.leo-form

{

	-webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

	-ms-transition: all 0.3s ease;

	-o-transition: all 0.3s ease;

	transition: all 0.3s ease;

	

}



.leo-quicklogin-form

{

	position: relative;

	overflow: hidden;

	-webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

	-ms-transition: all 0.3s ease;

	-o-transition: all 0.3s ease;

	transition: all 0.3s ease;

	max-width: 600px;

	

	/*

	height: 100%;

	width: 100%;

	*/

	/*

	max-width: 600px;

	max-height: 1000px;

	*/

}



.leo-quicklogin-form.html

{

	max-width: 100%;

}



.lql-form-bt

{

	width: 100%;

}



.leo-quicklogin-form.update

{

	/*

	max-width: 7000px;

	max-height: 10000px;

	*/

}

.leo-form.leo-form-inactive

{

	position: absolute;

	visibility: hidden;

	opacity: 0;

	top: 0;	

}



.leo-form.leo-form-active

{

	/*

	transform: translateX(0);

	-moz-transform: translateX(0));

	-webkit-transform: translateX(0);

	-o-transform: translateX(0);

	-ms-transform: translateX(0);

	

	visibility: visible;

	opacity: 1;

	*/

}



.leo-login-form.leo-form-inactive

{

	right: 0;

	transform: translateX(-100%);

	-moz-transform: translateX(-100%));

	-webkit-transform: translateX(-100%);

	-o-transform: translateX(-100%);

	-ms-transform: translateX(-100%);

}



.leo-register-form.leo-form-inactive

{

	left: 0;

	transform: translateX(100%);

	-moz-transform: translateX(100%));

	-webkit-transform: translateX(100%);

	-o-transform: translateX(100%);

	-ms-transform: translateX(100%);

}

.leo-form.full-width

{

	width: 100%;

}



.leo-login-form

{

	

}



.leo-resetpass-form

{

	display: none;

	

	/*

	opacity: 0;

	visibility: hidden;

	-webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

	-ms-transition: all 0.3s ease;

	-o-transition: all 0.3s ease;

	transition: all 0.3s ease;

	margin-top: -160px;

	*/

}



.leo-resetpass-form.active

{

	/*

	opacity: 1;

	visibility: visible;

	margin-top: 0px;

	*/

	/*

	margin-top: 10px;

	*/

}



.lql-callregister, .lql-calllogin

{

	display: none;

}



.leo-form.full-width .lql-callregister, .leo-form.full-width .lql-calllogin

{

	display: block;

}



.leoquicklogin-loading, .leoquicklogin-icon

{

	display: none;

}

.lql-form-bt .leoquicklogin-icon

{

	margin: 0;

	    line-height: 18px;

}

.leoquicklogin-cssload-speeding-wheel {

	

	width: 24px;

	height: 24px;

	margin: -3px auto;

	border: 2px solid #fff;

	border-radius: 50%;

	border-left-color: transparent;

	border-right-color: transparent;

	animation: cssload-spin 800ms infinite linear;

		-o-animation: cssload-spin 800ms infinite linear;

		-ms-animation: cssload-spin 800ms infinite linear;

		-webkit-animation: cssload-spin 800ms infinite linear;

		-moz-animation: cssload-spin 800ms infinite linear;

}







@keyframes cssload-spin {

	100%{ transform: rotate(360deg); transform: rotate(360deg); }

}



@-o-keyframes cssload-spin {

	100%{ -o-transform: rotate(360deg); transform: rotate(360deg); }

}



@-ms-keyframes cssload-spin {

	100%{ -ms-transform: rotate(360deg); transform: rotate(360deg); }

}



@-webkit-keyframes cssload-spin {

	100%{ -webkit-transform: rotate(360deg); transform: rotate(360deg); }

}



@-moz-keyframes cssload-spin {

	100%{ -moz-transform: rotate(360deg); transform: rotate(360deg); }

}



.lql-form-content input

{

	

	background-color:#f9f9f9;

}



.lql-form-content .leo-has-error input

{

	border-color: red;

}



.lql-form-mesg

{

	display: none;

	margin: 0;

	

	

}



.lql-form-mesg label

{

	text-align: left;

	

}

 

.full-width .leo-login-title .title-both, .leo-login-title .title-only

{

	display: none;

}



.full-width .leo-login-title .title-only, .leo-login-title .title-both

{

	display: block;

}



/*******************DONGND CSS FOR QUICKLOGIN FORM END*****************************/



/*******************DONGND CSS FOR QUICKLOGIN MODAL BEGIN*****************************/



/*******************DONGND CSS FOR QUICKLOGIN MODAL END*****************************/



/*******************DONGND CSS FOR QUICKLOGIN SLIDEBAR BEGIN*****************************/

body.leoquicklogin-active-slidebar {

	overflow: hidden;

	padding-right: 17px;

}



body.leoquicklogin-active-push

{

	

}



body main

{	

	-webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

	-ms-transition: all 0.3s ease;

	-o-transition: all 0.3s ease;

	transition: all 0.3s ease;

}



.leoquicklogin-mask {

	position: fixed;

	z-index: 100;

	top: 0;

	left: 0;

	overflow: hidden;

	width: 0;

	height: 0;

	background-color: #000;

	opacity: 0;

	transition: opacity 0.8s, width 0s 0.8s, height 0s 0.8s;

	-webkit-transition: opacity 0.8s, width 0s 0.8s, height 0s 0.8s;

	-moz-transition: opacity 0.8s, width 0s 0.8s, height 0s 0.8s;

	-ms-transition: opacity 0.8s, width 0s 0.8s, height 0s 0.8s;

	-o-transition: opacity 0.8s, width 0s 0.8s, height 0s 0.8s;

}



.leoquicklogin-mask.active {

	width: 100%;

	height: 100%;

	opacity: 0.7;

	transition: opacity 0.3s;

	-webkit-transition: opacity 0.3s;

	-moz-transition: opacity 0.3s;

	-ms-transition: opacity 0.3s;

	-o-transition: opacity 0.3s;

}

.leoquicklogin-slidebar-wrapper

{

	max-width: 600px;

	margin: 0 auto;

	

}

.leoquicklogin-slidebar

{

	/*

	width: 100%;

	height: 100%;

	*/

	z-index: 999;

	position: fixed;

	background: #fff;

	padding: 20px;

	/*

	-webkit-transition: -webkit-transform 0.3s linear;

	transition: transform 0.3s linear;

	-moz-transition: -moz-transform 0.3s linear;

	-ms-transition: -ms-transform 0.3s linear;

	-o-transition: -o-transform 0.3s linear;

	*/

	-webkit-transition: all 0.3s ease; 

	-moz-transition: all 0.3s ease;

	-ms-transition: all 0.3s ease;

	-o-transition: all 0.3s ease;

	transition: all 0.3s ease; 

	

	/*

	opacity: 0;

	*/

	visibility: hidden;

	display: none;

}



.leoquicklogin-slidebar.slidebar_left, .leoquicklogin-slidebar.push_slidebar_left

{

	display: block;

	height: 100%;

	/* opacity: 1; */

	top: 0;

	left: 0;

	transform: translateX(-100%);

	-moz-transform: translateX(-100%));

	-webkit-transform: translateX(-100%);

	-o-transform: translateX(-100%);

	-ms-transform: translateX(-100%);

}



.leoquicklogin-slidebar.slidebar_right, .leoquicklogin-slidebar.push_slidebar_right

{

	display: block;

	height: 100%;

	/* opacity: 1; */

	top: 0;

	right: 0;

	transform: translateX(100%);

	-moz-transform: translateX(100%);

	-webkit-transform: translateX(100%);

	-o-transform: translateX(100%);

	-ms-transform: translateX(100%);

}



.leoquicklogin-slidebar.slidebar_left.active, .leoquicklogin-slidebar.push_slidebar_left.active, .leoquicklogin-slidebar.slidebar_right.active, .leoquicklogin-slidebar.push_slidebar_right.active

{

	/* visibility: visibility; */

	/*

	opacity: 1;

	*/

	visibility: visible;

	transform: translateX(0);

	-moz-transform: translateX(0);

	-webkit-transform: translateX(0);

	-o-transform: translateX(0);

	-ms-transform: translateX(0);

}



.leoquicklogin-slidebar.slidebar_top, .leoquicklogin-slidebar.push_slidebar_top

{

	display: block;

	width: 100%;

	/* opacity: 1; */

	top: 0;

	left: 0;

	transform: translateY(-100%);

	-moz-transform: translateY(-100%));

	-webkit-transform: translateY(-100%);

	-o-transform: translateY(-100%);

	-ms-transform: translateY(-100%);

}



.leoquicklogin-slidebar.slidebar_bottom, .leoquicklogin-slidebar.push_slidebar_bottom

{

	display: block;

	width: 100%;

	/* opacity: 1; */

	bottom: 0;

	left: 0;

	transform: translateY(100%);

	-moz-transform: translateY(100%);

	-webkit-transform: translateY(100%);

	-o-transform: translateY(100%);

	-ms-transform: translateY(100%);

}



.leoquicklogin-slidebar.slidebar_top.active, .leoquicklogin-slidebar.push_slidebar_top.active, .leoquicklogin-slidebar.slidebar_bottom.active, .leoquicklogin-slidebar.push_slidebar_bottom.active

{

	visibility: visible;

	/*

	opacity: 1;

	*/

	transform: translateY(0);

	-moz-transform: translateY(0);

	-webkit-transform: translateY(0);

	-o-transform: translateY(0);

	-ms-transform: translateY(0);

}



.leoquicklogin-slidebar-top

{

	margin-bottom: 10px;

}



.leoquicklogin-slidebar-top, .leoquicklogin-slidebar-bottom

{

	text-align: right;

	display: none;

}



.leoquicklogin-slidebar.push_slidebar_left .leoquicklogin-slidebar-top, .leoquicklogin-slidebar.slidebar_left .leoquicklogin-slidebar-top, 

.leoquicklogin-slidebar.push_slidebar_right .leoquicklogin-slidebar-top, .leoquicklogin-slidebar.slidebar_right .leoquicklogin-slidebar-top, 

.leoquicklogin-slidebar.push_slidebar_bottom .leoquicklogin-slidebar-top, .leoquicklogin-slidebar.slidebar_bottom .leoquicklogin-slidebar-top

{

	display: block;

}



.leoquicklogin-slidebar.push_slidebar_top .leoquicklogin-slidebar-bottom, .leoquicklogin-slidebar.slidebar_top .leoquicklogin-slidebar-bottom

{

	display: block;

}

/*******************DONGND CSS FOR QUICKLOGIN SLIDEBAR END*****************************/

/*******************DONGND CSS FOR SOCIALLOGIN BEGIN *****************************/

.lql-social-login

{

	margin-bottom: 10px;

}

.lql-social-modal-mesg

{

	display: none;

	text-align: center;

}

.lql-social-modal-mesg.active

{

	display: block;

}

.lql-social-modal .modal-dialog

{

	margin: 250px auto;

}



.lql-social-modal-mesg.error-email i, .lql-social-modal-mesg.error-login i

{

	color: #f0ad4e

}

.lql-social-modal-mesg.success i

{

	color: #5cb85c

}



.lql-social-modal .modal-content

{

	border-radius: 0;

}



.lql-social-modal-mesg.active span

{

	display: block;

	border-top-color: #414141;

	border-bottom-color: #414141;

}

.social-login-bt

{

	color: #fff;

	border-color: transparent;

	margin-top: 5px;

	width:100%;

}

.facebook-login-bt, .facebook-login-bt:hover, .facebook-login-bt:active, .facebook-login-bt:focus

{

	background: #4C68A2;

}

.google-login-bt, .google-login-bt:hover, .google-login-bt:active, .google-login-bt:focus

{

	background: #4285f4;

}

.twitter-login-bt, .twitter-login-bt:hover, .twitter-login-bt:active, .twitter-login-bt:focus

{

	background: #53d1f8;

}



.show-bt-txt .social-login-bt span

{

	margin-right: 10px;

}

/*******************DONGND CSS FOR SOCIALLOGIN END *****************************/



.lql-form-content input[type="checkbox"]{  width: 13px;

     width: 13px;

    height: 13px;

    padding: 0;

    margin: 0;

    vertical-align: bottom;

    position: relative;

    top: -6px;

	    z-index: 9999;

 }

 

.lql-form-content-element > div:nth-child(1) > label > span{

	 /* display: block; */

    padding-left: 0px;

    text-indent: -15px;

}





.dropdown.open .leo-dropdown-wrapper label{

	    font-size: 11px;

}

.leo-register-title, .lql-social-login-title, .leo-login-title{text-align:center;    font-size: 20px;
   }

.leo-form-active.full-width > div > h3{text-align:center;font-size: 20px;
  }

.lql-calllogin {text-align:center; font-size: 11px;}

.lql-calllogin > div{text-align:center; font-size: 14px; margin-top:30px;}

.lql-form-content a{color:#262626 !important; font-size: 14px; text-decoration:underline;}

#topbar > div > div > div > div > div.header_user_info > ul > li:nth-child(3) > div.dropdown.open > div > div.leo-quicklogin-form.row.dropdown > div.leo-form.leo-register-form.col-sm-12.full-width.leo-form-active > form > div.form-group.lql-calllogin > a:nth-child(2){color:#0BB2E6 !important;}

.lql-form-content a:hover{color:#0BB2E6 !important;}



.lql-register-bt, .lql-login-bt, .leoquicklogin-reset-pass-bt{background-color:#3AADFF; border-color:#349DE2;}

.text-sm-right{text-align:right;}

.lql-register-bt:hover, .lql-login-bt:hover, .leoquicklogin-reset-pass-bt:hover{background:#349DE2; border-color:#349DE2;}

.leo-quicklogin-form.row.dropdown > div.leo-form.leo-login-form.col-sm-12.full-width.leo-form-active > form, .leo-resetpass-form, .leo-register-form-content, .lql-social-login{ border-bottom:1px solid #f1f1f1; padding-bottom:10px; margin-bottom:10px;}

.lql-social-login-title{margin-top:7px;}



.has-danger label{ padding-left:30px; background:url('ic_warning_black_24px.png') no-repeat center left; line-height: 20px; margin-bottom:10px; }

.has-success label{ padding-left:30px; background:url('ic_done_all_black_24px.png') no-repeat center left; line-height: 20px; margin-bottom:10px; }



.icon-us-position{

	position: absolute;

    left: 0px;

    font-size: 27px;

    bottom: 0px;

}



.pad-left-user-position{

    padding-left: 26px;	

}

#mobileuser_acc2{display:block !important;}



#mobileuser_acc{height: 40px;}

#mobileuser_acc a{

	position: relative;

    display: inline-block;

    padding-right: 5px;

    padding-left: 35px;

}

#mobileuser_acc a i{

	    position: absolute;

    left: 0px;

    font-size: 27px;

    bottom: -7px;

}



@media (max-width: 1007px){

#mobileuser_acc{display:block !important;}

.pad-left-user-position{font-size:0px; color:#cba241;}

.pad-left-user-position i{ bottom: -6px; color:#ffffff;}



.header_user_info .popup-content{display: none !important;}

.mobile-pads{padding-left:10px !important; padding-right:10px !important;}

.mobile-pads:before{display:none !important;}

#topbar > div > div > div > div > div.header_user_info.popup-over.e-scale{margin-right:0px;}

#cart{margin-left:0px;}

.lql-form-content input[type="checkbox"]{  width: 13px;

     width: 13px;

    height: 13px;

    padding: 0;

    margin: 0;

    vertical-align: bottom;

    position: relative;

    top: -8px;

 }

}



@media (max-width: 768px){

	.leo-dropdown-wrapper{

        width: 300px;

		right: -28px;

		left: auto;

	    margin-top: 17px !important;

	}

	

	#mobileuser_acc .account{

		 padding-right: 0px;

		 height: 12px;

	}

	#mobileuser_acc .account i{

		 bottom: -9px;

		 left: 4px;

	}



}