@font-face{
	src: url(font/GoGrunge.ttf);
	font-family: goGru;
}



body{
	
	
	
	margin: auto;
	background-color: #314e52;
	
	
}
.Box{
	width: 100%;
	height: 100%;
	background-color: blue;
	color: red;
	
	
	
	
}
.header{
	
	width: 100%;
	height: 300px;
	background-color: #314e52;
	color: red;
	
	
}

.MainBox{
	width: 100%;
	height: 1900px;
	/*background-color: #e7e6e1;*/
	color: red;
	position: absolute;
	background: rgb(231,230,225);
	background: linear-gradient(0deg, rgba(231,230,225,1) 60%, rgba(77,108,112,1) 100%);
	
	
	
}
.Centering{
	width: 100%;
	height: 1330px;
	/*zoom: 0.7;
    -moz-transform: scale(0.7);*/
	position: absolute;
	justify-content: center;
	
}
.innerBox{
	width: 1260px;
	height: 700px;
	background-color:#f7f6e7;
	margin-top:21px;
	margin-left:21px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
	margin-left: auto;
	margin-right: auto;
	
	
}

.innerBoxHeader{
	width: 1260px;
	height: 98px;
	background-color: #f2a154;
	color: purple;
	position: relative;
	
}

.headerInfoBox{
	width: 400px;
	height: 300px;
	background-color: #314e52;
	float: right;
	
	
}
.headerInfo{
	width: 392px;
	height: 42px;
	color: white;
	font-size: 30px;
	background-color:#f2a154;
	margin-top: 20px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	padding:4px;
    
	
}

.innerBoxHeaderText{
	
	color: white;
	font-size: 56px;
	font-family:goGru;
	margin-left:21px;
	margin-top: 21px;
	padding-top: 14px;
	
	
}
.ContactBox{
	width: 280px;
	height: 490px;
	background-color: #eaceb4;
	color: purple;
	position: relative;
	margin-top:21px;
	margin-left: 21px;
	float: left;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.InputBox{
	width:245px;
	height:420px;
	
	margin-top: 21px;
	margin-left:auto;
	margin-right:auto;
}
.ContactBoxTitle{
	width: 100%;
	height: 70px;
	background-color:#f0e3ca;
	color: grey;
	font-size:56px;
	text-align:center;
	font-family:goGru;
	margin-bottom:14px;
}

.MainImg{
	
	width: 630px;
	height: 490px;
	float: left;
	margin-top: 21px;
	margin-left: 21px;
	
}
.InfoBox{
	
	width: 301px;
	height: 490px;
	background-color: red;
	float: left;
	margin-top: 21px;
	margin-left: 21px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
	font-family: Arial, Helvetica, sans-serif;
	color: white;
	font-size: 28px
	
}
.InfoBoxTop{
	
	width: 273px;
	height: 266px;
	background-color: #314e52;
	font-size: 35px;
	padding:14px;
	text-align: center;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
	font-family:goGru;
}
.InfoBoxMiddle{
	width: 273px;
	height: 98px;
	background-color:#f2a154;
	text-align: center;
	padding:14px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.2);
	
	
	color: white;
	font-size: 35px;
	font-family:goGru;
}
.InfoBoxBottom{
	width: 273px;
	height: 42px;
	background-color:#f2a154;
	text-align: center;
	padding:14px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
	
	color: white;
	font-size: 35px;
	font-family:goGru;
}

.LogoImg{
	width: 300px;
	height: 300px;
	float: left;
}
.PhotoBox{
	width: 1260px;
	height: 350px;
	background-color: #f7f6e7;
	
	margin-top: 21px;
	margin-left: 21px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	margin-left: auto;
	margin-right: auto;
}
.Photo1{
	width: 588px;
	height: 322px;
	background-color: #314e52;
	float: left;
	margin-top: 14px;
	margin-left: 21px;
	box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
}
.Photo2{
	width: 588px;
	height: 322px;
	background-color: #314e52;
	float: left;
	margin-top: 14px;
	margin-left: 42px;
	box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
}
.PhotoInfoBox{
	
	width: 637px;
	height: 308px;
	background-color: #314e52;
	float: left;
	margin-top: 21px;
	margin-left: 21px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	
	
	/*/////////////////////////*/
}

.CategoryMainBox{
	width: 1260px;
	height: 700px;
	background-color: #f7f6e7;
	margin-top: 21px;
	margin-left: 21px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	margin-left: auto;
	margin-right: auto;
	
}
.CategoryBasic{
	width: 280px;
	height: 280px;
	
	float: left;
	margin-left: 21px;
	margin-top: 21px;
}
.CategoryBasic2{
	width: 280px;
	height: 280px;
	background-color: #df7861;
	float: left;
	margin-left: 21px;
	margin-top: 21px;
}
.CategoryLogoBox{
	width: 112px;
	height: 112px;
	background-color: #ffffff;
	position: absolute;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.3);
}
.CategoryInnerBox{
	width: 259px;
	height: 189px;
	background-color: #314e52;
	position: absolute;
	margin-top: 91px;
	margin-left: 21px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.3);
}
.CategoryText{
	width: 210px;
	height: 168px;
	
	
	margin-left: 21px;
	color: white;
	font-size: 21px;
	text-align: center;
	font-size: 35px;
	font-family: Arial, Helvetica, sans-serif;
	display: flex;
    justify-content: center;
    flex-direction: column;
	font-family: goGru;
	
}
.Footer{
	width: 100%;
	height: 100px;
	background-color: #314e52;
	margin-top: 21px;
	text-align: center;
	color: white;
	display: flex;
    justify-content: center;
    flex-direction: column;
	
}
.CategoryText:hover .overlay {
  opacity: 1;
}
.overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: .5s ease;
  background-color: #f2a154;
  
}
img{
	width:100%;
	height:100%;
}
#cf {
	position:relative;
	width: 595px;
	height: 490px;
	margin-top: 21px;
	margin-left: 21px;
	float: left;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

#cf img {
	position:absolute;
	left:0;
  -webkit-transition: opacity 1s ease-in-out;
  -moz-transition: opacity 1s ease-in-out;
  -o-transition: opacity s ease-in-out;
  transition: opacity 0.5s ease-in-out;
}

#cf img.top:hover {
  opacity:0;
}
input{
	background-color: #f0e3ca;
	width: 100%;
	height:32px;
	font-size: 25px;
	border: none;
	text-align: center;
	margin-top:7px;
	outline: none;
	-webkit-box-sizing: border-box;
	font-family:goGru;
    
    
	
}
textarea{
	background-color: #f0e3ca;
	width: 100%;
	height: 175px;
	font-size: 21px;
	border: none;
	text-align: center;
	resize: none;
	margin-top:7px;
	-webkit-box-sizing: border-box;
	font-family:goGru;
}
button{
	background-color: #f0e3ca;
	width: 100%;
	height: 56px;
	font-size: 50px;
	border: none;
	text-align: center;
	margin-top:14px;
	font-family:goGru;
	color: grey;
}