
*:focus, *:active {
    outline: none;
    border: 0;
}

::placeholder {
    color: #000;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #000;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #000;
}

.container-fluid a {
    word-wrap: break-word;
}
/*product slider*/

.promotilesContainer {
    text-align: center;
    max-width: 1280px;
    margin: 0 auto;
}

.preriodCal-promotileContainer {
    margin: 50px 0;
}

.preriodCal-promotileContainer {
    border-top: 20px solid transparent;
    border-image: linear-gradient(to right, #ed0678, #ed1b32);
    border-image-slice: 1;
    margin-top: 60px;
    padding-top: 60px;
}

    .preriodCal-promotileContainer h2 {
        font-size: 50px;
        font-family: "Kotex-Bold";
    }

    .preriodCal-promotileContainer h5 {
        font-size: 27px;
        font-family: "Kotex-Light";
        font-weight: normal;
        margin-bottom: 25px;
    }

.productslider .slick-slide, .tipsresponsive .slick-slide {
    outline: none;
}

.preriodCal-promotileContainer .corousel-content {
    padding: 0 10px;
}

    .preriodCal-promotileContainer .corousel-content img, .preriodCal-tipsadviceContainer .corousel-content img {
        width: 100%;
    }

    .preriodCal-promotileContainer .corousel-content p {
        overflow: hidden;
        position: relative;
        max-height: 6em;
        margin-right: -5px;
        padding-right: 5px;
        font-size: 16px;
        font-family: "Kotex-Light";
        min-height: 96px;
    }

        .preriodCal-promotileContainer .corousel-content p:before {
            content: '...';
            position: absolute;
            right: 0;
            bottom: 5px;
            font-family: "Kotex-Bold";
        }

        .preriodCal-promotileContainer .corousel-content p:after {
            content: '';
            position: absolute;
            right: 0;
            width: 1em;
            height: 1em;
            margin-top: 0.2em;
            background: white;
        }

.preriodCal-promotileContainer a {
    font-size: 16px;
    /* border: 3px solid #000; */
    border-radius: 50px;
    text-decoration: none;
    padding: 5px 15px;
    display: inline-block;
    background: #ed0678;
    color: #fff;
}

.productslider button.slick-prev.slick-arrow.slick-disabled {
    opacity: 0.5;
}

.preriodCal-promotileContainer .slick-prev:before, .preriodCal-tipsadviceContainer .slick-prev:before {
    content: "";
}

.preriodCal-promotileContainer .slick-next:before, .preriodCal-tipsadviceContainer .slick-next:before {
    content: "";
}

.sortbyButton .banner-cta-wrapper img {
    height: 42px;
    position: relative;
    bottom: 0;
    margin-left: -30px;
    margin-top: -3px;
}

html:lang(en-ca) .recentView_slider .banner-dataContent h3 {
    min-height: 145px;
}

html:lang(en-ca) .recentView_slider .banner-dataContent h2 {
    min-height: 145px;
}

html:lang(fr-ca) .trending_slider .corousel-content .banner-dataContent h3 {
    min-height: 103px;
}

html:lang(en-ca) .heroBanner_slider .slick-dots, html:lang(fr-ca) .heroBanner_slider .slick-dots {
    bottom: 32.5%;
}

.article_link {
    cursor: pointer;
}

.article_corousel_list .bottomRight_content .shareIcon, .recentView_slider .bottomRight_content .shareIcon {
    display: none;
} 

@media (min-width: 1290px) {
    .sortbyButton .banner-cta-wrapper img {
        height: 41px;
        position: relative;
        bottom: 0;
        margin-left: -30px;
        margin-top: -4px;
    }

    #articleSearchFormSumbit .banner-cta-wrapper img {
        height: 44px;
        position: relative;
        bottom: 0;
        margin-left: -30px;
        margin-top: -4px;
    }
}

@media (min-width: 1025px) {
    .productslider .corousel-content h3 {
        font-size: 20px;
        display: block;
        display: -webkit-box;
        display: -webkit-box;
        display: -moz-box;
        display: -webkit-box;
        display: box;
        display: -ms-flexbox;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        font-family: "Kotex-Bold";
        min-height: 65px;
        padding: 0 10px;
		margin-top: 10px;
		margin-bottom: 10px;
    }
}

@media (max-width: 768px) {
    #div-article-share {
        width: 100% !important;
    }

    .preriodCal-promotileContainer .slick-prev, .preriodCal-tipsadviceContainer .slick-prev {
        left: 0px;
    }

    .preriodCal-promotileContainer .slick-next, .preriodCal-tipsadviceContainer .slick-next {
        right: 0px;
    }

    .layer.hero-banner .row {
        margin-left: 0;
        margin-right: 0;
    }
}

@media (max-width: 767px) {
    .preriodCal-promotileContainer .slick-prev, .preriodCal-tipsadviceContainer .slick-prev {
        width: 0;
        height: 0;
        border-top: 20px solid transparent;
        border-bottom: 20px solid transparent;
        border-right: 20px solid #ea3689;
        z-index: 999;
    }

    .preriodCal-promotileContainer .slick-next, .preriodCal-tipsadviceContainer .slick-next {
        width: 0;
        height: 0;
        border-top: 20px solid transparent;
        border-bottom: 20px solid transparent;
        border-left: 20px solid #ea3689;
        z-index: 999;
    }

    .preriodCal-promotileContainer .slick-prev, .preriodCal-tipsadviceContainer .slick-prev {
        left: 0px;
        top: 30%;
    }

    .preriodCal-promotileContainer .slick-next, .preriodCal-tipsadviceContainer .slick-next {
        right: 0px;
        top: 30%;
    }
}

.youtube-frame {
    height: 350px;
    width: 100%;
    border: none;
    outline: none;
    margin: 15px 0 25px;
}

.coveo-searchBox-column {
    display: none !important;
}

.article-search-form-input {
    display: block;
    padding-right: 0px;
    max-width: 915px;
    margin: 0 auto 45px;
    padding-left: 20px;
    width: 100%;
}

    .article-search-form-input .article_input {
        width: 100%;
        max-width: 795px;
        height: 40px;
        display: inline-block;
        border: 2px solid rgb(230, 230, 230) !important;
        font-family: "Kotex-Light" !important;
        font-style: italic !important;
        font-weight: 400 !important;
        text-align: center;
    }

    .article-search-form-input a {
        border: 3px solid #EE2C74;
        display: inline-block;
        padding: 11px 13px 13px;
        background: #EE2C74;
        color: #fff;
        font-family: "Kotex-Light";
        margin-top: 0px;
        height: 40px;
        font-size: 14px;
        margin-left: -3px;
        line-height: 16px;
    }

/*product slider*/
/*New CSS*/
.banner-dataContent h2, .banner-dataContent h3 {
    font-family: "Kotex-Bold";
    font-size: 19px;
}

.banner-dataContent p {
    font-size: 16px;
    font-family: "Kotex-Light";
}

.banner-dataContent a {
    background: #EE2C74;
    color: #ffffff;
    border-radius: 50px;
    padding: 10px 25px;
    display: inline-block;
}

.artical_landing_page {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

.heroBanner_slider .slick-prev {
    left: 25px;
}

.heroBanner_slider .slick-next {
    right: 25px;
}

.heroBanner_slider .slick-dots li button {
    background: gray;
    border-radius: 50%;
}

    .heroBanner_slider .slick-dots li button:before {
        content: "";
    }

.heroBanner_slider .slick-dots li.slick-active button:before {
    opacity: .75;
    color: #fff;
    background: red;
    border-radius: 50%;
}

.heroBanner_slider .corousel-content {
    position: relative;
    height: 550px;
}

.heroBanner_slider .banner-dataContent {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    background: #292927;
    color: #fff;
    padding: 35px 25px 25px;
    text-align: center;
    position: absolute;
    text-align: center;
    top: 100%;
    left: 50%;
    z-index: 999;
    transform: translate(-50%, -85%);
    min-height: 250px;
}

    .heroBanner_slider .banner-dataContent a {
        margin-bottom: 35px;
    }

    .heroBanner_slider .banner-dataContent h2 {
        font-size: 24px;
        font-family: "Kotex-Bold";
        min-height: 52px;
    }

    .heroBanner_slider .banner-dataContent p {
        font-size: 16px;
        font-family: "Kotex-Light";
        min-height: 45px;
    }

.heroBanner_slider .slick-dots {
    bottom: 32.5%;
}

.artical_help_you_find {
    padding: 25px 45px 50px;
    text-align: center;
}

    .artical_help_you_find h1 {
        font-size: 38px;
        font-family: "Kotex-Bold";
        padding: 0 0 15px;
    }

.article_corousel_list.slick-slide {
    padding: 0 20px;
    overflow: hidden;
}

input.article_input {
    padding: 7px 30px 8px !important;
    border-radius: 30px;
    margin: 10px 0;
    text-align: left;
    display: inline-block;
    width: 100%;
    max-width: 505px;
    color: #000;
    background-color: #fff;
    border: none;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 1px;
    position: relative;
    margin-bottom: 0;
    border: 2px solid #000;
    outline: none;
}

.banner-cta-wrapper img {
    height: 45px;
    position: relative;
    bottom: 0;
    margin-left: -30px;
    margin-top: -5px;
}

.trending_slider .slick-prev, .trending_slider .slick-next {
    z-index: 999;
    background: none;
    height: 35px;
}

    .trending_slider .slick-next:before, .trending_slider .slick-prev:before {
        content: "";
    }

.trending_slider .slick-prev {
    left: -50px;
    background-image: url(/-/media/ubykotex/homepage/carousel/arrow-prev.png) !important;
    background-size: 100% 100% !important;
}

.trending_slider .slick-next {
    background-image: url(/-/media/ubykotex/homepage/carousel/arrow-next.png) !important;
    right: -50px;
    background-size: 100% 100% !important;
}

.trending_slider .corousel-content {
    -webkit-box-shadow: 0 0 10px #fff;
    box-shadow: 0 0 3px #000;
    text-align: center;
    margin-bottom: 15px;
}

    .trending_slider .corousel-content .banner-dataContent {
        padding: 15px;
        background: #fff;
        clear: both;
        min-height: 275px;
    }

        .trending_slider .corousel-content .banner-dataContent h3 {
            min-height: 83px;
        }

        .trending_slider .corousel-content .banner-dataContent p {
            min-height: 130px;
        }

.browse_category_slider .corousel-content .banner-dataContent p {
    min-height: 90px;
}

.browse_category_slider .corousel-content .banner-dataContent h3 {
    min-height: 30px;
}

.browse_category_slider .corousel-content img {
    padding: 25px;
}

.article_trending_pages > .row {
    padding: 45px 200px;
    background: #d3d3d3;
}

.category_trending_pages > .row {
    padding: 45px 200px;
    background: #fff;
}

.category_trending_pages h2 {
    color: #000;
}

.corousel-content img {
    width: 100%;
}

.checkout_banner > img {
    width: 100%;
    height: 220px;
}

.trending_slider .checkout_banner > img {
    width: 100%;
    height: 100%;
    max-height: 250px;
}

.checkout_banner {
    position: relative;
}

.topleft_content {
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    padding: 5px 10px;
    color: #EE2C74;
    font-weight: bold;
    font-family: "Kotex-Bold";
    font-size: 16px;
}

.bottomRight_content {
    position: absolute;
    right: 0;
    bottom: 0px;
    background: #292927;
    padding: 5px;
}

    .bottomRight_content img {
        display: inline-block;
        width: auto;
    }

.slick-initialized .slick-slide {
    outline: none;
}

.heroBanner_slider .slick-next {
    background-image: url(/-/media/ubykotex/homepage/carousel/arrow-next.png) !important;
    right: 30px;
    background-size: 100% 100% !important;
    top: 35%;
}

.heroBanner_slider .slick-prev {
    left: 30px;
    background-image: url(/-/media/ubykotex/homepage/carousel/arrow-prev.png) !important;
    background-size: 100% 100% !important;
    top: 35%;
}

.heroBanner_slider .slick-prev, .heroBanner_slider .slick-next {
    width: 20px;
    height: 35px;
    margin: 0;
    transform: translate(0%,-50%);
    -webkit-transform: translate(0%,-50%);
    -moz-transform: translate(0%,-50%);
    -ms-transform: translate(0%,-50%);
    -o-transform: translate(0%,-50%);
    z-index: 99;
    background-size: 100% 100%;
}

    .heroBanner_slider .slick-prev:before {
        content: "";
    }

    .heroBanner_slider .slick-next:before {
        content: "";
    }

.article_browse_category {
    text-align: center;
    padding: 45px 0;
}

.browse_category_slider .corousel-content {
    -webkit-box-shadow: 0 0 10px #fff;
    box-shadow: 0 0 10px #d3d3d3;
    text-align: center;
    margin-bottom: 15px;
    padding: 25px;
}

/*.browse_category_slider .corousel-content .banner-dataContent{
    padding:15px;
}*/
.browse_category_slider div {
    outline: none;
}

.browse_category_slider .slick-next {
    background-image: url(/-/media/ubykotex/homepage/carousel/arrow-next.png) !important;
    right: 0px;
    background-size: 100% 100% !important;
    top: 35%;
}

.browse_category_slider .slick-prev {
    left: 0px;
    background-image: url(/-/media/ubykotex/homepage/carousel/arrow-prev.png) !important;
    background-size: 100% 100% !important;
    top: 35%;
}

    .browse_category_slider .slick-prev:before {
        content: "";
    }

.browse_category_slider .slick-next:before {
    content: "";
}

.browse_category_slider .slick-prev, .browse_category_slider .slick-next {
    z-index: 999;
    background: none;
    height: 35px;
}

.article_recently_viewed .slick-next {
    background-image: url(/-/media/ubykotex/homepage/carousel/arrow-next.png) !important;
    right: 0px;
    background-size: 100% 100% !important;
    top: 35%;
}

.article_recently_viewed .slick-prev {
    left: 0px;
    background-image: url(/-/media/ubykotex/homepage/carousel/arrow-prev.png) !important;
    background-size: 100% 100% !important;
    top: 35%;
}

    .article_recently_viewed .slick-prev:before {
        content: "";
    }

.article_recently_viewed .slick-next:before {
    content: "";
}

.article_recently_viewed .slick-prev, .article_recently_viewed .slick-next {
    z-index: 999;
    background: none;
    height: 35px;
}

.articles_header {
    margin-bottom: 45px;
}

    .articles_header h2 {
        font-size: 44px;
        font-family: "Kotex-Bold";
    }

.article_browse_category > .row {
    border-bottom: 20px solid transparent;
    border-image: linear-gradient(to right, #ed0678, #ed1b32);
    border-image-slice: 1;
}

.articles_header p {
    font-size: 38px;
    font-family: "Kotex-Light";
}

.category_description {
    padding: 25px 0;
    font-size: 14px;
    font-style: italic;
    text-align: center;
    font-family: "Kotex-Light";
}

.recentView_slider .corousel-content {
    -webkit-box-shadow: 0 0 10px #fff;
    box-shadow: 0 0 10px #d3d3d3;
    text-align: center;
    margin-bottom: 15px;
}

.recentView_slider .slick-slide {
    padding: 15px;
}

.recentView_slider .category-list {
    outline: none;
}

.recentView_slider .banner-dataContent h3, .recentView_slider .banner-dataContent h2 {
    min-height: 85px;
}

.recentView_slider .banner-dataContent p {
    min-height: 120px;
}

.recentView_slider .corousel-content .banner-dataContent {
    padding: 15px;
}

.article_recently_viewed, .article_trending_pages {
    text-align: center;
}

.article_recently_viewed {
    margin-bottom: 45px;
}

/*two column promotile component*/
section.layer.row.hero-banner.grey-back {
    background-color: #716d6a;
    margin-bottom: 15px;
}

section.layer.row.hero-banner {
    background-size: auto;
    background-repeat: no-repeat;
    background-position-x: right;
    overflow: hidden;
}

section.hero-banner .content-container {
    display: flex;
    align-items: center;
}

    section.hero-banner .content-container .columns {
        padding: 0;
    }

section.hero-banner .banner-text-wrapper {
    padding: 30px;
    max-width: 430px;
    margin-left: 60px;
}

section.layer.row.hero-banner.white-text h1, section.layer.row.hero-banner.white-text p, section.layer.row.hero-banner.white-text h2 {
    color: #ffffff;
}

section.hero-banner h1.banner-title {
    font-size: 34px;
    margin-bottom: 20px;
    font-weight: 600;
}
section.hero-banner h2.banner-title {
    font-size: 34px;
    margin-bottom: 20px;
    font-weight: 600;
}

section.layer.row.hero-banner.white-text h1, section.layer.row.hero-banner.white-text p, section.layer.row.hero-banner.white-text h2 {
    color: #ffffff;
}

section.hero-banner p.banner-text {
    font-size: 20px;
}

.banner-cta-wrapper a.banner-cta {
    padding: 10px 30px !important;
    border-radius: 30px;
    margin: 30px 0;
    text-align: center;
    display: block;
    max-width: 250px;
    min-width: 200px;
    color: #fff;
    background-color: #000;
    border: none;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 1px;
    position: relative;
    margin-bottom: 0;
}

.banner-image-wrapper img {
    width: 100%;
}
/*two column promotile component*/

.realAnswerDetail-page {
    font-family: "Kotex-Light";
    font-size: 18px;
}

.article_social_links {
    margin-top: 35px;
}

    .article_social_links .likeButton {
        font-family: "Kotex-Bold";
        font-size: 18px;
    }

table#bottom-article-share tr td img {
    height: 30px;
    width: 30px;
}

.article_related_title_page .header-for-realAnswerPage {
    font-size: 36px;
    font-family: "Kotex-Bold";
    margin-bottom: 45px;
}

.article_related_title_page .row {
    margin-left: 0;
    margin-right: 0;
}

.article_tile_container {
    margin-top: 45px;
    padding: 0 25px;
}

    .article_tile_container .col-md-4 h2 {
        font-family: "Kotex-Bold";
        margin-bottom: 15px;
        margin-top: -5px;
        padding: 0 15px;
    }

    .article_tile_container a {
        text-decoration: none;
        color: #fff;
    }

.right_related_article a {
    text-decoration: none;
    color: #fff !important;
}

.article_page_content h1 {
    font-family: "Kotex-Bold";
    margin-top: 10px;
    margin-bottom: 15px;	
    font-size: 30px !important;
}

.articleDetail_LargeHeadings {
    font-family: "Kotex-Bold";
    margin-top: 10px;
    margin-bottom: 15px;	
    font-size: 30px !important;
}
.article_page_content p {
    font-family: "Kotex-Light";
    font-size: 16px;
}
.article_page_content li h2 {
    margin-bottom: 0px !important;
}
.article_page_content h2 {
    font-family: "Kotex-Light";
    font-size: 16px;
    margin-bottom: 13px;
    margin-top: 10px;
}
.article_page_content h3 {	
    margin-bottom: 10px;
}
.related_article .banner-dataContent h3 {
    margin-top: 10px;
    margin-bottom: 10px;
}

.article_page_content a {
    color: #EE2C74;
    text-decoration: underline;
}
.articleDetail_Content {	
    text-decoration: underline;
    font-weight: bold;
	font-size: 16px;
}
.articleDetail_SubHeadings {
    font-weight: bold;
	font-size: 14px;
}
.articleDetail_Headings {
    font-weight: bold;
	font-size: 16px;
}
.details-author {
    font-size: 16px;
}

    .details-author + p {
        font-size: 16px;
        font-size: 14px;
        padding-bottom: 25px;
        font-weight: bold;
        font-style: italic;
    }

.article_page_content > p {
    font-size: 16px;
    font-size: 14px;
    padding-bottom: 25px;
    font-weight: bold;
    font-style: italic;
}

.details-author a {
    display: block;
    color: #000;
    font-size: 14px;
    text-decoration: none;
}

.realAnswerDetail-answer.row {
    margin-bottom: 25px;
    border-bottom: 1px dotted;
    padding-bottom: 25px;
    font-size: 16px;
}

.header-for-realAnswerPage p {
    font-size: 14px;
    font-family: "Kotex-Bold";
    margin-bottom: 35px;
}


.article_social_links .interest_socail_media .social-icon-list li {
    padding: 0 12px;
}

.interest_socail_media ul {
    margin-left: -10px !important;
}

.interest_socail_media .footer-social-icon {
    height: 30px;
    display: block;
    width: 30px;
}

.interest_socail_media .instagram-footer {
    background: url(/-/media/UbyKotex/PeriodCalculator/SocialIcons/InstagramLogo.png) 0/contain no-repeat;
}

.interest_socail_media .youtube-footer {
    background: url(/-/media/UbyKotex/PeriodCalculator/SocialIcons/YoutubeLogo.png) 0/contain no-repeat;
}

.interest_socail_media .pinterest-footer {
    background: url(/-/media/UbyKotex/PeriodCalculator/SocialIcons/PinterestLogo.png) 0/contain no-repeat;
}

.interest_socail_media .fb-footer {
    background: url(/-/media/UbyKotex/PeriodCalculator/SocialIcons/FaceBookLogo.png) 0/contain no-repeat;
}

.article_banner_container img, .related_article img {
    width: 100%;
}

.related_article {
    -webkit-box-shadow: 0 0 10px #fff;
    box-shadow: 0 0 10px #d3d3d3;
    text-align: center;
    margin-bottom: 15px;
}

    .related_article .banner-dataContent {
        padding: 15px;
    }

.interest_socail_media {
    display: inline-block;
    padding-right: 45px;
    vertical-align: top;
    margin-bottom: 0;
}

.article_trending_pages .articles_header h2 {
    color: #fff;
}

div.gig-button-container {
    margin-bottom: 0 !important;
}

.sortbyButton {
    width: 200px;
    position: relative;
    margin-bottom: 35px;
}

    .sortbyButton input.article_input {
        max-width: 135px;
        margin-top: 0;
        pointer-events: none;
        font-size: 16px;
    }

    .sortbyButton .menuList {
        position: absolute;
        left: 155px;
        top: 1px;
        z-index: 999;
    }

        .sortbyButton .menuList li {
            list-style-type: none;
            border: 1px solid #000;
            min-width: 130px;
        }

            .sortbyButton .menuList li button {
                width: 100%;
                border-radius: 0;
                border: none;
                background: #fff;
                margin: 0;
                padding: 0;
                font-family: "Kotex-Bold";
                font-size: 16px;
            }

                .sortbyButton .menuList li button:hover {
                    background: #ed0678;
                    border-image: linear-gradient(to right, #ed0678, #ed1b32);
                    border-image-slice: 1;
                    color: #fff;
                }

.hidesort {
    display: none;
}

.sortbyButton .menuList li button.sort_active {
    background: #ed0678;
    border-image: linear-gradient(to right, #ed0678, #ed1b32);
    border-image-slice: 1;
    color: #fff;
}

.article_corousel_list .bottomRight_content div, .recentView_slider .bottomRight_content div {
    display: inline-block;
    margin-bottom: 0;
    vertical-align: bottom;
}

    .article_corousel_list .bottomRight_content div img {
        display: inline-block;
        outline: none;
    }

.bottomRight_content img {
}

.slick-disabled {
    opacity: 0.4;
}

.realAnswerDetail-answerAuthorDetails {
    text-align: center;
    padding-top: 4px;
}

.realAnswerDetail-answerAuthorImage {
    width: 70px;
}

.img-circle {
    border-radius: 50%;
}

.realAnswerDetail-answerAuthorType {
    padding-top: 10px;
    /* font-family: Gotham-BlackItalic; */
    font-family: "Kotex-Bold";
    font-style: italic;
    /* font-weight: 800; */
    font-size: 12px;
}

.realAnswerDetail-answerAuthorNameLink {
    /* font-family: Basel-BoldItalic; */
    font-family: "Kotex-Light";
    font-style: italic;
    /* font-weight: 400; */
    font-size: 14px;
    color: #EE2C74;
}

.likeIcon a {
    text-decoration: none;
}

.article-like {
    width: 35px;
    height: 43px;
    position: relative;
    top: 2px;
}

.article-like {
    background-image: url(/~/media/UbyKotex/PeriodInfoAndAdvice/SocialIcons/Like.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.visited {
    background-image: url(/~/media/UbyKotex/PeriodInfoAndAdvice/SocialIcons/Like_active.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.altimage {
    display: none !important;
}

.article-like > img {
    width: 100%;
}

.likeIcon .details-likesCount {
    display: none !important;
}

.interest_socail_media img {
    width: 30px;
    height: 30px;
}

.likeIcon a {
    text-decoration: none;
}

.article-details-like {
    width: 30px;
    height: 30px;
    position: relative;
    top: 2px;
}

.article-details-like {
    background-image: url(/-/media/UbyKotex/PeriodInfoAndAdvice/SocialIcons/LikeBlack.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

    .article-details-like.visited {
        background-image: url(/-/media/UbyKotex/PeriodInfoAndAdvice/SocialIcons/LikeBlack_Active.png);
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

.altimage {
    display: none !important;
}

.article-details-like > img {
    width: 100%;
}

.details-likesCount {
    display: none !important;
}

.recentView_slider .checkout_banner img {
    max-height: 220px;
}

.video-layout-right .youtube-frame {
    height: 250px;
    width: 49%;
    border: none;
    outline: none;
    display: inline-block;
    float: right;
    margin-left: 25px;
}

.video-layout-left .youtube-frame {
    height: 250px;
    width: 49%;
    border: none;
    outline: none;
    display: inline-block;
    float: left;
    margin-right: 25px;
}

.video-layout-right .col-md-12 {
    padding: 0 0;
}

.video-layout-left .col-md-12 {
    padding: 0 0;
}


@media only screen and (max-width:768px) {
    .video-layout-left .youtube-frame {
        width: 100%;
    }

    .article-search-form-input {
        padding: 0 15px;
    }

        .article-search-form-input a {
            width: 100%;
            max-width: 80px;
            margin: 15px auto 0;
            display: block;
        }

    .article_recently_viewed .slick-next {
        background-image: url(/-/media/ubykotex/homepage/carousel/arrow-next.png) !important;
        right: -13px;
        background-size: 100% 100% !important;
        top: 35%;
    }

    .article_recently_viewed .slick-prev {
        left: -13px;
        background-image: url(/-/media/ubykotex/homepage/carousel/arrow-prev.png) !important;
        background-size: 100% 100% !important;
        top: 35%;
    }

    .interest_socail_media {
        display: inline-block;
        padding-right: 45px;
        vertical-align: top;
        margin-bottom: 25px;
    }

    .sortbyButton {
        margin-top: 45px;
    }

        .sortbyButton .banner-cta-wrapper img {
            height: 42px;
            position: relative;
            bottom: 0;
            margin-left: -30px;
            margin-top: -3px;
        }

    .browse_category_slider .slick-next {
        right: -20px;
    }

    .browse_category_slider .slick-prev {
        left: -20px;
    }

    .banner-cta-wrapper a.banner-cta {
        left: 18%;
        top: 0;
    }

    section.hero-banner .banner-text-wrapper {
        padding: 30px;
        max-width: 430px;
        margin-left: 0;
    }

    .articles_header h2 {
        font-size: 32px;
        font-family: "Kotex-Bold";
    }

    .articles_header p {
        font-size: 24px;
        font-family: "Kotex-Light";
        line-height: 29px;
        margin-top: 15px;
    }

    .artical_help_you_find input.article_input {
        max-width: 270px;
        font-size: 14px;
        padding-left: 15px !important;
    }

    .artical_help_you_find .banner-cta-wrapper img {
        height: 43px;
        position: relative;
        bottom: 0;
        margin-left: -30px;
        margin-top: -2px;
    }

    .artical_help_you_find {
        padding: 0px 15px 50px;
        text-align: center;
    }

        .artical_help_you_find h1 {
            font-size: 27px;
            font-family: "Kotex-Bold";
            padding: 0 15px 15px;
        }

    .article_corousel_list.slick-slide {
        padding: 0 10px;
    }

    .heroBanner_slider .slick-dots {
        bottom: 64%;
    }

    html:lang(en-ca) .heroBanner_slider .slick-dots, html:lang(fr-ca) .heroBanner_slider .slick-dots {
        bottom: 62%;
    }

    .heroBanner_slider .corousel-content {
        height: auto;
    }

    .article_trending_pages > .row {
        padding: 25px 45px;
        background: #d3d3d3;
    }

    .category_trending_pages > .row {
        padding: 25px 45px;
        background: #ffffff;
    }

    .heroBanner_slider .banner-dataContent {
        position: static;
        transform: none
    }

    .heroBanner_slider {
        margin-top: -21px;
    }

        .heroBanner_slider .slick-next {
            background-image: url(/-/media/ubykotex/homepage/carousel/arrow-next.png) !important;
            right: 15px;
            background-size: 100% 100% !important;
            top: 13.5%;
        }

        .heroBanner_slider .slick-prev {
            left: 15px;
            background-image: url(/-/media/ubykotex/homepage/carousel/arrow-prev.png) !important;
            background-size: 100% 100% !important;
            top: 13.5%;
        }

    .banner-dataContent h2, .banner-dataContent h3 {
        font-family: "Kotex-Bold";
        font-size: 16px;
    }

    .banner-dataContent p {
        font-size: 14px;
        font-family: "Kotex-Light";
    }

    .trending_slider .slick-next {
        background-image: url(/-/media/ubykotex/homepage/carousel/arrow-next.png) !important;
        right: -35px;
        background-size: 100% 100% !important;
    }

    .trending_slider .slick-prev {
        left: -35px;
        background-image: url(/-/media/ubykotex/homepage/carousel/arrow-prev.png) !important;
        background-size: 100% 100% !important;
    }

    .article_browse_category {
        text-align: center;
        padding: 45px 15px;
    }

    .browse_category_slider .corousel-content img {
        padding: 10px;
    }
}


.slick-list {
    padding-top: 5px !important;
}

.bannerslider .slick-list {
    padding-top: 0 !important;
}

#div-article-share td {
    display: inline-block;
    padding-right: 0px;
}

@media only screen and (max-device-width: 1024px) and (min-device-width: 768px) and (orientation: portrait) {
    .preriodCal-promotileContainer {
        overflow: hidden;
    }

    .related_article img {
        width: 100%;
        max-height: 220px;
        height: 220px;
    }

    .related_article {
        -webkit-box-shadow: 0 0 10px #fff;
        box-shadow: 0 0 10px #d3d3d3;
        text-align: center;
        margin-bottom: 15px;
        width: 100%;
        float: left;
        margin: 0;
    }

        .related_article .banner-dataContent h2 {
            font-family: "Kotex-Bold";
            font-size: 16px;
            min-height: 95px;
        }

        .related_article .banner-dataContent p {
            font-size: 14px;
            font-family: "Kotex-Light";
            min-height: 175px;
        }

    .article_related_title_page .article_tile_container {
        padding: 0;
    }

    .heroBanner_slider {
        margin-top: -60px;
    }

    .bannerslider .slick-list {
        padding-top: 5px !important;
    }

    .trending_slider .corousel-content .banner-dataContent h3 {
        min-height: 85px;
    }

    .heroBanner_slider {
        margin-top: -65px;
    }

    section.hero-banner h1.banner-title {
        font-size: 29px;
    }

section.hero-banner h2.banner-title {
        font-size: 29px;
    }
    section.hero-banner p.banner-text {
        font-size: 18px;
    }

    .banner-cta-wrapper a.banner-cta {
        left: 0;
        top: 0;
    }

    .heroBanner_slider .slick-dots {
        bottom: 43%;
    }

    html:lang(en-ca) .heroBanner_slider .slick-dots, html:lang(fr-ca) .heroBanner_slider .slick-dots {
        bottom: 43%;
    }

    .heroBanner_slider .slick-next {
        background-image: url(/-/media/ubykotex/homepage/carousel/arrow-next.png) !important;
        right: 15px;
        background-size: 100% 100% !important;
        top: 25%;
    }

    .heroBanner_slider .slick-prev {
        left: 15px;
        background-image: url(/-/media/ubykotex/homepage/carousel/arrow-prev.png) !important;
        background-size: 100% 100% !important;
        top: 25%;
    }

    .promotilesContainer {
        padding-bottom: 35px;
    }
}

@media only screen and (max-device-width: 1024px) and (min-device-width: 768px) and (orientation: landscape) {

    .heroBanner_slider .slick-next {
        background-image: url(/-/media/ubykotex/homepage/carousel/arrow-next.png) !important;
        right: 30px;
        background-size: 100% 100% !important;
        top: 30%;
    }

    .heroBanner_slider .slick-prev {
        left: 30px;
        background-image: url(/-/media/ubykotex/homepage/carousel/arrow-prev.png) !important;
        background-size: 100% 100% !important;
        top: 30%;
    }

    .artical_landing_page .heroBanner_slider {
        margin-top: -60px;
    }

    .heroBanner_slider .banner-dataContent {
        top: 89%;
    }

    .heroBanner_slider .slick-dots {
        bottom: 42.5%;
    }

    html:lang(en-ca) .heroBanner_slider .slick-dots, html:lang(fr-ca) .heroBanner_slider .slick-dots {
        bottom: 42.5%;
    }

    .article_trending_pages > .row {
        padding: 45px 100px;
        background: #d3d3d3;
    }
}

@media only screen and (max-width:767px) {
    .container-fluid {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    section.hero-banner p.banner-text {
        font-size: 18px;
    }

    section.hero-banner h1.banner-title {
        font-size: 26px;
        margin-bottom: 20px;
        font-weight: 600;
        line-height: 1.2;
    }
	
	section.hero-banner h2.banner-title {
        font-size: 26px;
        margin-bottom: 20px;
        font-weight: 600;
        line-height: 1.2;
    }

    section.layer.row.hero-banner {
        display: block;
        position: relative;
        width: 100%;
        background-size: 100%;
    }

    section.layer.row.hero-banner {
        background-size: 50%;
        background-repeat: no-repeat;
        background-position: center right;
    }

    section.hero-banner .content-container {
        flex-direction: column-reverse;
    }

    section.hero-banner .columns {
        width: 100%;
        position: relative;
        text-align: center;
        padding: 20px;
    }

    .layer.row.hero-banner {
        margin-left: 0;
        margin-right: 0;
    }

    .article_corousel_list.slick-slide {
        padding: 0 5px;
    }

    .browse_category_slider .corousel-content img {
        padding: 15px;
    }

    .browse_category_slider .slick-next {
        right: -20px;
        top: 50%;
    }

    .browse_category_slider .slick-prev {
        left: -20px;
        top: 50%;
    }

    .article_browse_category {
        text-align: center;
        padding: 45px 30px;
    }

    .article_trending_pages > .row {
        padding: 25px 40px;
    }

    .article_recently_viewed, .article_trending_pages {
        text-align: center;
        padding: 0 15px;
    }

    .related_article_mobile_slider {
        padding: 0 !important;
    }

    .article_tile_container {
        padding: 0 15px;
    }

    .heroBanner_slider {
        margin-top: -21px;
        padding: 0 15px;
    }

    .trending_slider .slick-next {
        background-image: url(/-/media/ubykotex/homepage/carousel/arrow-next.png) !important;
        right: -30px;
        background-size: 100% 100% !important;
    }

    .trending_slider .slick-prev {
        left: -30px;
        background-image: url(/-/media/ubykotex/homepage/carousel/arrow-prev.png) !important;
        background-size: 100% 100% !important;
    }

    .youtube-frame {
        height: 300px;
    }
}
.article_page_content .transcript-text {    
    font-size: 12px;
}
<link href="/sitecore/shell/themes/standard/default/Default.css" rel="stylesheet" />

<link href="/sitecore/shell/controls/Lib/Flexie/flex.css" rel="stylesheet" />

<link href="/sitecore/shell/themes/standard/default/Default.css" rel="stylesheet" />

<link href="/sitecore/shell/controls/Lib/Flexie/flex.css" rel="stylesheet" />

<link href="/sitecore/shell/themes/standard/default/Default.css" rel="stylesheet" />

<link href="/sitecore/shell/controls/Lib/Flexie/flex.css" rel="stylesheet" />

<link href="/sitecore/shell/themes/standard/default/Default.css" rel="stylesheet" />

<link href="/sitecore/shell/controls/Lib/Flexie/flex.css" rel="stylesheet" />

