h1, h2, h3, h4,h5{
	color: #5c5c5c;
}
p, p a, li{
	color: #5c5c5c;
	letter-spacing: 1px;
}


.text-primary{
	color: #cb62e6!important;
}

.border-primary{
	border-color: #cb62e6!important;
}

.bg-primary{
	background-color: #f9eefc!important;
}

a.text-primary:hover{
  color: #fff!important;
}

.navbar{

	border-top: 1px solid #975fa5;
	border-bottom: 1px solid #975fa5;
	margin-top: 0px;

  	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 0px 0px 0 rgba(0, 0, 0, 0.19);
  	padding-bottom: 0;
    position: relative;
}
.navbar-brand {
	font-size: 18px;
	letter-spacing: 5px;
	font-weight: 600;
	padding:0;

}

.navbar-brand.navTitle-en{
  letter-spacing: 1px;
/*  max-width: 200px;*/

}

@media  (min-width: 992px) and   (max-width: 1600px)   {
  .navbar{
    display: flex;
     flex-direction: column;
     align-items: center;
             justify-content: center;
  }
  .navbar-brand.navTitle-en{
/*   width: 100%;*/

  }
}
@media  (max-width: 991px)  {
  .navbar{
    display: flex;
     flex-direction: row;
     align-item: between;
     justify-content: space-between;
  }
  .navbar-brand.navTitle-en{
   letter-spacing: 0px;
   margin-right: 0;

  }
}




.navbar-brand .logo{
	padding-right: 10px;
	max-height: 55px;
	
}


.dropdown-toggle{

}
.dropdown-toggle::after{
	border:none;

	content: "\f078";
	font-family:Font Awesome\ 5 Free;
	-moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    box-sizing: border-box;
    font-weight: 900;
    vertical-align: middle;
}

.dropdown-menu .dropdown-toggle::after{
  border-left: transparent;
}
.dropdown-menu > li a:hover, .dropdown-menu > li.show{
  background: #dfdfdf;
}
.marquee {
/*    height: 65px;*/
    line-height: 4.5;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    width: 100vw;
}
.marquee .track, .marquee .track-2 {
    white-space: nowrap;
    will-change: transform;
}
.marquee .track {
    animation: marquee 100s linear infinite;
}
.marquee .track-2 {
    animation: marquee-left 100s linear infinite;
}

@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-80%); }
}

@keyframes marquee-left {
  0% { transform: translateX(-50%); }
  100% { transform: translateX(0); }
}


.bannerWidth{
	width: 280px;
}
.marquee .track .bannerWidth{
  width: 230px;
}
@media only screen and (max-width: 720px) {
  
	.bannerWidth{
		width: 160px;
	}
  .marquee .track .bannerWidth{
  width: 130px;
}
	@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-90%); }
}

@keyframes marquee-left {
  0% { transform: translateX(-90%); }
  100% { transform: translateX(0); }
}

}



.floatWhatsappBtn{
  position:fixed;
  width:60px;
  height:60px;
  bottom:40px;
  right:40px;
  background-color:#0C9;
  color:#FFF;
  border-radius:50px;
  text-align:center;
  box-shadow: 2px 2px 3px #999;
}
.floatWhatsappBtn:hover{
  color: #fff;
}

.floatWhatsappBtn .fa-whatsapp{
  margin-top:10px;
  font-size: 38px;
  opacity: 0.7;
    color: #fff;
}



.floatWhatsappBtn .fa-whatsapp:hover{
  color: #fff;
  opacity:1;
}



#main-footer b{ 
  color: #8f8f8f;

}


.pattern-pink-stack {
    background-image: url(../../assets/img/pink-stack.webp);
    background-position: top;
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    -webkit-mask-image: linear-gradient(0deg, transparent 15%, #000 25%);
    mask-image: linear-gradient(0deg, transparent 15%, #000 25%);
    padding: 0px 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;

}


/*----------------- old style*/





      .width-300 {

        width: 300px!important;

      }

        








/* FOOTER */

.lightColor {

  background: #f8f5ff!important;

 }



 .lightColor2 {

  background: #e6fcfc!important;

 }


.NoOpacity {

  opacity: 1;

}



    .text-color-cn {

      /*  background-color: #f595de !important;  */

        color:#0abcb5!important;  

    font-family: 'Noto Sans TC', sans-serif;

    line-height: 1.5;

    font-size: 1em;

    font-weight: 300;

      }

    

      .text-color {

        /*  background-color: #f595de !important;  */

          color:#0abcb5!important;  

        }

      

      .fz-1-1 {

        font-size: 1.1em;

        font-weight: 300;

      }.fz-1-2 {

        font-size: 1.2em;

        font-weight: 300;

      }



  .bg-white {

    /*  background-color: #f595de !important;  */

      background-color: white!important;  

    }

    

  .bg-docWhite {

      /*  background-color: #f595de !important;  */

        background-color: white!important;

        padding: 20px;  

      } 





      .lightPink{ background-color:  #ffebfa!important;

      }

      

      

      .bg-lightPink{ background-color:  #ffebfa!important;

      }

          

/*    .btn-pink{ background-color: #0abcb5!important;  

      color: white!important;  

    } */



    .btn-pink{ background-color:#ade9e7!important;  

      color: gray!important;  

      text-decoration: none;

    }



    .btn-pink-glossary { background-color:#0abcb5!important;  

      color: white!important;  

      text-decoration: none;

      width: 20px;

    }

    .btn-pink:hover { background-color:#039e99!important;  

      color: white!important;

      text-decoration: underline;

    }

    .text-white:hover { 

      text-decoration: 1px solid white!important;

    }



    .box-shadow--3dp {

      box-shadow: 0 3px 4px 0 rgba(0, 0, 0, .14), 0 3px 3px -2px rgba(0, 0, 0, .2), 0 1px 8px 0 rgba(0, 0, 0, .12);

      text-decoration: none;

  }



  .btn-darkPink:hover { 

    background-color: #0abcb5!important;  

  }



  

  .bodytext_black:hover { 

    color: #0abcb5!important;  

  }



  

  .bodytext_black:hover { 

    color: #0abcb5!important;  

  }



  /*doc-start*/  

  .subhead-pink {

    /*   font-family: 'Noto Serif TC', serif; */

    font-family: 'Noto Sans TC', sans-serif;

    line-height: 1.5em;

    font-size: 1.5em;

    font-weight: 700;

    color:#0abcb5 !important;

}





.box {

  border: 1px solid black;

  padding: 10px;

}

 /*doc-end*/

  

    



a.bg-pink:hover, a.bg-pink:focus,

button.bg-pink:hover,

button.bg-pink:focus {

  background-color: #0abcb5 !important;

}



.dropdown-divider {

  border-bottom: 1px solid white!important ;



}




.pointer {cursor: pointer;

  border: 3px #0abcb5 solid;

  }



.textH3-cn { 

  /*   font-family: 'Noto Serif TC', serif; */  

  font-family: 'Noto Sans TC', sans-serif;

  color:#0abcb5 ;

  font-weight: 700;

  text-align: left;

}



.textH3-en { 

  /*   font-family: 'Noto Serif TC', serif; */  

  font-family: 'Open Sans', sans-serif;

  color:#0abcb5 ;

  font-weight: 700;

  text-align: left;

}





.text-center {

  text-align: center!important;

  font-weight: bold;

  }     



  .center {

    text-align: center!important;

    }     



    

    .image-center {

      display: block;

      margin-left: auto;

      margin-right: auto;

      width: 50%;

    }

    

.card-body-cn { 

  /*   font-family: 'Noto Serif TC', serif; */  

  font-family: 'Noto Sans TC', sans-serif;

  color: black;  

  font-weight: 400;

}



.carousel-item {

  height: 200px;

}



.carousel-image-1 {

  background: url('../../img/cover_cn.png');

  background-size: cover;

}



.carousel-image-2 {

  background: url('../../img/VenueQR_cn.png');

  background-size: cover;

}



.carousel-image-3 {

  background: url('../../img/slide03.jpg');

  background-size: cover;

}



.carousel-image-4 {

  background: url('../../img/slide04.jpg');

  background-size: cover;

}



.carousel-image-5 {

  background: url('../../img/slide05.jpg');

  background-size: cover;

}



.carousel-image-6 {

  background: url('../../img/slide06.jpg');

  background-size: cover;

}





#video-play {

  position: relative;

  width: 300px;

  min-height: 200px;

  background-image: url('../../img/IVF03B_en.jpg');

  /*background: rgba(0, 0, 0, 0.5);*/

  /*background-attachment: fixed;*/

  background-repeat: no-repeat;

  /*background-position: 100 100;*/

  text-align: center;

  color:  #0abcb5;

}





#video-play1 {

  position: relative;

  width: 300px;

  min-height: 220px;

  background-image: url('../../img/IFV2_Screenshot.png');

  /*background: rgba(0, 0, 0, 0.5);*/

  /*background-attachment: fixed;*/

  background-repeat: no-repeat;

  /*background-position: 100 100;*/

  text-align: center;

  color:  #0abcb5;

}



#video-play2 {

  position: relative;

  width: 300px;

  min-height: 220px;

  background-image: url('../../img/ICSI_Screenshot.png');

  /*background: rgba(0, 0, 0, 0.5);*/

  /*background-attachment: fixed;*/

  background-repeat: no-repeat;

  /*background-position: 100 100;*/

  text-align: center;

  color:  #0abcb5;

}



#video-play3 {

  position: relative;

  width: 300px;

  min-height: 300px;

  background-image: url('../../img/EmbryoDevelopment_Screenshot.png');

  /*background: rgba(0, 0, 0, 0.5);*/

  /*background-attachment: fixed;*/

  background-repeat: no-repeat;

  /*background-position: 100 100;*/

  text-align: center;

  color:  #0abcb5;

}





#video-play a, #video-play1 a, #video-play2 a, #video-play3 a {

  color:white;

}



.modal-w500 {

  width: 500px;

  margin: auto;

}



.modal-w550 {

  width: 550px;

  margin: auto;

}



.modal-w900 {

  width: 900px;

  margin: auto;

}



.modal-ku {

  width: 650px;

  margin: auto;

}



.modal-uterus {

  width: 900px;

  margin: auto;

}



.modal-video {

  width: 900px;

  margin: auto;

}





.w_auto {

  height: 600px;

}

.w_40 {

  width: 40%;

  text-align: center;

}

.w_50 {

  width: 50%;

  text-align: center;

}

.w_55 {

  width: 50%;

  text-align: center;

}

.wd_30 {

  width: 30%;

  text-align: left;

}



.w_60 {

  width: 60%;

}

.w_70 {

  width: 70%;

}

.w_60c {

  width: 60%;

  text-align: center;

}

.w_10 {

  width: 10%;

}

.w_5pc {

  width: 5%;

}



.w_4pc {

  width: 4%;

}



.w_8pc {

  width: 8%;

}



.w_6pc {

  width: 6%;

}





.w_5pc {

  width: 5%;

}





.w_3pc {

  width: 3%;

}



.w_100 {

  width: 100%;

  text-align: center;

}



.img_w50 {

  width: 50%;

  text-align: center;

  margin: 0 auto;

}







.pl1 {

  padding-left: 1em;

}



.h1_inline {display: inline;

}



.right {

  text-align: right;

}



.left {

  text-align: right!important;

}



.footLeft {

  float: left;

  width: 10%;

}



.footMiddle {

  width: 50%;

}

.footRight {

  width: 40%;

}





#OurClinic-heading {

  position: relative;

  min-height: 300px;

  background: url('../../img/ourclinic.jpg');

  background-attachment: fixed;

  background-repeat: no-repeat;

  width: auto;

  text-align: center;

  color: #fff;

}

/*

#OurTeam-heading {

  position: relative;

  min-height: 220px;

  background: url('../../img/OurMedicalTeam.png');

  background-attachment: fixed;

  background-repeat: no-repeat;

  text-align: center;

  color: #fff;

}



#Press-heading {

  position: relative;

  min-height: 220px;

  background: url('../../img/1.jpg');

  background-attachment: fixed;

  background-repeat: no-repeat;

  text-align: center;

  color: #fff;

}

#Download-heading {

  position: relative;

  min-height: 220px;

  background: url('../../img/1.jpg');

  background-attachment: fixed;

  background-repeat: no-repeat;

  text-align: center;

  color: #fff;

}

*/



.pink-overlay {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: rgba(231, 0, 124, 0);

/*  background: rgba(231, 0, 124, 0.3); */

}


.card-3pt {

  border: 3px #0abcb5 solid;

 }



 .card-2pt {

  border: 2px #0abcb5 solid;

  width: 100%;

 }

 .card-1pt {

  border: 1px #0abcb5 solid;

 }



 .px-2 {

  padding-left: 2px;

  padding-right: 2px;

 }

  

/* BREAK POINT*/





/*      table {

        width: 100%;

      } */



      table.wborder, table.wborder tr th, table.wborder tr td {

        border: 1px solid black;

        border-collapse: collapse;

        padding: 10px;

      }

      



      table.fixed {

/*        table-layout:auto;

      width:280px;

    margin-left:100px;
*/
  }



    .pl-3 {

    padding-left: 3.5em!important;

    }



    .CMA-modal-content {

      height: 95vh;

    }

    .CMA-W50 {

      height: 80vh;

      text-align: center;

      margin: 0 auto;

    

    }

    .modal {

      background-color: white;

      border: none;

    }

 

    .modal-footer {

      position: absolute;

      top: 85vh;

      left: 50%;

      -ms-transform: translate(-50%, -50%);

      transform: translate(-50%, -50%);

      text-decoration: none;

    }



    a .btn, div .cma {

      cursor: pointer;

    }



  /* end of table style */





/* (xs) */

@media only screen and (max-width:480px) {

  .modal-ku2  {

    width: 350px;

    margin: auto;

  }



  .mt-slide {

    margin-top: 5em;

  }

  .card img {

    width: 100%;

  }



  .card-height {

    height: auto;

  }

  

  .card-height2 {

    height: auto;

  }



  .OurClinic-heading img {

    width: 100%;

  }

  

  .card-column2 {  float: left;

    width: 100%;

    padding:  10px 10px;

    margin-bottom: 20px;

  }



  H3 {

    font-size: 0.5em;

  }

    .front-h3{
    font-size: 1.3em;

  }

  

  .w_4pc {

    display: none;

  }

  .w_5pc {

    display: none;

  }

  .w_6pc {

    display:none;

  }



  #main-footer {

    min-height: 19em;

  }

  #main-footer .right {

    text-align: left;

  }

  table.fixed {

    border: 0;

margin-left: 0px;}



  .carousel-item {

    height: 180px;

  }

    #staff1 .w_50l, #staff2 .w_50l, #staff3 .w_50l, #staff4 .w_50l {

      width:100%;

      text-align: left;

    }



 .card-deck {

  margin-top: 0em!important;

}



.scrollfinger {

  display: block;

}



.widthPercent {

  width: 100%;

}



.CMA-W50 {

  width: 100%;

  text-align: center;

  margin: 0 auto;

}







/*

.widthPercent2 {

  width: 100%;

}*/



}





/* (sm) 

@media (min-width: 481px) and  (max-width:540px) */

@media (min-width: 481px) and  (max-width: 766px) {

  .modal-ku2  {

    width: 400px;

    margin: auto;

  }



  .card img {

    width: 100%;

  }



  .card-height {

    height: auto;

  }

  

  .card-height2 {

    height: auto;

  }



    

  .mt-slide {

    margin-top: 5em;

  }



  .w_4pc {

    display:none;

  } 

  .w_5pc {

    display:none;

  }

  .w_6pc {

    display:none;

  }

 



  H3 {

    font-size: 0.7em;

  }

    .front-h3{
    font-size: 1.3em;

  }


  

  

  .card-column2 {  float: left;

    width: 46%;

    padding: 0px 0px;

    margin: 10px 10px;

  }





  .OurClinic-heading img {

    width: 100%;

  }

.carousel-item {

  height: 300px;

}



.card-deck {

  margin-top: 20px!important;

}



.scrollfinger {

  display: block;

}

#main-footer {

  min-height: 19em;

}



#main-footer .right {

  text-align: left;

}



table.fixed {

  margin-left: 0px;}



  

  .widthPercent {

    width: 90%;

  }

/*

  .widthPercent2 {

    width: 100%;

  }*/





}





/* (md) 

@media (min-width: 541px) and (max-width:980px) */

@media (min-width: 767px) and (max-width:990px) {

  .modal-ku2  {

    width: 700px;

    margin: auto;

  }





  H3 {

    font-size: 1em;

  }

  .front-h3{
    font-size: 1.4em;

  }


  .card img {

    width: 100%;

  }



  .card-height {

    height: auto;

  }



  .card-height2 {

    height: auto;

  }



  

  .card-height3 {

    padding-top: 23px;

    height: 95px;

  }



  .card-height4 {

    padding-top : 17px;

    height: 86px;

  }



  .card-height4a {

    padding-top : 17px;

    padding-left : 5px;

    padding-right : 5px;



  }

  

  .mt-slide {

    margin-top: 7em;

  }



  .OurClinic-heading img {

    width: 100%;

  }

  .carousel-item {

    height: 300px;

  }

  .card-column2 {  float: left;

    width: 46%;

    padding: 0px 0px;

    margin: 10px 10px;

  }

  

  .card-deck {

    margin-top: 20px!important;

  }

  

  .footerText {

    text-align: left;

  }

  

table.fixed {

  margin-left: 0px;}



  .scrollfinger {

    display: block;

  }  



  

  .widthPercent {

    width: 60%;

  }

/*

  .widthPercent2 {

    width: 55%;

  }*/



}







/* (lg) 

@media  (min-width: 981px) and (min-width:1920px) */

@media (min-width: 991px) and (max-width:1199px)  {

  .modal-ku2  {

    width: 700px;

    margin: auto;

  }






  .mt-slide {

    margin-top: 7em;

  }



  .card img {

    width: 100%;

  }



  .card-height {

    height: 70px;

    padding-top: 12px;

  }



  .card-height2 {

    padding-top: 14px;

    padding-left: 5px;

    padding-right: 5px;

    height: 95px;

  }



  .card-height3 {

    padding-top: 23px;

    height: 95px;

  }



  .card-height4 {

    padding-top : 17px;

    height: 86px;

  }



  .card-height4a {

    padding-top : 17px;

    padding-left : 5px;

    padding-right : 5px;



  }



  .OurClinic-heading img {

    width: 100%;

  }

  .carousel-item {

    height: 500px;

  }

  .card-column2 {  float: left;

    width: 48%;

    padding: 0px 0px;

    margin: 10px 10px;    

  }



  .card-deck {

    margin-top: 20px!important;

  }



  .scrollfinger {

    display: none;

  }  



  

  .widthPercent {

    width: 60%;

  }

/*

  .widthPercent2 {

    width: 55%;

  }*/





}





/* (xl) 

@media  (min-width: 1921px)*/



@media (min-width: 1200px) {

  .modal-ku2  {

    width: 700px;

    margin: auto;

  }



  

  .mt-slide {

    margin-top: 7em;

  }



  .card img {

    width: 100%;

  }

  .card-height {

    height: 70px;

    padding-top: 12px;

  }



  .card-height2 {

    padding-top: 14px;

    padding-left: 5px;

    padding-right: 5px;

    height: 95px;

  }



  .card-height3 {

    padding-top: 23px;

    height: 95px;

  }





  .card-height4 {

    padding-top : 17px;

    height: 86px;

  }



  .card-height4a {

    padding-top : 17px;

    padding-left : 5px;

    padding-right : 5px;



  }



  .OurClinic-heading img {

    width: 100%;

  }

  .carousel-item {

    height: 500px;

  }

  .card-column2 {  float: left;

    width: 48%;

    padding: 0px 0px;

    margin: 10px 10px;    

  }

  .card-deck {

    margin-top: 20px!important;

  }



  .scrollfinger {

    display: none;

  }  



  .widthPercent {

    width: 60%;

  }

  /*

  .widthPercent2 {

    width: 55%;

  }*/



}