.bg-image {
	position:fixed;
	z-index:-1;
	top:0;
	left:0;
	background-image: url("../pic/waterbb.jpg");
	filter: blur(5px);
	-webkit-filter: blur(5px);
	height: 100vh;
	width: 100%;
	background-repeat: no-repeat;
	background-size: cover;
}

* {
	padding-inline-start:0;
}

body {
	background-color:#2596be;
}

h1 , h2 , h3 , p {
	font-family:"Arial";
	text-indent: 10px;
}
ul {
	width:96%;
	text-align:center;
}
li {
	display:inline;
	margin-left:40px;
}
a {
	color:ffffff;
	text-decoration:none;
}
a:hover { 
	color:ff8800;
}
img {
	float:right;
	height:200px;
}
div {
	width:50vw;
	height:100vw;
	background-color:#2187AB;
	margin-left:auto;
	margin-right:auto;
	border-radius:5px;
	padding:2%;
}
body {
  background-color: #f4f4f4;
}
.bottles-center {
  width: 600px;
  margin: 2% auto;
  background-color: #1c1827;
  box-shadow: 2px 2px 10px -1px #1c1827;
  padding: 25px;
}

.plate {
  margin: 0 auto;
  height: 10px;
  width: 550px;
  background-color: #544271;
  border-radius: 20px;
}

.bottles-container {
  display: inline-flex;
}

.bottle {
  position: relative;
  height: 350px;
  top: 105px;
  left: 16%;
  z-index: 1;
  opacity: 0.8;
  .bottle-cap {
    position: absolute;
    height: 12px;
    width: 40px;
    top: -95px;
    left: 30px;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
    .triangle {
      border-width: 0px 5px 8px 5px;
      border-style: solid;
      border-color: transparent transparent #1c1827 transparent;
      position: absolute;
      &.one {
        left: 3px;
        top: 5px;
      }

      &.two {
        left: 15px;
        top: 5px;
      }

      &.three {
        left: 27px;
        top: 5px;
      }
    }
  }
  .top-part {
    position: absolute;
    height: 50px;
    width: 33px;
    -webkit-perspective: 170px;
    perspective: 170px;
    left: 34px;
    top: -95px;
    z-index: 1;
    .tilt {
      height: 100px;
      width: 33px;
      -webkit-transform-style: preserve-3d;
      -webkit-transform: rotateX(45deg);
      transform-style: preserve-3d;
      transform: rotateX(45deg);
    }
  }
  .bottle-body {
    position: relative;
    background-color: red;
    height: 250px;
    width: 100px;
    border-top-left-radius: 60px;
    border-top-right-radius: 60px;
  }
}

.bottle {
  .bottle-body {
    .shine {
      position: absolute;
      top: 60px;
      left: 15px;
      .round {
        background: #fff;
        height: 10px;
        width: 10px;
        border-radius: 20px;
        margin-bottom: 10px;
      }
      .big {
        background: #fff;
        height: 60px;
        width: 10px;
        border-radius: 20px;
      }
    }
  }
  .sticker {
    position: absolute;
    width: 40px;
    height: 70px;
    top: 110px;
    right: 0;
  }
}

.first.bottle {
  .bottle-cap {
    background: #7775bf;
  }
  .top-part .tilt {
    background: rgba(28, 24, 38, 1);
    background: -moz-linear-gradient(
      top,
      rgba(28, 24, 38, 1) 0%,
      rgba(78, 74, 90, 1) 100%
    );
    background: -webkit-gradient(
      left top,
      left bottom,
      color-stop(0%, rgba(28, 24, 38, 1)),
      color-stop(100%, rgba(78, 74, 90, 1))
    );
    background: -webkit-linear-gradient(
      top,
      rgba(28, 24, 38, 1) 0%,
      rgba(78, 74, 90, 1) 100%
    );
    background: -o-linear-gradient(
      top,
      rgba(28, 24, 38, 1) 0%,
      rgba(78, 74, 90, 1) 100%
    );
    background: -ms-linear-gradient(
      top,
      rgba(28, 24, 38, 1) 0%,
      rgba(78, 74, 90, 1) 100%
    );
    background: linear-gradient(
      to bottom,
      rgba(28, 24, 38, 1) 0%,
      rgba(78, 74, 90, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(
        startColorstr="#1c1826",
        endColorstr="#4e4a5a",
        GradientType=0
      );
  }
  .bottle-body {
    background: rgba(78, 74, 90, 1);
    background: -moz-linear-gradient(
      top,
      rgba(78, 74, 90, 1) 0%,
      rgba(119, 117, 191, 1) 100%
    );
    background: -webkit-gradient(
      left top,
      left bottom,
      color-stop(0%, rgba(78, 74, 90, 1)),
      color-stop(100%, rgba(119, 117, 191, 1))
    );
    background: -webkit-linear-gradient(
      top,
      rgba(78, 74, 90, 1) 0%,
      rgba(119, 117, 191, 1) 100%
    );
    background: -o-linear-gradient(
      top,
      rgba(78, 74, 90, 1) 0%,
      rgba(119, 117, 191, 1) 100%
    );
    background: -ms-linear-gradient(
      top,
      rgba(78, 74, 90, 1) 0%,
      rgba(119, 117, 191, 1) 100%
    );
    background: linear-gradient(
      to bottom,
      rgba(78, 74, 90, 1) 0%,
      rgba(119, 117, 191, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(
        startColorstr="#4e4a5a",
        endColorstr="#7775bf",
        GradientType=0
      );
  
    .sticker {
       background: rgba(119, 117, 191, 1);
    }
  }
}

.second.bottle {
  .bottle-cap {
    background: #5cc8f2;
  }
  .top-part .tilt {
   background: rgba(28,24,38,1);
    background: -moz-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(76,80,93,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(28,24,38,1)), color-stop(100%, rgba(76,80,93,1)));
    background: -webkit-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(76,80,93,1) 100%);
    background: -o-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(76,80,93,1) 100%);
    background: -ms-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(76,80,93,1) 100%);
    background: linear-gradient(to bottom, rgba(28,24,38,1) 0%, rgba(76,80,93,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c1826', endColorstr='#4c505d', GradientType=0 );
  }
  .bottle-body {
    background: rgba(76,80,93,1);
    background: -moz-linear-gradient(top, rgba(76,80,93,1) 0%, rgba(92,200,242,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(76,80,93,1)), color-stop(100%, rgba(92,200,242,1)));
    background: -webkit-linear-gradient(top, rgba(76,80,93,1) 0%, rgba(92,200,242,1) 100%);
    background: -o-linear-gradient(top, rgba(76,80,93,1) 0%, rgba(92,200,242,1) 100%);
    background: -ms-linear-gradient(top, rgba(76,80,93,1) 0%, rgba(92,200,242,1) 100%);
    background: linear-gradient(to bottom, rgba(76,80,93,1) 0%, rgba(92,200,242,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4c505d', endColorstr='#5cc8f2', GradientType=0 );
    .sticker {
       background: #5cc8f2;
    }
  }
}

.third.bottle {
  .bottle-cap {
    background: #f2d43d;
  }
  .top-part .tilt {
    background: rgba(28,24,38,1);
    background: -moz-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(88,83,82,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(28,24,38,1)), color-stop(100%, rgba(88,83,82,1)));
    background: -webkit-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(88,83,82,1) 100%);
    background: -o-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(88,83,82,1) 100%);
    background: -ms-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(88,83,82,1) 100%);
    background: linear-gradient(to bottom, rgba(28,24,38,1) 0%, rgba(88,83,82,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c1826', endColorstr='#585352', GradientType=0 );
  }
  .bottle-body {
    background: rgba(88,83,82,1);
    background: -moz-linear-gradient(top, rgba(88,83,82,1) 0%, rgba(242,212,61,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(88,83,82,1)), color-stop(100%, rgba(242,212,61,1)));
    background: -webkit-linear-gradient(top, rgba(88,83,82,1) 0%, rgba(242,212,61,1) 100%);
    background: -o-linear-gradient(top, rgba(88,83,82,1) 0%, rgba(242,212,61,1) 100%);
    background: -ms-linear-gradient(top, rgba(88,83,82,1) 0%, rgba(242,212,61,1) 100%);
    background: linear-gradient(to bottom, rgba(88,83,82,1) 0%, rgba(242,212,61,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#585352', endColorstr='#f2d43d', GradientType=0 );
    .sticker {
       background: #f2d43d;
    }
  }
}

.fourth.bottle {
  .bottle-cap {
    background: #f28d35;
  }
  .top-part .tilt {
    background: rgba(28,24,38,1);
    background: -moz-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(86,76,81,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(28,24,38,1)), color-stop(100%, rgba(86,76,81,1)));
    background: -webkit-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(86,76,81,1) 100%);
    background: -o-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(86,76,81,1) 100%);
    background: -ms-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(86,76,81,1) 100%);
    background: linear-gradient(to bottom, rgba(28,24,38,1) 0%, rgba(86,76,81,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c1826', endColorstr='#564c51', GradientType=0 );
  }
  .bottle-body {
    background: rgba(86,76,81,1);
    background: -moz-linear-gradient(top, rgba(86,76,81,1) 0%, rgba(242,141,53,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(86,76,81,1)), color-stop(100%, rgba(242,141,53,1)));
    background: -webkit-linear-gradient(top, rgba(86,76,81,1) 0%, rgba(242,141,53,1) 100%);
    background: -o-linear-gradient(top, rgba(86,76,81,1) 0%, rgba(242,141,53,1) 100%);
    background: -ms-linear-gradient(top, rgba(86,76,81,1) 0%, rgba(242,141,53,1) 100%);
    background: linear-gradient(to bottom, rgba(86,76,81,1) 0%, rgba(242,141,53,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#564c51', endColorstr='#f28d35', GradientType=0 );
    .sticker {
       background: #f28d35;
    }
  }
}

.fifth.bottle {
  .bottle-cap {
    background: #f24495;
  }
  .top-part .tilt {
    background: rgba(28,24,38,1);
    background: -moz-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(86,71,87,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(28,24,38,1)), color-stop(100%, rgba(86,71,87,1)));
    background: -webkit-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(86,71,87,1) 100%);
    background: -o-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(86,71,87,1) 100%);
    background: -ms-linear-gradient(top, rgba(28,24,38,1) 0%, rgba(86,71,87,1) 100%);
    background: linear-gradient(to bottom, rgba(28,24,38,1) 0%, rgba(86,71,87,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c1826', endColorstr='#564757', GradientType=0 );
  }
  .bottle-body {
    background: rgba(86,71,87,1);
    background: -moz-linear-gradient(top, rgba(86,71,87,1) 0%, rgba(242,68,149,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(86,71,87,1)), color-stop(100%, rgba(242,68,149,1)));
    background: -webkit-linear-gradient(top, rgba(86,71,87,1) 0%, rgba(242,68,149,1) 100%);
    background: -o-linear-gradient(top, rgba(86,71,87,1) 0%, rgba(242,68,149,1) 100%);
    background: -ms-linear-gradient(top, rgba(86,71,87,1) 0%, rgba(242,68,149,1) 100%);
    background: linear-gradient(to bottom, rgba(86,71,87,1) 0%, rgba(242,68,149,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#564757', endColorstr='#f24495', GradientType=0 );
    .sticker {
       background: #f24495;
    }
  }
}

.second,
.third,
.fourth,
.fifth {
  margin-left: -12px;
}