@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');



* {

	padding: 0;

	margin: 0;

	box-sizing: border-box;

}



body {

	height: 100vh;

	

	align-items: center;

	font-family: 'Poppins', sans-serif;

}



.contact-wrap {

	width: 100%;

	height: auto;

	margin: auto;

	display: flex;

	flex-wrap: wrap;

}



.contact-in {

	padding: 40px 30px;

}



label {

        font-size: 14px;

        color: #000;

}



.contact-in:nth-child(1) {

	flex: 100%; 

	padding: 0px 0px;

}



.img-responsive {

	width: 100%;

	position: relative;

}



.contact-in:nth-child(2) {

	flex: 45%;

	background: #f1f1f1;

}



.contact-in:nth-child(3) {

	background-color:#d9d5d4;

	flex: 25%;

}



.contact-in h1 {

	font-size: 24px;

	color: #000;

	text-transform: uppercase;

	font-weight: 500;

	margin-bottom: 20px;

	text-align: center;

}



.contact-in h2 {

	font-size: 20px;

	font-weight: 400;

	margin-bottom: 15px;

	color:#000;

}



.contact-in h2 i {

	font-size: 16px;

	width: 40px;

	height: 40px;

	margin-right: 10px;

	background: #db2c16;

	color: #fff;

	border-radius: 50px;

	line-height: 40px;

	text-align: center;

}



.contact-in p {

	font-size: 13.5px;

	font-weight: 500;

	margin-bottom: 20px;

	color:#282727;

}



.contact-in-wh {

	font-size: 14px;

	font-weight: 300;

	color:#FFFFFF;

	/* line-height: 3.8; */

}





.contact-in ul {

	padding: 0;

	margin: 0;

}



.contact-in ul li {

	list-style: none;

	display: inline-block;

	margin-right: 5px;

	margin-top: 5px;

}



.contact-in ul li a {

	display: block;

	width: 30px;

	height: 30px;

	text-align: center;

	background: #fff;

	border-radius: 50px;

}



.contact-in ul li a i {

	font-size: 14px;

	line-height: 30px;

	color: #000;

}



.contact-in form {

	width: 100%;

	height: auto;

}



.contact-in-input {

	width: 100%;

	height: 40px;

	margin-bottom: 20px;

	border: 1px solid #fff;

	border-radius: 6px;

	outline: none;

	padding-left: 5px;

	background:#FFFFFF;

	color: #000;

	font-size: 12px;

	/* font-weight: 300; */

	font-family: 'Poppins', sans-serif;

}



/* Create three unequal columns that floats next to each other */

.column {

  float: left;

  padding: 2px;

}



/* Left and right column */

.column.full {

  width: 100%;

}



/* Left and right column */

.column.side {

  width: 20%;

}



/* Middle column */

.column.middle {

  width: 80%;

}



/* Left and right column */

.column.equal {

  width: 50%;

}



/* Left and right column */

.column.three {

  width: 33.333%;

}



.contact-in-input-menu {

	width: 30%;

	height: 40px;

	margin-bottom: 20px;

	border: 1px solid #fff;

	outline: none;

	padding-left: 5px;

	background:#FFFFFF;

	color: #000;

	font-size: 12px;

	/* font-weight: 300; */

	font-family: 'Poppins', sans-serif;

	

	display: block;

	border-radius: 6px;



	

}



.contact-in-input::placeholder {

	color: #000000;

	font-weight: bold;

}



.contact-in-textarea {

	width: 100%;

	height: 140px;

	margin-bottom: 20px;

	border: 1px solid #fff;

	outline: none;

	padding-top: 5px;

	padding-left: 5px;

	background: transparent;

	color: #fff;

	font-size: 12px;

	font-weight: 300;

	font-family: 'Poppins', sans-serif;

}



.contact-in-textarea::placeholder {

	color: #fff;

}



.contact-in-btn {

	width: 150px;

	height: 40px;

	

	display: block;

	margin-left: auto;

	margin-right: auto;

  

	border: 0px solid #fff;

	outline: none;

	background: #1c8908;

	color: #fff;

	font-size: 12px;

	font-weight: 300;

	font-family: 'Poppins', sans-serif;

	cursor: pointer;

	border-radius: 6px;

}



.contact-in-btn:hover

{

  background-color:#db2c16;

  color: #fff;

  font-weight: 600;

}



.contact-in-btn:focus{

  background-color:#000;

}



.contact-in iframe {

	width: 100%;

	height: 100%;

}



.button {

	background-color: #db2c16;

	color: white;

	padding: 15px 32px;

	text-align: center;

	text-decoration: none;

	text-shadow: 0 0.04em 0.04em rgba(0,0,0,0.35);

	display: inline-block; 

	font-size: 16px;

	margin: 4px 2px;

	cursor: pointer;

	border-radius: 8px;

	border: 1px solid #d20804;

}



.buttonA {

	background-color: #282727;

	color: #fff;

	padding: 15px 32px;

	text-align: center;

	text-decoration: none;

	text-shadow: 0 0.04em 0.04em rgba(0,0,0,0.35);

	display: inline-block; 

	font-size: 16px;

	margin: 4px 2px;

	cursor: pointer;

	border-radius: 8px;

	border: 1px solid #ff5c00;

}



.myDiv {

	margin-top:50px;

  	text-align: center;

	color: #000 !important;

}



@media only screen and (max-width:1000px){

	.button{

	    display:block;

	    padding: 10px;

	    font-size:15px;

	}

	  .column.side, .column.middle, .column.equal,.column.three {

    width: 100%;

  }



}



@media only screen and (max-width:480px) {

.contact-in h1 {

	font-size: 14px;

	color: #000;

	text-transform: uppercase;

	font-weight: 500;

	margin-bottom: 20px;

	text-align:center;

}

label {

        font-size: 12px;

        color: #000;

}

.contact-in {

	padding: 20px 30px;

}





	.contact-in:nth-child(1) {

	}

	

	.img-responsive {

		width: 100%;

		position: relative;

	}

	

	.contact-in:nth-child(2) {

		flex: 50%;

	}



	.contact-in:nth-child(3) {

		flex: 100%;

	}



      .column.side, .column.middle, .column.equal,.column.three {

    width: 100%;

  }



}



@media only screen and (max-width:360px) {

.contact-in h1 {

	font-size: 14px;

	color: #000;

	text-transform: uppercase;

	font-weight: 500;

	margin-bottom: 20px;

	text-align:center;

}

label {

        font-size: 12px;

        color: #000;

}

.contact-in {

	padding: 20px 30px;

}



	.contact-wrap {

		height: auto;

		margin: auto;

		display: inline;

		flex-wrap: wrap;

	}



	.contact-in:nth-child(1) {

		flex: 50%;

	}



	.contact-in:nth-child(2) {

		flex: 50%;

	}



	.contact-in:nth-child(3) {

		flex: 100%;

	}

      .column.side, .column.middle, .column.equal, .column.three {

    width: 100%;

  }



}

