/*
11:24 2020-04-03 for use in editing environment (no css class):
11:23 2020-04-03 ".govStepBlk__list" change to ".govStepBlks ul"
11:23 2020-04-03 add ".govStepBlks ol"
11:24 2020-04-03 ".govStepBlk_desc" change to ".govStepBlks p"
11:53 2020-04-03 fix nested lists spacing
15:07 2020-04-15 prolong vertical line as reviewer mobile issue
15:57 2020-05-11 user request for order list
*/


/*** Layout Style for govStepBlk ***/
.govStepBlks {
  margin-bottom: 45px;
  width: auto; }

.govStepBlk {
  position: relative;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-align-content: stretch;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
  overflow: hidden;
  padding-bottom: 30px; }
  .govStepBlk:last-child {
    padding-bottom: 0; }
    .govStepBlk:last-child:before {
      content: '';
      display: block;
      position: absolute;
      left: 0;
      bottom: 0;
      height: 3px;
      background: #e55b00;
      width: 50px;
      transform: scaleX(0);
      transition: .4s; }
      @media screen and (max-width: 767px) {
        .govStepBlk:last-child:before {
          width: 30px; } }
    .govStepBlk:last-child.isActive:before {
      transform: scaleX(1); }

.govStepBlk__id {
  width: 50px;
  height: 50px;
  background: #e55b00;
  color: #FFF;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-align-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 100%;
  font-weight: bold;
  flex: 0 0 auto;
  margin-right: 15px;
  position: relative; }
  @media screen and (max-width: 767px) {
    .govStepBlk__id {
      width: 30px;
      height: 30px;
      margin-right: 10px; } }
  .govStepBlk__id:after {
    width: 5px;
    margin-left: -2.5px;
    content: '';
    display: block;
    /* height: 200vh; 15:07 2020-04-15 prolong vertical line as reviewer mobile issue */
	height: 500vh;
    top: 100%;
    background: #e55b00;
    position: absolute;
    left: 50%;
    transition: .4s; }
    .govStepBlk:last-child:not(.isActive) .govStepBlk__id:after {
      height: 0; }
    @media screen and (max-width: 767px) {
      .govStepBlk__id:after {
        width: 3px;
        margin-left: -1.5px; } }

.govStepBlk__body {
  width: 100%;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-align-content: flex-start;
  -ms-flex-line-pack: start;
  align-content: flex-start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start; }

.govStepBlk__toggle {
  width: 100%;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-align-content: center;
  -ms-flex-line-pack: center;
  align-content: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  text-decoration: none !important; }
  body.innerPage .innerPageHolder .govStepBlk .govStepBlk__toggle {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex; }
  @media screen and (max-width: 767px) {
    .govStepBlk__toggle {
      -webkit-justify-content: space-between;
      -ms-flex-pack: justify;
      justify-content: space-between;
      -webkit-align-items: flex-start;
      -ms-flex-align: start;
      align-items: flex-start; } }

.govStepBlk__icon {
  position: relative;
  background: url() no-repeat center center;
  background-size: 100%;
  display: inline-block;
  vertical-align: middle;
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  margin-right: 15px; }
  @media screen and (max-width: 767px) {
    .govStepBlk__icon {
      width: 28px;
      height: 28px;
      margin-right: 10px; } }

.govStepBlk__plus {
  position: relative;
  width: 26px;
  height: 26px;
  display: inline-block;
  vertical-align: middle;
  flex: 0 0 auto;
  margin-left: 15px; }
  @media screen and (max-width: 767px) {
    .govStepBlk__plus {
      width: 20px;
      height: 20px;
      margin-left: 10px;
      margin-right: 10px; } }
  .govStepBlk__plus:before, .govStepBlk__plus:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -1.5px;
    left: 0;
    background: #e55b00;
    height: 3px;
    width: 100%;
    border-radius: 3px;
    transition: .3s; }
    @media screen and (max-width: 767px) {
      .govStepBlk__plus:before, .govStepBlk__plus:after {
        height: 2px;
        margin-top: -1px; } }
  .govStepBlk__plus:after {
    transform: rotate(90deg); }
    .govStepBlk.isActive .govStepBlk__plus:after {
      transform: scale(0);
      opacity: 0; }

.govStepBlk__title {
  display: inline-block;
  vertical-align: middle;
  text-decoration: none;
  color: #2f2f2f !important; }
  @media screen and (max-width: 767px) {
    .govStepBlk__title {
      width: 100%; } }

.govStepBlk__smalltitle {
  display: inline-block;
  vertical-align: middle;
  text-decoration: none;
  color: #2f2f2f !important;
  margin-bottom: 30px; }

.govStepBlk__content {
  padding: 30px 0;
  padding-left: 57px;
  display: none; }
  @media screen and (max-width: 767px) {
    .govStepBlk__content {
      padding: 15px 0; } }
  .govStepBlk.isActive .govStepBlk__content {
    display: block; }


/* 11:09 2020-04-03 GovHK: change ul class to ul and add ol */
.guidebookContentStep ul {
  list-style: disc;
  color: #e55b00;
  padding-left: 25px; }

/* 15:57 2020-05-11 user request for order list */
.guidebookContentStep ol {
  padding-left: 25px; }

  .guidebookContentStep li {
	 color:#353535;
  }

  @media screen and (max-width: 767px) {
	.guidebookContentStep ol ,  
    .guidebookContentStep ul {
      padding-left: 20px; } }
  body.innerPage .guidebookContentStep .innerPageHolder ol ,	  
  body.innerPage .guidebookContentStep .innerPageHolder ul {
    margin-bottom: 28px; }
	body.innerPage .guidebookContentStep .innerPageHolder ol:last-child ,
    body.innerPage .guidebookContentStep .innerPageHolder ul:last-child {
      margin-bottom: 0; }
  .guidebookContentStep ol a ,	  
  .guidebookContentStep ul a {
    color: #951717;
    text-decoration: underline !important; }
  .guidebookContentStep ol span ,	
  .guidebookContentStep ul span {
    color: #2f2f2f !important; }
  body.innerPage .guidebookContentStep .innerPageHolder ol li ,	
  body.innerPage .guidebookContentStep .innerPageHolder ul li {
    margin-bottom: 15px; }
	body.innerPage .guidebookContentStep .innerPageHolder ol li:last-child ,
    body.innerPage .guidebookContentStep .innerPageHolder ul li:last-child {
      margin-bottom: 0; }

/* 10:55 2020-04-03 UNorderList default have padding-top:0, so need to override orderList to pad-top-0 also */
body.innerPage .guidebookContentStep .innerPageHolder ol ,	  
body.innerPage .guidebookContentStep .innerPageHolder ul {
	padding-top:0;
}	

/* 11:47 2020-04-03 fix user test case for nested lists (add top margin for 2nd (nested) list) */
body.innerPage .guidebookContentStep .innerPageHolder ol ol,	  
body.innerPage .guidebookContentStep .innerPageHolder ol ul,
body.innerPage .guidebookContentStep .innerPageHolder ul ul,
body.innerPage .guidebookContentStep .innerPageHolder ul ol {
	margin-top:15px;
}	

/* 11:09 2020-04-03 GOVHK: change ul class to ul and add ol */
.guidebookContentStep ol , 
.guidebookContentStep ul {
  font-size: 15px; }
  :lang(zh-hk) .guidebookContentStep ol, :lang(zh-cn) .guidebookContentStep ol ,
  :lang(zh-hk) .guidebookContentStep ul, :lang(zh-cn) .guidebookContentStep ul {
    font-size: 16px; }
	
/* 12:36 2020-04-03 change ".govStepBlk__desc" to ".guidebookContentStep p"  */	
.guidebookContentStep p {
  margin-bottom: 20px; }
  .guidebookContentStep p a {
    display: inline !important; }
	
/* 12:01 2020-04-03 add for normal hyperlink */	
body.innerPage .guidebookContentStep .innerPageHolder li a {
    display: inline; }

/* 13:38 2020-04-03 add for step paragraph */	
body.innerPage .guidebookContentStep p {
  font-size: 15px; }
  :lang(zh-hk) .govStepBlks p, :lang(zh-cn) .govStepBlks p {
    font-size: 16px; }
	

.govStepBlk__subtitle {
  position: relative;
  padding: 30px 0; }
  @media screen and (max-width: 767px) {
    .govStepBlk__subtitle {
      padding: 15px 0;
      margin-left: 36px; } }

.govStepBlk__num {
  border: 3px solid #e55b00;
  color: #e55b00;
  border-radius: 100%;
  flex: 0 0 auto;
  position: absolute;
  right: 100%;
  top: 50%;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-flex-wrap: nowrap;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-align-content: flex-start;
  -ms-flex-line-pack: start;
  align-content: flex-start;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 42px;
  height: 42px;
  margin-top: -21px;
  margin-right: 15px; }
  @media screen and (max-width: 767px) {
    .govStepBlk__num {
      width: 28px;
      height: 28px;
      margin-top: -14px;
      margin-right: 10px; } }




.govStepBlk__remark {
  margin-top: 30px;
  margin-bottom: 30px; }

/*** END Layout Style for govStepBlk ***/
/*** Typography for govStepBlk ***/
.govStepBlk__id {
  text-align: center;
  font-size: 30px; }
  @media screen and (max-width: 767px) {
    .govStepBlk__id {
      font-size: 20px; } }

.govStepBlk__toggle {
  font-size: 0; }

.govStepBlk__title {
  font-weight: bold;
  font-size: 21px; }
  :lang(zh-hk) .govStepBlk__title, :lang(zh-cn) .govStepBlk__title {
    font-size: 22px; }
  @media screen and (max-width: 767px) {
    .govStepBlk__title {
      font-size: 20px; } }

.govStepBlk__smalltitle {
  font-weight: bold;
  font-size: 22px; }
  @media screen and (max-width: 767px) {
    .govStepBlk__smalltitle {
      font-size: 16px; } }



.govStepBlk__num {
  text-align: center;
  font-weight: bold;
  font-size: 20px; }
  @media screen and (max-width: 767px) {
    .govStepBlk__num {
      font-size: 16px; } }



.govStepBlk__remark {
  font-size: 15px; }
  :lang(zh-hk) .govStepBlk__remark, :lang(zh-cn) .govStepBlk__remark {
    font-size: 16px; }

/*** END Typography for govStepBlk ***/

/*# sourceMappingURL=style_addon.css.map */