*{
			box-sizing: border-box;
			margin: 0;
			padding: 0;
			font-size: 11px;
			color: darkslategray;
			transition: 0.2s !important;
			font-family:  sans-serif;
		}
		.phone{
			margin-top: 50px;
			margin-left: 50px;
			height: 550px;
			width: 270px;
			border:5px solid white;border-radius: 10px;position: relative;
			border-radius: 30px;
			background: black;
		}
		.top{
			position: absolute;
			top:5px;
			height: 40px;
			width: 240px;
			left: 10px;
			text-align: center;
		}
		.top .mic{
			height: 5px;
			width: 60px;
			border-radius: 5px;
			border:1px solid green;
			margin-top: 10px;
			margin-bottom: 10px;

		}
		.top label{
			font-weight: bold;
		}
		.screen{
			position: absolute;
			top: 50px;
			left: 10px;
			width: 240px;
			height: 440px;
			border:0px solid green;
			background: white;
			z-index: 1;

		}
		.screen .bar{
			height: 20px;
			width: 100%;

			background: royalblue;
		}
		.screen .iconsPage,.screen .ussd{
			height: 420px;
			width: 100%;
			background: green;
			padding: 10px;
			z-index: 0;
			position: relative;

		}
		.iconsPage{
			border:none !important;
			display: block;
			background: url('../images/back.jpeg') !important;
			background-repeat: no-repeat;
			background-size: cover !important;
		}
		.screen .ussd{
			background: white !important;
			padding: 0 !important;
			display: block;
			height: 420px;
		}
		.screen .iconsPage .icons{
			height: 60px;
			width: 60px;
			border: 0px solid white;
			background: none;
			display: inline-flex;
			margin-left: 10px;
			text-align: center !important;
			padding-top: 17px;
			padding-left: 13px;
			color: #4169e1;
			font-weight: bold;
			letter-spacing: 1px;

		}
		.screen .iconsPage .icons:hover{
			cursor: pointer;
		}
		.btm{
			position: absolute;
			bottom: 5px;
			left: 10px;
			width: 240px;
			height: 50px;
			border:none;
			text-align: center;
		}
		.btm button{
			border:1px solid green;
			background: transparent;
			border-radius: 1px;
			box-sizing: content-box;
			padding: 4px 9px;
			width: 22%;
			margin-top: 15px;

			cursor: pointer;
			border:none;

		}
		.circleBtn{
			border:2.5px solid white !important;
			border-radius: 20px !important;
			color: ;
		}
		.keyboard{
			position: absolute;
			bottom: -2px;
			width: 100%;
			background: white;
			padding-top: 10px;
			border-bottom: 0px solid green;
			bottom: 0;
			-webkit-box-shadow: 1px -6px 8px 5px rgba(0,0,0,0.06);
			-moz-box-shadow: 1px -6px 8px 5px rgba(0,0,0,0.06);
			box-shadow: 1px -6px 8px 5px rgba(0,0,0,0.06);

		}
		.keyboard .row button{
			width: 30%;
			height: 27px;
			border:none;
			font-size: 24px;
			margin-bottom: 10px;
			background: none;
			cursor: pointer;
			color: darkslategray;
		}
		.keyboard .row button:hover{
			opacity: 0.7;
		}
		.send{
			font-size: 14px !important;
			border-radius: 50% !important;
			border:0px solid red !important;
			height: 50px !important;
			width: 50px !important;
			background:;
			background: url('../images/playstore-icon.png') !important;
			background-size: 100% 100% !important;
			cursor: pointer;
			color: white !important;

		}
		.input{

			border:none;
			outline: none;
			border-bottom: 1px solid lightgreen;
			padding-left: 5px;
			display: inline;
			margin-left: 5%;
            height: 70%;
            width: 80%;
            font-size: 18px;
		}
		.input:focus{
			border-bottom: 1px solid gray !important;
		}
		.delete{
			word-break: break-all;
			border:none;
			cursor: pointer;
			background-color: transparent;
			display: inline;
		}
		.result{
			min-height: 160px;
			width: 200px;
			border:0px solid lightgray;
			position: absolute;
			left: 20px;
			/*top: 10px;*/
			top: 50px;
			z-index: 100;
			background: white;
			display: none;
			-webkit-box-shadow: 3px 0px 5px 5px rgba(0,0,0,0.21);
			-moz-box-shadow: 3px 0px 5px 5px rgba(0,0,0,0.21);
			box-shadow: 3px 0px 5px 5px rgba(0,0,0,0.21);

		}
		.result .textOutput{
			position: absolute;
			top: 2.5px;
			left: 2.5px;
			height: 100px;
			width: 190px;
			border: 0px solid lightgray;
			padding: 8px;
			font-size: 13px;
			color: black !important;
		}
		.result .resultInputs{
			height: 40px;
			width: 100%;
			position: absolute;
			bottom: 0;
			padding-bottom: 5px;


		}
		.result .resultInput{
			width: 100%;
			border:none;
			border-bottom: 1px solid #4169e1;
			margin-bottom: 7px;
			width: 95%;
		}
		.result .resultInput:focus .keyboard{

			border:5px solid yellow;
		}
		.result .resultInputs button{
			border:none;
			color: #4169e1 !important;
			background: transparent;
			font-weight: bold;
			float: right;
			margin-right: 10px;
			cursor: pointer;
		}
		.loading{
			position: absolute;
			height: 40px;
			width: 160px;
			border:0px solid green;
			top: 200px;
			left: 40px;
			z-index: 9999;
			background: white;
			border-radius: 0px;
			display: none;
			-webkit-box-shadow: 3px 0px 5px 5px rgba(0,0,0,0.21);
			-moz-box-shadow: 3px 0px 5px 5px rgba(0,0,0,0.21);
			box-shadow: 3px 0px 5px 5px rgba(0,0,0,0.21);
		}
		.loader{
			height: 30px;
			width: 30px;
			background: transparent;
			display: inline-block;
			border-radius: 50%;
			margin-left: 10px;
			border:5px solid transparent;
			border-top:5px solid green;
			border-right:5px solid green;
			margin-top: 6px;
			animation-name: loader;
			animation-duration: 1s;
			animation-delay: 0s;
			animation-timing-function: linear;
			animation-iteration-count: infinite;
			animation-direction: ;

		}
		@keyframes loader{
			100%{
				transform: rotate(360deg);
			}
		}
		.textOutput{
			text-align: center !important;
		}
		.resend,.cancel{
			color: darkslategray !important;
		}
		.time{
			margin-top: 60px;
			margin-bottom: 200px;
			height: 70px;
			background-color: none ;
			border-radius: 100px;
			border:0px solid white;
			opacity: 1;
			color: black;
		}
		.time h1{
			padding-top: 30px;
			font-size: 35px;
		    line-height: 10px;
		    font-weight: 700;
		    color: white;
		    text-shadow: rgba(61, 61, 61, 0.3) 1px 1px, rgba(61, 61, 61, 0.2) 2px 2px, rgba(61, 61, 61, 0.3) 3px 3px;
		}
				pre[class*="language-"].line-numbers {
		    position: relative;
		    padding-left: 0px !important;
		    counter-reset: linenumber;
		}
		.phone{
			border: 5px solid rgba(0,0,0,0.09) !important;
		}
		.tempCont,.codes{
			position: absolute;top: 70px;left: 420px;height: 550px;width: 450px;background: white;border-radius: 20px;overflow: hidden;
			-webkit-box-shadow: 13px 21px 22px 19px rgba(0,0,0,0.04);
			-moz-box-shadow: 13px 21px 22px 19px rgba(0,0,0,0.09);
			box-shadow: 13px 21px 22px 19px rgba(0,0,0,0.09);
		}
		.codes{
			border-radius: 0 !important;
			left: 420px !important;
			right: 10px !important;
			width: 450px !important;
			padding-left: 0px !important;
			display: none;
		}
		pre{
			padding-left: -20px !important;
		}
		code{
			padding-left: -20px !important;
		}
		.tempCont{
			display: block;
		}
		.settings{
			max-height: 400px;
			width: 350px;
			margin-left: 50px;
			display: ;
			border:0px solid green;
			background-color: white;
			position: absolute;
			top: 140px;
			-webkit-box-shadow: 13px 21px 22px 19px rgba(0,0,0,0.04);
			-moz-box-shadow: 13px 21px 22px 19px rgba(0,0,0,0.04);
			box-shadow: 13px 21px 22px 19px rgba(0,0,0,0.04);
			padding: 30px;
			border-radius: 10px;
			border-top: 5px solid darkorchid;
		}
		.settings h1{
			font-size: 24px;
		}
		.form .row{
			margin-top: 20px;
		}
		.form .row input{
			width: 95%;
			margin-bottom: 10px;
			height: 25px;
			border: none;
			border-bottom-color: currentcolor;
			border-bottom-style: none;
			border-bottom-width: medium;
			outline: none;
			border-bottom: 1px solid green;
			padding-left: 0px;
			color: #4169e1;
			margin-left: 5%;
		}
		.form .row input:focus{
			border-bottom: 1px solid darkblue;
		}
		.form .row4 button{
			height: 30px;
			width: 120px;
			border:none;
			outline: none;
			background-color: transparent;
			border: 1px solid #4169e1;
			border-radius: 20px;
			cursor: pointer;
			color: #4169e1;
		}
		.alert, .alertMsg{
			height: 40px;
			border:1px solid green;
			background:green;
			text-align: left;
			margin-top: 10px;
			margin-bottom: 10px;
			display: none;

		}
		.alertMsg{
			border:1px solid red ;
			background: rgb(200,20,20,0.8);


		}
		.alertMsg p,.alert p{
			color: white !important;
		}
		.alert p,.alertMsg p{
			font-size: 16px;
			padding-top: 10px;
			padding-left: 20px;
		}
		.phone .volume{
			height: 100px;
			width: 7px;
			background: rgba(0,0,0,0.9);
			border:1px solid transparent;
			position: absolute;
			top: 100px;
			left: -7px;
			border-radius: 2px;
		}
		.phone .power{
			height: 50px;
			width: 7px;
			background: rgba(0,0,0,0.9);
			border:1px solid transparent;
			position: absolute;
			top: 120px;
			right: -7px;
			border-radius: 2px;
		}
		.endSession{
			position: absolute;
			bottom: 10px;
			right: 0;
			border:none;
			background: transparent;
			font-weight: bold;
			margin-right: 10px;
			cursor: pointer;
			color: #4169e1 !important;
		}
		.copy{
			border:none;
			background: transparent;
			font-weight: bold;
			margin-right: 10px;
			cursor: pointer;
			color: #4169e1 !important;
			margin-top: -10px;
		}
		.nav{
			height: 40px;width: 100%;position: fixed;top: 0;left: 0;background-color: white;box-shadow:-1px 6px 9px -4px rgba(0,0,0,0.06)
		}
		.nav h1{
			padding-top: 10px;padding-left: 30px;
		}
		ul{
			position: absolute;
			top: 10px;
			right: 30px;

		}
		ul li{
			display: inline;
			margin-right: 10px;
		}
		a{
			text-decoration: none;
		}
		.colorCont{
			position: absolute;top: 0;left: 0;width: 100%;height: 250px;background:  cornflowerblue
		}
		.colorCont h1{
			color: white;font-size: 20px;font-weight: 10;padding-top: 30px;padding-left: 60px;
		}
		.colorCont p{
			font-size: 16px;color: white;padding-left: 60px;margin-top: 20px;
		}
		.codes .header{
			position: absolute;top: 0px;left: 0;width: 100%;height: 10%;border-bottom: 1px solid white;background: #6495ed;
		}
		.codes .header h1{
			color: white;padding-top: 20px;padding-left: 10px;
		}
		.codes .container{
			height: 90%;position: absolute;bottom: 0;left: 0;width: 100%;overflow-y: scroll;padding-top: -5px;background-color: #272822;
		}
		.codes .header button{
			float: right;margin-left: 10px;
			color: green !important;
		}