/* .circle-button{
  display: block;
  width: 150px;
  height: 150px;
  border: black 2px solid;
  background: #fffdca;
  border-radius: 75px 75px;
  float: left;
  margin-left: 50px;
  text-decoration: none;
}

.circle-button:hover{
  transform: scale(1.1);
} */

/* .circle-button a{
  text-align: center;
  padding-top: 20px;
  font-size: 25px;
  color: #CCC;
  font-family: 'SociallyFont';
} */

.buttons-div{
  display: block;
  width: 500px;
  height: 150px;
  margin-bottom: 50px;
}

#main-middle-section{
  margin-bottom: 250px;
}

#button-section{
  float: right;
  margin-right: 200px;
}

#button-section p{
  text-align: center;
  padding-top: 20px;
  font-size: 20px;
  color: black;
  font-family: 'SociallyFontTwo';

}

#video-section{
  width: 600px;
  height: 400px;
  float: left;
  margin-left: 200px;
}

#video-section video{
  width: 370px;
  height: 700px;
  margin-top: -150px;
  margin-left: 10px;
  transform: rotate(-90deg);
}

#book-section{
  font-family: 'SociallyFontThree';
  margin-top: 25px;
}

.phone-template{
  display: block;
  background-image: url("/assets/ipad-template-mockup-09d9f959.png");
  background-repeat: no-repeat;
  background-size: 100%;
  height: 600px;
  width: 600px;
  margin: 0 auto;
  transform: rotate(90deg);
  margin-left: 70px;
}

.book{
  height: 700px;
  width: 700px;
  border: #CCC 2px solid;
  margin: 0 auto;
  background-color: #fffee6;
}

.book .content{
  width: 100%;
}

#arrows{
  width: inherit;
  height: 50px;
  float: left;
  margin-top: -200px;
}

.previous-book-slide-div{
  float: left;
  height: 50px;
  width: 50px;
  margin-left: 20px;
}


.next-book-slide-div{
  float: right;
  height: 50px;
  width: 50px;
  margin-right: 20px;
}

.arrow-for-previous-page{
  width: 50px;
  height: 50px;
  filter: invert(100%);
  transform: scaleX(-1);

}

.arrow-for-next-page{
  width: 50px;
  height: 50px;
  color: black;
  filter: invert(100%);

}

.previous-book-slide-div:hover{
  cursor: pointer;
  transform: scale(1.2);
}

.next-book-slide-div:hover{
  cursor: pointer;
  transform: scale(1.2);
}

.image-on-page{
  height: 200px;
  width: 400px;
  margin: 0 auto;
  margin-top: 20px;
  /* border: 1px solid black; */
  background-image: url("/assets/about-us-image-88c121b4.png");
  background-size: 100%;
  background-repeat: no-repeat;
}


.heading-div{
  width: 500px;
  height: 50px;
  margin: 0 auto;
  text-align: center;
}

.heading-div p{
  font-size: 40px;
  font-family: 'SociallyFontTwo';
}

.text-div{
  margin: 0 auto;
  height: 200px;
  width: 400px;
  /* word-break: break-all; */
  margin-top: 5px;
}

/* .text-div p{
  text-decoration: underline;
} */

.page-number-div{
  height: 30px;
  width: 10px;
  float: right;
  margin-right: 20px;
  margin-top: 120px;
  /* margin-top: 800px; */
}


/*
.diagonal-corner-top-left{
  width: 11.43%;
  height: 2px;
  background: black;
  margin-left: -1%;
  margin-top: -614px;
  transform: rotate(-30deg);
}

.diagonal-corner-top-right{
  width: 11.43%;
  height: 2px;
  background: #CCC;
  margin-left: 99.14%;
  margin-top: -0.001%;
  transform: rotate(-30deg);
}

.diagonal-corner-bottom-right{
  width: 11.43%;
  height: 2px;
  background: black;
  margin-left: 99.14%;
  margin-top: 102.86%;
  transform: rotate(-30deg);
}



.top-line{
  width: 100%;
  height: 2px;
  background: black;
  margin-left: 9.71%;
  margin-top: -3.14%;
}

.inbetween-top-line-one{
  width: 100%;
  height: 2px;
  background: #CCC;
  margin-left: 7.86%;
  margin-top: -99.29%;
}

.inbetween-top-line-two{
  width: 100%;
  height: 2px;
  background: #CCC;
  margin-left: 6.14%;
  margin-top: 0.71%;
}

.inbetween-top-line-three{
  width: 100%;
  height: 2px;
  background: #CCC;
  margin-left: 4.57%;
  margin-top: 0.71%;
}

.inbetween-top-line-four{
  width: 100%;
  height: 2px;
  background: #CCC;
  margin-left: 2.71%;
  margin-top: 0.71%;
}

.inbetween-right-line-one{
  width: 2px;
  height: 100%;
  background: #CCC;
  margin-left: 102.57%;
}

.inbetween-right-line-two{
  width: 2px;
  height: 100%;
  background: #CCC;
  margin-left: 730px;
  margin-top: -708px;
}

.inbetween-right-line-three{
  width: 2px;
  height: 100%;
  background: #CCC;
  margin-left: 741px;
  margin-top: -707px;
}

.inbetween-right-line-four{
  width: 2px;
  height: 100%;
  background: #CCC;
  margin-left: 754px;
  margin-top: -707px;
}

.right-side-line{
  width: 2px;
  height: 100%;
  background: black;
  margin-left: 768px;
  margin-top: -721px;
} */


.app-download-icons-div{
  width: 540px;
  height: 100px;
  margin: 0 auto;
  /* border: blue 2px solid; */
}
/*
.app-download-icons-div img{
  width: 300px;
  height: 100px;

} */

.app-store-icon{
  /* margin-left: 150px;
  margin-right: 20px; */
  display: block;
  width: 250px;
  height: 80px;
  margin-right: 40px;
  float: left;
  background-image: url("/assets/app_store_icon-a1a41aec.png");
  background-repeat: no-repeat;
  background-size: 100%;
}

.google-play-icon{
  /* margin-left: 150px;
  margin-right: 20px; */
  display: block;
  width: 250px;
  height: 80px;
  float: left;
  background-image: url("/assets/google_play_icon-c4d6d457.png");
  background-repeat: no-repeat;
  background-size: 100%;
}

.read-more-link{
  text-decoration: none;
  color: black;
}

.read-more-link:hover{
  color: #CCC;
}





@media only screen and (max-width: 600px) {
  /* .all-extra-book-lines{
    display: none;
  } */

  .book{
    width: 75%;
    height: 800px;
    margin-top: -30px;
  }

  .app-download-icons-div{
    width: 250px;
    height: 230px;
    margin: 0 auto;
    margin-top: 20px;

  }

  .app-store-icon{
    margin-bottom: 30px;
  }

  .image-on-page{
    width: 57.1%;
    height: 150px;
    display: block;
  }


  .page-number-div{
    height: 100px;
    width: 50px;
    float: right;
    margin-right: -20px;
    margin-top: 450px;
    /* margin-top: 800px; */
  }

  .text-div{
    /* margin-left: 10px;
    margin-right: 10px; */
    width: 90%;
    height: 50px;
    /* border: blue 1px solid; */
  }

  .page-heading{
    width: 200px;
    height: 50px;
    margin: 0 auto;
  }

  .heading-div{
    width: 100%;
    margin-top: 10px;
  }

  #arrows{
    width: 100%;
    margin-top: -165px;
  }

  .previous-book-slide-div{
    margin-left: 5px;
  }


  .next-book-slide-div{
    margin-right: 5px;
  }
/*
  .next-book-slide-div{
    margin-right: -20px;
  } */

}