.header{
width: 100%;
left: 0;
top: 0;
height: 15%;  
position: relative;
float: left;
}

.content{
width:50%;
left: 15%;
top: 200px;
height: 100%;
position: relative;
float: left;
text-align: center;
}

body{
    margin: 0;
    padding: 0;
    background-color: #262626;  
  -moz-background-size: 100%;
    -webkit-background-size: 100%; 
    -o-background-size: 100%;
  background-size: 100%;
}
.MyLogo{
  position: absolute;
  top: 0;
  left: 3%;
  height: 130px;
  width: 175px;
  text-align: center;
}

h1{
  position: absolute;
  margin-left: 40%;
  font-family: 'Anton';
  color: #D3C5C4;
} 


#ph1{
  position: relative;
  top: 10%;
  left: 1%;
  width: 40%;

  float: left;


}



#ph2{
  position: absolute; 
  left: 50%;
  width: 40%;



}

#ph3{
  position: absolute;
  left: 100%;
  width: 40%;


}

#ph4{
  position: relative;
  top: 10%;
  left: 1%;
  width: 40%;

  float: left;


}



#ph5{
  position: absolute; 
  left: 50%;
  width: 40%;



}

#ph6{
  position: absolute;
  left: 100%;
  width: 40%;


}






#ph1:hover,#ph2:hover,#ph3:hover{

    opacity: 0.6;
  background: rgba(0,0,0,0);
  color: #3a7999;
  box-shadow: inset 0 0 0 3px #3a7999;



}
#ph1pht{
  width: 100%;
  float: left;
}

#ph2pht{
  width: 100%;
    float: left;

}

#ph3pht{
  width: 100%;
    float: left;

}

h2{

  font-family: 'Oswald', sans-serif;
  float: left;
  text-align: center;
  color: #E10C4D;
  background: rgba(255,255,s255,0.3);
  border-radius: 5px;
  transition: all 2s ease;
}




#silka{
  text-decoration:none;
  color:#fff;
  width:120px;
  display:inline-block;
  text-align:center;
  transition:all .33s linear;
  -webkit-transition:all .33s linear;
  top: 10%;
}


ul {
  position: absolute;
  top: 150px;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;
  padding: 0;
  display: flex;
}
ul li {
  list-style: none;
}
ul li #silka {
  position: relative;
  display: block;

  color: #aaa;
  font-size: 18px;
  text-decoration: none;
  text-transform: uppercase;
  transition: 0.5s;
  overflow: hidden;
}
ul li #silka::before {
  content: '';
  position: absolute;
  top: calc(50% - 2px);
  left: -100%;
  width: 100%;
  height: 4px;
  background: #2196f3;
  transition: 0.5s;
}
ul li #silka:hover {
  color: #fff;
}
ul li #silka:hover::before {
  animation: animate .5s linear forwards; 
}

@keyframes animate {
  0% {
    top: calc(50% - 2px);
    left: -100%;
    height: 4px;
    z-index: 1;
  }
  50% {
    top: calc(50% - 2px);
    left: 0;
    height: 4px;
    z-index: 1;
  }
  100% {
    top: 0;
    left: 0;
    height: 100%;
    z-index: -1;
  }



  h4{
 
  font-family: 'Oswald';
  color: #AAAAAA;
  background: rgba(255,255,255,0.3);
  border-radius: 5px;
}