body
{
    background: url(img/bg.png), no-repeat;
}

.MainGrid
{
        display: grid;
        height: 100%;
        grid-template-columns: 1fr 3fr;
        grid-template-rows: 0.5fr 2fr 0.5fr;
}

h1{
    text-align: center;
}

span{
    color:darkred;
}

.Main > p
{
font-size: 20px;
}
.Logo
{
grid-area: 1 / 1 / 3 / 2; 
display: flex;
justify-content: center;
margin: 5px;
height: 300px;
background: url(img/logo-bg.png), no-repeat;
background-repeat: no-repeat;
background-position: center;
line-height: 300px;
text-align: center;
}

.Logo img
    {
        vertical-align: middle;
    }

.Head
{
grid-area: 1 / 2 / 2 / 3;
display: flex;
justify-content: space-around;
margin: 5px;
text-align: center;
height: 120px;
}

.Head div{
    width: 30%;
  }


.Head div p:nth-child(1){
    font-size: 12px;
    margin-top: 30px;
    margin-bottom: -15px;
     color: darkred;
   }

   .Head div p:nth-child(2){
    font-size: 20px;
     color: darkred;
   }

.Main
{
grid-area: 2 / 2 / 3 / 3;
display: flex;
flex-direction: column;
justify-content: center;
margin: 5px;
}

.title {
    text-align: center;
	overflow: hidden;
}
.title:before,
.title:after {
	content: '';
	display: inline-block;
	vertical-align: middle;
	box-sizing: border-box;
	width: 100%;
	height: 3px;
	background: gray;
}
.title:before {
	margin-left: -100%;
}
.title:after {
	margin-right: -100%;
}



.PhotoGrid
{
    display: grid;
    width: 100%;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;

}

div.PhotoGrid div
{
    margin: 7%;
    text-align: center;
}

div.PhotoGrid div img
{
   width: 100%;
   height: 100%
}

div.PhotoGrid div p
{
    color: darkred;
   margin-top: 0;
   margin-bottom: 0;
}

div.PhotoGrid p:nth-child(2)
{
font-size: 15px;
}

div.PhotoGrid p:nth-child(3)
{
font-size: 20px;
font-weight: 550;
}

.Foot
{
grid-area: 3 / 2 / 4 / 3;
display: flex;
flex-direction: column;
margin: 5px;

}

.Foot img{
    width: 100%;
    height: 25%;
}

.Foot p{
    text-align: center;
    width: 50%;
    margin-left: 25%;
}