CodePen

HTML

            
              <div class="panel">
  <p class="type">Quick Panel</p>
  <div class="paneltop">
  </div>
  <div class="panelback">
  </div>
</div>
            
          
!
via HTML Inspector

CSS

            
              .panel {
  position: absolute;
  left: 180px;
  top: 25px;
  width: 360px;
  height: 427px;
  z-index: 7;
}
.type {
  font-size: 19.913px;
  font-family: "Helvetica";
  color: rgb( 255, 255, 255 );
  line-height: 1.11;
  text-align: center;
  -moz-transform: matrix( 1.70449868947994, 0, 0, 1.72443193254442, 0, 0);
  -webkit-transform: matrix( 1.70449868947994, 0, 0, 1.72443193254442, 0, 0);
  position: absolute;
  left: 83px;
  top: 25.902px;
  width: 180px;
  height: 27px;
  z-index: 6;
}

.paneltop {
  background-image: -moz-linear-gradient( -90deg, rgb( 1, 98, 171 ) 0%, rgb( 0, 52, 91 ) 100%);
  background-image: -webkit-linear-gradient( -90deg, rgb( 1, 98, 171 ) 0%, rgb( 0, 52, 91 ) 100%);
  position: absolute;
  left: 2px;
  top: 1px;
  width: 351px;
  height: 81px;
  z-index: 4;
}
.panelback {
  border-radius: 20px;
  background-color: rgb( 224, 225, 226 );
  box-shadow: 1.5px 2.598px 5px 0px rgb( 0, 0, 0 );
  position: absolute;
  left: 2px;
  top: 1px;
  width: 351px;
  height: 418px;
  z-index: 3;
}

            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................