Help with making moble friendly

Help with making moble friendly
0

#1
Josh Spencer Photography
  body{
    margin: 0;
    padding: 0;
    background-color: #34495E;
  } 
   
  .border{
    border-color: silver;
    border-style: solid;
    border-width:10px;
  }
  
  #box1{
    height: 700px;
    width: 100%;
    background-image: url(https://lh3.google.com/u/0/d/1yRoSFlQREYeddd3v3Xpk_yY47ez6jBMC=w2880-h1518-iv1);
    background-size: cover;
    display: table;
    background-attachment: fixed;
  }
  .White-box{
    font-family:Lobster;
    background-color: #34495E;


    text-align: center;
    height: 100px;
    width: 100%;
    background-size: cover;
    border-color: black;
    border-width: 10px;

  }
  #box2{
    height: 700px;
    width: 100%;
    background-image: url(https://lh3.google.com/u/0/d/1D-25kT5NYJiL6H4b3mEExUZJ07WSVUm3=w2880-h1518-iv1);
    background-size: cover;
    display: table;
    background-attachment:fixed;
  }


  #box3{
    height: 700px;
    width: 100%;
    background-image: url(https://lh3.google.com/u/0/d/10EDEFgBZ1xEC7gNbMCM9Vw_k6gkDnhJA=w2880-h1518-iv1);
    background-size: cover;
    display: table;
    background-attachment: fixed;
  }
   @media only screen and (max-width: 700px){
    .box1, .box2, .box3{
      bacground-attach:scroll;
    }

}
color-text{
text-color:silver;
}
h1{

    font-family: Lobster;
    font-size: 50px;
    color:white ;
    text-shadow: 3px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000;
    margin: %;
    text-align: center;


  }
  shadow{

    font-family: Lobster;
    font-size: 20px;
    color:white ;
    text-shadow: 7px 0 0 #000, 0 -1px 0 #000, 0 1px 0 #000, -1px 0 0 #000;
    margin: %;
    text-align: center;


  }
  h2{
    background-color:#34495E;
    font-family: Lobster;
    font-size: 50px;
    color:Black;
   
    margin: 0%;
    text-align: center;
    border-color: black;
    border-width: 10px;

  }
  p{
    font-family: Monoprice;
    font-size: 20px;
    color:white;
    margin: 10px;
    text-align: center;

  }
  .text1{
    margin-top: 50%;
    margin-left:50%;
    text-align:left;
    font-family:Lobster;
    font-size 100px;
    color:black;
  }
  .text-align{
    text-align:"text-center"
  }

 
    .container {
      background-attachment:scroll;
    }
  
</style>
<link rel="stylesheet" href="style.css">
<div class="container">
  <div id="box1" >
    <img src = "https://lh3.google.com/u/0/d/1x8YeIOFNXhPy1i5ah0PeVea8qK4_DbBx=w2880-h1516-iv1" width= 20%>
     
    <h1>Josh Spencer Photography</h1>
    <div class= "shadow"><p>Wedding Photography </p></div>
   
    </div>

  <div class="White-box"><h2> Weddings</h2><p>Josh Spencer Photagraphy.</p>
  </div>
  <div id="box2">
    <h1></h1>
  </div>
  <div class="White-box">
  <h2><h2> Contact</h2><p> Email- [email protected] || Phone- (248)-842-0082 
    </p></h2></div>

  <div id="box3">
    <h1></h1>
  </div>
</div>

#2

here is a link to the website