@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap');
	html, body{
		background-color: #111418;
	}

	.main-body
	{
		width: 1140px;
		padding-top: 70px;
		padding-bottom: 80px;
		background-color: #111418;
		min-height: 650px;
		padding-left: 24px;
		padding-right: 24px;
		margin: auto;
	}


	.category-titleR
	{
		color: #FFFFFF;
		font-weight: 500;
		font-size: 2.5rem;
	}

	.category-sub
	{
		color: #bbb;
		font-weight: 400;
	}

	.par
	{
		color: #777;
		font-weight: 400;
	}

	.update-div
	{
		width: 100%;
		padding: 45px;
		background-color: #252a3099;
		border-radius: 0.8rem;
		padding-bottom: 30px;
		padding-top: 20px;
		position: relative;
		margin-top: 20px;
	}

	.sec-title
	{
		color: #eee;
		font-weight: 400;
		margin-bottom: 15px;
		border-bottom: 1px solid #ffffff11;
		padding-bottom: 15px;
	}

	.u-row
	{
		width: 100%;
		position: relative;
		height: 50px;
		margin-top: 20px;
	}

	.u-tit
	{
		width: 20%;
		height: 30px;
		line-height: 30px;
		position: absolute;
		left: 20%;
		top: 10px;
		color: #777;
		font-weight: 400;
		font-family: 'Lato', sans-serif;
		font-size: 1.2rem;
		white-space: nowrap;
	  	overflow: hidden;
	  	text-overflow: ellipsis;
	  	text-align: left;
	}

	.u-tit b
	{
		float: right;
	}

	.u-inp
	{
		width: calc(40% - 20px);
		height: 50px;
		position: absolute;
		left: calc(40% + 20px);
		top: 0px;
		outline: none;
		border: 1px solid #555;
		background-color: unset;
		border-radius: 25px;
		padding-left: 25px;
		color: #ccc;

	}

	.updt-btn
	{
		padding: 0px;
		border-radius: 0.42rem;
		color: #06b3f5;
		background-color: #06b3f533;
		border: 0px;
		transition: 0.3s;
		width: 60%;
		margin-left: 20%;
		height: 50px;
		outline: none;
	}

	.updt-btn:hover
	{
		background-color: #06b3f5cc;
		color: #333;
		font-weight: 600;
	}	

	.cancel-btn
	{
		position: absolute;
		right: 45px;
		top: 20px;
		background-color: #f64e6033;
		padding: 7px;
		padding-left: 15px;
		padding-right: 15px;
		border-radius: 0.42rem;
		cursor: pointer;
		color: #f64e60;
		transition: 0.3s;
	}

	.cancel-btn:hover
	{
		background-color: #f64e60;
		color: #111418;
	}

	.cancel-btn-h
	{
		font-size: 0.8rem;
		text-align: center;
		line-height: 100%;
		margin-bottom: 0px;
	}

	.suppor-textarea
	{
		width: 60%;
	    min-height: 200px;
	    margin-left: 20%;
	    margin-top: 20px;
	    background-color: #00000000;
	    color: #ccc;
	    padding: 25px;
	    border-radius: 25px;
	    outline: none;
	}


	@media(max-width: 1200px)
	{
		.main-body
		{
			width: 100%;
			padding-left: 24px;
			padding-right: 24px;
		}
	}


	@media(max-width: 800px)
	{
		.u-tit
		{
			width: 40%;
			left: 0%;
		}

		.u-inp
		{
			width: calc(60% - 20px);
			left: calc(40% + 20px);

		}
		.suppor-textarea
		{
			width: 100%;
		    margin-left: unset;
		}

		.updt-btn
		{
			width: 100%;
		    margin-left: unset;
		}
	}

	@media(max-width: 500px)
	{
		.update-div
		{
			padding-left: 20px;
			padding-right: 20px;
		}
		.u-row
		{
			width: 100%;
			position: relative;
			height: 90px;
			margin-top: 10px;
		}
		.u-tit
		{
			width: 100%;
			left: 0%;
		}

		.u-tit b
		{
			float: unset;
		}

		.u-inp
		{
			width: 100%;
			left: 0px;
			top: 45px;
		}

		.cancel-btn
		{
			right: 25px;
			top: 20px;
		}

		.sec-title
		{
			font-size: 1.0rem;
		}

	}