#sll{
    margin-top:9px;
 background-color:blue;
 color:white;
 border-bottom:2px solid red;
 border-radius:px;
}


      * {
        margin: 0;
        padding: 0;
      }



      body {
        background-color: #8098ff;
        margin-top: 2px;


      }
body { border: ridge 20px;} 


      .btn-box {
        width: 100%;
        height: 40px;
        background: white;
        border-radius: 10px;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        background-color: #fff;
        box-shadow: 0 2px 2px 0 rgba(116, 97, 127, 1.00);


      }

      .content {
        width: 100%;
        height: 93vh;
        overflow: scroll;

      }

      .container {
        font-weight: bold;
        width: 150px;
        height: 170px;
        position: relative;
}

      .container1 {
        font-weight: bold;
        width: 320px;
        height: 170px;
        position: relative;

      }
      .card1 {
        width: 120px;
        height: 120px;
        position: relative;
        top: 15px;


      }
      .card2 {
        width:80%;
        height: 120px;
        position: relative;
        top: 15px;



      }

      .card3 {
        width:200px;
        height: 120px;
        position: relative;
        top: 15px;



      }


      h3 {
        font-size: 13px;
        color: #000;
        display: inline-block;
        position: relative;
        top: 20px;
      }

      figcaption {
        text-align: center;
      }


      .btn2 {
        margin: 5px;
        font: bold 15px Arial;
        text-decoration: none;
        border-radius: 10px;
        text-transform: uppercase;
        -webkit-transition: all 200ms linear;
        transition: all 200ms linear;
        padding: 0px;
        letter-spacing: 1px;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
        -ms-flex-pack: center;
        text-align: center;
        border: 3px solid #8098ff;
        background-color: #fff;
        color: #102770;
        box-shadow: 0 8px 24px 0 rgba(255, 235, 167, .2);
        transition: 0.1s;


      }

      .btn2:active,
      .btn2:focus,
      .btn2:hover {
        color: #ffeba7;
        box-shadow: 0 0 0.20em 0.20em rgba(255, 255, 255);
        border: 3px solid red;
        outline: none;
        transform: scale(1.07);
      }

      .sv-box {
        background-color: #bfffea;
        padding: 5px;
        display: block;
        position: relative;
        border: 2px dodgerblue solid;
        border-radius: 10px;
      }

      .btn {}

      .btn:active,
      .btn:focus {
        background-color: #20c0c0;
        color: #ffeba7;
        border-radius: 10px;
      }

      .btn:hover {
        background-color: #20c0c0;
        color: #ffeba7;
        border-radius: 10px;
      }

      .btn1 {
        width: 32%;
        height: 30px;
        font: bold 12px Arial;
        text-decoration: none;
        border-radius: 5px;
        text-transform: uppercase;
        -webkit-transition: all 200ms linear;
        transition: all 200ms linear;
        padding: 3px;
        letter-spacing: 1px;
        display: -webkit-inline-flex;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-align-items: center;
        -moz-align-items: center;
        -ms-align-items: center;
        align-items: center;
        -webkit-justify-content: center;
        -moz-justify-content: center;
        -ms-justify-content: center;
        justify-content: center;
        -ms-flex-pack: center;
        text-align: center;
        border: 1px dodgerblue solid;
        background-color: #20c0c0;
        color: #000;
        box-shadow: 0 8px 24px 0 rgba(255, 235, 167, .2);



      }

      .btn1:active,
      .btn1:focus {
        background-color: #fff;
        color: #8098ff;
        outline: none;



      }

      .btn1:hover {
        background-color: #fff;
        color: #8098ff;
        outline: none;



}
      .button-1 {
        width: 90%;
  background-color: transparent;
  border: 3px solid white;
  border-radius: 95px;
  -webkit-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out;
  color: #00d7c3;
}
.button-1:hover {
  box-shadow: 0 0 30px 0 #00d7c3 inset, 0 0 20px 2px gold;
  border: 3px solid #00d7c3;
}

.button-4 {
  background-color: white;
  width: 90%;
  border: 3px solid #ff0251;
  color: #ff0251;
  transition: .3s;
}
.button-4:hover {
  animation: pulse 1s infinite;
  transition: .3s;
}
@keyframes pulse {
  0% {
    transform: scale(1);
  }
  70% {
    transform: scale(.9);
  }
    100% {
    transform: scale(1);
  }
  .custom-btn {
            width: 130px;
            height: 45px;
            color: #ff7433;
            border-radius: 5px;
            padding: 10px 25px;
            font-family: 'Lato', sans-serif;
            font-weight: 500;
            background: transparent;
            cursor: pointer;
            transition: all 0.3s ease;
            position: relative;
            display: inline-block;
            box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, .5), 7px 7px 20px 0px rgba(0, 0, 0, .1), 4px 4px 5px 0px rgba(0, 0, 0, .1);
            outline: none;
        }

        .btn-11 {
            border: white;
            background: green;
            background: linear-gradient(80deg, #32c0cc 10%, black 100%);
            color: #ff7433;
            overflow: hidden;
        }

        .btn-11:hover {
            text-decoration: none;
            color: #ff7433;
            background-image: linear-gradient(135deg,  #32c0cc 100%, #000000 20%);
        }

        .btn-11:before {
            position: absolute;
            content: '';
            display: inline-block;
            top: -180px;
            left: 0;
            width: 30px;
            height: 100%;
            background-color: #fff;
            animation: shiny-btn1 3s ease-in-out infinite;
        }

        .btn-11:hover {
            opacity: .7;
            color: ff7433;
        }

        .btn-11:active {
            box-shadow: 4px 4px 6px 0 rgba(255, 255, 255, .3), -4px -4px 6px 0 rgba(116, 125, 136, .2), inset -4px -4px 6px 0 rgba(255, 255, 255, .2), inset 4px 4px 6px 0 rgba(0, 0, 0, .2);
          }