* {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
body {
  background:
linear-gradient(135deg, #708090 22px, #d9ecff 22px, #d9ecff 24px, transparent 24px, transparent 67px, #d9ecff 67px, #d9ecff 69px, transparent 69px),
linear-gradient(225deg, #708090 22px, #d9ecff 22px, #d9ecff 24px, transparent 24px, transparent 67px, #d9ecff 67px, #d9ecff 69px, transparent 69px)0 64px;
background-color:#708090;
background-size: 64px 128px;
  padding: 25px;
}
#card-front,#card-inside .wrap,#card-inside{
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}
#card-front {
  color: #FFDFDF;
  text-align: center;
  
}
#card-front p{
  font-family: 'Raleway', sans-serif;
  font-size: 28px
}
#card-front .link{
	background-color: #E91E63;
	font-family: 'Pacifico', cursive;
	border-radius: 10px;
	padding: 15px;
	font-size: 20px;
	
	transition:         all 0.2 linear;
    -moz-transition:    all 0.2s linear;
    -webkit-transition: all 0.2s linear;
}
#card-front .link:hover{
	cursor:pointer;
	background-color: #EC407A;
}

.wrap {
    padding: 2em 3em;  
    height: 500px;
}
.hez {
  border-left-width:30px;
}
.hey{
  height:30px;
  width:30px;
}
.leftpage {
  width:30;
}
.maintext {
  margin-top: 2rem;
}
#card-front, #card-inside {
  width: 50%;
  -webkit-box-shadow: 2px 2px 30px rgba(0, 0, 0, .25), 0 0 1px rgba(0, 0, 0, .5);
  -moz-box-shadow: 2px 2px 30px rgba(0, 0, 0, .25), 0 0 1px rgba(0, 0, 0, .5);
  box-shadow: 2px 2px 30px rgba(0, 0, 0, .25), 0 0 1px rgba(0, 0, 0, .5);
  position: absolute;
  left: 40%;
}

 #card-inside-left {
  width: 50%;
  background-color:#FFEFEF;
  -webkit-box-shadow: 2px 2px 30px rgba(0, 0, 0, .25), 0 0 1px rgba(0, 0, 0, .5);
  -moz-box-shadow: 2px 2px 30px rgba(0, 0, 0, .25), 0 0 1px rgba(0, 0, 0, .5);
  box-shadow: 2px 2px 30px rgba(0, 0, 0, .25), 0 0 1px rgba(0, 0, 0, .5);
  position: absolute;
  left: 40%;
}


#card-inside .wrap {
    background: #FFEFEF;
    -webkit-box-shadow: inset 2px 0 1px rgba(0, 0, 0, .05);
    -moz-box-shadow: inset 2px 0 1px rgba(0, 0, 0, .05);
    box-shadow: inset 2px 0 1px rgba(0, 0, 0, .05);
}
#card {
    max-width: 70vw;
    margin: 0 auto;
    transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    perspective: 5000px;
    -moz-perspective: 5000px;
    -webkit-perspective: 5000px;
    position: relative;
}

#card h1 {
    font-family: 'Pacifico', cursive;
    font-size: 48px;
    color: white;
}
#card-inside {
    font-size: 1.1em;
    line-height: 1.4;
    font-family: 'Raleway', sans-serif;
    color: #331717;
    font-style: italic;
}

p {
    margin-top: 1em;
}

p:first-child {
    margin-top: 0;
}

p.signed {
    margin-top: 1.5em;
    text-align: right;
    font-family: 'Pacifico', cursive;
    font-size: 1.5em;
}
 #card-front img{
	opacity:1;
	transition:         all 0.5 linear;
       -moz-transition:    all 0.5s linear;
    -webkit-transition: all 0.5s linear;
}
#card.open-fully #card-front img{
  opacity:0;
  background-image: url(data:image/jpeg;base64,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);
}
#card-front {
background: 
radial-gradient(circle closest-side at 60% 43%, #b03 26%, rgba(187,0,51,0) 27%),
radial-gradient(circle closest-side at 40% 43%, #b03 26%, rgba(187,0,51,0) 27%),
radial-gradient(circle closest-side at 40% 22%, #d35 45%, rgba(221,51,85,0) 46%),
radial-gradient(circle closest-side at 60% 22%, #d35 45%, rgba(221,51,85,0) 46%),
radial-gradient(circle closest-side at 50% 35%, #d35 30%, rgba(221,51,85,0) 31%),

radial-gradient(circle closest-side at 60% 43%, #b03 26%, rgba(187,0,51,0) 27%) 50px 50px,
radial-gradient(circle closest-side at 40% 43%, #b03 26%, rgba(187,0,51,0) 27%) 50px 50px,
radial-gradient(circle closest-side at 40% 22%, #d35 45%, rgba(221,51,85,0) 46%) 50px 50px,
radial-gradient(circle closest-side at 60% 22%, #d35 45%, rgba(221,51,85,0) 46%) 50px 50px,
radial-gradient(circle closest-side at 50% 35%, #d35 30%, rgba(221,51,85,0) 31%) 50px 50px;
background-color:#b03;
background-size:100px 100px;
            transform-origin: left;
       -moz-transform-origin: left;
    -webkit-transform-origin: left;
            transition:         transform 1s linear;
       -moz-transition:    -moz-transform 1s linear;
    -webkit-transition: -webkit-transform 1s linear;
    position: relative;
}

#card-front .wrap {
            transition: background 1s linear;
       -moz-transition: background 1s linear;
    -webkit-transition: background 1s linear;
}

#card-front button {
  position: absolute;
  bottom: 1em;
  right: -1.25em;
  
  height:2.5em;
  width:2.5em;
  
  background: #F44;
  color: #FFF;
  
  
  font-style: italic;
  font-weight: bold;
  font-size: 1em;
  
  padding: 0.5em;
  border-radius: 50%;
  border: none;
  cursor: pointer;
}

#card-front button:hover,
#card-front button:focus {
  background: #F22;
}

#close {
  display: none;
}

#card.open-fully #close,
#card-open-half #close {
  display: inline;
}

#card.open-fully #open {
  display: none;
}


#card.open-half #card-front,
#card.close-half #card-front {
            transform: rotateY(-90deg);
       -moz-transform: rotateY(-90deg);
    -webkit-transform: rotateY(-90deg);
}
#card.open-half #card-front .wrap {
    background-color: rgba(0, 0, 0, .5);
}

#card.open-fully #card-front,
#card.close-half #card-front {
  background: #FFEFEF;
}

#card.open-fully #card-front {
    transform: rotateY(-180deg);
    -moz-transform: rotateY(-180deg);
    -webkit-transform: rotateY(-180deg);
}

#card.open-fully #card-front .wrap {
    background-color: rgba(0, 0, 0, 0);
}

#card.open-fully #card-front .wrap *,
#card.close-half #card-front .wrap * {
   display: none;
}

#error-msg{
  color: #EEEEEE;
  width: 100%;
  background-color: #E53935;
  padding: 1.5em 1em;
  letter-spacing: 2px;

  display: none;
}
/* setting background-image when the card is fully open , over*/

.open-fully #card-front {
 
  background-image: url("../img/irena.png") !important;

  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}
@media only screen and (max-width: 1020px) {
    #card {
        display: none;
    }
    #error-msg{
      display: block;
    }
}