body{
	margin:0;
	font-family: 'Montserrat', sans-serif;
}
h3{
	font-size: 20px;
	border-bottom: 1px solid #FF0000;
	width: 10%;
	margin-top:0;
}
input[type="text"],
input[type="button"],
input[type="submit"],
textarea {
     -webkit-appearance: none;
}
input, textarea:focus{
    outline: none;
}
.mainSection{
	background-image:url('images/background.jpg');
	background-size: cover;
	min-height: 768px;
}
.headerMain{
	width: 100%;
	display: flex;
	align-items:center;
	justify-content:center;
	height: 70px;
	position: absolute;
	
}
.logo{
	width: 30%;
	margin-left: 20px;
	text-align: center;
}
.menuContainer{
	width: 70%;
	
	height: 47px;
	padding-right: 20px;
	padding-top:25px;
	text-align: right;
}
.menuContainer a{
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size:14px;
	color:white;
	text-decoration: none;
	margin-right: 15px;
	text-align: right;
	letter-spacing: 2px;
}
.menuContainer a:hover{
	text-decoration: underline;
}
.motto{
	position: absolute;
	bottom:100px;
	margin-left:80px;
}
.motto p{
	width: 80%;
	font-family: 'Montserrat', sans-serif;
	font-size:60px;
	color:#afafaf;
	font-style: italic;
}
.arrow{
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: 20px;
}
#subHeader{
	width: 100%;
	display: none;
	align-items:center;
	justify-content:center;
	height: 70px;
	box-shadow: 0px -5px 18px #434343;
	z-index: 99;
	background-color: white;
	position: fixed;
}
.subMenuContainer{
	width: 70%;
	height: 47px;
	padding-right: 20px;
	padding-top:25px;
	text-align: right;
}
.subMenuContainer a{
	font-family: 'Montserrat', sans-serif;
	font-weight: 300;
	font-size:14px;
	color:#434343;
	text-decoration: none;
	margin-right: 15px;
	text-align: right;
	letter-spacing: 2px;
}
.subMenuContainer a:hover{
	text-decoration: underline;
}
.contentContainer{
	width: 100%;
	padding-top:50px;
	float:left;
}
.contentHeader{
	width: 90%;
	padding-left:10%;
}
.leftContent{
	width: 40%;
	margin-left: 10%;
	text-align: left;
	float: left;
	vertical-align: top;
}
.rightContent{
	width: 40%;
	margin-right: 10%;
	text-align: right;
	float: left;
	vertical-align: top;
}
.theTeam{
	padding-top:100px;
}
.teamContainer{
	height: 60%;
	padding-top:10px;
}
.theTeamName{
	font-size: 16px;
}
.theTeamTitle{
	font-size: 14px;
}
.theTeamInfo{
	text-align: center;
	margin-right: -4%;
	padding-top:20px;
}
.teamLeft{
	width: 30%;
	padding-left:10%;
	float: left;
}
.teamImage{
	
	width: 100%;
	text-align: center;
}
.TeamLeft p{
	text-align: center;
}
.theTeam img{
	width: 60%;
}
.teamRight{
	width: 50%;
	padding-right: 10%;
	float: left;
	padding-top: 1%; 
}
.teamRight p{
	font-size: 14px;
}


/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.accordion {
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 70%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
    border-bottom:1px solid #979797;

}

.active, .accordion:hover {
    background-color: #fbf9f9;
}

.accordion:after {
    color: #777;
    font-weight: bold;
    float: right;
    margin-left: 5px;
    content: '\002B';
}

.active:after {  
	content: "\2212";

}

.panel {
    padding: 0 18px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
    width: 80%;
}
.panel p{
	font-size:15px;
	color:#434343;
	width: 70%;
}
.panel a{
	text-decoration: none;
	font-size:15px;
	color:#434343;
}
.panel a:hover{
	text-decoration: underline;
}
.formarea{
	text-align: left;
	margin-right: 0;
	margin-bottom: 70px;
}
label{
	display: inherit;
	margin-bottom: 15px;
    color: #434343;
    font-size: 16px;
}
.fieldarea input, textarea{
	width: 60%;
    height: 40px;
    font-size: 15px;
    font-style: italic;
    color: #434343;
    padding-left: 10px;
    border: 1px solid #434343;
    margin-bottom: 20px;
    background-color: white;
}
.fieldarea input[type="submit"]{
	text-transform: uppercase;
    letter-spacing: 10px;
    width: 30%;
    margin-left: 15%;
    font-style: normal;
    cursor: pointer;
}
textarea{
	height: 200px;
}
.offices{
	width: 84%;
}
.contactLeft{
	width: 50%;
}
.contact{
	padding-top:100px;
}
.services{
	padding-top:100px;
}
.team{
	padding-top:100px;
}
.footer{
	width: 100%;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #434343;
}
.footer img{
	width: 20%;
}
.menuOverlay{
  display: none;
}
.mobileMenu{
	display: none;
}
.mobileMenuContainer{
	display: none;
}

/* responsive */


@media screen and (max-width: 820px) and (min-width: 350px) {
	.mobileMenuContainer{
	display: block;
}

	.menuOverlay{
	    background-color: rgba(0, 0, 0, 0.78);
	    width: 100%;
	    height: 100%;
	    position: absolute;
	    z-index: 999;
	    padding-top:40px; 
	}
	.menuOverlay a{
	    font-family: 'Montserrat', sans-serif;
		font-weight: 300;
		font-size:14px;
		color:white;
		text-decoration: none;
	    text-align: center;
	    margin-top: 40px;
	    margin-bottom: 30px;
	    text-decoration: none;
	    font-size: 20px;
	    color: #fff;
	    display: block;
	    line-height: 25px;
	    transition: .3s;
	    -moz-transition: .3s;
	    -ms-transition: .3s;
	    -o-transition: .3s;
	    -webkit-transition: .3s;
	    text-transform: uppercase;
	}



	.mobileMenu{
		display: block;
	}
	.menuClose{
		margin-left: 10px;
		margin-top:-15px;
	}
	h3{
		width: 60%;
	}
	.leftContent{
		width: 90%;
	}
	.rightContent{
		width: 90%;
	}
	.rightContent img{
		width: 80%;
	}
	.teamLeft{
		width: 80%;
	}
	.teamRight{
		width: 80%;
		padding-left:10%;
		padding-right: 10%;
	}
	.accordion{
		width: 90%;
	}
	.servicesImage{
		margin-top:40px;
	}
	.form{
		width: 80%;
	    text-align: left;
	    margin-left: 20%;
	    margin-top: 40px;
	}
	.fieldarea input, textarea{
		width: 80%;
	}
	.fieldarea input[type="submit"]{
		width: 50%;
	}
	.footer img{
		width: 50%;
	}
	.menuContainer{
		display: none;
	}
	.logo{
		width: 70%;
		margin-right: 50px;
	}
	.subHeader{
		display: none !important;
	}
	.mainSection{
		min-height: 650px;
		width: 103%;
	}
	.motto p{
		width: 60%;
		font-size: 40px; 
	}
	.hakkimizda{
		width: 80%;
	}
	textarea,
input[type="text"],
input[type="button"],
input[type="submit"] {
    -webkit-appearance: none;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0
}
}
