/*
Theme : Softwarewala; 
Created By : www.desqworx.com;  
Author : Vivek Narayan;
Color Hex Palete: #e4e4e4, #333f48;
*/

 /*GLOBAL*/
html,body{background: url('../images/bg.jpg');background-repeat: no-repeat;background-size:cover;}
.clearfix{clear: both;}

.device{color:red; text-align: center;font-size: 18px; font-weight: 600;display: none;}


/*SCREEN ONE*/
#dw-app .screen-1{display: none;}
/*#dw-app .screen-1 .view{background: url('../images/bg_1.png');background-repeat: no-repeat;background-size: 100% 100%;padding: 30px;font-family: lato;height:100%; min-height:100vh;}*/


#dw-app .header{background: #00cccb;padding: 15px;}
#dw-app .header .previous{text-align: left;}
#dw-app .header .previous img{width: 45px;height: auto;}
#dw-app .header .next{text-align: right;}
#dw-app .header .next img{width: 45px;height: auto;}
#dw-app .header .date_time_section{text-align:center;}
#dw-app .header .date_time_section .time{font-weight: 600;font-size: 20px;color: #fff;}
#dw-app .header .date_time_section{color: #fff;font-size: 14px;}
#dw-app .screen-1 .logo{text-align: center;}
#dw-app .screen-1 .logo img{width: 220px;}
#dw-app .screen-1 .view{padding: 30px;font-family: lato;overflow: hidden;}
#dw-app .screen-1 .view .logo_section{margin-top: 30px;}
#dw-app .screen-1 .view .logo_section .logo_image{width: 200px;}
#dw-app .screen-1 .view #phoneWrap .welcome-quote{text-align:center;margin-top: 20px;}
#dw-app .screen-1 .view #phoneWrap .welcome{font-size: 65px;font-weight: 600;color: #fff;}
/*#dw-app .screen-1 .view #phoneWrap .welcome span{color:#00cccb;}*/
#dw-app .screen-1 .view #phoneWrap .welcome-quote .please_signin{font-weight:600;font-size: 35px;color: #fff;float: left;}
#dw-app .screen-1 .view #phoneWrap .phone{margin-top: 75px;text-align: center;}
#dw-app .screen-1 .view #phoneWrap  input[type='number']{width: 80%;height: 45px;letter-spacing: 1px;padding-left: 15px;padding-right: 10px;outline: none;border: 2px solid #00cccb;background: transparent;color: #fff;font-size: 19px;}
#dw-app .screen-1 .view #phoneWrap .next-btn{margin-right: 20%;}
#dw-app .screen-1 .view #phoneWrap .next-btn img{width: 80px;}
#dw-app .screen-1 .view #phoneWrap .Nbtn{text-align: right;margin-top: 17%;}





/*SCREEN TWO*/
#dw-app .screen-2{display: none;}
#dw-app .screen-2 .view{padding: 30px;font-family: lato;}
#dw-app .screen-2 .view .date_time_section{margin-top: 30px;float: left;}
#dw-app .screen-2 .view .date_time_section .time{font-weight: 600;font-size: 22px;color: #333f48;}
#dw-app .screen-2 .view .date_time_section{color: #333f48;font-size: 16px;}
#dw-app .screen-2 .view .logo_section{margin-top: 30px;float: right;}
#dw-app .screen-2 .view .logo_section .logo_image{width: 200px;}
#dw-app .screen-2 .view #otpWrap .welcome-quote{margin-top: 10%;}
#dw-app .screen-2 .view #otpWrap .welcome{font-size: 90px;font-weight: 600;color: #333f48;}
#dw-app .screen-2 .view #otpWrap .welcome-quote .please_signin{font-weight:400;font-size: 20px;color: #fff;}
#dw-app .screen-2 .view #otpWrap .otp{margin-top: 15px;}
#dw-app .screen-2 .view #otpWrap  input[type='number']{width: 100%;height: 45px;letter-spacing: 1px;padding-left: 15px;padding-right: 10px;outline: none;border: 2px solid #00cccb;background: transparent;color: #fff;font-size: 16px;}
#dw-app .screen-2 .view #otpWrap .next-btn{margin-right: 20%;}
#dw-app .screen-2 .view #otpWrap .next-btn img{width: 80px;}
#dw-app .screen-2 .view #otpWrap .Nbtn{text-align: right;margin-top: 17%;}

/*SCREEN THREE*/
#dw-app .screen-3{height:100%;display: none;}
.invalid{color:red;}
#dw-app .screen-3 .previous{text-align: left;}
#dw-app .screen-3 .previous img{width: 45px;height: auto;}
#dw-app .screen-3 .logo{text-align: center;}
#dw-app .screen-3 .logo img{width: 220px;}
#dw-app .screen-3 .next{text-align: right;}
#dw-app .screen-3 .next img{width: 45px;height: auto;}
#dw-app .screen-3 { }
#dw-app .screen-3 .form {margin-top: 50px;}
#dw-app .screen-3 .name{background: #f8f8f8;padding: 10px 20px;}
#dw-app .screen-3 .name label{color: #8d8f93;width: 120px;display: inline-block;}
#dw-app .screen-3 .name input{display: inline-block;font-weight: 600;color: #363a44;width: 300px;border:none;box-shadow: none;background:#f8f8f8;}
#dw-app .screen-3 .email{background: #f8f8f8;padding: 10px 20px;}
#dw-app .screen-3 .email label{color: #8d8f93;width: 120px;display: inline-block;}
#dw-app .screen-3 .email input{display: inline-block;font-weight: 600;color: #363a44;width: 300px;border:none;box-shadow: none;background:#f8f8f8;}
#dw-app .screen-3 .phone{background: #f8f8f8;padding: 10px 20px;}
#dw-app .screen-3 .phone label{color: #8d8f93;width: 120px;display: inline-block;}
#dw-app .screen-3 .phone input{display: inline-block;font-weight: 600;color: #363a44;width: 300px;border:none;box-shadow: none;background:#f8f8f8;}
#dw-app .screen-3 .company{background: #f8f8f8;padding: 10px 20px;}
#dw-app .screen-3 .company label{color: #8d8f93;width: 120px;display: inline-block;}
#dw-app .screen-3 .company input{display: inline-block;font-weight: 600;color: #363a44;width: 300px;border:none;box-shadow: none;background:#f8f8f8;}
#dw-app .screen-3 .visitor{background: #f8f8f8;padding: 10px 20px;}
#dw-app .screen-3 .visitor label{color: #8d8f93;width: 120px;display: inline-block;}
#dw-app .screen-3 .visitor button{display: inline-block;font-weight: 600;color: #8d8f93;text-align: left;width: 300px;border:none;box-shadow: none;background:#f8f8f8;}
#dw-app .screen-3 .dropdown-menu{padding: 15px 0;margin: 9px 0 0;font-size: 12px;border: 1px solid #f8f8f8;border-radius: 0px;-webkit-box-shadow: none;box-shadow:none;width: 100%;}
#dw-app .screen-3 .visitor .dropdown-menu > .active > a{background:#eeeeef;}
#dw-app .screen-3 .visitor .dropdown-menu .input-group{width:100%;}
#dw-app .screen-3 .visitor .dropdown-menu .input-group .input-group-addon{display: none;}
#dw-app .screen-3 .visitor .dropdown-menu .input-group .multiselect-search{border:none;border-bottom:1px solid #eeeeef;}
#dw-app .screen-3  .dropdown-menu > li > a{padding:0 30px;}
#dw-app .screen-3 .meet{background: #f8f8f8;padding: 10px 20px;}
#dw-app .screen-3 .meet label{color: #8d8f93;width: 120px;display: inline-block;}
#dw-app .screen-3 .meet button{display: inline-block;font-weight: 600;color: #8d8f93;text-align: left;width: 300px;border:none;box-shadow: none;background:#f8f8f8;}
#dw-app .screen-3 .meet .dropdown-menu{max-height: 300px;overflow-y: scroll;padding: 15px 0;margin: 9px 0 0;font-size: 12px;border: 1px solid #f8f8f8;border-radius: 0px;-webkit-box-shadow: none;box-shadow:none;width: 100%;}
#dw-app .screen-3 .meet .dropdown-menu > .active > a{background:#eeeeef;}
#dw-app .screen-3 .meet .dropdown-menu .input-group{width:100%;}
#dw-app .screen-3 .meet .dropdown-menu .input-group .input-group-addon{display: none;}
#dw-app .screen-3 .meet .dropdown-menu .input-group .multiselect-search{border:none;border-bottom:1px solid #eeeeef;}
#dw-app .screen-3 .meet  .dropdown-menu > li > a{padding:0 30px;}
#dw-app .screen-3 .continue{text-align: center;}
#dw-app .screen-3 .continue .continue-btn{margin-top: 30px;background: #00cccb;color: #fff;font-weight: 600;border-radius: 21px;padding: 6px 30px;display: inline-block;text-decoration: none;font-size: 16px;}


/**SCREEN FOUR*/
#dw-app .screen-4{display: none;}
#dw-app .screen-4 .previous{text-align: left;}
#dw-app .screen-4 .previous img{width: 65px;height: auto;}
#dw-app .screen-4 .logo{text-align: center;}
#dw-app .screen-4 .logo img{width: 220px;}
#dw-app .screen-4 .next{text-align: right;}
#dw-app .screen-4 .next img{width: 65px;height: auto;}
#dw-app .screen-4 {padding-top: 30px;}
#dw-app .screen-4 .form {margin-top: 50px;}
#dw-app .screen-4 .continue{text-align: center;}
#dw-app .screen-4 .continue .continue-btn{margin-top: 30px;background: #00cccb;color: #fff;font-weight: 600;border-radius: 21px;padding: 6px 30px;display: inline-block;text-decoration: none;font-size: 16px;}
#dw-app .screen-4 .welcome{text-align: center;border: 1px solid #00cccb;padding: 45px;box-shadow: 0px 0px 3px 1px #00cccb;}
#dw-app .screen-4 .welcome h3{line-height: 40px;color: #fff;}



/*RESPONSIVE DESIGN*/
@media (min-width: 220px) and (max-width: 380px){ }
@media (min-width: 380px) and (max-width: 575px){ 
	#dw-app{display: none;}
}
@media (min-width: 575px) and (max-width: 767px){ 
	#dw-app .screen-1 .view #phoneWrap .welcome{font-size: 30px;}
	#dw-app .screen-1 .view #phoneWrap .welcome-quote .please_signin{font-size: 20px;}
	#dw-app .screen-1 .view #phoneWrap .welcome-quote{margin-top: 34%;width:30%;float: left;}
	#dw-app .screen-1 .view #phoneWrap .phone{width:50%;float: left;margin-top: 37%;}
	#dw-app .screen-1 .view	#phoneWrap .Nbtn{margin-top: 36%;width:20%;float: left;}
	#dw-app .screen-1 .view #phoneWrap input[type="phone"]{width:100%;}
	#dw-app .screen-1 .view #phoneWrap .next-btn img{width:60px;}
	#dw-app .screen-2 .view #otpWrap .welcome{font-size: 30px;}
	#dw-app .screen-2 .view #otpWrap .welcome-quote .please_signin{font-size: 20px;}
	#dw-app .screen-2 .view #otpWrap .welcome-quote{margin-top: 34%;width:30%;float: left;}
	#dw-app .screen-2 .view #otpWrap .otp{width:50%;float: left;margin-top: 37%;}
	#dw-app .screen-2 .view	#otpWrap .Nbtn{margin-top: 36%;width:20%;float: left;}
	#dw-app .screen-2 .view #otpWrap input[type="text"]{width:100%;}
	#dw-app .screen-2 .view #otpWrap .next-btn img{width:60px;}
}
@media (min-width: 767px) and (max-width: 991px){ 
	#dw-app .screen-1 .view #phoneWrap .welcome{font-size: 40px;}
	#dw-app .screen-1 .view #phoneWrap .welcome-quote .please_signin{font-size: 25px;}
	#dw-app .screen-1 .view #phoneWrap .welcome-quote{margin-top: 5%;width:100%;float: left;}
	#dw-app .screen-1 .view #phoneWrap .phone{width:100%;float: left;margin-top: 10%;}
	#dw-app .screen-1 .view	#phoneWrap .Nbtn{width:20%;float: left;margin-top: 29%;}
	#dw-app .screen-1 .view #phoneWrap input[type="phone"]{width:100%;}
	#dw-app .screen-2 .view #otpWrap .welcome{font-size: 40px;}
	#dw-app .screen-2 .view #otpWrap .welcome-quote .please_signin{font-size: 25px;}
	#dw-app .screen-2 .view #otpWrap .welcome-quote{margin-top: 18%;width:50%;float: left;}
	#dw-app .screen-2 .view #otpWrap .otp{width:50%;float: left;margin-top: 20%;}
	#dw-app .screen-2 .view	#otpWrap .Nbtn{width:20%;float: left;margin-top: 29%;}
	#dw-app .screen-2 .view #otpWrap input[type="text"]{width:100%;}	
}
@media (min-width: 991px) and (max-width: 1200px){ 
	#dw-app .screen-1 .view #phoneWrap .welcome{font-size: 60px;}
	#dw-app .screen-1 .view #phoneWrap .welcome-quote .please_signin{font-size: 40px;}
	#dw-app .screen-1 .view #phoneWrap .welcome-quote, #dw-app .screen-1 .view .phone, #dw-app .screen-1 .view .Nbtn{margin-top: 21%;}
	#dw-app .screen-1 .view #phoneWrap .welcome-quote{margin-top: 15%;}
	#dw-app .screen-2 .view #otpWrap .welcome{font-size: 60px;}
	#dw-app .screen-2 .view #otpWrap .welcome-quote .please_signin{font-size: 40px;}
	#dw-app .screen-2 .view #otpWrap .welcome-quote, #dw-app .screen-1 .view .otp, #dw-app .screen-1 .view .Nbtn{margin-top: 21%;}
	#dw-app .screen-2 .view #otpWrap .welcome-quote{margin-top: 15%;}	
} 
#dw-app .active{display: block;}