/* body {
    margin:0;
    padding:0;
    background-color:#864701;
}

.wrapper {
   	display:flex;
	align-items: center;
	justify-content: center;
}

.wrapper img {
    max-width:100%;
    max-height:100vh;
} */



.bg__loyout-wrapper {
    width: 100%;
    height: 100vh;
    background-color: #536dfe;
  }
  
  .bg__picture {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
  
  .bg__picture-wrapper {
    width: 100%;
    height: 100%;
    padding-top: 48px;
    padding-bottom: 48px;
    padding-left: 52px;
    padding-right: 52px;
    overflow: hidden;
    position: relative;
  }
  
  .bg__frame-inner-shadow-outer {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding-top: 16px;
    padding-bottom: 16px;
    padding-left: 16px;
    padding-right: 16px;
    z-index: 9;
    position: absolute;
  }
  
  .bg__frame-inner-shadow {
    width: 100%;
    height: 100%;
    -webkit-box-shadow: inset 6px 8px 16px -8px #000001;
    -moz-box-shadow: inset 68px 8px 16px -8px #000001;
    box-shadow: inset 6px 8px 16px -8px #000001;
    opacity: 0.6;
  }
  
  .bg__frame-inner-shine-outer {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding-top: 16px;
    padding-bottom: 16px;
    padding-left: 16px;
    padding-right: 16px;
    z-index: 9;
    position: absolute;
  }
  
  .bg__frame-inner-shine {
    width: 100%;
    height: 100%;
    -webkit-box-shadow: inset -48px -8px 58px -14px #212121;
    -moz-box-shadow: inset -4px -8px 58px -14px #212121;
    box-shadow: inset -4px -8px 58px -14px #212121;
    opacity: 0.4;
  }
  
  .bg__frame-inner-photo-shadow-outer {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding-top: 48px;
    padding-bottom: 48px;
    padding-left: 52px;
    padding-right: 52px;
    z-index: 9;
    position: absolute;
  }
  
  .bg__frame-inner-photo-shadow {
    width: 100%;
    height: 100%;
    -webkit-box-shadow: inset -2px 1px 12px -1px #212121;
    -moz-box-shadow: inset -2px -1px 12px -1px #212121;
    box-shadow: inset -2px -1px 12px -1px #212121;
    opacity: 0.2;
  }
  
  .bg__frame {
    background-color: #eceff1;
    height: 540px;
    width: 540px;
    margin: -270px -270px;
    position: absolute;
    left: 50%;
    top: 50%;
    border: 1px solid;
    border-color: rgba(33, 33, 33, 0.9) rgba(33, 33, 33, 0.9);
    box-shadow: 3px 6px 10px -2px rgba(0, 0, 0, 0.3), inset 0 1px 0 #212121, inset 1px 0 0 #232323, inset 0 -1px 0 #212121, inset -1px 0 0 #232323, inset 0 2px 0 #242425, inset 2px 0 0 #262728, inset 0 -2px 0 #242425, inset -2px 0 0 #262728, inset 0 3px 0 #26272a, inset 3px 0 0 #24252c, inset 0 -3px 0 #26272a, inset -3px 0 0 #24252c, inset 0 4px 0 #292a2e, inset 4px 0 0 #2e2e31, inset 0 -4px 0 #292a2e, inset -4px 0 0 #2e2e31, inset 0 5px 0 #2b2c33, inset 5px 0 0 #313235, inset 0 -5px 0 #2b2c33, inset -5px 0 0 #313235, inset 0 6px 0 #2e2f37, inset 6px 0 0 #353539, inset 0 -6px 0 #2e2f37, inset -6px 0 0 #353539, inset 0 7px 0 #30323c, inset 7px 0 0 #38393e, inset 0 -7px 0 #30323c, inset -7px 0 0 #38393e, inset 0 8px 0 #333540, inset 8px 0 0 #3c3d42, inset 0 -8px 0 #333540, inset -8px 0 0 #3c3d42, inset 0 9px 0 #353844, inset 9px 0 0 #3f4147, inset 0 -9px 0 #353844, inset -9px 0 0 #3f4147, inset 0 10px 0 #383b49, inset 10px 0 0 #43444b, inset 0 -10px 0 #383b49, inset -10px 0 0 #43444b, inset 0 11px 0 #3a3d4d, inset 11px 0 0 #474850, inset 0 -11px 0 #3a3d4d, inset -11px 0 0 #474850, inset 0 12px 0 #3d4052, inset 12px 0 0 #4a4c54, inset 0 -12px 0 #3d4052, inset -12px 0 0 #4a4c54, inset 0 13px 0 #3f4356, inset 13px 0 0 #4a4c54, inset 0 -13px 0 #3f4356, inset -13px 0 0 #4a4c54, inset 0 14px 0 #3d4052, inset 14px 0 0 #474850, inset 0 -14px 0 #3d4052, inset -14px 0 0 #474850, inset 0 15px 0 #3a3d4d, inset 15px 0 0 #43444b, inset 0 -15px 0 #3a3d4d, inset -15px 0 0 #43444b, inset 0 16px 0 #383b49, inset 16px 0 0 #3f4147, inset 0 -16px 0 #383b49, inset -16px 0 0 #3f4147;
  }