.space{padding:0.2em 0.8em 0.2em 0.8em;}
    
    .fade-in::before {
       content: "";
   
        animation: 3s ease 0s normal none  running  fadeIn;
        background:url("media/Goliath.jpg") no-repeat center  ;
        margin: 0.4em;
        height: 40em;
        width: 98%;
        background-size: cover;
        
        display: inline-block;
   
  
      
    /*animation: fadeIn ease 10s;*/
    -webkit-animation: fadeIn ease 10s;
    -moz-animation: fadeIn ease 10s;
    -o-animation: fadeIn ease 10s;
   
    }
    @keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
    }

    @-moz-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
    }

    @-webkit-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
    }

    @-o-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:1;}
    }

    
   
  

     @media screen and (min-width: 1025px){
     .fade-in::before {
        height: 46em;
        
        width:100%;
        background:url("media/Tamar.jpg") no-repeat center center;
        background-size: 90% 100%;}
     .space{padding:0.2em 1em 0.2em 3em;}
    }
   
        
     @media screen and (min-width: 2280px){
         .fade-in::before {
              
              height: 60em;
          }
     }