@font-face {
    font-family: 'Helvetica Neue Medium';
    src: url(../Fonts/HelveticaNeueLTStd-Md.woff);
    unicode-range: U+00-024F;
}
@font-face {
    font-family: 'Helvetica Neue Bold';
    src: url(../Fonts/HelveticaNeueLTStd-Bd.woff);
    unicode-range: U+00-024F;
}
@font-face {
    font-family: 'Helvetica Neue Roman';
    src: url(../Fonts/HelveticaNeueLTStd-Roman.woff);
    unicode-range: U+00-024F;
}

@font-face {
    font-family: "Noto Sans HK";
    src: local("Noto Sans HK"), sans-serif;
    unicode-range: U+4E00-9FFF;
}

.zh-HK, .zh-HK p , .zh-HK .fontStyleD2 {
font-family: "Helvetica Neue Roman", 'Noto Sans HK', sans-serif!important;
}

a.anchor {
    display: block;
    position: relative;
    top: -150px;
    visibility: hidden;
}
#section-news .fontStyleB{
font-size:53px;
}
.dean-image{
	max-width:25.5%
}
.flex-item-Sou{
position: relative;
    flex: 1;
    padding: 0px;
    box-sizing: border-box;
    width: 100%;
}
.flex-item-Sou a{
color: #1EAEDB!important;
    cursor: pointer;
    text-decoration: none;
}
.news-content .fontStyleB{
font-size:53px;
}
body {
    position: relative;
    display: block;
    color: #000000;
    background-color: #a2a2a2;
    font-size: 15px;
    font-weight: normal;
    font-family: "Helvetica Neue Roman", "Helvetica Neue Medium", "Noto Sans HK", 'arial', sans-serif;
    min-width: 320px;
    margin: 0 auto;
}
.clearBoth{
    clear: both;
}
.btn-download-doc{
	padding: 2% 9%;
	/* Web Accessibility Enhancement (30/03/2022) - change color from "#00d7be" to "#10737f"*/
	background: #10737f;
    /*background: #00d7be;*/
    margin-bottom: 30px;
}

/* (21/04/2022) Change underline color to white*/
.btn-download-doc:hover{
	text-decoration-color: white;
}

.btn-download-doc span{
	color:white!important;
}
.newsletter-box .flex-item .image-container img{
	width:auto!important;
}
.normal-news-box-wrapper flex-item{
	max-width:320px;	
}

.souvenirs .description{
	font-size: 1.2rem;
	
}
.year-select{
	float:right;
	width:20%;
}
.btn-order{
	float: right;
	font-size: 15px;
	padding: 10px;
	/* Web Accessibility Enhancement (30/03/2022) - change color from "#00d7be" to "#10737f"*/
	background: #10737f
	/*background: #00d7be;*/
	color: white;
}
/*//////////// main content ////////*/
@media (max-width: 575.98px) {
    main {
        min-height: calc(100vh - 575px);
    }
}
@media (min-width: 576px) {
    main {
        min-height: calc(100vh - 536px);
    }
}
@media (min-width: 768px) {
    main {
        min-height: calc(100vh - 470px);
    }
}
@media (min-width: 992px) {
    main {
        min-height: calc(100vh - 442px);
    }
}
.site-wrapper{
    position: relative;
    display: block;
    margin: 0 auto;
    width: 100%;
    min-width: 320px;
    max-width: 1920px;
    overflow-x: hidden;    
    box-sizing: border-box;
    min-height: 100vh;
}
.main-wrapper{
    position: relative;
    display: block;
    width: 100%;
    margin: 0 auto;
    margin-top: 125px;
    box-sizing: border-box;
}
.box-container{
    position: relative;
    display: block;
    width: 100%;
    padding: 30px 0px;
    margin: 0 auto;
    box-sizing: border-box;
    max-width: 1280px;
}
.box-container:after{
    content: "";
    clear: both;
}
.box-container.noVerticalPadding{
    padding-left: 0;
    padding-right: 0;
}
.full-width-container{
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}
.full-width-container.topBorder{
    border-top: 1px solid #CBCBCB;
}
.full-width-container.bottomBorder{
    border-bottom: 1px solid #CBCBCB;
}
.title-container.box-container{
    padding: 70px 40px 50px 40px;
}
.row {
    position: relative;
    display: block;
}
.row:after{
    content: "";
    clear: both;
}
body > .site-wrapper{
    min-height: 90vh;
}
/*/////////// header ////////////*/
#header {
    /* position: fixed;/*relative;*/
    /* z-index: 900; */
    border-bottom: 1px solid #CBCBCB;
    width: 100%;
    background-color: #ffffff;
    max-width: 1920px;
}
#header > .box-container{
    background-color: #ffffff;
    z-index: 991;
    padding: 30px 40px 27px 30px;
}
.mainLogo {
    position: relative;
    top: 0;
    left: 0;
    /*width: 380px;*/
    width: 50%;
    height: auto;
    float: left;
    top:25px;
}
.mainLogo:before {
    position: absolute;
    top: 0;
    right: calc(100% - 1px);
    height: 100%;
    content: "";
    background-color: #ffffff;
}
.mainLogo__img {
    image-rendering: auto;
    position: relative;
    z-index: 3;
    /*height: 60px;*/
    width:100%;
}

.mainLogo__img_mobile {
    display: none;
    width: 100%;
}

.mainLogo a {
    display: block;
}
.functional-gp{
    position: relative;
    display: block;
    float: right;
}
.functional-gp .tools-gp{
    display: inline-block;
}
#btn-menu{
    position: relative;
    display: inline-block;
    font-size: 1.8rem;
    color: #000000;
    height: 20px;
}
/*#btn-menu:focus,
#btn-menu:hover,
#btn-menu.selected{
    color: #00d7be;
}*/

.desktop {
    display: inline-block;
    padding-right: 20px;
}

/*  menu --> icon
    20210324
*/
#btn-menu span {
    display: none;
}

#btn-menu #btn-menu-icon {
    position: relative;
    content: "";
    background-image: url(../images/mobile-menu.svg);
    background-size: 40px;
    background-repeat: no-repeat;
    background-position: center 100%;
    font-size: inherit;
    display: inline-block;
    width: 40px;
    height: 40px;
    text-align: center;
    box-sizing: content-box;
}

/*
    20210409: fix desktop view
*/
#btn-menu.selected #btn-menu-icon {
    display: none;
}

#btn-menu.selected:before{
    position: absolute;
    top: -2px;
    left: -33px;
    content: "";
    background-image: url(../images/close.svg);
    background-size: 40px;
    background-repeat: no-repeat;
    background-position: center 100%;
    font-size: inherit;
    line-height: 1;
    display: inline-block;
    width: 30px;
    height: 30px;
    padding: 0px;
    text-align: center;
    box-sizing: content-box;
    padding-top: 25px;
}

/*Web Accessibility Enhancement (02/03/2022) - Add border to close menu button*/
#btn-menu.selected.focus:before{
    border:2px solid #000;
}


#btn-search{
    position: relative;
    display: inline-block;
    font-size: 1.8rem;
    color: #000000;
    font-weight: bold;
    /* margin: 20px 20px; */
    width: 20px;
    height: 20px;
	border: none;
}
#btn-search:focus,
#btn-search:hover,
#btn-search.selected{
	/* Web Accessibility Enhancement (30/03/2022) - change color from "#00d7be" to "#10737f"*/
	color: #10737f;
    /*color: #00d7be;*/
}
#btn-search:before{
    display: inline-block;
    content: "\f002";
    font-family: FontAwesome;
    font-size: 1.8rem;
    line-height: 1;
    text-align: center;
    margin-top: 4px;
    margin-right: 10px;
}
#btn-language{
    position: relative;
    display: inline-block;
    font-size: 1.8rem;
    color: #000000;
    font-weight: bold;
    margin: 20px 20px;
    width: auto;
    height: 20px;
}
#btn-language:focus,
#btn-language:hover,
#btn-language.selected{
	/* Web Accessibility Enhancement (30/03/2022) - change color from "#00d7be" to "#10737f"*/
	color: #10737f;
    /*color: #00d7be;*/
}
.btn-features{
    position: relative;
    display: inline-block; 
    color: #000000;
    font-size: 16px;
    font-family: "Helvetica Neue Bold", 'Noto Sans HK';
}
.btn-features:hover, .btn-features:focus{
	/* Web Accessibility Enhancement (30/03/2022) - change color from "#00d7be" to "#10737f"*/
	color: #10737f;
    /*color: #00d7be;*/
}
.btn-features:before{
    position: relative;
    top: 7px;
    left: 0px;
    content: "";
    background-image: url(../images/arrow_right.svg);
    background-size: 25px;
    background-repeat: no-repeat;
    background-position: center 100%;
    font-size: inherit;
    line-height: 1;
    display: inline-block;
    color: #ffffff;
    width: 25px;
    height: 25px;
    padding: 0px;
    text-align: center;
    z-index: 10;
    box-sizing: content-box; 
}
.btn-features+.btn-features{
    margin-left: 20px;
}
/*/////////// Mega menu ///////////*/
#header #megamenu{
    z-index: 990;
    min-height: 860px;
}
#megamenu{
    position: relative;
    display: none;/*flex;*/
    width: 100%;
    max-width: 1920px;
    height: calc(100vh - 100px);
    flex-direction: row;
    background-color: #f0f0f0;
    box-sizing: border-box;
    will-change: transform;
    transform: translateZ(0);
    backface-visibility: hidden;
    perspective: 1000px;
    -moz-transform: translate(0, -100%);
    -ms-transform: translate(0, -100%);
    -webkit-transform: translate(0, -100%);
    transform: translate(0, -100%);
    -moz-transition: -moz-transform 0s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -o-transition: -o-transform 0s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -webkit-transition: -webkit-transform 0s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    -ms-transition: -webkit-transform 0s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition: transform 0s cubic-bezier(0.25, 0.46, 0.45, 0.94);    
}
.animating#megamenu {
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    -moz-transition-duration: 0s;
    -ms-transition-duration: 0s;
    -webkit-transition-duration: 0s;
    transition-duration: 0s;
}
#megamenu .menu-column{
    position: relative;
    display: flex;
    flex-grow: 1;
    flex-shrink: 0;
    flex-direction: column;
    background-color: #f0f0f0;
}
#megamenu .first-level{
    flex-basis: 75%;
    max-width: calc(1280px * 0.75 + (100vw - 1280px)/2);
}
#megamenu .first-level .row{
    width: 100%;
}
#megamenu .first-level .first-level-link-holder.flex-box{
    border: none;
}
#megamenu .first-level .first-level-menu-header.columns, 
#megamenu .first-level .first-level-menu-holder.columns{
    height: 100%;
    color: #000000;
    background-color: #f0f0f0;
}
#megamenu .first-level .MenuGroup-tab{
    padding-left: calc((100vw - 1280px)/2);
}
#megamenu .first-level .MenuGroup-tab:hover .first-level-menu-header.columns,
#megamenu .first-level .MenuGroup-tab:focus .first-level-menu-header.columns,
#megamenu .first-level .MenuGroup-tab:hover .first-level-menu-holder.columns,
#megamenu .first-level .MenuGroup-tab:focus .first-level-menu-holder.columns{
    color: #ffffff;
    background-color: #000000;
}
#megamenu .first-level .first-level-menu-header.columns > .box-container, 
#megamenu .first-level .first-level-menu-holder.columns > .box-container{
    padding: 10px 40px;
}
#megamenu .first-level .first-level-menu-header.columns > .box-container > h5{
    padding: 3px 0px 3px 0px;
}
#megamenu .second-level{
    flex-basis: 25%; 
    flex-direction: column;
    height: calc(120% / 2);
    max-width: calc(1280px * 0.25 + (100vw - 1280px)/2);
}
#megamenu .menu-column .flex-box{
    border-bottom: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
}
#megamenu .menu-column .flex-box.first-level-child{
    border: none;
    align-self: flex-start;  
}
#megamenu .menu-column > .flex-box{
    height: calc((100vh - 100px)/5);
    overflow-y: hidden;
}
#megamenu .menu-column.second-level > .flex-box{
    border-right: none;
    /*padding-right: calc((100vw - 1280px)/2);*/
}
#megamenu .menu-column.second-level > .flex-box:first-child{
    border-bottom: none;
}
#megamenu .second-level-child .flex-box:last-child{
    border-bottom: none;
}
#megamenu .second-level-child.flex-box{
    flex-basis: 100%; 
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-bottom: none;/*1px solid #cccccc;*/
}
#megamenu .second-level-child.flex-box:last-child{
    border-bottom: none;
}
#megamenu .third-level.menu-column{
    position: relative;
    display: block;
    padding: 10px 20px;
    box-sizing: border-box;
    font-size: 1.5rem;
    background-color: #f0f0f0;
}
#megamenu .third-level .btnMenuLink{
    font-size: 1.5rem;
    padding: 3px 0;
}
#megamenu .third-level .btnMenuLink span.title{
    padding-left: 0px;
}
#megamenu .third-level .btnMenuLink:hover,
#megamenu .third-level .btnMenuLink:focus{
	/* Web Accessibility Enhancement (30/03/2022) - change color from "#00d7be" to "#10737f"*/
	color: #10737f;
    /*color: #00d7be;*/
}
#megamenu .third-level.menu-column > p{
    display: inline-block;
    padding-right: 10%;
}
#megamenu .third-level.menu-column .btnSocial-holder{
    display: block;
    vertical-align: middle;
}
#megamenu #social-menu-holder{
    max-height: none;
    display: block;
}
#megamenu #useful-menu-holder{
    flex: 2;
    max-height: none;
}
#megamenu .nav-tab-btn {
    position: absolute;
    display: none;
    cursor: pointer;
    text-decoration: none;
    width: 36px;
    height: 36px;
    top: 0;
    right: 0;
    padding: 15px;
    padding-left: 50%;
}
#megamenu .nav-tab-btn:before {
    position: absolute;
    top: 15px;
    right: 15px;
    content: "";
    background-image: url(../images/plus.svg);
    background-size: 36px;
    background-repeat: no-repeat;
    background-position: center 100%;
    font-size: inherit;
    line-height: 1;
    display: inline-block;
    width: 36px;
    height: 36px;
    padding: 0px;
    text-align: center;
    z-index: 10;
    box-sizing: content-box;
}
/*/////////// Mega Menu open ////////////*/ 
.site-wrapper.MenuOpen{
    /*height: 100vh;*/
}
.site-wrapper.MenuOpen #header{
    max-width: 1920px;
    position: fixed;
    overflow-y: scroll;
    height: calc(100vh + 10px);
}
.site-wrapper.MenuOpen #megamenu{
    display: flex;
}
/*/////////// flex box ////////////*/
.flex-box{
    position: relative;
    display: flex;
    flex: 1;
    padding: 0;
    flex-wrap: wrap;
    flex-direction: row;
}
.flex-item {
    position: relative;
    flex: 1;    
    min-height: 220px;
    padding: 0px;
    box-sizing: border-box;
    width: 100%;
}
.flex-item .text-container{
    padding: 20px;
}
/*////// banner section //////*/  
#section-banner{
    position: relative;
    line-height: 0;
    max-height: 700px;
    overflow: hidden;    
}
#section-banner .content-container.box-container{
    position: absolute;
    padding: 40px 40px 60px 40px;
    box-sizing: border-box;
    max-width: 980px;
    margin-left: calc((100vw - 1280px)/2);
    margin-top: 7vh;
    top: 0;
}
 #section-banner .left-bottom .content-container.box-container{
margin-left: calc((100vw - 1780px)/2);
    top: 230px;
}
 #section-banner .right-top .content-container.box-container{
    text-align: right;
    margin-left: calc((100vw - 720px)/2);
    
}
 #section-banner .right-bottom .content-container.box-container{
margin-left: calc((100vw - 80px)/2);
    top: 230px;

}
#section-banner .content-container.box-container h1{
    display: inline;
    background-color: #ffffff;
    /* padding: 2px; */
    /* line-height: 74px; */
    font-size: 60px;
    box-shadow: 20px 0 0 #ffffff, -20px 0 0 #ffffff;
    -webkit-box-shadow: 20px 0 0 #ffffff, -20px 0 0 #ffffff;
    -moz-box-shadow: 20px 0 0 #ffffff, -20px 0 0 #ffffff;
	padding: 10px 2px 10px 2px;
    line-height: 80px;
}
#section-banner .content-container.box-container h2{
    display: inline;
    background-color: #ffffff;
    /* padding: 2px; */
    /* line-height: 74px; */
    font-size: 60px;
    box-shadow: 20px 0 0 #ffffff, -20px 0 0 #ffffff;
    -webkit-box-shadow: 20px 0 0 #ffffff, -20px 0 0 #ffffff;
    -moz-box-shadow: 20px 0 0 #ffffff, -20px 0 0 #ffffff;
	padding: 10px 2px 10px 2px;
    line-height: 80px;


}
#section-banner .content-container.box-container.on h1{

    background-color: #000000;
    color: #ffffff;
    box-shadow: 20px 0 0 #000000, -20px 0 0 #000000;
    -webkit-box-shadow: 20px 0 0 #000000, -20px 0 0 #000000;
    -moz-box-shadow: 20px 0 0 #000000, -20px 0 0 #000000;    
}
#section-banner .content-container.box-container.on h2{
    background-color: #000000;
    color: #ffffff;
    box-shadow: 20px 0 0 #000000, -20px 0 0 #000000;
    -webkit-box-shadow: 20px 0 0 #000000, -20px 0 0 #000000;
    -moz-box-shadow: 20px 0 0 #000000, -20px 0 0 #000000;    
}
#section-banner .content-container .more-btn{
    position: relative;
    display: inline-block;
    line-height: 1.2em;
    background-color: #ffffff;
    color: #000000;
    padding: 15px 30px;
    margin: 40px -20px;
	
	/* (21/04/2022) Remove the underline*/
	text-decoration:none;
}
#section-banner .content-container.box-container.on .more-btn{
    background-color: #000000;
    color: #ffffff;
}
#section-banner .content-container .more-btn-text{
    position: relative;
    display: inline-block;
    line-height: 1.2em;
    background-color: #ffffff;
    color: #000000;
    padding: 15px 30px;
    margin: 40px -20px;
}
/*////// quicklink section //////*/  
#section-quicklinks.box-container{
    /*padding-top: 0;*/
}
.ql-box{
    position: relative;
    margin: 40px auto;
    cursor: pointer;
}
.ql-box:first-child{
    margin-top: 20px;
}
.ql-box .flex-item.ql-box-text .text-container{
    padding-right: 10%;
}
.ql-box .flex-item.ql-box-image {
    flex-grow: 1;
    flex-shrink: 0;
    flex-basis: 20%;
    padding: 0;
    background-color: #222222;
    overflow: hidden;
}
.ql-box:nth-child(odd) .ql-box-text.flex-item{
    order: 1;
}    
.ql-box:nth-child(odd) .ql-box-image.flex-item{
    order: 2;
}
.ql-box .flex-item.ql-box-image .image-container{
    display: block;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 100%;
}
.flex-item .image-container img{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position : center center;
	image-rendering:auto;
}
.ql-box:hover .flex-item.ql-box-text{
    background-color: #000000;
    color: #ffffff;
}

/* (21/04/2022) Remove the underline*/
a.ql-box.flex-box:hover{
	text-decoration: none;
}

.ql-box:hover .flex-item.ql-box-image.hover-zoom .image-container, .ql-box:focus .flex-item.ql-box-image.hover-zoom .image-container{
    -ms-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}
@-moz-document url-prefix() {
    .ql-box:hover .flex-item.ql-box-image.hover-zoom .image-container, .ql-box:focus .flex-item.ql-box-image.hover-zoom .image-container{
        -moz-transform: none;
        -webkit-transform: none;
        transform: none;
    }
}

/*///////////// footer /////////////*/
footer#footer{
    position: relative;
    border-top: 1px solid #CBCBCB;
    background-color: #ffffff;
}
footer#footer .content {
    color: #000000;
    font-size: 15px;
}
footer#footer .content a {
    color: #000000;
    font-size: 15px;
    font-weight: bold;
}
#footer a:hover, #footer a:focus {
    text-decoration: underline;
}
footer#footer .box-container{
    padding-left: 0;
}
footer#footer .box-container.contact-info p{
    margin-bottom: 0;
}
footer#footer .HKUMed-logo{
    position: relative;
    display: block;
    text-align: right;
}
footer#footer .HKUMed-logo img{
    width: 100%;
    max-width: 170px;    
}
footer#footer .row{
    width: 100%;
    margin: 0 auto;
}
footer#footer a:hover, footer#footer a:focus{
	/* Web Accessibility Enhancement (30/03/2022) - change color from "#00d7be" to "#10737f"*/
	color: #10737f;
    /*color: #00d7be;*/
    text-decoration: underline;
}
footer#footer .backTop-row{
    border-bottom: 1px solid #CBCBCB;
}
footer#footer .backTop-row .box-container{
    text-align: right;
    padding: 10px 0;
}
#backTop{
    position: relative;
    display: inline-block;
    right: 0;
    text-decoration: none;
    color: #000000;
}
footer#footer #backTop:hover, footer#footer #backTop:focus{
    color: #000000;
}
#backTop span{
    position: relative;
    display: inline-block;
    font-size: 20px;
    vertical-align: bottom;
}
#backTop span:before{
    position: relative;
    content: "";
    background-image: url(../images/arrow_up.svg);
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: center 100%;
    font-size: inherit;
    display: inline-block;
    width: 30px;
    height: 30px;
    padding-right: 10px;
    text-align: center;
    z-index: 580;
    box-sizing: content-box;
    vertical-align: bottom;
}

.column, .columns {
    width: 100%;
    float: left;
    display: inline-block;
    box-sizing: border-box;
}
@media (min-width: 550px) {
    .column:first-child, .columns:first-child {
        margin-left: 0; 
    }

  .col-1.column,
  .col-1.columns                    { width: 8.33333333%; }
  .col-2.columns                    { width: 16.66666667%; }
  .col-3.columns                  { width: 25%;            }
  .col-4.columns                   { width: 33.33333333% }
  .col-5.columns                   { width: 41.66666667%; }
  .col-6.columns                    { width: 50%;            }
  .col-7.columns                  { width: 58.33333333%; }
  .col-8.columns                  { width: 66.66666667%}
  .col-9.columns                   { width: 75%;}
  .col-10.columns                    { width: 83.33333333% }
  .col-11.columns                 { width: 91.66666667%; }
  .col-12.columns                 { width: 100%; margin-left: 0; }

  .col-1-to-3.column               { width: 33.33333333%; }
  .col-2-to-3.column              { width: 66.66666667%; }

  .col-half.column                { width: 50%; }

  /* Offsets */
  .offset-1.column,
  .offset-1.columns          { margin-left: 8.66666666667%; }
  .offset-2.column,
  .offset-2.columns          { margin-left: 17.3333333333%; }
  .offset-3.column,
  .offset-3.columns        { margin-left: 26%;            }
  .offset-4.column,
  .offset-4.columns         { margin-left: 34.6666666667%; }
  .offset-5.column,
  .offset-5.columns         { margin-left: 43.3333333333%; }
  .offset-6.column,
  .offset-6.columns          { margin-left: 52%;            }
  .offset-7.column,
  .offset-7.columns        { margin-left: 60.6666666667%; }
  .offset-8.column,
  .offset-8.columns        { margin-left: 69.3333333333%; }
  .offset-9.column,
  .offset-9.columns         { margin-left: 78.0%;          }
  .offset-10.column,
  .offset-10.columns          { margin-left: 86.6666666667%; }
  .offset-11.column,
  .offset-11.columns       { margin-left: 95.3333333333%; }

  .offset-1-to-3.column,
  .offset-1-to-3.columns    { margin-left: 34.6666666667%; }
  .offset-2-to-3.column,
  .offset-2-to-3.columns   { margin-left: 69.3333333333%; }

  .offset-half.column,
  .offset-half.columns     { margin-left: 52%; }

}
@media (min-width: 768px) {
    .col-md-1.columns { width: 8.33333333%; }
    .col-md-2.columns { width: 16.66666667%; }
    .col-md-3.columns { width: 25%; }
    .col-md-4.columns { width: 33.33333333%; }
    .col-md-5.columns { width: 41.66666667%; }
    .col-md-6.columns { width: 50%; }
    .col-md-7.columns { width: 58.33333333%; }
    .col-md-8.columns { width: 66.66666667%; }
    .col-md-9.columns { width: 75%; }
    .col-md-10.columns { width: 83.33333333%; }
    .col-md-11.columns { width: 91.66666667%; }
    .col-md-12.columns { width: 1000%; }
}
@media (min-width: 992px) {
    .col-lg-1.columns { width: 8.33333333%; }
    .col-lg-2.columns { width: 16.66666667%; }
    .col-lg-3.columns { width: 25%; }
    .col-lg-4.columns { width: 33.33333333%; }
    .col-lg-5.columns { width: 41.66666667%; }
    .col-lg-6.columns { width: 50%; }
    .col-lg-7.columns { width: 58.33333333%; }
    .col-lg-8.columns { width: 66.66666667%; }
    .col-lg-9.columns { width: 75%; }
    .col-lg-10.columns { width: 83.33333333%; }
    .col-lg-11.columns { width: 91.66666667%; }
    .col-lg-12.columns { width: 1000%; }
}
.row {
    display: inline-block;
}

/*/////////// social button ///////////*/
.btnSocial-holder{
    position: relative;
    display: inline-block;
}
.btnSocial{
    position: relative;
    display: inline-block;
    color: #000000;
    width: 24px; 
    margin: 0 10px;
}
.btnSocial:before{
    display: inline-block;
    font-family: FontAwesome;
    font-size: 30px;
    line-height: 1;
    text-align: center;
}
.btnSocial.btn-facebook{
    width: 20px;
    margin-left: 0;
}
.btnSocial.btn-facebook:before{
    content: "\f09a";
    margin-left: 2px;
}
.btnSocial.btn-instagram:before{
    content: "\f16d";
    margin-left: 2px;
}
.btnSocial.btn-linkedIn:before{
    content: "\f0e1";
    margin-left: 2px;
}
.btnSocial.btn-Twitter:before{
    content: "\f099";
    margin-left: 2px;
}

.btnSocial.btn-youtube:before{
    content: "\f16a";
    margin-left: 0px;
}
.btnSocial.btn-envelope:before {
    content: "\f003";
    margin-left: 2px;
}
.btnSocial.btn-twitter:before {
    content: "\f099";
    margin-left: 2px;
}
.btnSocial.btn-wechat:before {
    content: "\f1d7";
    margin-left: 2px;
}

.btnSocial:hover,
.btnSocial:focus{
    /* Web Accessibility Enhancement (30/03/2022) - change color from "#00d7be" to "#10737f"*/
	color: #10737f;
    text-decoration: none;
    /*color: #00d7be;*/
}