@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap');
/*font-family: 'Montserrat', sans-serif;*//**/

@import url('https://fonts.googleapis.com/css2?family=Modak&display=swap');
/*font-family: 'Modak', cursive;*//**/

@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&display=swap');
/*font-family: 'Dancing Script', cursive;*//**/

@import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap');
/*font-family: 'Lobster', cursive;*//**/

@import url('https://fonts.googleapis.com/css2?family=Fjalla+One&display=swap');
/*font-family: 'Fjalla One', sans-serif;*//**/

@import url('https://fonts.googleapis.com/css2?family=Indie+Flower&display=swap');
/*font-family: 'Indie Flower', cursive;*//**/

@import url('https://fonts.googleapis.com/css2?family=Exo+2:ital@1&display=swap');
/*font-family: 'Exo 2', sans-serif;*//**/

@import url('https://fonts.googleapis.com/css2?family=Shadows+Into+Light&display=swap');
/*font-family: 'Shadows Into Light', cursive;*//**/

@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap');
/*font-family: 'Abril Fatface', cursive;*//**/

@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@1,500&display=swap');
/*font-family: 'EB Garamond', serif;*//**/

@import url('https://fonts.googleapis.com/css2?family=Fredericka+the+Great&display=swap');
/*font-family: 'Fredericka the Great', cursive;*//**/

@import url('https://fonts.googleapis.com/css2?family=Arvo:ital,wght@1,700&display=swap');
/*font-family: 'Arvo', serif;*//**/

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@200&display=swap');
/*font-family: 'Cairo', sans-serif;*//**/

body {
  background:#8ee8db;
  background:#8ee8db;
  margin:0;
}

.mainleft {
  box-sizing:border-box;
  margin:0;
  position:absolute;
  top:50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.mainright {
  box-sizing:border-box;
  margin:0;
  position:absolute;
  top:50%;
  right: 0px;
  left:500px;
  
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.rightbox {
  overflow: hidden;
  background:#ff756e;
  padding-left:0;
  padding-top:140px;
  padding-bottom:140px;
}

.crop {
  overflow: hidden;
  width: 380px;
  background:black;
  padding-left:80px;
  padding-top:140px;
  padding-bottom:140px;
}

.superbox, .snippanbox {
  background:#ff756e;
  width: auto;
  overflow: visible;
  text-align: left;
  height: 75px;
  padding-left:2px;
  width: 500px;
}

.superbox, .snippanbox {
  margin-top: 20px;
}

.superboxright, .snippanboxright {
  background:black;
  width: auto;
  overflow: visible;
  text-align: left;
  height: 75px;
  padding-left:2px;
  width: calc(100%);
  position:relative;
}

.superboxright, .snippanboxright {
  margin-top: 20px;
}

.rosealliancelogo {
  border-radius: 50%;
  height: 60px;
}

.righttop {
  font-family: 'Montserrat', sans-serif;
  font-size: 20px;
  position:absolute;
  top: 50%;
  transform:translateY(-50%);
  left: 5px;
  color:white;
}

.rightbottom {
  position:absolute;
  top: 50%;
  transform:translateY(-50%);
  left: 5px;
  color:white;
}

a, .super {
  font-size: 90px;
  background: -webkit-linear-gradient(#8ee8db, #FFF);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

a, .snippan {
  font-size: 90px;
  background: -webkit-linear-gradient(#FFF, #8ee8db);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.s1 {
  font-family: 'Modak', cursive;
  font-weight:;
  display:inline-block;
  line-height: 77px;
  height:63px;
  width:57px;
  padding-left:3px;
  position: relative;
  bottom: -3px;
  background: linear-gradient(to top, white 10px, #8ee8db 10px),
      linear-gradient(to bottom, white 10px, white 10px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.u1 {
  font-family: 'Dancing Script', cursive;
  font-weight:;
  display:inline-block;
  line-height: 77px;
  height:79px;
  width:70px;
  position: relative;
  bottom: 5px;
  left:-15px;
  background: linear-gradient(to top, white 11px, #8ee8db 11px),
      linear-gradient(to bottom, white 11px, white 11px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.p1 {
  font-family: 'Lobster', cursive;
  font-weight:;
  display:inline-block;
  line-height: 77px;
  height:76px;
  width:57px;
  padding-left:3px;
  position: relative;
  bottom: -2px;
  left:-30px;
  background: linear-gradient(to top, white 10px, #8ee8db 10px),
      linear-gradient(to bottom, white 10px, white 10px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.e1 {
  font-family: 'Fjalla One', sans-serif;
  font-weight:;
  display:inline-block;
  line-height: 90px;
  height:83px;
  width:40px;
  position: relative;
  bottom: -2px;
  left:-40px;
  background: linear-gradient(to top, white 10px, #8ee8db 10px),
      linear-gradient(to bottom, white 10px, white 10px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.r1 {
  font-family: 'Indie Flower', cursive;
  font-weight:;
  display:inline-block;
  line-height: 77px;
  height:67px;
  width:55px;
  padding-left:4px;
  position: relative;
  bottom: 1px;
  left:-55px;
  background: linear-gradient(to top, white 10px, #8ee8db 10px),
      linear-gradient(to bottom, white 10px, white 10px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.dash {
  display:inline-block;
  line-height: 77px;
  height:67px;
  width:55px;
  padding-left:4px;
  position: relative;
  bottom: 10px;
  left:-70px;
}

.s2 {
  font-family: 'Exo 2', sans-serif;
  font-weight:;
  display:inline-block;
  line-height: 59px;
  height:67px;
  width:55px;
  padding-left:4px;
  position: relative;
  top: -15px;
  background: linear-gradient(to bottom, white 9px, #8ee8db 9px),
      linear-gradient(to top, white 9px, white 9px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.n1 {
  font-family: 'Shadows Into Light', cursive;
  font-weight:;
  display:inline-block;
  line-height: 75px;
  height:73px;
  width:48px;
  padding-left:4px;
  position: relative;
  top: -9px;
  left:-20px;
  background: linear-gradient(to bottom, white 9px, #8ee8db 9px),
      linear-gradient(to top, white 9px, white 9px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.i1 {
  font-family: 'Abril Fatface', cursive;
  font-weight:;
  display:inline-block;
  line-height: 64px;
  height:68px;
  width:34px;
  padding-left:4px;
  position: relative;
  top: -14px;
  left:-30px;
  background: linear-gradient(to bottom, white 9px, #8ee8db 9px),
      linear-gradient(to top, white 9px, white 9px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.p2 {
  font-family: 'EB Garamond', serif;
  display:inline-block;
  line-height: 58px;
  height:64px;
  width:60px;
  padding-left:4px;
  position: relative;
  top: -19px;
  left:-45px;
  background: linear-gradient(to bottom, white 9px, #8ee8db 9px),
      linear-gradient(to top, white 9px, white 9px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.p3 {
  font-family: 'Fredericka the Great', cursive;
  font-weight:;
  display:inline-block;
  line-height: 73px;
  height:71px;
  width:67px;
  padding-left:4px;
  position: relative;
  top: -11px;
  left:-55px;
  background: linear-gradient(to bottom, white 9px, #8ee8db 9px),
      linear-gradient(to top, white 9px, white 9px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.a1 {
  font-family: 'Arvo', serif;
  font-weight:;
  display:inline-block;
  line-height: 75px;
  height:72px;
  width:70px;
  padding-left:7px;
  position: relative;
  top: -11px;
  left:-70px;
  background: linear-gradient(to bottom, white 9px, #8ee8db 9px),
      linear-gradient(to top, white 9px, white 9px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.n2 {
  font-family: 'Cairo', sans-serif;
  font-weight:;
  display:inline-block;
  line-height: 66px;
  height:68px;
  width:56px;
  padding-left:0px;
  position: relative;
  top: -14px;
  left:-80px;
  background: linear-gradient(to bottom, white 9px, #8ee8db 9px),
      linear-gradient(to top, white 9px, white 9px);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}



/*
later, download the fonts and use this trick:
http://jsfiddle.net/jfcox/3LQyr/
A =  U+41-41
B =  U+42-42
C =  U+43-43
D =  U+44-44
E =  U+45-45
F =  U+46-46
G =  U+47-47
H =  U+48-48
I =  U+49-49
J =  U+4A-4A
K =  U+4B-4B
L =  U+4C-4C
M =  U+4D-4D
N =  U+4E-4E
O =  U+4F-4F
P =  U+50-50
Q =  U+51-51
R =  U+52-52
S =  U+53-53
T =  U+54-54
U =  U+55-55
V =  U+56-56
W =  U+57-57
X =  U+58-58
Y =  U+59-59
Z =  U+5A-5A
 - =  U+2D-2D
*/