@charset "utf-8";

 html {
     scroll-behavior: smooth
 }

 .normal_para {
     font: 16px "Roboto", "Helvetica", "Arial", sans-serif;
     color: #000;
     text-align: justify;
     line-height: 30px
 }

 .jump_menus {
     display: grid;
     justify-content: center;
     align-items: stretch;
     gap: 5px;
     grid-template-columns: repeat(auto-fit, minmax(320px, 1fr))
 }

 .jump_menus li {
     display: flex;
     justify-content: stretch;
     align-items: center
 }

 .jump_menus li a {
     display: flex !important;
     justify-content: center;
     align-items: center;
     width: 100%;
     margin: 0 !important
 }

 .extra_nav {
     display: grid;
     justify-content: center;
     align-items: center;
     gap: 10px;
     grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
     list-style: none;
     background: #eee;
     padding: 10px;
     margin: 0
 }

 .extra_nav li {
     background: #fff;
     transition: all .5s ease;
     display: flex;
     justify-content: center;
     align-items: center;
     padding: 10px
 }

 .extra_nav li a {
     width: 100%;
     text-align: center
 }

 .extra_nav li:hover {
     background: #000
 }

 .extra_nav li:hover a {
     color: #fff
 }

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

 article img {
     display: block;
     margin: 0 auto
 }

 ul.frctl {
     font: 16px "Roboto", "Helvetica", "Arial", sans-serif;
     color: #000;
     margin-left: 13px
 }

 .about_navigation {
     list-style: none
 }

 .footnew-two {
     justify-content: start
 }

 ul.frctl li {
     list-style-type: square;
     text-align: justify;
     line-height: 30px;
     margin-bottom: 10px;
     color: #000
 }

 ul.frctl li a {
     color: #000;
     font-style: normal;
     font: 16px "Roboto", "Helvetica", "Arial", sans-serif
 }

 .filt_head,
 .image_head,
 .ngrid,
 .ngrid figcaption a,
 .ngrid li,
 .ngrid li a,
 .references-title,
 .trigger {
     text-align: center
 }

 .ngrid,
 .references-list ul {
     list-style: none
 }

 .breadcrumb_1 span {
     font-size: 14px;
     color: #000;
     text-transform: capitalize;

 }

 .filt_head,
 .flex-align-center-title dd,
 .image_head,
 .references-title {
     text-transform: uppercase
 }

 .ngrid figure {
     margin: 0;
     position: relative
 }

 .ngrid figure img {
     display: block;
     position: relative;
     margin: 0 auto
 }

 .ngrid figcaption {
     position: absolute;
     top: 0;
     left: 0;
     padding: 20px;
     background: #000;
     font: 13px "Roboto", "Helvetica", "Arial", sans-serif !important;
     color: #fff
 }

 .ngrid figcaption a {
     padding: 5px 10px;
     border-radius: 2px;
     display: inline-block;
     background: #fff;
     color: #000
 }

 .cs-style-7 li:first-child,
 .cs-style-7 li:nth-child(2),
 .cs-style-7 li:nth-child(3),
 .cs-style-7 li:nth-child(4),
 .cs-style-7 li:nth-child(5),
 .cs-style-7 li:nth-child(6),
 .cs-style-7 li:nth-child(7),
 .cs-style-7 li:nth-child(8),
 .cs-style-7 li:nth-child(9),
 .cs-style-7 figure img {
     z-index: 2
 }

 .cs-style-7 figcaption {
     height: 100%;
     width: 100%;
     opacity: 0;
     -webkit-backface-visibility: hidden;
     -moz-backface-visibility: hidden;
     backface-visibility: hidden;
     -webkit-transition: opacity .3s, height .3s, box-shadow .3s;
     -moz-transition: opacity .3s, height .3s, box-shadow .3s;
     transition: opacity .3s, height .3s, box-shadow .3s;
     box-shadow: 0 0 #000
 }

 .cs-style-7 figure.cs-hover figcaption,
 .no-touch .cs-style-7 figure:hover figcaption {
     opacity: 1;
     height: 130%;
     border: thin solid #000;
     outline: #fff solid 5px;
     box-shadow: 0 0 0 10px #000
 }

 .cs-style-7 figcaption h3 {
     margin-top: 90%;
     font: 20px "Roboto", "Helvetica", "Arial", sans-serif !important;
     color: #fff
 }

 .cs-style-7 figcaption a,
 .cs-style-7 figcaption h3,
 .cs-style-7 figcaption span {
     opacity: 0;
     -webkit-transition: opacity 0s;
     -moz-transition: opacity 0s;
     transition: opacity 0s
 }

 .cs-style-7 figcaption a {
     position: absolute;
     bottom: 100px;
     z-index: 30;
     right: 20px
 }

 .plus,
 .prev_inno .slick-next {
     right: 0
 }

 .cs-style-7 figure.cs-hover figcaption a,
 .cs-style-7 figure.cs-hover figcaption h3,
 .cs-style-7 figure.cs-hover figcaption span,
 .no-touch .cs-style-7 figure:hover figcaption a,
 .no-touch .cs-style-7 figure:hover figcaption h3,
 .no-touch .cs-style-7 figure:hover figcaption span {
     -webkit-transition: opacity .3s .2s;
     -moz-transition: opacity .3s .2s;
     transition: opacity .3s .2s;
     opacity: 1
 }

 .filt_head {
     display: block;
     margin: .5em 0;
     font: 1em "Roboto", "Helvetica", "Arial", sans-serif;
     color: #000
 }

 .ngrid li,
 .trigger {
     min-height: 15.5em
 }

 .ngrid li {
     background: #f3f5f6;
     margin: 0;
     transition: all .5s ease;
     border-right: 1px solid #fff;
     border-bottom: 1px solid #fff;
     padding: 0
 }

 .ngrid li:hover {
     background: #010949;
     color: #fff;
     text-decoration: underline
 }

 .ngrid {
     margin: 1em .9em
 }

 .ngrid li a,
 .trigger svg {
     display: block;
     margin: 0 auto
 }

 .ngrid li a {
     color: #555;
     font-size: 17px;
     padding: 2em
 }

 .ngrid li:hover a {
     color: #fff
 }

 .ngrid li:hover .trigger svg {
     fill: #fff
 }

 .trigger svg {
     width: 100px;
     height: 100px;
     fill: #555
 }

 .trigger {
     display: -webkit-flexbox;
     display: -ms-flexbox;
     display: -webkit-flex;
     display: flex;
     -webkit-flex-align: center;
     -ms-flex-align: center;
     -webkit-align-items: center;
     align-items: center;
     width: 100%
 }

 .image_head {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 20px;
     background: #fff;
     color: #000;
     padding: 5px;
     border: 1px solid #000;
     border-bottom: 5px solid #000;
     margin-bottom: 0
 }

 .image_head+a>img {
     border-bottom: 5px solid #000
 }

 .image_head a {
     color: #000
 }

 input.quicksearch {
     margin: 0
 }

 .breadcrumb_1.anim_bread span {
     color: #fff
 }

 .article_pagi .pagination li a,
 .bk_bg_hd,
 .idea_pro_name {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .inno_post .bott_post,
 .inno_post .bott_post h3,
 .ita_con h2,
 .sm_head,
 .strike_th h1 {
     text-transform: uppercase
 }

 .article_pagi .sm_head,
 p.credits {
     text-align: center
 }

 p.credits {
     margin-top: 100px
 }

 .credits img {
     border-radius: 50%;
     width: 100px
 }

 .article_pagi {
     display: block;
     margin-top: 2em
 }

 .pagination-wrap {
     display: flex;
     justify-content: center;
     align-items: center;
     width: 100%;
     gap: .5em;
     max-width: 1440px;
     flex-flow: row nowrap
 }

 .pagination-wrap>.article_pagi:nth-child(2n+1) {
     flex: 0 1 auto
 }

 .pagination-wrap>.article_pagi:nth-child(2n) {
     flex: 0 1 196px
 }

 .article_pagi .pagination {
     display: flex;
     justify-content: center;
     align-items: center;
     margin: 0 auto;
     list-style: none;
     max-width: 320px;
     gap: .5em
 }

 .article_pagi .pagination li {
     flex: 1 0 auto;
     min-width: 50px
 }

 .article_pagi .pagination li.current a,
 .article_pagi .pagination li.current a:hover {
     background: #3e2249;
     color: #fff
 }

 .article_pagi .pagination li a {
     width: 100%;
     color: #3e2249;
     font-size: 1.1em;
     font-weight: 100;
     border-radius: 0.5em;
     border: 1px solid #3e2249;
     display: flex;
     justify-content: center;
     align-items: center;
     transition: all .5s ease
 }

 .article_pagi .pagination li a:hover {
     background: #3e2249;
     color: #fff;
 }

 .sm_head {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     margin: 0;
     display: block
 }

 .sm_head {
     font-size: 1.5em;
     color: #000;
     background: #efefef;
     padding: .3em
 }

 .second_heading {
     background: #171936;
     color: #fff !important;
     clear: both;
     display: block;
     text-align: center
 }

 .head_bg {
     display: block;
     background: #fff;
     padding: .5em 0
 }

 ul.bloglist li {
     font: 1em "Roboto", "Helvetica", "Arial", sans-serif;
     list-style-type: square;
     line-height: 30px
 }

 ._source,
 .ita_con a {
     font-style: italic
 }

 ._source {
     text-align: center;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .content_para {
     padding: 0
 }

 .insp_article img {
     display: block;
     margin: 0 auto
 }

 .insp_article a {
     display: inline-block;
     color: #6f6f6f
 }

 ._source {
     display: block;
     color: #6f6f6f;
     font-size: .8em
 }

 .fi-arrows-out::before {
     content: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAxMDAwIDEwMDAnIHhtbDpzcGFjZT0ncHJlc2VydmUnPjxwYXRoIGQ9J201Ni4yIDY5NC42LTQ2IDI3Ny4xYy0uOCA1IC44IDEwLjEgNC40IDEzLjcgMy42IDMuNiA4LjggNS4yIDEzLjggNC40bDI3Ni4zLTQ2LjdjNS44LTEgMTAuNi01LjEgMTIuNC0xMC44IDEuOC01LjYuMy0xMS44LTMuOS0xNmwtNTQtNTQgMTQ1LjEtMTQ1LjFjNi4yLTYuMiA2LjItMTYuMSAwLTIyLjNsLTEwMC0xMDBjLTYuMi02LjItMTYuMi02LjItMjIuMyAwTDEzNyA3NDBsLTU0LTU0Yy00LjItNC4yLTEwLjMtNS43LTE2LTMuOS01LjcgMS44LTkuOSA2LjYtMTAuOCAxMi41ek05NDMuOCAzMDUuNGw0Ni0yNzcuMWMuOC01LS44LTEwLjEtNC40LTEzLjctMy42LTMuNi04LjgtNS4yLTEzLjgtNC40TDY5NS4zIDU2LjljLTUuOCAxLTEwLjYgNS4xLTEyLjQgMTAuOC0xLjggNS42LS4zIDExLjggMy45IDE2bDU0IDU0LTE0NS4xIDE0NWMtNi4yIDYuMi02LjIgMTYuMiAwIDIyLjNsMTAwIDEwMGM2LjIgNi4yIDE2LjEgNi4yIDIyLjMgMGwxNDUuMS0xNDUgNTQgNTRjNC4yIDQuMiAxMC4zIDUuNyAxNiAzLjkgNS42LTEuOCA5LjgtNi42IDEwLjctMTIuNXpNNjk0LjYgOTQzLjhsMjc3LjEgNDZjNSAuOCAxMC4xLS44IDEzLjctNC40IDMuNi0zLjYgNS4yLTguNyA0LjQtMTMuOGwtNDYuNy0yNzYuM2MtMS01LjgtNS4xLTEwLjYtMTAuOC0xMi40LTUuNi0xLjgtMTEuOC0uMy0xNiAzLjlsLTU0IDU0LTE0NS0xNDUuMWMtNi4yLTYuMi0xNi4xLTYuMi0yMi4zIDBsLTEwMCAxMDBjLTYuMiA2LjItNi4yIDE2LjEgMCAyMi4zbDE0NSAxNDUtNTQgNTRjLTQuMiA0LjItNS43IDEwLjMtMy45IDE2IDEuOCA1LjcgNi42IDkuOSAxMi41IDEwLjh6TTMwNS40IDU2LjJsLTI3Ny4xLTQ2Yy01LS44LTEwLjEuOC0xMy43IDQuNC0zLjYgMy42LTUuMiA4LjctNC40IDEzLjhsNDYuNyAyNzYuM2MxIDUuOCA1LjEgMTAuNiAxMC44IDEyLjQgNS42IDEuOCAxMS44LjMgMTYtMy45bDU0LTU0IDE0NSAxNDVjNi4yIDYuMiAxNi4yIDYuMiAyMi4zIDBsMTAwLTEwMGM2LjItNi4yIDYuMi0xNi4yIDAtMjIuM2wtMTQ1LTE0NSA1NC01NGM0LjItNC4yIDUuNy0xMC4zIDMuOS0xNi0xLjgtNS42LTYuNi05LjgtMTIuNS0xMC43eicgZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgLz48L3N2Zz4=);
     position: absolute;
     width: 21px;
     line-height: normal
 }

 .fi-arrows-out {
     display: flex;
     position: relative;
     justify-content: center;
     height: 50px;
     align-items: center
 }

 .inno_post .bott_post,
 .inno_post .bott_post a,
 .inno_post .bott_post h3 {
     color: #fff;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .inno_post {
     display: block;
     position: relative;
     overflow: hidden
 }

 .inno_post .bott_post,
 .inno_post span {
     display: block;
     width: 100%;
     position: absolute;
     text-align: center;
     transition: .3s
 }

 .inno_post span {
     top: 0;
     height: 100%;
     background: transparent
 }

 .inno_post:hover span {
     background: rgba(0, 0, 0, .5)
 }

 .inno_post:hover .bott_post {
     top: 50%;
     transform: translateY(-50%);
     opacity: 1
 }

 .inno_post .bott_post {
     top: 50%;
     opacity: 0;
     margin: 0 auto;
     font-size: .8em
 }

 .inno_post .bott_post h3 {
     text-align: center;
     font-size: 1.5em
 }

 .inno_post .bott_post a {
     display: inline-block;
     font-size: .9em;
     background: #70ad46;
     padding: .5em 1em
 }

 .prev_inno .slick-next,
 .prev_inno .slick-prev {
     bottom: 50%;
     transform: translateY(50%)
 }

 .prev_inno.slick-slider {
     margin-bottom: 0
 }

 .strike_th {
     display: block;
     margin: 1em 0;
     position: relative
 }

 .strike_th h1 {
     display: block;
     font-size: 22px;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     background: #fff;
     color: #000;
     text-align: center;
     font-weight: 500;
     margin: .17em 0
 }

 .ita_con .pid,
 .ita_con .pidcon,
 .ita_con a,
 .ita_con h2,
 .ita_con h3,
 .ita_con p,
 .ita_con p a,
 .ita_con ul li span,
 .ita_head h1,
 .strike_th h2,
 .strike_th p {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .ita_con p,
 .strike_th p {
     line-height: 30px;
     font-weight: 400
 }

 .strike_th h2 {
     position: relative;
     overflow: hidden;
     font-size: 1.2em;
     color: #999;
     text-align: center
 }

 .strike_th p {
     color: #000
 }

 .strike_th h2 span {
     display: inline-block;
     vertical-align: baseline;
     zoom: 1;
     position: relative;
     padding: 0 20px
 }

 .ita_con,
 .ita_con img,
 .ita_head h1,
 .strike_th p {
     display: block
 }

 .strike_th h2 span:after,
 .strike_th h2 span:before {
     content: "";
     display: block;
     width: 30%;
     position: absolute;
     top: .73em;
     border-top: 1px solid #999
 }

 .strike_th h2 span:before {
     right: 100%
 }

 .strike_th h2 span:after {
     left: 100%
 }

 .strike_th p {
     margin: 0 0 20px;
     padding: 0 1em;
     font-size: 15px;
     text-align: justify
 }

 .ita_con,
 .ita_con a {
     text-align: center
 }

 .ita_con img {
     margin: 0 auto
 }

 .ita_con a {
     display: inline-block;
     color: #6f6f6f;
     font-size: .8em
 }

 .ita_con p {
     display: block;
     margin: 10px 0 20px;
     font-size: 1em;
     color: #000;
     text-align: justify
 }

 .ita_con h2,
 .ita_con p a {
     text-align: center
 }

 .ita_con p a {
     display: inline-block;
     font-style: normal;
     color: #70ad46;
     font-size: 13.5px
 }

 .ita_con h2,
 .ita_con h3 {
     display: block;
     color: #000
 }

 .ita_con h2 {
     margin: 1em 0;
     font-size: 22px
 }

 .ita_con h3 {
     text-align: left;
     font-size: 1.2em;
     text-transform: capitalize
 }

 .ita_con .cus_tex_hd h3,
 .ita_con .pid,
 .ita_con .pidcon,
 .ita_con h2 span {
     text-transform: uppercase
 }

 .ita_con .cus_tex_hd h3,
 .ita_con h2 span {
     display: inline-block;
     background: #000;
     padding: .2em .5em;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .ita_con h2 span {
     text-align: center;
     border-radius: 30px;
     color: #fff
 }

 .ita_con ul {
     list-style-type: none;
     text-align: left;
     margin-top: .5em
 }

 .ita_con ul li {
     list-style-type: square;
     color: #000;
     margin-bottom: .5em
 }

 .ita_con ul li span {
     font-size: 1em;
     color: #000;
     line-height: 30px;
 }

 .ita_con .cus_tex_hd {
     display: block;
     text-align: left;
     border-bottom: 1px solid #000
 }

 .ita_con .cus_tex_hd h3 {
     margin: 15px 0 0;
     text-align: left;
     font-size: .9em;
     color: #fff
 }

 .ita_con .pid,
 .ita_con .pidcon {
     font-size: .8em;
     border: 1px solid #999;
     margin: 0;
     padding: .1em .5em;
     display: inline-block;
     text-align: center
 }

 .ita_con .pidcon {
     background: #999;
     color: #fff
 }

 .ita_con .pid {
     color: #999
 }

 .gall_ico_main {
     display: inline-block;
     position: relative;
     bottom: 0;
     right: 0
 }

 .fresco .gall_ico {
     display: inline-block;
     width: 50px;
     height: 47px;
     line-height: 50px;
     border-radius: 50px;
     position: absolute;
     bottom: 5%;
     right: 5%;
     background: rgba(0, 0, 0, .2);
     transition: .3s
 }

 .fresco .gall_ico i {
     font-size: 1.5em;
     color: rgba(255, 255, 255, .5)
 }

 .fresco:hover>.gall_ico {
     background: #000;
     transition: .3s
 }

 .example_suites .slick-next,
 .example_suites .slick-next:focus,
 .example_suites .slick-next:hover,
 .example_suites .slick-prev:focus,
 .example_suites .slick-prev:hover {
     background: #000
 }

 .fresco:hover>.gall_ico i {
     color: #fff;
     transition: .3s
 }

 .example_suites {
     display: block;
     margin-top: 1em
 }

 .example_suites .slick-prev {
     top: 65%;
     background: #000;
     width: 47px;
     padding: 8px;
     left: 0;
     z-index: 1
 }

 .example_suites .slick-prev:before {
     padding: 29px
 }

 .example_suites .slick-next {
     top: 65%;
     width: 47px;
     padding: 8px;
     right: 0
 }

 .example_suites .slick-next:before {
     padding: 29px
 }

 .back li span,
 .back p,
 .head_cont h1,
 .head_cont h2,
 .id18_views_con h2,
 .id18_views_con ul li .colo_cod h5,
 .id18_views_con ul li .colo_cod span,
 .profile-name,
 .profile-title,
 .titleline34,
 .yearcolor h1 {
     text-transform: uppercase
 }

 .back p,
 .intro_text,
 .web_address,
 footer.details p {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .intro_text {
     line-height: 30px;
     font-weight: 400;
     font-size: 14.5px;
     color: #fff;
     text-align: justify
 }

 .back li,
 .back p,
 footer.details p {
     font-size: 12px
 }

 .back p,
 .swatch_wrapper,
 .yearcolor,
 footer.details p {
     text-align: center
 }

 .fimage,
 .fimage_kiransh {
     display: inline-block;
     position: relative;
     height: 170px
 }

 .swatch_wrapper {
     position: absolute;
     bottom: -18px;
     left: 0;
     right: 0
 }

 .web_address {
     font-size: 14px
 }

 .web_address {
     display: inline-block;
     font-style: italic;
     color: #5a5a5a
 }

 .x_long_desc {
     min-height: 1000px
 }

 .xx_long_desc {
     min-height: 1160px
 }

 .long_desc {
     min-height: 850px
 }

 .mid_desc {
     min-height: 700px
 }

 .short_desc {
     min-height: 540px
 }

 blockquote {
     border-left: none;
     padding-left: 0;
     clear: both
 }

 .yearcolor {
     display: block;
     background: #85af4b;
     color: #fff;
     margin: 0 0 1em;
     padding: 10px
 }

 .yearcolor h1 {
     display: block;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 1.8em;
     color: #fff;
     margin: 0
 }

 .yearcolor h4,
 .yearcolor p {
     font-size: 1em;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .yearcolor p {
     display: block;
     text-align: justify
 }

 .col2018_bg,
 .id_views_con,
 .id_views_con ul li .colo_cod,
 .links_toni,
 .ple_refer,
 .profile-text,
 .titleline34,
 .yearcolor h4 {
     text-align: center
 }

 .yearcolor h4 {
     display: inline-block;
     color: #fff;
     border: 1px solid #fff;
     padding: 5px 10px;
     font-style: italic
 }

 .titleline34 {
     font-size: 22px;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     background: #0a2a50;
     color: #fff;
     font-weight: 400;
     margin: .4em 0 0
 }

 .profile-img {
     display: block;
     height: 11em;
     border-radius: 100%;
     margin: 0 auto;
     border: 5px solid #fff
 }

 .profile-name {
     margin-bottom: 0;
     font-size: 1.3em;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .profile-title {
     color: #000;
     font-size: 1.2em;
     border-bottom: 1px solid #000
 }

 .ple_refer {
     color: #000;
     font-size: 15px;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     display: block
 }

 .id_views_con ul li .colo_cod h5,
 .id_views_con ul li .colo_cod span {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     text-align: center;
     text-transform: uppercase
 }

 .ple_refer ul li {
     text-decoration: none;
     font-size: .9em;
     list-style-type: none;
     font-weight: 400;
     color: #666
 }

 .mhs_head p.download a,
 .wtr_ref a:hover {
     text-decoration: underline
 }

 h2.profile-name img {
     margin-top: -6px
 }

 .web_address a {
     margin-top: -.2em
 }

 .grey_bck {
     background: #f7f7f7;
     padding: .5em
 }

 #sthoverbuttons #sthoverbuttons-background {
     width: 0 !important
 }

 #sthoverbuttons .sthoverbuttons-shade-r {
     background: 0 0 !important
 }

 .links_toni {
     font-size: .8em;
     display: block
 }

 * {
     transition: all .3s ease 0
 }

 .id_views_con {
     display: block
 }

 .id_views_con ul {
     list-style-type: none;
     margin-left: 0
 }

 .id_views_con ul li {
     display: inline-block;
     margin-right: .5em;
     position: relative;
     width: 150px;
     height: 150px;
     border-radius: 100% 10% 100% 100%;
     overflow: hidden;
     box-shadow: 1px 1px 1px 1px rgba(226, 228, 231, .75)
 }

 .id_views_con ul li .id_color {
     display: block;
     height: 60%
 }

 .id_views_con ul li .colo_cod {
     display: block
 }

 .id_views_con ul li .colo_cod h5 {
     display: block;
     margin: .4em 0 0;
     line-height: 1.1em;
     font-size: 12px;
     color: #000;
     font-weight: 700
 }

 .id_views_con ul li .colo_cod span {
     display: block;
     margin: 0;
     font-size: 10px;
     color: #666
 }

 .head_cont h1,
 .head_cont h2,
 .head_cont p {
     margin: 0;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     color: #fff
 }

 .tables {
     width: 100%
 }

 .tables td {
     font-size: 1em
 }

 .txt_decor {
     border-bottom: 1px solid #fff
 }

 .col2018_bg {
     display: block;
     width: 100%;
     height: 620px;
     background: url("https://images.qssupplies.co.uk/col2018_bg.jpg") center center no-repeat;
     background-size: cover
 }

 .col2019_bg {
     display: block;
     position: relative;
     width: 100%;
     height: auto;
     background: #ff6f61;
     padding-bottom: 1em
 }

 .example-mask {
     mask-image: url(https://www.qssupplies.co.uk/images/paint_stroke.svg) center center no-repeat;
     webkit-mask-image: url(https://www.qssupplies.co.uk/images/col2018_bg.jpg) center center no-repeat;
     mask-mode: alpha;
     webkit-mask-mode: alpha;
     mask-repeat: no-repeat;
     webkit-mask-repeat: no-repeat;
     mask-size: 200px;
     webkit-mask-size: 200px;
     mask-position: center;
     webkit-mask-position: center
 }

 .head18_cont_main {
     display: block;
     width: 100%;
     height: 500px
 }

 .head_cont {
     display: inline-block;
     position: relative
 }

 .head_cont h2 {
     display: block;
     font-size: 1.5em
 }

 .head_cont h1 {
     display: block;
     font-size: 2em;
     font-weight: 400
 }

 .head_cont p {
     display: block;
     font-size: 1.1em;
     line-height: 2em
 }

 .lt18_grey {
     display: block;
     background: #f1f1f1;
     padding-bottom: 1.5em;
     position: relative
 }

 .id18_views_con {
     display: block;
     width: 95%;
     margin-top: 1.5em;
     position: relative;
     border-radius: 10px;
     background: #fff;
     padding: 1em 1em 0 8em;
     float: right;
     box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .16), 0 0 0 1px rgba(0, 0, 0, .08);
     z-index: 1
 }

 .profile18-img {
     display: inline-block;
     height: 11em;
     border: 10px solid #f1f1f1;
     border-radius: 100%;
     position: absolute;
     left: -8%;
     top: 50%;
     transform: translateY(-50%)
 }

 .id18_det {
     display: block;
     overflow: auto
 }

 .id18_views_con h2 {
     display: block;
     float: left;
     margin: 0;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 1.1em;
     color: #000
 }

 .comp_chart h4,
 .comp_head h3,
 .id18_det .comp_coun span,
 .id18_views_con a,
 .id18_views_con p,
 .id18_views_con ul li .colo_cod h5,
 p.conclusion {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .comp_chart i.medium {
     padding: 12px
 }

 .id18_views_con h2::after {
     content: "|";
     margin-left: .5em;
     vertical-align: text-bottom;
     color: #c8c8c8
 }

 .id18_views_con a {
     display: block;
     float: left;
     margin: 0 0 0 10px;
     font-size: .9em;
     color: #000;
     transition: .3s
 }

 .id18_views_con a i {
     font-size: 1.7em;
     color: #bfbfbf
 }

 .id18_views_con a:hover i {
     font-size: 1.7em;
     color: #000
 }

 .id18_views_con p,
 p.conclusion {
     display: block;
     font-size: 1.1em;
     color: #666;
     line-height: 2em;
     text-align: justify
 }

 p.conclusion {
     padding: .5em
 }

 .id18_views_con ul {
     list-style-type: none;
     margin-left: 0
 }

 .id18_views_con ul li {
     display: inline-block;
     margin-right: .5em;
     position: relative;
     width: 150px;
     height: 150px;
     border-radius: 100% 10% 100% 100%;
     overflow: hidden;
     box-shadow: 1px 1px 1px 1px rgba(226, 228, 231, .75)
 }

 .id18_views_con ul li .id_color {
     display: block;
     height: 60%
 }

 .id18_views_con ul li .colo_cod {
     display: block;
     text-align: center
 }

 .id18_views_con ul li .colo_cod h5 {
     display: block;
     margin: .4em 0 0;
     line-height: 1.1em;
     text-align: center;
     font-size: 12px;
     color: #000;
     font-weight: 700
 }

 .id18_views_con ul li .colo_cod span {
     display: block;
     margin: 0;
     text-align: center;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 10px;
     color: #666
 }

 .id18_det span {
     display: block;
     float: right
 }

 .id18_det .comp_coun {
     display: block;
     float: left
 }

 .id18_det .comp_coun span {
     display: inline-block;
     margin: .4em .6em;
     font-style: italic;
     font-size: .9em;
     color: #555;
     text-transform: capitalize
 }

 .comp_chart h4,
 .comp_head h3 {
     text-transform: uppercase
 }

 .id18_det .comp_coun img {
     display: inline-block;
     height: 1.7em
 }

 .col_vio,
 .comp_chart,
 .comp_head h3 {
     display: block
 }

 .col_vio {
     background: #5f4b8b;
     padding: .5em 0
 }

 .comp_head h3 {
     text-align: center;
     font-size: 2em;
     color: #fff
 }

 .comp_chart {
     margin-top: 1em
 }

 .comp_chart h4 {
     display: block;
     text-align: center;
     font-size: 1.5em;
     color: #000
 }

 ._text {
     line-height: 2em
 }

 .full-width-article-image {
     background: url(https://www.qssupplies.co.uk/images/article-1-head.jpg) center no-repeat;
     background-size: cover;
     height: 600px
 }

 .full-width-article-image-2 {
     background: url(https://www.qssupplies.co.uk/images/article-2-head.jpg) center no-repeat;
     background-size: cover;
     height: 600px
 }

 .full-width-article-image-3 {
     background: url(https://www.qssupplies.co.uk/images/article-3-head.jpg) center no-repeat;
     background-size: cover;
     height: 600px
 }

 .full-width-article-image-4 {
     background: url(https://www.qssupplies.co.uk/images/article-4-head.jpg) center no-repeat;
     background-size: cover;
     height: 600px
 }

 .full-width-article-image-5 {
     background: url(https://www.qssupplies.co.uk/images/article-5-head.jpg) center no-repeat;
     background-size: cover;
     height: 600px
 }

 .full-width-article-image-6 {
     background: url(https://www.qssupplies.co.uk/images/article-6-head.jpg) center no-repeat;
     background-size: cover;
     height: 600px
 }

 .gallery-button-container {
     display: block;
     text-align: center
 }

 a.gallery-button-background {
     background: rgba(0, 0, 0, .6);
     color: #fff;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     padding: 10px 25px;
     border-radius: 50px;
     font-size: 1.1em
 }

 .content_para,
 .content_para ul li,
 .intro_text span,
 .toi_content_para,
 .toi_head,
 .web_address a {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 a.gallery-button-background:hover {
     background: rgba(0, 0, 0, .5)
 }

 a.gallery-button-background i {
     font-size: 1.3em;
     display: block;
     float: left;
     margin: -4px 10px 0 0
 }

 a.gallery-button-background span.text-1 {
     display: inline-block;
     margin-right: 10px
 }

 a.gallery-button-background span.text-2 {
     display: inline-block;
     font-size: .8em
 }

 .bogger_imagination {
     display: block;
     position: relative;
     margin-bottom: 10em
 }

 .bogger_imagination .blogger_det {
     display: block;
     position: absolute;
     margin: 0 auto;
     bottom: -150px;
     left: 0;
     right: 0
 }

 .open_quote {
     position: absolute;
     left: 0;
     top: 0
 }

 .close_quote {
     position: absolute;
     right: 0;
     bottom: 0
 }

 .web_address a {
     display: inline-block;
     font-style: italic;
     font-size: 14px;
     color: #5a5a5a;
     transition: .3s
 }

 .web_address a:hover {
     color: #000
 }

 .web_address .fi-social-facebook {
     display: inline-block;
     color: #4867aa;
     font-size: 1.5em;
     vertical-align: middle
 }

 .web_address .fi-social-twitter {
     display: inline-block;
     color: #1da1f2;
     font-size: 1.5em;
     vertical-align: middle
 }

 .intro_text span {
     color: #fff;
     font-size: 16px;
     line-height: 2.5em
 }

 .content_para {
     line-height: 2.8em;
     font-size: 1em;
     text-align: justify;
     font-weight: 400;
     margin-bottom: 2.8em;
     color: #000
 }

 .content_para a {
     color: #000;
     border-bottom: 1px solid #000
 }

 .content_para ul li {
     line-height: 2.8em;
     font-weight: 400;
     font-size: 13.5px;
     color: #6f6f6f;
     text-align: justify
 }

 .breadcrumb_1 {
     margin-top: 0;
     background: #f0efec;
 }

 .dark_bg {
     display: block;
     background: #f9f9f9
 }

 .slick-prev {
     z-index: 999
 }

 .ver_divide {
     border-top: 1px solid silver;
     padding: 10px 0
 }

 article+[data-readmore-toggle] {
     background: #75ce66;
     color: #fff;
     padding: 5px;
     margin-top: 5px;
     width: 100px !important;
     font-size: .9em;
     text-align: center
 }

 *,
 :after,
 :before {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box
 }

 .cd-container {
     margin: 0 auto
 }

 .cd-container::after {
     content: "";
     display: table;
     clear: both
 }

 #cd-timeline {
     position: relative
 }

 #cd-timeline::before {
     content: "";
     position: absolute;
     top: 0;
     height: 100%;
     width: 6px;
     background: #050565
 }

 .cd-timeline-block:after,
 .cd-timeline-content:after {
     content: "";
     clear: both
 }

 @-webkit-keyframes cd-bounce-2 {
     0% {
         opacity: 0;
         -webkit-transform: translateX(-100px)
     }

     60% {
         opacity: 1;
         -webkit-transform: translateX(20px)
     }

     100% {
         -webkit-transform: translateX(0)
     }
 }

 @-moz-keyframes cd-bounce-2 {
     0% {
         opacity: 0;
         -moz-transform: translateX(-100px)
     }

     60% {
         opacity: 1;
         -moz-transform: translateX(20px)
     }

     100% {
         -moz-transform: translateX(0)
     }
 }

 @keyframes cd-bounce-2 {
     0% {
         opacity: 0;
         -webkit-transform: translateX(-100px);
         -moz-transform: translateX(-100px);
         -ms-transform: translateX(-100px);
         -o-transform: translateX(-100px);
         transform: translateX(-100px)
     }

     60% {
         opacity: 1;
         -webkit-transform: translateX(20px);
         -moz-transform: translateX(20px);
         -ms-transform: translateX(20px);
         -o-transform: translateX(20px);
         transform: translateX(20px)
     }

     100% {
         -webkit-transform: translateX(0);
         -moz-transform: translateX(0);
         -ms-transform: translateX(0);
         -o-transform: translateX(0);
         transform: translateX(0)
     }
 }

 @-webkit-keyframes cd-bounce-2-inverse {
     0% {
         opacity: 0;
         -webkit-transform: translateX(100px)
     }

     60% {
         opacity: 1;
         -webkit-transform: translateX(-20px)
     }

     100% {
         -webkit-transform: translateX(0)
     }
 }

 @-moz-keyframes cd-bounce-2-inverse {
     0% {
         opacity: 0;
         -moz-transform: translateX(100px)
     }

     60% {
         opacity: 1;
         -moz-transform: translateX(-20px)
     }

     100% {
         -moz-transform: translateX(0)
     }
 }

 @keyframes cd-bounce-2-inverse {
     0% {
         opacity: 0;
         -webkit-transform: translateX(100px);
         -moz-transform: translateX(100px);
         -ms-transform: translateX(100px);
         -o-transform: translateX(100px);
         transform: translateX(100px)
     }

     60% {
         opacity: 1;
         -webkit-transform: translateX(-20px);
         -moz-transform: translateX(-20px);
         -ms-transform: translateX(-20px);
         -o-transform: translateX(-20px);
         transform: translateX(-20px)
     }

     100% {
         -webkit-transform: translateX(0);
         -moz-transform: translateX(0);
         -ms-transform: translateX(0);
         -o-transform: translateX(0);
         transform: translateX(0)
     }
 }

 .cd-timeline-content>img {
     display: block;
     margin: 0 auto;
     border: 6px double #050565
 }

 .cd-timeline-img {
     position: absolute;
     top: 0;
     border-radius: 50%;
     box-shadow: 0 0 0 4px #d6f3dd, inset 0 2px 0 rgba(0, 0, 0, .08), 0 3px 0 4px rgba(0, 0, 0, .05);
     text-align: center;
     color: #fff;
     background: #00b32a
 }

 .cd-timeline-img p {
     line-height: 1;
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%)
 }

 .cd-timeline-img img {
     display: block;
     width: 24px;
     height: 24px;
     position: relative;
     left: 50%;
     top: 50%;
     margin-left: -12px;
     margin-top: -12px
 }

 @-webkit-keyframes cd-bounce-1 {
     0% {
         opacity: 0;
         -webkit-transform: scale(.5)
     }

     60% {
         opacity: 1;
         -webkit-transform: scale(1.2)
     }

     100% {
         -webkit-transform: scale(1)
     }
 }

 @-moz-keyframes cd-bounce-1 {
     0% {
         opacity: 0;
         -moz-transform: scale(.5)
     }

     60% {
         opacity: 1;
         -moz-transform: scale(1.2)
     }

     100% {
         -moz-transform: scale(1)
     }
 }

 @keyframes cd-bounce-1 {
     0% {
         opacity: 0;
         -webkit-transform: scale(.5);
         -moz-transform: scale(.5);
         -ms-transform: scale(.5);
         -o-transform: scale(.5);
         transform: scale(.5)
     }

     60% {
         opacity: 1;
         -webkit-transform: scale(1.2);
         -moz-transform: scale(1.2);
         -ms-transform: scale(1.2);
         -o-transform: scale(1.2);
         transform: scale(1.2)
     }

     100% {
         -webkit-transform: scale(1);
         -moz-transform: scale(1);
         -ms-transform: scale(1);
         -o-transform: scale(1);
         transform: scale(1)
     }
 }

 .cd-timeline-content {
     position: relative;
     background: #fff;
     border-radius: .25em;
     box-shadow: 3px 3px 6px 6px #e8e8e8
 }

 .cd-timeline-content:after {
     display: table
 }

 .cd-timeline-content h2 {
     color: #050565;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 1.25rem
 }

 .cd-timeline-content .cd-date,
 .cd-timeline-content .cd-read-more,
 .cd-timeline-content p {
     font-size: 15px;
     text-align: justify
 }

 .cd-timeline-content .cd-date,
 .cd-timeline-content .cd-read-more {
     display: inline-block
 }

 .cd-timeline-content .cd-read-more {
     padding: .8em 1em;
     background: #acb7c0;
     color: #fff;
     border-radius: .25em;
     float: left
 }

 .no-touch .cd-timeline-content .cd-read-more:hover {
     background-color: #bac4cb
 }

 .cd-timeline-content .cd-date {
     float: left;
     padding: .8em 0;
     opacity: .7
 }

 .cd-timeline-content::before {
     content: "";
     position: absolute;
     right: 100%;
     height: 0;
     width: 0;
     border: 7px solid transparent;
     border-right: 7px solid #fff
 }

 .cd-timeline-content p {
     margin: 1em 0;
     line-height: 1.6;
     font-size: 1rem;
     color: #6f6f6f
 }

 .phase_1 h3,
 .phase_1 p,
 .phase_2 p {
     line-height: 2em
 }

 .phase_1 p a,
 .phase_2 p a {
     text-decoration: underline
 }

 #cd-timeline {
     margin-top: 3em;
     margin-bottom: 3em
 }

 #cd-timeline::before {
     left: 50%;
     margin-left: -2px
 }

 .cd-timeline-block {
     position: relative
 }

 .cd-timeline-block:after {
     display: table
 }

 .cd-timeline-content {
     margin-left: 0;
     padding: 1.6em;
     width: 45%
 }

 .cd-timeline-content::before {
     top: 24px;
     left: 100%;
     border-color: transparent transparent transparent #fff
 }

 .cd-timeline-block:nth-child(even) .cd-timeline-content,
 .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more {
     float: right
 }

 .cd-timeline-content .cd-date {
     position: absolute;
     width: 100%;
     left: 122%;
     top: 6px;
     font-size: 16px;
     font-size: 1.2rem
 }

 .cd-timeline-block:nth-child(even) .cd-timeline-content::before {
     top: 24px;
     left: auto;
     right: 100%;
     border-color: transparent #fff transparent transparent
 }

 .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date {
     left: auto;
     right: 122%;
     text-align: right
 }

 .cssanimations .cd-timeline-content.is-hidden {
     visibility: hidden
 }

 .cssanimations .cd-timeline-content.bounce-in {
     visibility: visible;
     -webkit-animation: cd-bounce-2 .6s;
     -moz-animation: cd-bounce-2 .6s;
     animation: cd-bounce-2 .6s
 }

 .cssanimations .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in {
     -webkit-animation: cd-bounce-2-inverse .6s;
     -moz-animation: cd-bounce-2-inverse .6s;
     animation: cd-bounce-2-inverse .6s
 }

 .cd-timeline-block {
     margin: 4em 0
 }

 .cd-timeline-block:first-child {
     margin-top: 0
 }

 .cd-timeline-block:last-child {
     margin-bottom: 0
 }

 .cd-timeline-img p {
     font-size: 1.2rem
 }

 .cd-timeline-img {
     width: 75px;
     height: 75px;
     left: 50%;
     margin-left: -37px;
     -webkit-transform: translateZ(0);
     -webkit-backface-visibility: hidden
 }

 .cssanimations .cd-timeline-img.is-hidden {
     visibility: hidden
 }

 .cssanimations .cd-timeline-img.bounce-in {
     visibility: visible;
     -webkit-animation: cd-bounce-1 .6s;
     -moz-animation: cd-bounce-1 .6s;
     animation: cd-bounce-1 .6s
 }

 .hot_bg {
     background: #fff
 }

 .rhs_intro_con h1,
 .rhs_intro_con h2 {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .gallery {
     display: none
 }

 .top_intro_bg {
     display: block;
     background: #c2b59b
 }

 .rhs_intro_con {
     display: block;
     margin-top: 1em;
     text-align: center
 }

 .rhs_intro_con h1,
 h2,
 h3 {
     margin: 0
 }

 .rhs_intro_con h1 {
     display: block;
     font-size: 3.2em;
     color: #332309;
     text-transform: uppercase
 }

 .rhs_intro_con h2 {
     display: block;
     font-size: 1.5em;
     color: #332309;
     text-transform: uppercase
 }

 .drk_brown_bg h2,
 .phase_1 h2,
 .phase_1 h3,
 .phase_1 p,
 .rhs_intro_con p {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .rhs_intro_con p {
     display: block;
     font-size: 1em;
     line-height: 2em;
     color: #332309
 }

 .drk_brown_bg {
     width: 100%;
     background: #b0a086;
     text-align: center
 }

 .drk_brown_bg h2 {
     display: inline-block;
     margin: .5em;
     border: 2px solid #fff;
     padding: 0 .5em;
     border-radius: 50px;
     font-size: 2em;
     color: #fff;
     text-transform: uppercase
 }

 .mhs_head,
 .mhs_head h2,
 .phase_1 h3 {
     display: block
 }

 .dark_purp_bg {
     background: url(https://www.qssupplies.co.uk/images/bg_wall_tex.png) repeat-x #231b23;
     padding: 2em 0
 }

 .phase_1 h2,
 .phase_1 p {
     color: #fff;
     padding: 1em;
     display: block
 }

 .phase_1 h2 {
     text-align: center;
     font-size: 1.6em;
     text-transform: uppercase
 }

 .phase_1 h3 {
     color: #fff;
     font-size: 1.4em;
     text-align: left
 }

 .fact_con h2,
 .mhs_head,
 .phase_2 h1 {
     text-align: center
 }

 .phase_1 p {
     margin-top: 3em;
     font-size: 1em;
     background: #7c5e7a;
     border-radius: 15px
 }

 .light_beige_bg {
     background: #c2b59b
 }

 .mhs_head h2 {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 2.2em;
     color: #332309;
     text-transform: uppercase;
     margin: .5em
 }

 .mhs_head a.download,
 .phase_2 h1,
 .phase_2 p {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .mhs_head a.download {
     display: inline-block;
     border: 5px solid #7c5e7a;
     margin: 1em 0;
     background: #231b23;
     font-size: 1em;
     padding: 1em 2em;
     color: #fff;
     text-transform: uppercase;
     border-radius: 50px;
     transition: .3s
 }

 .mhs_head a.download:hover {
     background: #7c5e7a;
     transition: .3s
 }

 .mhs_head p.download {
     margin-top: 1em
 }

 .light_purp_bg {
     background: url(https://www.qssupplies.co.uk/images/bg_wall_tex.png) repeat-x #413641;
     padding: 3em 0
 }

 .phase_2 h1 {
     display: block;
     color: #fff;
     font-size: 1.6em;
     text-transform: uppercase
 }

 .phase_2 p {
     display: block;
     margin-top: 3em;
     font-size: 1em;
     color: #fff;
     background: #7c5e7a;
     padding: 1em;
     border-radius: 15px
 }

 span.number {
     display: inline-block;
     position: absolute !important;
     top: -3.38em !important;
     font-size: .9em;
     line-height: .5em;
     padding: .5em .4em;
     color: #000;
     border: 1px solid #000
 }

 .thumbnail {
     display: inline-block;
     max-width: 100%;
     margin-bottom: 1rem;
     border: 4px solid #fefefe;
     border-radius: 0;
     -webkit-box-shadow: 0 0 0 1px rgba(10, 10, 10, .2);
     box-shadow: 0 0 0 1px rgba(10, 10, 10, .2);
     line-height: 0
 }

 .source {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: .9em;
     text-align: center;
     color: #cecece;
     font-style: italic
 }

 .wbi_insp_article a {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     color: #6f6f6f
 }

 .para {
     display: block;
     margin: 10px 0 20px;
     line-height: 36px;
     font-weight: 400;
     font-size: 17px;
     text-align: justify
 }

 .wbi_insp_article {
     display: block;
     text-align: center
 }

 .wbi_insp_article img {
     display: block;
     margin: 0 auto
 }

 .wbi_insp_article a {
     display: inline-block;
     font-style: italic;
     font-size: .8em;
     text-align: center
 }

 .wbi_insp_article h2 {
     display: block;
     text-align: center;
     text-transform: none;
     line-height: 15em;
     background: #eee
 }

 .wtr_title h1,
 .wtr_title h2,
 .wtr_title_new h1,
 .wtr_title_new h1.public {
     text-align: center;
     text-transform: uppercase
 }

 .wtr_ref,
 .wtr_table,
 .wtr_title,
 .wtr_title h2,
 .wtr_title p,
 .wtr_title_new h1.public {
     display: block
 }

 .wtr_title h1,
 .wtr_title_new h1 {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 1.8em;
     display: block
 }

 .wtr_map>iframe>div.i4ewOd-pzNkMb-haAclf {
     background-color: #002b5c !important
 }

 .wtr_title h1 {
     color: #fff
 }

 .wtr_title_new h1 {
     color: #002b5c
 }

 .wtr_title_new h1.public {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     margin: 0 0 .5em;
     font-size: 22px;
     background: #002b5c;
     color: #d2e4f9;
     padding: .5em 0;
     text-transform: capitalize
 }

 .wtr_title h2 {
     margin: 0;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 18px;
     color: #fff
 }

 .map_ico_des h5,
 .open_def_chart a,
 .wtr_grph_con h1,
 .wtr_ref a,
 .wtr_table table td,
 .wtr_title p {
     font-family: "Roboto", "Helvetica", "Arial", sans-serif
 }

 .curr_symb,
 .wtr_ref a,
 .wtr_ref sup,
 .wtr_title p {
     font-size: 1em
 }

 .wtr_title p {
     line-height: 2.5em;
     text-align: justify
 }

 .wtr_table {
     overflow-x: auto;
     -webkit-overflow-scrolling: touch
 }

 .wtr_table table {
     width: 1170px
 }

 .wtr_table table td {
     font-size: 1em;
     text-transform: capitalize
 }

 .wtr_ref sup {
     color: #ef0002;
     top: 0
 }

 .wtr_ref a {
     display: inline-block;
     color: #000
 }

 table {
     border: 4px solid #3e2249;
 }

 table .tab_tit_hd {
     background: #002b5c
 }

 table .tab_tit_hd_more {
     background: #3e2249;
 }

 table .tab_tit_hd td,
 table .tab_tit_hd_more td {
     color: #fff;
     text-transform: uppercase;
     font-size: .9em
 }

 table tr:nth-of-type(2n) {
     background: #e8e5df;
 }

 .map_ico_main {
     display: block;
     text-align: center
 }

 .map_ico_des {
     display: inline-block;
     text-align: center;
     margin: 0 2em 1em 0
 }

 .lt_blue_bg,
 .map_ico_des span {
     display: block
 }

 .map_ico_des h5 {
     display: block;
     font-size: .8em;
     text-transform: uppercase;
     color: #fff
 }

 .lt_blue_bg {
     background: #002b5c;
     padding: 1em 0
 }

 .lt_sky_bg,
 .lt_sky_bg_bor {
     display: block;
     background: #d2e4f9
 }

 .lt_sky_bg {
     padding: .5em 0
 }

 .lt_sky_bg_bor {
     border-top: 5px solid #002b5c;
     padding: 0
 }

 .wtr_grph_con {
     display: inline-block;
     padding: .5em 0;
     margin-right: 1em;
     text-align: center
 }

 .wtr_grph_con h1 {
     display: block;
     margin: 0;
     line-height: normal;
     font-size: 3em;
     font-weight: 100;
     color: #002b5c
 }

 .open_def_chart {
     display: block;
     text-align: center
 }

 .open_def_chart img {
     display: block;
     margin: 0 auto
 }

 .open_def_chart a {
     display: inline-block;
     font-size: .8em;
     font-style: italic;
     color: #999
 }

 .open_def_chart a:hover {
     color: #000
 }

 ul.social_wdrfree {
     display: flex;
     flex-flow: column wrap;
     gap: 1em;
     list-style: none;
     align-items: center;
     margin: 0
 }

 .social_wdrfree a.icoFacebook {
     color: #fff
 }

 a.icoFacebook svg,
 a.icoTwitter svg,
 a.icoPinterest svg {
     margin-top: .25em
 }

 .social_wdrfree a.icoFacebook:hover {
     color: #fff
 }

 .social_wdrfree a.icoFacebook .fi-social-facebook:hover {
     color: #fff
 }

 .social_wdrfree a.icoTwitter {
     color: #fff
 }

 .social_wdrfree a.icoTwitter:hover {
     color: #fff
 }

 .social_wdrfree a.icoTwitter .fi-social-twitter:hover {
     color: #fff
 }

 .social_wdrfree a.icoPinterest {
     color: #fff
 }

 .social_wdrfree a.icoPinterest:hover {
     color: #fff
 }

 .social_wdrfree a.icoPinterest .fi-social-pinterest:hover {
     color: #fff
 }

 .social_wdrfree li a {
     display: block;
     position: relative;
     margin: 0 auto;
     -moz-border-radius: 50%;
     -webkit-border-radius: 50%;
     border-radius: 50%;
     text-align: center;
     width: 30px;
     height: 30px;
     font-size: 1.2em;
     background: #fff
 }

 .social_wdrfree li i {
     margin: 0;
     line-height: 0;
     text-align: center
 }

 .social_wdrfree a {
     color: #20497a;
     -webkit-transition: all .3s;
     -moz-transition: all .3s;
     -o-transition: all .3s;
     -ms-transition: all .3s;
     transition: all .3s
 }

 .social-col .sticky_social {
     position: fixed;
     top: 1em;
     width: auto
 }

 .container {
     bottom: 20px;
     left: 25px;
     position: fixed;
     margin: 0;
     z-index: 1
 }

 .buttons,
 .buttons:not(:last-child) {
     margin: 10px auto 0;
     border-radius: 50%
 }

 .buttons {
     box-shadow: 0 5px 11px -2px rgba(0, 0, 0, .18), 0 4px 12px -7px rgba(0, 0, 0, .15);
     display: block;
     width: 50px;
     height: 50px;
     position: relative;
     -webkit-transition: all .1s ease-out;
     transition: all .1s ease-out
 }

 .buttons:active,
 .buttons:focus,
 .buttons:hover {
     box-shadow: 0 0 4px rgba(0, 0, 0, .14), 0 4px 8px rgba(0, 0, 0, .28)
 }

 .buttons:not(:last-child) {
     width: 30px;
     height: 30px;
     opacity: 0;
     -webkit-transform: translateY(50px);
     -ms-transform: translateY(50px);
     transform: translateY(50px)
 }

 .container:hover .buttons:not(:last-child) {
     opacity: 1;
     -webkit-transform: none;
     -ms-transform: none;
     transform: none;
     margin: 15px auto 0
 }

 .buttons:nth-last-child(1) {
     -webkit-transition-delay: 25ms;
     transition-delay: 25ms;
     background-image: url(https://www.qssupplies.co.uk/images/shareround.svg);
     background-size: contain
 }

 .buttons:not(:last-child):nth-last-child(2) {
     -webkit-transition-delay: 50ms;
     transition-delay: 20ms;
     background-image: url(https://www.qssupplies.co.uk/images/facebook.svg);
     background-size: contain
 }

 .buttons:not(:last-child):nth-last-child(3) {
     -webkit-transition-delay: 75ms;
     transition-delay: 40ms;
     background-image: url(https://www.qssupplies.co.uk/images/twitter.svg);
     background-size: contain
 }

 .buttons:not(:last-child):nth-last-child(4) {
     -webkit-transition-delay: .1s;
     transition-delay: 60ms;
     background-image: url(https://www.qssupplies.co.uk/images/pinterest.svg);
     background-size: contain
 }

 [tooltip]:before {
     bottom: 10%;
     font-family: arial;
     font-weight: 600;
     border-radius: 2px;
     background: #585858;
     color: #fff;
     content: attr(tooltip);
     font-size: 12px;
     visibility: hidden;
     opacity: 0;
     padding: 5px 7px;
     margin-left: 6px;
     position: absolute;
     left: 100%;
     white-space: nowrap
 }

 [tooltip]:hover:after,
 [tooltip]:hover:before {
     visibility: visible;
     opacity: 1
 }

 .brand_block {
     display: flex;
     justify-content: space-around;
     align-content: centre;
     justify-content: space-around;
     overflow-x: auto;
     white-space: nowrap
 }

 .brand_block span {
     flex: 0 0 30px;
     height: 30px;
     display: flex;
     justify-content: center;
     align-items: center;
     padding: 0;
     margin: 0
 }

 .titleline_brand {
     margin: 1em 0
 }

 .choose_direct {
     margin: 0;
     border-bottom: none;
     flex: 1 0 auto
 }

 .choose_direct {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
     gap: .5em
 }

 .choose_direct a span {
     padding: .5em;
     background: #050d2f;
     width: 100%;
     min-width: 0;
     text-align: center;
     margin: 0
 }

 .sm_head+br+img {
     margin: 0 auto;
     display: block
 }

 .bpmg-main {
     display: block;
     max-width: 1440px;
     margin: 0 auto;
     padding: 0 0.5em
 }

 .bpmg-elements {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
     gap: 1em
 }

 .bpmg-cards {
     box-shadow: 0 0 0 1px #efefef;
     border-radius: 10px;
     overflow: hidden
 }

 .bpmg-cards .sm_head {
     font-size: 1.2em;
     text-transform: capitalize;
     text-align: center;
     padding: .5em 0
 }

 .bpmg-cards .content_para {
     padding: 1em;
     margin: 0;
     line-height: 2.2em
 }

 .forfullwidth {
     background: #fff;
     padding: 1em 0 2em 0;
 }

 .blog-wrapper-main {
     display: block;
     max-width: 1440px;
     margin: 0 auto;
     padding: 0 0.5em;
 }

 .blog-wrapped {
     display: grid;
     grid-template-columns: 70px 1fr;
     gap: 1em;
 }

 .blog-title-dates {
     grid-column: 2/-1;
 }

 .blog-title-dates {
     grid-column: 2/-1;
     display: flex;
     flex-direction: column;
 }

 .both-dates {
     display: flex;
     justify-content: space-between;
 }

 .social-col {
     display: flex;
     justify-content: center;
 }

 .publish_date,
 .updated_date {
     display: flex;
     flex-flow: row wrap;
     justify-content: center;
     align-items: center;
     border-radius: 5px;
     overflow: hidden;
 }

 .pd-two {
     color: #000;
     padding: 3px;
 }

 .blogwrapper {
     width: 100%;
     overflow: hidden;
 }

 .blogcanvas {
     position: relative;
     display: grid;
     grid-template-columns: 250px 1fr;
 }

 .blgoverlay {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(255, 255, 255, .7);
     z-index: 1;
     display: none;
     cursor: pointer;
 }

 .blgmenu-active .blgoverlay {
     display: block;
     backdrop-filter: blur(5px);
     -webkit-backdrop-filter: blur(5px);
 }

 .blgmenu {
     width: 250px;
     height: 100%;
     position: sticky;
     top: 0;
     left: 0;
     background-color: #f0efec;
     transform: translateX(-100%);
     transition: transform .3s;
 }

 .blgmenu-title {
    font: 500 15px "Roboto", "Helvetica", "Arial", sans-serif;
     padding: .7em .5em;
     background: #3e2249;
     color: #fff;
 }

 .blgmenu-active .blgmenu {
     transform: translateX(0);
 }

 .blgmenu-active .blgcontent {
     transform: translateX(0);
 }

 .blgmenu ul {
     list-style-type: none;
     padding: 0;
     margin: 0;
 }

 .blgmenu ul li:last-child {
     border-bottom: none;
 }

 .blgmenu ul li {
     border-bottom: 1px solid #cac3b5;
     transition: .3s;
 }

 .blgmenu ul li a {
     padding: 10px;
     color: #000;
     text-decoration: none;
     display: flex;
     justify-content: space-between;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 15px;
     line-height: normal;
 }

 .blgmenu ul li a span {
     font-size: 13px;
     color: #3e2249;
     border: 1px solid #3e2249;
     padding: 1px 5px;
     border-radius: 25px;
     min-height: 20px;
     min-width: 30px;
     padding: 0;
     display: flex;
     justify-content: center;
     align-items: center;
 }

 .blgmenu ul li:hover {
     background-color: #e8e5df;
 }

 .blgmenu ul li:hover a span {
     background: #3e2249;
     color: #fff;
 }

 .blgcontent {
     transition: transform .3s;
     transform: translateX(-250px);
     width: 100vw;
     background: #f0efec;
 }

 .blog-cat-but {
     display: flex;
     flex-flow: row wrap;
     justify-content: center;
     align-items: center;
     gap: 1em;     
     padding: 1em;
 }

 .blog-cat-but button {
    font: 16px "Roboto", "Helvetica", "Arial", sans-serif;
    background: #3e2249;
    color: #fff;
    padding: .5em 1em;
    border-radius: 25px;
 }

 .blog-sections {
     display: block;
     max-width: 1440px;
     margin: 0 auto;
     padding: 0 0.5em;
 }

 .blog-sec-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 2em;
 }

 .blog-grid-cards {
     border-radius: 1em;
     overflow: hidden;
     box-shadow: rgba(99, 99, 99, .2) 0 2px 8px 0;
     background: #fff;
     padding: 1em;
 }

 .blog-grid-cards h2 {
     font:500 18px "Roboto", "Helvetica", "Arial", sans-serif;
     color: #000;
     line-height: 26px;
     padding: .5em 1em;
 }

 .blog-grid-cards a img {
     display: block;
     margin: 0 auto;
     border-radius: 0.5em;
 }

 .blog-grid-cards:hover a {
     background-image: linear-gradient(180deg, #482b55, #3e2249);
     background-repeat: no-repeat;
     background-position: 1px bottom;
     background-size: 100% 5px
 }

 @media only screen and (min-width:40em) and (max-width:63.9375em) {
     .social-col .sticky_social {
         position: fixed;
         width: auto
     }

     .swatch_wrapper {
         position: relative
     }

     .id18_det span {
         float: none;
         clear: both;
         overflow: auto
     }

     .id18_det .comp_coun span {
         margin: .3em 0
     }

     .id18_views_con h2::after {
         content: "|";
         margin: 0 .1em
     }

     #cd-timeline {
         margin-top: 3em;
         margin-bottom: 3em
     }

     #cd-timeline::before {
         margin-left: -2px
     }

     .cd-timeline-block:after {
         display: table
     }

     .cd-timeline-content .cd-read-more {
         float: left
     }

     .cd-timeline-block:nth-child(even) .cd-timeline-content,
     .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-read-more {
         float: right
     }

     .cd-timeline-content .cd-date {
         position: absolute;
         width: 100%;
         left: 122%;
         top: 6px;
         font-size: 16px;
         font-size: 1.2rem
     }

     .cd-timeline-block:nth-child(even) .cd-timeline-content::before {
         top: 24px;
         left: auto;
         right: 100%;
         border-color: transparent #fff transparent transparent
     }

     .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date {
         left: auto;
         right: 122%;
         text-align: right
     }

     .cd-timeline-content.is-hidden {
         visibility: hidden
     }

     .cd-timeline-content.bounce-in {
         visibility: visible;
         -webkit-animation: cd-bounce-2 .6s;
         -moz-animation: cd-bounce-2 .6s;
         animation: cd-bounce-2 .6s
     }

     .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in {
         -webkit-animation: cd-bounce-2-inverse .6s;
         -moz-animation: cd-bounce-2-inverse .6s;
         animation: cd-bounce-2-inverse .6s
     }

     .cd-timeline-block:first-child {
         margin-top: 0
     }

     .cd-timeline-block:last-child {
         margin-bottom: 0
     }

     .cd-timeline-img {
         margin-left: -37px;
         -webkit-transform: translateZ(0);
         -webkit-backface-visibility: hidden
     }

     .cd-timeline-img.is-hidden {
         visibility: hidden
     }

     .cd-timeline-img.bounce-in {
         visibility: visible;
         -webkit-animation: cd-bounce-1 .6s;
         -moz-animation: cd-bounce-1 .6s;
         animation: cd-bounce-1 .6s
     }

     #cd-timeline::before {
         content: "";
         position: absolute;
         top: 0;
         left: 18px;
         height: 100%;
         width: 6px;
         background: #050565
     }

     .cd-timeline-block {
         position: relative;
         margin: 2em 0
     }

     .cd-timeline-img {
         position: absolute;
         top: 0;
         left: 35px;
         width: 40px;
         height: 40px;
         border-radius: 50%;
         box-shadow: 0 0 0 4px #d6f3dd, inset 0 2px 0 rgba(0, 0, 0, .08), 0 3px 0 4px rgba(0, 0, 0, .05);
         text-align: center;
         color: #fff;
         background: #00b32a
     }

     .cd-timeline-img p {
         font-size: .7rem;
         line-height: 1;
         position: absolute;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -50%)
     }

     .cd-timeline-content::before {
         content: "";
         position: absolute;
         top: 16px;
         left: -1em;
         height: 0;
         width: 0;
         border: 7px solid transparent;
         border-color: #fff transparent transparent
     }

     .cd-timeline-content {
         width: 90%;
         position: relative;
         margin-left: 60px;
         background: #fff;
         border-radius: .25em;
         padding: 1em;
         box-shadow: 3px 3px 6px 6px #e8e8e8
     }

     .cd-timeline-block:first-child .cd-timeline-content::before {
         top: 24px;
         left: auto;
         right: 100%;
         border-color: transparent #fff transparent transparent
     }

     .head_cont p {
         display: block;
         font-size: .95em;
         line-height: 2em
     }
 }

 .onebed_bg {
     display: block;
     padding: 0 0 1em;
     background: #66839b
 }

 .twobed_bg {
     display: block;
     padding: 2em 0 1em;
     background: #456786
 }

 .rent_table table {
     background: 0 0
 }

 .rent-head-main {
     display: block;
     text-align: center
 }

 .rent-head-main h2 {
     display: inline-block;
     position: relative;
     text-align: center;
     margin: 1em auto;
     padding: .3em 1.3em;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 1.7em;
     color: #2d4861;
     text-transform: uppercase;
     border: 5px solid #2d4861;
     border-radius: 5pc
 }

 .rent-head {
     display: block;
     text-align: center
 }

 .rent-head h2 {
     display: inline-block;
     position: relative;
     text-align: center;
     margin: 1em auto;
     padding: .3em 1.3em;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 2em;
     color: #fff;
     text-transform: uppercase;
     border: 5px solid #2d4861;
     border-radius: 5pc
 }

 .rent-head h2 span {
     display: inline-block;
     background: #2d4861;
     position: absolute;
     width: 50px;
     height: 50px;
     left: -.6em;
     top: 50%;
     transform: translateY(-50%);
     line-height: 35px;
     border: 5px solid #2d4861;
     border-radius: 5pc
 }

 .rent_table table tr td {
     color: #fff;
     font-size: 1em !important
 }

 .rent_table table .tab_tit_hd {
     background: #2d4861
 }

 .rent_table table .tab_tit_hd span {
     text-transform: capitalize;
     font-style: italic;
     font-size: .9em
 }

 .rent_table table tr:nth-of-type(2n) {
     background: linear-gradient(to right, rgba(158, 127, 99, 0) 0, rgba(69, 103, 134, 1) 16%, rgba(69, 103, 134, 1) 84%, rgba(172, 107, 83, 0) 100%)
 }

 .avg_rent {
     display: block;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 5em;
     color: #213a4f
 }

 .rent_tbd table {
     background: 0 0
 }

 .rent_tbd table tr td {
     color: #fff;
     font-size: 1em !important
 }

 .rent_tbd table .tab_tit_hd {
     background: #2d4861
 }

 .rent_tbd table .tab_tit_hd span {
     text-transform: capitalize;
     font-style: italic;
     font-size: .9em
 }

 .rent_tbd table tr:nth-of-type(2n) {
     background: linear-gradient(to right, rgba(158, 127, 99, 0) 0, rgba(102, 131, 155, 1) 8%, rgba(102, 131, 155, 1) 91%, rgba(102, 131, 155, .89) 92%, rgba(172, 107, 83, 0) 100%)
 }

 .rent_city_para {
     display: block;
     margin-top: 1em
 }

 .rent_city_para h3 {
     display: block;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 1.3em;
     color: #2d4861;
     text-transform: capitalize;
     border-bottom: 1px solid #2d4861
 }

 .rent_city_para h3 span {
     display: inline-block;
     width: 30px;
     height: 30px;
     margin-right: 5px;
     text-align: center;
     background: #66839b;
     border: 3px solid #2d4861;
     border-radius: 10pc;
     font-size: 16px;
     color: #fff
 }

 .rent_city_para p {
     display: block;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 1em;
     line-height: 2.5em;
     color: #2d4861
 }

 .city_para {
     display: block;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 1em;
     line-height: 2.5em;
     color: #2d4861
 }

 .rent_src {
     display: block;
     text-align: center;
     margin-bottom: 1em
 }

 .rent_src h5 {
     display: block;
     margin: 0;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 1em;
     text-transform: uppercase;
     border-top: 1px solid #999;
     padding-top: 1em
 }

 .rent_src span {
     display: block;
     text-align: center
 }

 .rent_src a {
     display: inline-block;
     font-family: "Roboto", "Helvetica", "Arial", sans-serif;
     font-size: 1em;
     font-style: italic;
     color: #8e8e8e
 }

 .rent_src a:hover {
     color: #000
 }

 @media only screen and (min-width:40em) {
     .normal_fonts h1 {
         font:500 22px "Roboto", "Helvetica", "Arial", sans-serif, serif;
         color: #000;
         text-align: center
     }
 }

 @media only screen and (max-width:39.9375em) {
     .pagination-wrap {
         flex-flow: column nowrap;
     }

     .article_pagi:nth-child(2) {
         margin-top: .5em;
     }

     .pagination-wrap>.article_pagi:nth-child(2n) {
         flex: 0 1 auto;
     }

     .article_pagi .pagination li a {
         padding: 0 .5em;
     }

     .normal_fonts h1 {
         font:500 22px "Roboto", "Helvetica", "Arial", sans-serif, serif;
         margin: 0;
         text-align: center;
         line-height: 30px
     }

     .rent-head h2 {
         font-size: 1.4em;
         padding: 1em 1.3em .5em
     }

     .rent-head h2 span {
         left: 50%;
         top: -1.3em;
         transform: translateX(-50%)
     }

     .cd-timeline-img,
     .col2018_bg,
     .id18_det {
         text-align: center
     }

     .cd-timeline-img,
     .col2019_bg,
     .id18_det {
         text-align: center
     }

     #cd-timeline::before,
     .cd-timeline-content::before,
     .id18_views_con h2::after {
         content: ""
     }

     .social-col .sticky_social {
         position: fixed;
         z-index: 6;
         width: 100%
     }

     .head_cont,
     .social_wdrfree li a {
         display: block;
         position: relative
     }

     .id18_det .comp_coun,
     .id18_det span,
     .id18_views_con h2 {
         float: none
     }

     .social_wdrfree li a {
         width: 30px;
         height: 30px;
         margin: 0 auto;
         font-size: 1.1em
     }

     .social_wdrfree li i {
         line-height: 0;
         margin: 0;
         text-align: center
     }

     .example_suites .slick-prev {
         top: 100%;
         transform: scale(.5);
         left: -12px
     }

     .example_suites .slick-next {
         top: 100%;
         transform: scale(.5);
         right: -12px
     }

     .swatch_wrapper {
         position: relative;
         margin-bottom: 1.5em
     }

     .id_views_con ul li {
         margin: 5px;
         border-radius: 100%;
         width: 125px;
         height: 125px
     }

     .col2018_bg,
     .head18_cont_main {
         height: auto
     }

     .col2019_bg,
     .head18_cont_main {
         height: auto
     }

     .head_cont {
         top: 0;
         transform: translateY(0)
     }

     .id18_views_con {
         width: 100%;
         margin-top: 6em;
         padding: 4em 1em 1em
     }

     .profile18-img {
         display: inline-block;
         height: 8em;
         margin: 0 auto;
         left: 50%;
         transform: translateX(-50%);
         top: -4em
     }

     .id18_det span {
         clear: both;
         overflow: auto
     }

     .id18_views_con a {
         display: inline-block;
         float: none
     }

     .id18_views_con h2::after {
         margin-left: 0
     }

     .col2018_bg {
         display: block;
         width: 100%;
         background: #3d2c67
     }

     .id18_views_con ul li {
         margin: 5px;
         border-radius: 100%;
         width: 125px;
         height: 125px
     }

     .cd-timeline-content h2 {
         font-size: 1rem
     }

     .cd-timeline-content p {
         font-size: 16px
     }

     .cd-timeline-content .cd-date,
     .cd-timeline-content .cd-read-more {
         font-size: 14px;
         font-size: .875rem
     }

     #cd-timeline::before {
         position: absolute;
         top: 0;
         left: 18px;
         height: 100%;
         width: 6px;
         background: #050565
     }

     .cd-timeline-block {
         position: relative;
         margin: 2em 0
     }

     .cd-timeline-img {
         position: absolute;
         top: 0;
         left: 35px;
         width: 40px;
         height: 40px;
         border-radius: 50%;
         box-shadow: 0 0 0 4px #d6f3dd, inset 0 2px 0 rgba(0, 0, 0, .08), 0 3px 0 4px rgba(0, 0, 0, .05);
         color: #fff;
         background: #00b32a
     }

     .cd-timeline-img p {
         font-size: .7rem;
         line-height: 1;
         position: absolute;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -50%)
     }

     .cd-timeline-content::before {
         position: absolute;
         top: 16px;
         left: -1em;
         height: 0;
         width: 0;
         border: 7px solid transparent;
         border-color: #fff transparent transparent
     }

     .cd-timeline-content {
         width: 80%;
         position: relative;
         margin-left: 60px;
         background: #fff;
         border-radius: .25em;
         padding: 1em;
         box-shadow: 3px 3px 6px 6px #e8e8e8
     }

     .cd-timeline-block:first-child .cd-timeline-content::before {
         top: 24px;
         left: auto;
         right: 100%;
         border-color: transparent #fff transparent transparent
     }

     .titleline34 {
         font-size: 1.5em;
         padding: .8em
     }

     .head_cont p {
         display: block;
         font-size: .95em;
         line-height: 2em
     }
 }

 .normal_para a {
     color: #000 !important;
     font-style: normal;
     font-size: 16px;
     display: inline
 }

 .ngrid li .trigger a {
     font-style: normal;
     color: #000
 }

 .ngrid li:hover .trigger a {
     font-style: normal;
     color: #fff
 }

 .multiple-items.offer-productsul li a {
     font-size: 16px;
     text-align: justify;
     color: #000;
     font-style: normal
 }

 .small_title {
     font-size: 22px
 }

 .fr_border {
     background: 0 0 !important;
     line-height: inherit !important;
     position: relative;
     text-transform: none;
     font-size: 22px;
     width: 100%;
     padding: .2em 0;
     font-weight: 400
 }

 .fr_border:before {
     content: " ";
     width: 18px;
     height: 18px;
     border-top: 1px solid #000;
     top: 0;
     border-left: 1px solid #000;
     position: absolute;
     left: 0
 }

 .fr_border:after {
     content: " ";
     bottom: 0;
     width: 18px;
     height: 18px;
     border-right: 1px solid #000;
     border-bottom: 1px solid #000;
     position: absolute;
     right: 0
 }

 .normal_fonts h2,
 .normal_fonts h3 {
     font:500 22px "Roboto", "Helvetica", "Arial", sans-serif;
     color: #000;
     text-align: center;
     background: 0 0;
     line-height: normal;
     text-transform: initial
 }

 .publish_date,
 .updated_date {
     font: 14px "Roboto", "Helvetica", "Arial", sans-serif
 }

 .author_bio {
     display: grid;
     grid-template-columns: max-content 1fr;
     gap: .5em;
     font: 16px "Roboto", "Helvetica", "Arial", sans-serif;
     background: #fafafa;
     padding: .5em;
     border: 1px solid #eee;
     border-radius: .5em
 }

 .author-desc {
     display: flex;
     flex-direction: column;
     gap: .5em
 }

 .author_image {
     display: block
 }

 .author_image img {
     border-radius: .5em
 }

 .author-desc p {
     margin: 0;
     text-align: justify
 }

 .nopadding {
     padding: 0
 }

 .author_bio .posted_by {
     font: .8em "Roboto", "Helvetica", "Arial", sans-serif;
     color: #aaa;
     font-weight: 600;
     align-self: flex-end
 }

 .author_bio .posted_by span {
     font-style: italic
 }

 .author_bio p span {
     text-decoration: underline
 }

 .nested .medium-text-center.medium-no-padding2.clearance {
     background: #fff
 }

 .nested .medium-text-center.medium-no-padding2.clearance a {
     color: #000
 }

 .rel-article-main h2 {
     display: flex;
     justify-content: center;
     align-items: center;
     gap: .5em;
     white-space: nowrap;
     text-align: center;
     font:500 22px "Roboto", "Helvetica", "Arial", sans-serif;
     margin-bottom: .5em
 }

 .rel-article-main h2::before,
 .rel-article-main h2::after {
     content: "";
     border-bottom: 1px solid #000;
     width: 100%
 }

 .rel-article-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     gap: 2em;
     margin-bottom: 1em;
     align-items: center
 }

 .relart-sub {
     display: grid;
     grid-template-rows: max-content 1fr;
     height: 100%;
     gap: .5em;
     width: clamp(0, 100%, 500px);
     margin: 0 auto;
     text-align: center;
     place-items: center
 }

 .relart-sub:hover {
     text-decoration: underline
 }

 .relart-sub img {
     max-width: 100%;
     border-radius: 50px;
     margin: 0 auto
 }

 .vignette {
     position: relative;
     height: 100%;
     display: block;
     background-size: cover;
     border-radius: 50px;
     overflow: hidden
 }

 .vignette::after {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     bottom: 0;
     right: 0;
     box-shadow: inset 10px 10px 110px 0 rgba(5, 13, 47, .3)
 }

 .relart-sub .post_title {
     font: 18px "Roboto", "Helvetica", "Arial", sans-serif;
     line-height: 1.5;
     text-align: center;
     color: #000;
     text-decoration: none
 }

 @media screen and (max-width:39.9375em) {
     .author_bio {
         grid-template-columns: 1fr;
     }

     .rel-article-grid {
         grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
         gap: 1.5em
     }

     .publish_date,
     .updated_date {
         flex-flow: column wrap;
     }

     .blog-wrapped {
         grid-template-columns: 1fr;
     }

     .blog-title-dates,
     .social-col,
     .article-col {
         grid-column: 1/-1;
     }

     ul.social_wdrfree {
         flex-flow: row wrap;
         gap: .5em;
     }

     .social-col {
         justify-content: flex-start;
     }

     .vignette {
         max-height: 216px;
         border-radius: 10px
     }

     .vignette img {
         border-radius: 0
     }
 }

 @media screen and (max-width:63.9375em) {
     .blog-sec-grid {
         grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
     }
 }

 @media screen and (min-width:40em) and (max-width:63.9375em) {
     .blog-wrapped {
         grid-template-columns: 30px 1fr;
     }
 }

 @media screen and (min-width:64em) {
     .normal_fonts h1 {
         margin: 0 !important
     }

     .normal_fonts {
         min-height: 47px
     }

     .normal_fonts:first-child {
         display: flex;
         min-height: 93px;
         justify-content: center;
         align-items: center
     }
 }

 @media screen and (max-width:40em) {
     .normal_fonts h1 {
         font: 22px "Roboto", "Helvetica", "Arial", sans-serif, serif;
         color: #000;
         text-align: center
     }

     .normal_fonts {
         min-height: 112px
     }

     #topHeader+.breadcrumb_1 .breadcrumbs,
     #topHeader+.purple .breadcrumb_1 .breadcrumbs {
         flex: 1 0 auto;
         margin-bottom: 0;
         padding-right: 1em
     }

     #topHeader+.breadcrumb_1,
     #topHeader+.purple .breadcrumb_1 {
         margin-bottom: 0;
         display: flex;
         white-space: nowrap;
         flex-flow: row nowrap;
         overflow-x: auto
     }

     .publish_date,
     .updated_date {
         font-size: 13px
     }
 }