@import url("https://fonts.googleapis.com/css?family=Roboto:400");

/* Set font of all elements to 'Roboto' */
* {
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
}


*:focus {
	outline: 0;
}

body {
	background: #FFFFFF;  
}

h3 {
	text-align: center;
}

a:link {
  color: red;
  text-decoration: none;
}

a:visited {
  color: red;
  text-decoration: none;
}

a:hover {
  color: red;
  text-decoration: none;
  font-weight: bold;
}

a:active {
  color: red;
  text-decoration: none;
}

.mainDIV{
    position:relative;
	margin: 10px auto 0 auto;
    width:70%;
    min-width:750px;
	text-align: center;
	display:flex;
    flex-wrap:wrap;
}

.main2{
    position:relative;
	margin: 10px auto 0 auto;
    width:70%;
    min-width:750px;
	text-align: center;
	display:flex;
    flex-wrap:wrap;
}



.div-1{
    position:relative;
	width:22%;
    height:200px;
	min-width:150px;
	background: #f4f4f4;
	border-radius: 40px;
	border: 1px dotted red;
	background-image: url("left.jpg");
	margin: auto;
}

.div-2{
	position:relative;
	width:22%;
    height:200px;
	min-width:150px;
	background: #f4f4f4;
	border-radius: 40px;
	border: 1px dotted red;
	background-image: url("middle.jpg");
    margin: auto;

	
	
}

.div-3{
    position:relative;
    width:22%;
    height:200px;
	min-width:150px;
	background: #f4f4f4;
	border-radius: 40px;
	border: 1px dotted red;
	background-image: url("right.jpg");
	margin: auto;
	
}

.div-4{
    position:relative;
    width:22%;
    height:200px;
	min-width:150px;
	background: #f4f4f4;
	border-radius: 40px;
	border: 1px dotted red;
	background-image: url("right-right.jpg");
	margin: auto;
	
}









.div-s1{

    margin: auto;
    height:50px;
    width:22%;
	color: red;
}


.div-s2{
	
    height:50px;
    width:22%;
    margin:auto;
	color: red;
}



.div-s3{

    height:50px;
    width:22%;
	color: red;
	margin:auto;
	background: white;
}

.div-s4{
    height:50px;
    width:22%;
	color: red;
	margin:auto;
}

.logo {
	margin: -15px auto 0px auto;
	width: 75%;
	max-width: 875px;
}

.intro {
	padding: 12px 12px 12px 12px;
	margin: 0px auto 40px auto;
	background: #f4f4f4;
	width: 75%;
	max-width: 725px;
	text-align: justify;
	text-justify: inter-word;
	border-radius: 10px;
	border: 2px solid #e1e1e1;
}

.contact_details {
	padding: 0;
	margin: 0px auto 18px auto;
	width: 60%;
	max-width: 550px;
	text-align: right;
	font-weight: bold;
}


.form_div {
	padding: 10px 24px 24px 24px;
	margin: 18px auto 22px auto;
	background: #CFCFCF;
	border-radius: 40px;
	border: 3px solid #989898;
	width: 60%;
	max-width: 550px;
}

label {
	font-size: 0.75em;
	margin-left: 12px;
	font-weight: bold;
}


input[type=text],input[type=email], textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    margin-top: 6px;
    margin-bottom: 16px;
    resize: vertical;
}

input[type=text]:focus,input[type=email]:focus, textarea:focus {
	border: 2px solid red;
}

input[type=submit] {
	background: #989898;
	margin: 0 auto;
	outline: 0;
	color: black;
	border: 0;
	padding: 12px 24px;
	border-radius: 4px;
	transition: all ease-in-out 0.1s;
	position: relative;
	display: inline-block;
	text-align: center;
	font-weight: bold;
}

input[type=submit]:focus {
	background: #606060;
	color: whitesmoke;
}

input[type=submit]:hover {
	background: #606060;
	font-weight: bold;
	color: white;
}

.center {
	text-align: center;
}