@font-face {
    font-family: 'klavikamedium';
    src: url('../fonts/klavika-medium-webfont.woff2') format('woff2'),
         url('../fonts/klavika-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal}

@font-face {
    font-family: 'klavikabold';
    src: url('../fonts/klavika-bold-webfont.woff2') format('woff2'),
         url('../fonts/klavika-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal}

@font-face {
    font-family: 'klavikalight';
    src: url('../fonts/klavika-light-webfont.woff2') format('woff2'),
         url('../fonts/klavika-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal}

html, body, ul, li, p, a, h1, h2, h3, h4, h5, h6, div, input, label, figure, button {margin:0; padding:0; outline:none; font-weight:normal}
* {-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; outline:none; border:0; -webkit-font-smoothing:antialiased}
body {font-family:'klavikamedium'; font-weight:400}
select, textarea, input, button {-webkit-appearance:none; -moz-appearance:none; appearance:none; font-family:'klavikalight'; margin:0}
select {color:#000}
input[type="number"] {-moz-appearance:textfield}
a {text-decoration:none}
b, h1, h2, h3, h4, h5, h6 {font-family: 'klavikabold'; font-weight:normal}
ul li {list-style:none}
.clear {clear:both}
.container {width:1230px; margin:0 auto}

.body-wrapper {width:100%; overflow-x:hidden}

#state, #past-int, #technical {display:none}

header {height:120px; background:url(../images/logo-bg.png) top center no-repeat; background-size:contain}
header img {height:105px; float:left}
header ul {float:right; margin-top:40px}
header ul li {float:left; margin-left:3px; position:relative}
header ul li:nth-child(1) a, header ul li:nth-child(2) a {background:#F58B76; padding:5px 15px; display:block; color:#fff; border-radius:15px; font-family: 'klavikabold'; text-transform:uppercase; font-size:16px; border:1px solid rgba(0,0,0,0); margin-left:5px}
header ul li:nth-child(1) a {background:url(../images/icons/arrow.png) right 10px center no-repeat #F58B76; background-size:9px; padding-right:25px}
header ul li:nth-child(2) a {background:url(../images/icons/search.svg) center no-repeat #F58B76; background-size:15px; width:35px; height:35px}
header ul li:nth-child(1) a:hover, header ul li:nth-child(2) a:hover {color:#F58B76; background:#fff; border:1px solid #F58B76}
header ul li:nth-child(2) a:hover {background:url(../images/icons/search.svg) center no-repeat #F58B76}

.menu {display:none; position:absolute; right:2.5%; top:0}
.menu img {width:50px}

nav {background:#7D8CC6; padding:20px 0; margin-top:-8px}
nav .container {width:1156px}
nav a {color:#fff; font-family: 'klavikabold'; text-transform:uppercase; line-height:30px; margin-right:15px; font-size:17px; padding-bottom:22px}
nav a:hover, nav .active a {border-bottom:8px solid #fff}
nav ul li {float:left; line-height:40px; margin-right:12px; border-right:1px solid #C3C9E3; position:relative}
nav ul li:last-child {border-right:0; margin-right:0}
nav ul li:last-child a {margin-right:0}
nav ul li span, .home-gallery > a span, header ul li span, .preview > li:nth-child(2) > a span, .preview > li:nth-child(3) > a span {display:none; position:absolute; background:url(../images/icons/coming-soon.png) no-repeat; color:#7D8CC6; padding:5px 10px 10px 12px; border-radius:10px; top:-15px; font-size:10px; line-height:10px; left:calc(50% - 47px)}
nav ul li a:hover span, header ul li a:hover span, .preview > li:nth-child(2) > a:hover span, .preview > li:nth-child(3) > a:hover span {display:block}

.ticker-wrap {background:#F58B76; margin-top:10px; width:100%; overflow:hidden; padding-left:100%; box-sizing:content-box}
@-webkit-keyframes ticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
@keyframes ticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }
  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}
.ticker {white-space: nowrap;
  padding-right: 100%;
  box-sizing: content-box;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-name: ticker;
  animation-name: ticker;
  -webkit-animation-duration: 30s;
  animation-duration: 30s;
}
.ticker p {display:inline-block; padding:0 25px; font-size:28px; color:#fff; font-family:'klavikalight'; letter-spacing:-1px}

.preview > li {float:left; width:32.5%; margin-right:1%; background:#f8f8f8; padding:20px; color:#607ABB; padding-bottom:25px; border:1px solid #EBEBEB; border-top:0; border-bottom:18px solid #F58B76; border-radius:0 0 15px 15px}
.preview > li:last-child {margin-right:0}
.preview > li:nth-child(1) {background:#607ABB; color:#fff}
.preview > li:nth-child(2) {width:33%}

.preview > li h2 {padding-left:24px; text-transform:uppercase; font-size:19px; line-height:28px}
.preview > li:nth-child(1) h2 {background:url(../images/icons/chat.png) top 7px left no-repeat; background-size:18px}
.preview > li:nth-child(2) h2, .preview > li:nth-child(3) h2 {background:url(../images/icons/calendar.png) top 6px left no-repeat; background-size:18px}
.preview > li > img {max-width:52%; padding:10px 0}
.preview > li > h3, .chairman h3 {font-size:30px; text-transform:uppercase; line-height:30px}
.preview > li > h5, .chairman h5, .committee h5, .committee h6, .publication h6 {font-size:19px; text-transform:uppercase; line-height:20px}
.preview > li > i {display:block; margin:20px 0 5px; background:url(../images/icons/quote.png) left -5px top 5px no-repeat; background-size:24px}
.preview > li > p, .home-about, footer > p, .about p, .membership p, .fees h4, .fees h5, .fees h6, .events p, .list h6, .circular p, .contact p, .contact .offices b, .circular table, .circular .bullets li {font-size:26px; line-height:29px; font-family:'klavikalight'; letter-spacing:-1px}
.preview > li > p span {display:none}
.preview > li > p a, .preview > li > a, .home-gallery > a, .about p a, .chairman a, .circular .back, .contact .info ul li a {color:#fff; display:block; background:#F58B76; border-radius:17px; font-size:16px; font-family:'klavikabold'; width:115px; padding:3px 12px; margin-top:22px; text-transform:uppercase}

.preview > li > ul li {clear:both; border-bottom:1px solid #d6d6d6; padding:20px 0}
.preview > li > ul li:last-child {border-bottom:0; padding-bottom:10px}
.preview > li h6 {float:left; background:#607ABB; color:#fff; border-radius:10px; font-size:28px; width:41px; height:42px; line-height:18px; padding:4px; margin-right:8px; text-align:center}
.preview > li h6 b {display:block; font-size:14px; text-transform:uppercase}
.preview > li > ul li a, .preview > li .desc p {font-size:19px; line-height:20px; display:block}
.preview > li > ul li a, footer ul li p span, .membership h1 span {color:#607ABB}
.preview > li > ul li p a:hover {text-decoration:underline}
.preview > li:nth-child(2) > a {width:95px; margin-top:31px; position:relative; line-height:29px}

.preview > li:nth-child(3) > a {width:120px; margin-top:53px; position:relative; line-height:29px}
.preview .gallery img {max-width:100%; border-radius:15px; margin:25px 0}

.home-about {text-align:center; margin:90px 0; line-height:35px}

.home-gallery h2, footer h2, .publication h2 {font-size:30px; padding-left:35px; background:url(../images/icons/image.svg) top 10px left no-repeat; background-size: 27px; color:#607ABB; text-transform:uppercase}
.home-gallery h2 {float:left}
.home-gallery hr {width:calc(100% - 390px); float:left; height:1px; background:#999; margin:20px 0 0 10px}
.home-gallery > a {float:right; width:125px; text-align:center; margin-top:5px; position:relative; line-height:29px}
.home-gallery > a:hover span {top:-21px; display:block}
.home-gallery ul {margin:25px 0}
.home-gallery ul li {margin:0 15px 8px 0; width:calc(16.66% - 12.5px); float:left}
.home-gallery ul li img {max-width:100%}
.home-gallery ul li:nth-child(6), .home-gallery ul li:nth-child(11) {margin-right:0}
.home-gallery ul li:nth-child(12), .home-gallery ul li:nth-child(13), .home-gallery ul li:nth-child(15) {margin-top:-205px}
.home-gallery ul li:nth-child(14) {margin-top:-205px; width:calc(33.33% - 12.5px)}

footer {margin-top:75px}
footer h2 {background:url(../images/icons/paper-plane.svg) top 10px left no-repeat; background-size:27px}
footer > p {margin:30px 0 20px}
footer ul li {float:left; margin-right:40px; margin-bottom:40px}
footer ul li h5 {color:#607ABB; font-size:25px; line-height:34px; margin-bottom:5px}
footer ul li p {font-size:18px; line-height:22px}
footer ul li p a, .list li a {color:#000}
footer ul li p a:hover {color:#F58B76}
footer ul li:last-child {float:right; margin-right:0; display:flex; flex-wrap:wrap; margin-top:68px}
footer ul li:last-child > a {width:37px; height:37px; margin-left:3px}
footer ul li:last-child > a:nth-child(1) {background:url(../images/icons/fb.png) no-repeat; background-size:cover}
footer ul li:last-child > a:nth-child(2) {background:url(../images/icons/in.png) no-repeat; background-size:cover}
footer ul li:last-child > a:nth-child(3) {background:url(../images/icons/ln.png) no-repeat; background-size:cover}
footer ul li:last-child > a:nth-child(4) {background:url(../images/icons/x.png) no-repeat; background-size:cover}

.copyright {background:#607ABB; color:#fff; font-family:'klavikalight'; font-size:14px}
.copyright ul {display:flex}
.copyright ul li {width:33.33%; height:10px}
.copyright ul li:nth-child(1) {background:#F0A52D}
.copyright ul li:nth-child(2) {background:#fff}
.copyright ul li:nth-child(3) {background:#54C961}
.copyright .container {padding:30px 0}
.copyright .cr {float:left}
.copyright .db {float:right}
.copyright .db a {color:#fff}


.about h1, .membership h1, .circulars h1, .gov h1, .news h1, .publication h1, .events h1, .contact h1, .contact .info h2 {font-size:60px; text-transform:uppercase; line-height:45px; margin:40px 0 50px; max-width:1100px; letter-spacing:-2px}
.about h1 sup, .membership h1 sup {font-size:23px; color:#939393}
.about h2, .membership h2, .contact h2 {font-size:30px; color:#607ABB; text-transform:uppercase}
.about p {line-height:36px; margin-top:25px; padding-right:20px}
.about > p {float:left; width:50%}
.about p a {width:75px}
.about ul {float:left; width:50%; margin-top:-30px}
.about ul li {float:left; width:32%; margin-left:2%; height:195px; border-radius:15px; margin-bottom:12px; text-align:center; padding-top:80px; text-transform:uppercase; color:#fff; font-size:30px; font-family:'klavikabold'; line-height:27px}
.about ul li:nth-child(1), .about ul li:nth-child(4) {margin-left:0}
.about ul li:nth-child(7) {width:auto; height:auto; background:0; text-align:left; padding:0; color:#000; margin-left:0; font-size:18px; line-height:20px}
.about ul li:nth-child(5), .about ul li:nth-child(6) {padding-top:70px}

.about ul li:nth-child(1) {background:url(../images/fibre.jpg); background-size:cover}
.about ul li:nth-child(2) {background:url(../images/yarn.jpg) bottom center; background-size:cover}
.about ul li:nth-child(3) {background:url(../images/fabrics.jpg); background-size:cover}
.about ul li:nth-child(4) {background:url(../images/madeups.jpg); background-size:cover}
.about ul li:nth-child(5) {background:url(../images/textiles.jpg) top center; background-size:cover}
.about ul li:nth-child(6) {background:url(../images/technicalT.jpg) bottom -20px center; background-size:250px}

.about .vision-mission {margin:150px 0; text-align:center; display:flex}
.about .vision {width:37%; border-right:2px solid #d6d6d6; margin-right:3%; padding-right:3%; flex:0 0 37%}
.about .vision-mission h2 {margin-bottom:40px}

.awards {background:url(../images/export-bg.jpg) center no-repeat; background-attachment:fixed; background-size:100%; border-radius:15px; color:#fff; padding:30px; margin-bottom:140px}
.award-title {float:left; margin:0 0 16px}
.awards img {width:135px; margin-left:8px; float:left}
.awards h3 {font-size:58px; text-transform:uppercase; float:left; line-height:52px; margin:18px 0 0 15px; letter-spacing:-2px}
.awards p {border-left:1px solid #fff; font-size:26px; font-family:'klavikalight'; padding:10px 0 10px 30px; width:calc(100% - 415px); float:left; margin-left:40px; line-height:35px; margin-top:0}

.chairman {background:url(../images/logo-bg-trans.png) top no-repeat #607ABB; background-size:contain; color:#fff; margin-top:-10px; padding:30px 0}
.chairman img {float:left; margin-right:15px; width:280px}
.chairman h3 {padding-top:90px}
.chairman a {width:230px; display:inline-block; line-height:29px}

.committee {display:flex; flex-wrap: wrap; margin:30px 0 150px}
.committee li {display:list-item; flex:0 0 33.33%; padding:20px 40px; border-right:2px solid #d6d6d6; border-bottom:2px solid #d6d6d6}
.committee h5 {color:#607ABB; margin-bottom:20px}
.committee h6 {max-width:300px}
.committee li:nth-child(3n) {border-right:0}
.committee li:nth-child(1), .committee li:nth-child(2), .committee li:nth-child(3) {padding-top:5px}
.committee li:last-child, .committee li:nth-last-child(2) {border-bottom:0}

.membership p, .events .container > p {line-height:36px; margin-top:8px}
.membership h2 span {color:#ff846b}
.ssi {display:flex; margin:30px 0 50px}
.non-ssi {flex: 0 0 50%; padding:0 40px 20px 0; border-right:2px solid #d6d6d6}
.small-ssi {padding:0 0 20px 40px}

.fees {margin-top:10px}
.fees li {display:flex; border-top:2px solid #d6d6d6; line-height:50px}
.fees li:first-child {border-top:0}
.fees li h4 {display:list-item; flex:0 0 calc(100% - 320px); line-height:45px}
.fees li h5 {display:list-item; flex:0 0 160px; line-height:45px; border-right:2px solid #d6d6d6; padding-right:20px; text-align:right}
.fees li h6 {display:list-item; flex:0 0 160px; line-height:45px; text-align:right}
.spacer {margin-top:80px}
.spacer-both {margin:90px 0 120px !important}

.events {margin-top:50px}
.events h1 {margin-bottom:10px}
.category {display:flex; margin:20px 0 40px}
.category a {display:inline-block; color:#fff; background:#bababa; text-transform:uppercase; padding:7px 20px}
.category li {margin-right:15px}
.category li a:nth-child(1) {border-radius:15px 0 0 15px}
.category li a:nth-child(2) {border-radius:0 15px 15px 0}
.category a.active, .category a:hover {background:#ff846b}

.events .list li p, .events .list li a {font-size:26px; line-height:29px}
.events .list li h6:nth-child(1), .events .list li p:nth-child(1) {flex:0 0 40px; text-align:center}
.events .list li h6:nth-child(2), .events .list li a {flex:0 0 250px}
.events .list li h6:nth-child(3), .events .list li p:nth-child(3) {flex:0 0 120px}
.events .list li h6:nth-child(4), .events .list li p:nth-child(4) {flex:0 0 32%}
.events .list li h6:nth-child(5), .events .list li p:nth-child(5) {flex:0 0 100px}
.events .list li h6:nth-child(6), .events .list li p:nth-child(6) {flex:0 0 120px}
.events .list li p:last-child {border:0; margin-right:0; padding-right:0}
.events .list li a {color:#ff846b; padding-right:10px; margin-right:10px; border-right:1px solid #d6d6d6}

.event-gallery {margin-bottom:100px}
.event-gallery .gallery1, .event-gallery .gallery2, .event-gallery .gallery3 {float:left; width:50%; text-align:center; margin-bottom:50px; padding-right:25px}
.event-gallery .gallery2 {padding-left:0; padding-right:25px}
.event-gallery ul li {width:100%; height:340px}
.event-gallery .gallery1 ul li {background:url(../images/gallery/album2/image1.jpg) center no-repeat; background-size:cover}
.event-gallery .gallery2 ul li {background:url(../images/gallery/album3/image1.jpg) center no-repeat; background-size:cover}
.event-gallery .gallery3 ul li {background:url(../images/gallery/album4/image1.jpg) center no-repeat; background-size:cover}
.event-gallery p {line-height:50px}

.articles {display:flex; margin-top:50px; text-align:center; text-transform:uppercase}
.articles li {width:200px; margin-right:12px}
.articles a {display:block; padding-bottom:30px}
.articles li img {max-width:100%; border-radius:15px}
.articles h5 {color:#000; font-size:16px; margin-top:20px; line-height:16px}
.articles h6 {color:#ff846b; font-size:16px; line-height:16px}
.articles a.active, .articles a:hover {background:url(../images/icons/orange-arrow.png) center bottom no-repeat; background-size:15px}

.article {margin:50px 0}
.article img {max-width:100%; display:none}

.list {margin-bottom:150px}
.list li {display:flex; border-bottom:1px solid #d6d6d6}
.list li h6:first-child, .list li p:first-child {flex:0 0 90px}
.gov .list li h6:nth-child(2), .gov .list li p:nth-child(2) {flex:0 0 120px}
.gov .list li h6:nth-child(3), .gov .list li p:nth-child(3) {flex:0 0 225px}
.gov .list li h6:nth-child(4), .gov .list li p:nth-child(4) {flex:0 0 24%}
.list li h6 {border-right:1px solid #d6d6d6; padding-bottom:10px; margin-right:10px; text-transform:uppercase; padding-right:10px}
.list li h6:last-child {border-right:0; margin-right:0}
.list li p {border-right:1px solid #d6d6d6; padding:10px 0; margin-right:10px; padding-right:10px}
.circulars .list li p {padding:10px 0 42px}
.list li a {padding:10px 0}
.list li p, .list li a {font-size:18px; line-height:22px; font-family:'klavikalight'; letter-spacing:-1px}
.list li a:hover, .circular p a, .gov .list li a, .circular .bullets li a {color:#ff846b}

.circular {margin-bottom:150px}
.circular .back {width:200px; margin-bottom:30px}
.circular p {margin-bottom:40px}

.circular table {border-spacing:0; margin-bottom:40px}
.circular table tr td {padding:10px; border-top:2px solid #d6d6d6; border-left:2px solid #d6d6d6; vertical-align:top}
.circular table tr:last-child td {border-bottom:2px solid #d6d6d6}
.circular table tr td:last-child {border-right:2px solid #d6d6d6}
.circular .bullets {margin:-30px 0 40px 30px}
.circular ul.bullets li {list-style:disc}
.circular ol.bullets {margin-left:0}

.gov .category, .news .category {margin:-20px 0 20px}
.news .list li p:last-child {border-right:0; margin-right:0}

.publication h2 {background:url(../images/icons/newspaper.svg) center left no-repeat; background-size:25px}
.publication .report-list {margin:10px 0 30px; display:flex; border-bottom:1px solid #d6d6d6; padding-bottom:40px}
.publication .report-list li {text-align:center; margin-right:50px}
.publication .report-list.other li {text-align:left; position:relative}
.publication .report-list.other li p {font-size:25px; position:absolute; top:0px; left:5px; letter-spacing:-2px; color:#fff}
.publication .report-list li img {height:380px; margin-bottom:5px}
.publication .category {margin:10px 0 30px}
.publication .report-list.last {border-bottom:0; margin-bottom:110px}

.contact .address {margin:20px 0 40px}
.contact iframe {border-radius:20px; float:left; margin-right:30px; width:calc(100% - 760px)}
.contact .address p {line-height:36px}
.contact p a, .publication .report-list li a {color:#000}
.contact p a:hover, .publication .report-list li a:hover {color:#ff846b}
.contact .offices {display:flex; flex-wrap:wrap; margin-bottom:40px}
.contact .offices li {padding-left:20px; border-left:1px solid #d6d6d6; margin-left:20px; flex:0 0 32%}
.contact .offices li:first-child {margin-left:0; padding-left:0; border:0}
.contact .offices p {margin-bottom:30px; line-height:36px}
.contact .offices b {font-family:'klavikabold'}
.contact .info {background:url(../images/info-bg.png) no-repeat; background-size:cover; color:#fff; padding:40px 30px; border-radius:20px; margin-bottom:150px}
.contact .info img {float:left; margin-right:30px; width:140px}
.contact .info h2 {color:#fff; margin:0}
.contact .info ul {display:flex; margin-top:20px}
.contact .info ul li {font-size:30px; font-family:'klavikalight'}
.contact .info ul li:first-child {padding-right:30px; margin-right:20px; border-right:2px solid #fff}
.contact .info ul li b {text-transform:uppercase}
.contact .info ul li a {width:155px; margin:0 0 10px}

@media screen and (max-width:1400px) {
	.container {width:95%}
	.menu {display:block}
	
	nav, header ul {display:none}
	header {background:none}
	
	.home-gallery {display:none}
	footer {margin-top:30px}
}

@media screen and (max-width:1030px) {
	.preview > li, .preview > li:nth-child(2) {width:100%; margin-top:30px; border-radius:20px}
	.home-about {background:#607ABB; color:#fff; width:105%; margin:50px 0; margin-left:-2.5%; padding:30px 3%}
}

@media screen and (max-width:700px) {
.copyright .cr, .copyright .sm, .copyright .db {width:100%; float:none; text-align:left}
	.copyright .sm {margin-top:30px}
}
	
@media screen and (max-width:600px) {
	.container {width:90%}
	.menu {right:5%}
	.preview > li > h3 {font-size:26px}
	.preview > li > h5 {font-size:17px}
	.preview > li > ul li p, .preview > li .desc p {font-size:18px; line-height:20px}
	.preview > li > ul li {padding:18px 0}
	.preview > li h6 {font-size:26px; line-height:18px; padding:5px 0 0}
	.preview > li h6 b {font-size:13px}
	.home-about {text-align:left; margin-left:-6%; width:112%; padding:30px 6%}
	footer ul li:nth-child(1) > p {margin-bottom:10px}
	.copyright .cr b {display:block; line-height:18px}
	
	footer ul li {float:none}
	footer ul li:last-child {float:none; margin-top:20px}
}