body {
  margin: 0px;
  padding: 0px;
}

.mrg58 {
  margin-top: 58px;
}

.pdl57 {
  padding-left: 57px;
}

.pdl10 {
  padding-left: 10px;
}
.pdl15 {
  padding-left: 15px;
}
.pdt24 {
  padding-top: 24px;
}

.pdl77 {
  padding-left: 77px;
}

.fs26 {
  font-family: 'Mali';
  font-size: 26px;
  font-weight:500;
}
.fs20 {
  font-family: 'Staatliches';
  font-size: 22px;
  font-weight: 500;
  color: #363842;
}

.fs110 {
  font-family: 'Staatliches';
  font-size: 110px;
  font-weight: normal;
  color: #363842;
  margin: 0px;
}

.fs-30 {
  font-family: 'Staatliches';
  font-size: 30px;
  font-weight: normal;
  color: #363842;
  margin:15px 0px 0px 0px;
}

.fs70 {
  font-family: 'Staatliches';
  font-size: 70px;
  font-weight: normal;
  color: #363842;
  margin: 0px;
}
a.fs20, a.fs20:visited, a.fs20:hover {
  font-family: 'Staatliches';
  font-weight: 100;
  text-decoration: none ;
  text-transform: uppercase;
  display: block;
  padding-bottom: 22px;
}

.fs17 {
  font-family: 'Mali';
  font-size: 17px;
  font-weight:bold;
  color: #363842;
}
.fs22 {
  font-family: 'Mali';
  font-size: 22px;
  font-weight:bold;
  color: #363842;
}

.fs-22-regular {
  font-family: 'Mali';
  font-size: 22px;
  font-weight:normal;
  color: #363842;
}

.fs30 {
  font-family: 'Mali';
  font-size: 30px;
  font-weight:bold;
  color: #363842;
}


.fs40 {
  font-family: 'Staatliches';
  font-size: 40px;
  font-weight:500;
}
.fs43 {
  font-family: 'Staatliches';
  font-size: 43px;
  font-weight:500;
  text-align: center;
  padding: 25px 0px 25px 0px;
}

.header {
  background-image: url("./images/header_background.png");
  left: 0px;
  top: 0px;
  width: 100%;
  height: 270px;
  z-index: 1;
}

.logo {
  width: 430px;
  height: 170px;
  margin: auto;
  padding-top: 30px;
}
.intro {
  position: relative;
  background-color: #f1829b;
  width: 100%;
  height: 728px;
  padding-bottom: 22px;
  z-index: -1;
}

.about-us-body {
  background-color: #fbf1d6;
}
.about-us-section {
  position: relative;
  background-color: #fbf1d6;
  width: 100%;
  height: 100%;
  padding-bottom: 22px;
  z-index: -1;
}
.qa-section {
  position: relative;
  background-color: #fbf1d6;
  width: 100%;
  height: 100%;
  padding-bottom: 22px;
}
.create-book-section {
  background-color: #f1829b;
  padding-bottom: 20px;
}

.preview-book-section {
  background:url(./images/preview_book_background.webp);
  height: 1178px;
}

.testemonial-section {
  background-color: #ffffff;
  height: 950px;
}
.magic-gift-section {
  background:url(./images/magic_gift_background.webp);
  height: 640px;
}

.circle {
  word-wrap: normal;
  width: 360px;
  height: 360px;
  border-radius: 50%;
  display: flex; /* or inline-flex */
  align-items: center; 
  justify-content: space-around; 
  float: left;
  margin: 28px;
}
.testemonial-1 {
  background: url(./images/testemonial_1.webp) no-repeat;
} 
.testemonial-1 p, .testemonial-3 p,  .testemonial-5 p {
  color: #363842;
  padding: 70px;
  text-align: center;
} 
.testemonial-4 p,  .testemonial-6 p  {
  color: #ffffff;
  padding: 70px;
  text-align: center;
} 
.testemonial-2 {
  background: url(./images/testemonial_2.webp) no-repeat;
} 
.testemonial-3 {
  background: url(./images/testemonial_3.webp) no-repeat;
} 
.testemonial-4 {
  background: url(./images/testemonial_4.webp) no-repeat;
} 
.testemonial-5 {
  background: url(./images/testemonial_5.webp) no-repeat;
} 
.testemonial-6 {
  background: url(./images/testemonial_6.webp) no-repeat;
} 

.intro-image {
  text-align: center;
  margin: auto;
  margin-top: -68px;
 
}
.intro-image img {
  width: 100%;
}
.about-image {
  width: 1248px;
  text-align: center;
  margin: auto;
  margin-top: -68px;
 
}
.qa {
  width: 1248px;
  text-align: center;
  margin: auto;
 
}
.about-image-text {
  padding: 20px 100px 20px;

}
.create-book, .testemonial {
  margin: auto;
  width: 1248px;
  height: 240px;
  background-color: white;
  display: block;
}

.preview-book {
  margin: auto;
  width: 1248px;
  height: 1178px;
}

.testemonial {
  height: 950px;
}

::placeholder {
  color: white;
  text-align: center;
}
input:focus::-webkit-input-placeholder 
{
  color: transparent;
}
/* input, CreateBookForm */
.name {
  margin-top: -2px;
  background-color: #606b8b;
  color: white;
  height: 55px;
  width: 319px;
  border: none;
  border-radius: 6px;
  box-sizing: border-box;
  display: inline-block;
  text-align: center;
}

/* input, SendMailForm */
.send-form-input {
  font-family: "Mali";
  background-color:transparent;
  color: #6c6c6c;
  height: 55px;
  width: 400px;
  border: 1px solid #6c6c6c;
  border-radius: 10px;
  box-sizing: border-box;
  display: inline-block;
  text-align: left;
  font-size: 26px;
  padding-left: 12px;
}
.send-form-input::placeholder {
  color: #7a7979;
  font-size: 26px;
  text-align: left;
}
.send-form-input:focus {
  background-color: #ffffff;
}

.send-form-textarea {
  padding-left: 12px;
  font-family: "Mali";
  margin-top: 20px;
  background: transparent;
  border: 1px solid #6c6c6c;
  border-radius: 10px;
  height: 300px;
  resize: none;
  outline: none;
  font-size: 26px;
  width: 790px;
  color: #6c6c6c;
  text-align: left;
}
.send-form-textarea::placeholder {
  background: transparent;
  color: #7a7979;
  text-align: left;

}

.send-form-textarea:focus {
  background-color: #ffffff;
}
.send-form-textarea:focus::placeholder {
  color: transparent;
}

.view-book-button:focus {
  outline: none;
}
.name:focus {
  outline: none;
  text-align: center;
}
.view-book-button {
  font-family: 'Mali';
  font-size: 26px;
  font-weight: 500;
  color: white;
  background-color: #606b8b;
  height: 55px;
  width: 319px;
  border: none;
  border-radius: 6px;
  box-sizing: border-box;
  display: inline-block;
  padding-bottom: 7px;
  margin-bottom: 5px;
}

.create-book-form {
  display: flex;
  align-items: flex-end;
  flex-direction: row;
  text-align: center;
  padding-top: 20px;
}



.create-book-form-height {
  display: flex;
  align-items: center;
  flex-direction: row;
  height: 133px;
}

.create-book-form-height p {
  margin: 0px;
  padding: 0px;
}
.boy, .girl {
  display: none;
}

.boy-test:hover .boy{
  display:block;
  position: absolute;
  z-index: 1;
  margin-top: -181px;
}
.girl-test:hover .girl {
  display:block;
  position: absolute;
  z-index: 1;
  margin-top: -181px;
}
@media (max-width: 800px) {
  .create-book-form {
    flex-direction: column;
    align-items: revert;
  }

  .create-book, .testemonial-section, .testemonial, .intro {
      width: 100%;
      height: 100%;
  }
}

.footer-menu {
  display: flex;
  width: 1280px;
  margin: auto;
  margin-top: 10px;
  margin-bottom: 15px;
}
.footer-menu-lr {
  width: 450px;
  height: 290px;
  display: flex;
  flex-direction: column;
}
.footer-menu-middle {
    width: 100%;
    text-align: center;
    margin: auto;
}
.copy {
  margin: auto;
  width: 1290px;
  height: 55px;
  background-color: #363842;
  border-radius: 10px;
}
.copy-copy {
  color: #ffffff;
  font-family: "Mali";
  font-size: 17px;
  font-weight: normal;
  float: left;
  padding: 15px 0px 15px 13px;
}
.copy-privacy-policy {
  color: #ffffff;
  font-family: "Staatliches";
  font-size: 24px;
  font-weight: normal;
  float: right;
  padding: 13px;
}
.copy-privacy-policy a {
  text-decoration: none;
  color: #ffffff;
}
.slider {
  margin: auto;
  width: 610px;
}

textarea.dedication
{
  width: 85%;
  padding-left: 15%;
  background: transparent;
  line-height: 4ch;
  background-image: linear-gradient(transparent, transparent calc(4ch - 1px), #2c0d21 0px);
  background-size: 100% 4ch;
  height: 138px;
  resize: none;
  border: none;
  outline: none;
  font-size: 14px;
}
.dedication-illustration {
  position: relative;
  width: 265px;
  height: 236px;
  background: url(./images/dedication_illustration.webp) no-repeat;
  top: -605px;
  left: -135px;
}
.dedication-note {
  font-size: 17px;
  color: #363842;
  text-align: center;
}
.order-book {
  width: 100%;
  text-align: center;
  margin-top: 50px;
}
.order-book img {
  width: 239px;
  height: 239px;

}
.magic-gift {
  margin:auto;
  width: 1248px;
}
.magic-gift img {
  text-align: center;
}

.privacy-policy-text {
  position: relative;
  top: -900px;
  background-color: #ffffff;
  width: 720px;
  margin: auto;
  font-family: "Mali";
  font-size: 22px;
  text-align: center;
  padding: 20px;
}
.privacy-policy-close {
  display: block;
  width: 15px;
  height: 15px;
  float: right;
  font-size: 40px;
  font-weight: bolder;
  margin-right: 30px;
}
.privacy-policy-close a {
  text-decoration: none;
  color: #2c0d21;
}


.rotate {

  transform: rotate(-3deg);


  /* Legacy vendor prefixes that you probably don't need... */

  /* Safari */
  -webkit-transform: rotate(-3deg);

  /* Firefox */
  -moz-transform: rotate(-3deg);

  /* IE */
  -ms-transform: rotate(-3deg);

  /* Opera */
  -o-transform: rotate(-3deg);

  /* Internet Explorer */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

}