@charset "UTF-8";

html, body * {
    box-sizing: border-box;
}

html {
    font-size: 16px;
}

body {
    margin: 0;
    padding: 0;
    font-family: 'Roboto', sans-serif;
    background-color: #00ff00;
}
input {
  width:10% ;
  height: 50px;
  font-size: 25px;
  z-index: 100vh;

}

#table{
  /* position: relative ; */
  font-size: 30px;
  margin: 100px 0px 0px 40px;
}
#to{
  position: fixed;
  left: 125px;
  margin-top: 10px;
}
#name{
  width:10% ;
}
#info{
  position: fixed;
  left: 42px;
  width: 250px;
  background-color: #fff;
}
#btn{
  margin: 200px;
  width: 10%;
  height: 120px;
  font-size: 50px;
}

object {
  position: fixed;
  right: -300px;
  height: 100vh;
}
.happyStrokeStyle_2 {
  fill: url(#Summer);
}

.happyStrokeStyle_2, .cls-1, .happyStrokeStyle_4, .happyStrokeStyle_3, .cls-2 {
  stroke-width: 0px;
}

.cls-1 {
  fill: url(#Summer-4);
}

.happyStrokeStyle_4 {
  fill: url(#Summer-3);
}

.happyStrokeStyle_3 {
  fill: url(#Summer-2);
}

.cls-2 {
  fill: url(#Summer-5);
}
/* !         */


.happyStrokeStyle {
  fill: url(#Summer);
}

.happyStrokeStyle, .cls-1, .cls-2, .cls-3, .cls-4, .cls-5, .cls-6, .cls-7, .yellowLigthStyle, .cls-8, .redLigthStyle, .cls-9 {
  stroke-width: 0px;
}

.cls-1, .cls-10, .strokeStyle, .cls-11 {
  fill: none;
}

.cls-2 {
  fill: url(#radial-gradient);
}

.cls-3 {
  fill: url(#Golden_Ring);
}

.cls-12 {
  fill: #ea0f48;
  stroke: #b3b3b3;
}

.cls-12, .cls-10, .strokeStyle, .cls-13, .cls-11 {
  stroke-miterlimit: 10;
}

.cls-12, .cls-11 {
  stroke-width: .91px;
}

.cls-4 {
  fill: url(#Golden_Ring-2);
}

.cls-10 {
  stroke-width: .6px;
}

.cls-10, .strokeStyle {
  stroke: #000;
}

.cls-13 {
  fill: #ed1c24;
  stroke: #c1272d;
  stroke-width: .45px;
}

.cls-11 {
  stroke: #9e005d;
}

.cls-5 {
  fill: #39b54a;
}

.cls-6 {
  fill: #42210b;
}

.cls-7 {
  fill: #ff7bac;
}

.yellowLigthStyle {
  fill: #ffdb49;
}

.cls-8 {
  fill: #fff;
}

.redLigthStyle {
  fill: red;
}

.cls-9 {
  fill: lime;
}