body, html{
	margin: none;
	overflow: hidden;
	font-family: 'Montserrat', sans-serif;
}
a, a:active, a:visited, a:link{
	text-decoration: none;
	color: #efefef;
}
.land{
	height: 100vh;
	width: 100vw;
	overflow: hidden;
	padding-top: 30vh;
	background-image: url('assets/bg1.jpg');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	z-index: 20;
	transition: 300ms;
}
.box{
	height: 100vh;
	width: 100vw;
	position: absolute;
	background-color: #13171c;
	opacity: 0.8;
	margin-top: -30vh;
}
.logo_img{
	background-image: url('assets/logo.png');
	height: 40vh;
	width: 40vw;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;	
}
.login{
	transition: 500ms;
	position: relative;
	z-index: 1;
}
.header_l{
	font-size: 40px;
	color: #efefef;
	margin-top: -5vh;
}
.logo{
	height: 50vh;
	border-right: 3px solid #efefef;
}
.textbox{
	outline: none;
	border: none;
	background-color: transparent;
	color: #efefef;
	padding: 8px;
	width: 40vh;
	font-size: 20px;
	border-bottom: 2px solid;
	font-family: 'Montserrat', sans-serif;
}
.line{
	margin: auto;
	height: 3px;
	width: 130px;
	background-color: #efefef;
	border-radius: 5px;
}
.submit_a{
	width: 15vh;

}
.submit_b{
	font-size: 20px;
	width: 20vh;
	padding-top: 10px;
	padding-bottom: 10px;
	font-family: 'Montserrat', sans-serif;
	margin: auto;
	border-radius: 10px;
	background-color: #a263c0;
	color: #efefef;
	cursor: pointer;
}
.sign{
	color: #efefef;
	font-size: 15px;
}
.signup{
	color: #a263c0;
	cursor: pointer;
}
.login_hide{
	font-size: 0px;
	margin-top: -20vh;
	opacity: 0;
	z-index: -1;
}
.signin{
	opacity: 0;
	font-size: 0px;
	transition: 500ms;
	position: relative;
	z-index: -1; 
}
.signin_show{
	opacity: 1;
	font-size: 15px;
	z-index: 1;
	margin-top: -30vh;
}
.loginin{
	color: #a263c0;
	cursor: pointer;
}
.nav_b{
	position: fixed;
	z-index: 5;
	width: 100vw;
	height: 15vh;
	background-color: #9a41c4;
	margin-top: 85vh;
	padding-left: 21vw;
	color: #efefef;
	padding-top: 3vh;
	
}
.item{
	font-size: 40px;
	display: inline-block;
	text-align: center;
	cursor: pointer;
	margin-left: 6vw;
}
.item2{

}
.contacts{
	margin-top: 100vh;
	width: 100vw;
	padding-top: 10vh;
	height: 100vh;
	position: relative;
	z-index: 3;
}
.headings{
	font-size: 30px;
}
.c{
	position: relative;
	background-color: #dfdfdf;
	padding-top: 13px;
	padding-left: 50px;
	padding-bottom: 13px;
	width: 35vw;
	font-size: 20px;
	transition: 300ms;
	margin-top: 3vh;
	margin-left: 5vw;
}

.name{
	width: 30vw;
	margin-left: 40px;
}
.fav{
	position: absolute;
	color: grey;
	cursor: pointer;
}
.fav:hover{
	color: #9a41c4;						
}
.cross{
	float: right;
	margin-top: -35px;
	margin-right: 30px;	
	border-radius: 100%;
	width: 40px;
	height: 40px;
	text-align: center;
	padding-top: 5px;
	transform: rotate(45deg);
	color: grey;
	transition: 200ms;	
	cursor: pointer;
}
.edit{
	float: right;
	margin-top: -35px;
	margin-right: 30px;	
	border-radius: 100%;
	width: 40px;
	height: 40px;
	text-align: center;
	padding-top: 5px;
	color: grey;
	transition: 200ms;	
	cursor: pointer;	
}
.cross:hover{
	color: #9a41c4;
}
.edit:hover{
	color: #9a41c4;
}
.show{
	display: initial;
}
.del{
	display: none;
}
.addfav{
	font-size: 25px;
	color: red;
}
.fav_div{
	margin-top: 0vh;
}
.f{
	display: none;
}
.popup{
	position: absolute;
	z-index: -1;
	height: 70vh;
	width: 35vw;
	margin-left: 32vw;
	background-color: #efefef;
	transition: 300ms;
	border-radius: 10px;
	opacity: 0;
	border: 3px solid #9a41c4;
	margin-top: 110vh;
}
.popup_active{	
	z-index: 5;
	opacity: 1;
}
.khatam{
	transition: 400ms;
	opacity: 0.3;
	z-index: -1;
}
.cross--pop{
	float: right;
	transform: rotate(45deg);
	color: grey;
	transition: 200ms;	
	cursor: pointer;
	font-size: 40px;
	margin-right: 10px;
}
.cross--pop:hover{
	color: #9a41c4;
}
.profile{
	height: 100vh;
	width: 100vw;
	padding-top: 20vh;
}
.u{
	font-size: 20px;
	color: red;
}
.name_u, .user_u{
	font-size: 30px;
	color: #000;
}
.sign_u{
	color: #9a41c4;
}
.dp{
	font-size: 90px;
}
.noinput{
	display: none;
	text-align: center;
	color: #9a41c4;
	font-size: 20px;
	transition: 300ms;
}
.user{
	padding-top: 10vh;
}
.matter input{
	font-size: 20px;
	border: none;
	margin-top: 3vh;
	border-bottom: 2px solid #9a41c4;
}
.keypad{
	height: 100vh;
	width: 100vw;
	padding-top: 10vh;
}
.dialer{
	margin: auto;
	width: 50vw;
	height: 70vh;
}
.dial{
	height: 7vh;
	width: 30vw;
}
.numbertype{
	margin: auto;
	height: 10vh;
	width: 27vw;
	margin-left: 17vh;
}
.numbers{
	width: 500px;
	margin: auto; 
}
.nono{
	height: 70px;
	width: 70px;
	border-radius: 100%;
	background-color: #efefef;
	border: 2px solid #9a41c4;
	margin-left: 8vh;
	margin-top: 3vh;
	padding-top: 10px;
	font-size: 30px;
	color: #9a41c4;
	transition: 300ms;
	cursor: pointer;
}
.nono:hover{
	background-color: #9a41c4;
	color: #efefef;
	border: 2px solid #efefef;
}
.ns{
	font-size: 40px;

}
.black{
	color: #000;
}
.home{
	background-image: url('assets/bg3.jpg');
	height: 100vh;
	width: 100vw;
	padding-top: 30vh;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	z-index: 20;
	transition: 300ms;
}
.box2{
	opacity: 0.7;
}
.head1{
	font-size: 40px;
	color: #efefef;
}
.submit_s{
	height: 10vh;
	width: 10vh;
	background-color: #9a41c4;
	z-index: 100;
	position: relative;
	margin: auto;	
	color: #efefef;
	font-size: 32px;
	padding-top: 12px;
	font-family: 'Lato';
	border-radius: 10px;
	cursor: pointer;
}

.item_k{
	background-image: url('assets/key.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	z-index: 200;
	height: 50px;
	width: 50px;
	margin-top: -10px;
}
.matter_h{
	position: relative;
	z-index: 20;
}

.img_h{
	margin: auto;
	background-image: url('assets/logo.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	position: relative;
	height: 40vh;
	width: 30vw;
	margin-top: -20vh;

}

.para{
	font-size: 25px;
	color: #efefef;
}
.headings{
	font-size: 35px;
	color: #9a41c4;
}
.line{
	width: 17vw;
}
.nob{
	border: none;
}
.myd{
	margin: auto;
	height: 7vh;
	width: 17vh;
	background-color: #9a41c4;
	color: #efefef;
	font-size: 20px;
	border-radius: 15px;
	cursor: pointer;
	margin-top: 1.5vh;
	padding-top: 10px;
}
.addlol{
	height: 7vh;
	height: 7vh;
	width: 17vh;
	background-color: #9a41c4;
	color: #efefef;
	font-size: 20px;
	border-radius: 15px;
	cursor: pointer;
	margin-top: 1.5vh;
	padding-top: 10px;	
}
.new{
	border-radius: 100%;
	background-color: #9a41c4;
	color: #efefef;
	height: 60px;
	width: 60px;
	padding-top: 10px;
	font-size: 30px;
	text-align: center;
	margin: auto;
	margin-top: 5vh;
	cursor: pointer;
}
.c7, .c9{
	display: none;
	margin-left: 4vw;
}
.c8, .c10{
	display: none;
	margin-left: 2.2vw;
}

.new3, .new4{
	display: none;
}

.disabled{
	z-index: -1;
	position: relative;
}

z







.hide{
	display: none;
}

/*
.login_del{
	transform: skewY(50deg);
	margin-top: -800px;
	transition: 1s;								gold= #D4AF37
}*/


@media screen and (max-width: 500px;){
	div, section{
		overflow-y: visible; 
	}
}