@font-face {
		font-family: DB_HelvethaicaAIS_X_v3;
		src: url('../../font-awesome-4.7.0/fonts/DB_HelvethaicaAIS_X_v3.2.ttf');
	}

	body{

		font-family: DB_HelvethaicaAIS_X_v3;
		src: url('../../font-awesome-4.7.0/fonts/DB_HelvethaicaAIS_X_v3.2.ttf');
		background-image: url("../../../images/web/BG.png");
		background-color: #0086ef;
		background-repeat: no-repeat;
		background-size:     cover;
		background-position: center center;
		background-attachment: fixed;
	}


		.textleft{
			text-align: left;
		}
		.textright{
			text-align: right;
		}
		.sizelogo{
			margin-top: 12%;
			width: 80%;
		}
		.imglang
		{
			width: 25px;
		}
		.fontwhite
		{
			color: #ffffff;

		}
		.fontblack
		{
			color: #000000 !important;
		}
		.div1{
			padding-top: 2%;
			padding-right: 3%;
			padding-left: 3%;
		}
		#changelang{
			display: none;
		}
		.btnlang{
			padding: 0.5rem;
		}
		#contant{

			margin-top: 4%;
		}
		.boxfont
		{
			padding-top: 5%;
			padding-left: 0%;

		}
		.sizelogocontant
		{
			width: 45%;
		}
		#fontcontant1{
			padding-top: 15px;
			font-size: 2.2rem;
			font-weight: bold;
		}

		#fontcontant2{
			font-size: 2rem;
			font-weight: bold;
		}
		.aa{
			padding-right: 0px !important;
			padding-left:  0px !important;
		}
		.boxlogin{
			background-color: #ffffff;
			border-radius: 15px;
			height: auto;
			margin-left : 5%; 
			margin-right: 5%;
			margin-bottom: 5%;
		}
		.txtlogin{
			font-size: 2rem;
			font-weight: bold;
			padding-top: 10px;
			padding-bottom: 10px;
		}
		.form-control::placeholder
		{
			font-size: 1.4rem;
			color : #7B8996 !important;
		}
		input{

			font-size: 1.4rem !important;
			padding: 0.7rem !important;
			border-style: solid none solid solid !important;
			border-color: #7B8996 !important;
			border-radius: 10px 0px 0px 10px !important;
		}
		.input-group
		{
			padding-bottom: 15px !important;
		}
		.input-group-addon{
			background-color: transparent !important;
			border-color: #7B8996 !important;
			border-radius: 0px 10px 10px 0px !important;
		}
		.img_input{
			width: 30px;
		}
		#img_catcha{
			height: 50px; 
			width: 80%
		}
		#a_change_catcha{
			height: 40px !important;
			margin-top: 3%; 
			cursor: pointer; 
			cursor: hand;
		}
		.btn_login{
			font-size: 1.5rem;
			width: 100%;
			border-radius: 20px;
			background-color: #0086EF;
		}
		#link_forgot{
			font-size: 1.5rem;
			padding-top: 10px;
			text-decoration: underline !important;
			padding-bottom: 15px;
		}
		.catcha{
			border-style: solid !important;
			border-radius: 10px 10px 10px 10px !important;
		}
		#msg{
			font-size: 1.5rem;
			color: red;
			padding-top: 20px;
			padding-bottom: 5px;
			margin-bottom: -10px;
		}


	@media screen and (min-width: 1024px){
		.div1{
			padding : 2% 4% 0% 4%;
		}
		.sizelogo{
			margin-top: 1%;
			width: 25%;
		}
		#changelang{
			font-size: 1.6rem;
			display: inline-block;
		}
		.imglang
		{
			width: 35px;
		}
		#contant{

			margin-top: 10%;
		}
		.boxfont
		{
			padding-top: 7%;
			padding-left: 0%;

		}
		.sizelogocontant
		{
			width: 50%;
		}
		#fontcontant1{
			padding-top: 15px;
			font-size: 3.5rem;
			font-weight: bold;
		}
		#fontcontant2{
			font-size: 3.5rem;
			font-weight: bold;
			margin-top: -4%;
		}
		.aa{
			padding-right: 0px !important;
			padding-left:  0px !important;
		}
		.txtlogin{
			font-size: 2.3rem;
			font-weight: bold;
			padding-top: 10px;
			padding-bottom: 10px;
		}
		.boxlogin{
			background-color: #ffffff;
			border-radius: 15px;
			height: auto;
			margin-left : 5%; 
			margin-right: 25%;
			margin-bottom: 5%;
		}
		.form-control::placeholder
		{
			font-size: 1.6rem;
			color : #7B8996 !important;
		}
		input{

			font-size: 1.6rem !important;
			padding: 0.8rem !important;
			border-style: solid none solid solid !important;
			border-color: #7B8996 !important;
			border-radius: 10px 0px 0px 10px !important;
		}
		.input-group
		{
			padding-bottom: 15px !important;
		}
		.btn_login{
			font-size: 2rem;
			width: 100%;
			border-radius: 20px;
			background-color: #0086EF;
		}
		.catcha{
			border-style: solid !important;
			border-radius: 10px 10px 10px 10px !important;
		}
	}

	@media screen and (min-width: 1280px){

		#contant{

			margin-top: 7%;
		}

	}

	@media screen and (min-width: 1366px){
		
		.boxfont
		{
			padding-top: 6%;
			padding-left: 0%;

		}
	}

	@media screen and (min-width: 1920px){

		.aa{
			padding-right: 0px !important;
			padding-left:  5% !important;
		}
		#fontcontant1{
			padding-top: 15px;
			font-size: 4.5rem;
			font-weight: bold;
		}
		#fontcontant2{
			font-size: 4.5rem;
			font-weight: bold;
		}
		.txtlogin{
			font-size: 3rem;
			font-weight: bold;
			padding-top: 10px;
			padding-bottom: 10px;
		}
		.boxlogin{
			background-color: #ffffff;
			border-radius: 15px;
			height: auto;
			margin-left : 0%; 
			margin-right: 30%;
			margin-bottom: 5%;
		}
		.form-control::placeholder
		{
			font-size: 2rem;
			color : #7B8996 !important;
		}
		input{

			font-size: 2rem !important;
			padding: 0.8rem !important;
			border-style: solid none solid solid !important;
			border-color: #7B8996 !important;
			border-radius: 10px 0px 0px 10px !important;
		}
		.input-group
		{
			padding-bottom: 25px !important;
		}
	}