@import url(fonts.css);

/* Standard Configuration
* --------------------------------------- */

body {

    font-optical-sizing: auto;
    font-family: "Goldman Thin";

}

a {
    color: #fff;
    font-family: "Goldman Light";
}

.bold, strong {
    font-family: "Goldman Bold" !important;
}

.italic {
    font-family: "Goldman Italic" !important;
}

.thin {
    font-family: "Goldman Thin" !important;
}

a:hover {
    color: #fff;
    text-decoration: none;
}

ul {

    list-style: none;
    font-size: 20px;
    padding: 0;
    margin: 30px 0;

}

ul li {
    
    line-height: 1.8;
}

.nopadding {

    padding: 0 !important;
    margin: 0 !important;
 
 }

 .noindent {
    margin-left: -6px !important;
 }

 .noborder {
    border-bottom-width: 0px !important;
 }

 .divider  {
    border-bottom-width: 1px !important;
    border-color: #666;
    border-bottom-style: solid;
 }

.material-symbols-outlined {
    font-size: 40px !important;
}

.icon-label {
    padding: 0;
    display: inline-block;
    margin-left: 30px;
}

.icon-label .text {

    line-height: 1.4;
    vertical-align: top;
    display: inline-block;
    padding-top: 8px;
    font-size: 140%;
    font-family: "Goldman Bold";
    padding-left: 5px;

}


/* Text Formatting
* --------------------------------------- */


h1, h2, h4, h3, h5 {
    line-height: 1.4;
    vertical-align: middle;
}

h1 {
    padding-bottom: 20px;
    line-height: 1 !important;
}

strong {
        font-family: "Goldman Bold";
}

h1 span {
    border-bottom: solid 2px white;
    width: auto;
    padding: 10px 20px;
    text-transform: uppercase;
    font-size: smaller;
    line-height: 2.5;
}

h1.big {
    padding-top: 30px;
    padding-bottom: 10px;
}

h1.desktop span, h1.tablet span, h1.big span {
    font-weight: 100;
    font-size: 140%;
    border: none;
    line-height: 1.2;
    text-transform: none;
}

h1.phone span {
    font-weight: 100;
    font-size: 110%;
    border: none;
    line-height: 1.4;
    text-transform: none;
}

h1.title {
    text-shadow: none;
    font-weight: 300;
    text-transform: none;
    letter-spacing: 0;
    font-size: 4em;
    padding-bottom: 30px;
    line-height: 1.2;
    border-bottom: solid 1px #303030;
}

h1.phone .title {
    text-shadow: none;
    font-weight: 300;
    text-transform: none;
    letter-spacing: 0;
    font-size: 2em;
    padding-bottom: 30px;
    line-height: 1.2;
    border-bottom: solid 1px #303030;
}


p.article-intro {
    color: white;
    padding: 0 0 20px 0;
    font-size: 120%;
}


p .author{
    display: block;
    padding-top: 20px;
    opacity: .7;
}

.container-fluid {
    padding: 0 !important;
}

.uppercase {
    text-transform: uppercase !important;;
}


/* Tiles
* --------------------------------------- */

.tile-wrapper {
    display: table;
    background-color: rgba(0, 0, 0, .4);
    color: transparent;
    font-weight: bold;
    transition: all 0.5s ease;
    margin-bottom: -1px;
}

.tile {
    height: 25vh;
    display: table-cell;
    vertical-align: middle;
    text-align: centre;
    width: 100%;
    overflow: hidden;
    overflow-wrap: break-word;
}

.tile h4 {
    line-height: 1.2;
}

.tile-wrapper:hover {
    background-color: transparent;
    color: #fff;
}


.tile-wrapper.white { background-color: rgba(0, 160, 220, .7); text-align: left; color: white;}
.tile-wrapper.white .tile { padding: 5%; font-size: 140% !important; }
.tile-wrapper.a { border-left: solid 1px #00aeb3}
.tile-wrapper.b { border-bottom: solid 1px #7cb82f }
.tile-wrapper.c { border-left: solid 1px #dd5143 }
.tile-wrapper.d { border-bottom: solid 1px #e68523 }
.tile-wrapper.e { border-left: solid 1px #7cb82f }
.tile-wrapper.f { border-bottom: solid 1px #00a0dc }
.tile-wrapper.g { border-left: solid 1px #dc4b89 }
.tile-wrapper.h { border-bottom: solid 1px #edb220 }


/* Section Configurations
* --------------------------------------- */

#header {
    top:0px;
}

#footer {
    bottom:0px;
}

#nav {
    left:0px;
}

.section {
    text-align: left;
}

.slide,
#Section-Mission,
#Section-Profile,
#Section-Services,
#Section-Access,
#Section-Contact,
#section3 {
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    color: white;
}

.fp-slide {
    position: relative;
}




/* Section 3 */
#Section-Mission,
#Section-Services .slide,
#Section-Access .slide,
#Section-Projects-Landing,
#Section-Services-Insights,
#Section-Services-Landing { 
    
    background-image: url(../img/bg_dragon.jpg);
    background-position: bottom right;
    background-size: cover;
    background-attachment: fixed;
    padding: 0;


}



/* section-specific
* --------------------------------------- */


#Section-Services .fp-controlArrow { display: none; }

#Section-Projects-Landing,
#Section-Access .slide { background-image: none; background-color: #000;}

#Section-Participants .container {

    padding-top: 80px;

}


/* Config Fixed header and footer.
* --------------------------------------- */

#menu {
    position: fixed;
    z-index: 3;
    top: 50%;
    transform: translate(80px, -50%);
}

.container {
    margin-left: 0;
    margin-right: 0;
}

#header, #footer {
    position:fixed;
    height: auto;
    display:block;
    width: 100%;
    background: transparent;
    z-index:9;
    text-align:left;
    color: #f2f2f2;
    padding: 0;
}

#footer li {
    font-size: larger;
    opacity: 0.8;
}

#footer .copyright {
    padding-bottom: 80px;
}

#footer .copyright img {
    padding-bottom: 50px;
}

#footer .copyright span {
    opacity: 0.4;
    font-size: smaller;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-bottom: 20px;
}



/* Nav
* --------------------------------------- */

.navbar {
    margin-bottom: 0;
}

.nav > li > a {
    color: #fff;
    letter-spacing: 0;
    display: block;
    border-bottom: solid 2px transparent;
    padding: 0;
}

.nav > li > a:focus,
.nav > li:hover,
.nav > li > a:hover {
    background-color: transparent;
    text-decoration: none;
}

.nav > li:hover {
    border: 0;
    border-radius: 20px;
    background-color: rgba(215, 72, 14, 1);
    transition-duration: 500ms;
}

.navbar-header {
    margin-bottom: 30px;
}

.navbar-nav {
    padding: 0;
    width: 100%;
}

.navbar .icon-label .text {
    padding: 0px;
    padding-top: 10px;
    font-family: "Goldman Light";
    font-size: 16px;
}

.navbar .icon-label {
    text-align: center;
}

.navbar-nav li {
    padding-bottom: 30px;
    padding-top: 30px;
    min-width: 150px;
    text-align: center;
    border: 0;
    border-radius: 20px;
    background-color: rgba(0, 0, 0, 0.5);
    margin-bottom: 30px;
}

.navbar-nav li.active {
    border: 0;
    border-radius: 20px;
    background-color: #222
}
.navbar-nav li.active a .text {
    color: #fff;
    font-family: "Goldman Bold";
}

.navbar-collapse .glyphicon {
    display: none;
}

.navbar-collapse.in {
    background-color: rgba(0, 0, 0, .9);
    height: 100vh;
    padding-top: 10vh;
}

.navbar-collapse.in .glyphicon {
    display: inline-block;
}

.navbar-collapse.in li
{
    margin-bottom: 0;
    text-align: left;
    width: 100%;
}

.navbar-collapse.in li:hover,
.navbar-collapse.in li:hover a,
.navbar-collapse.in li.active,
.navbar-collapse.in li.active a
{
    border-bottom: solid 2px transparent;
    color: #d7480e;
}

.navbar-collapse.in .copyright
{
    position: absolute;
    bottom: 30px;
    width: 100%;
    text-align: center;
}

.navbar-nav .collapsing {
    -webkit-transition: none;
    transition: none;
}



.navbar-toggle {
    float: none;
    margin: 0 0 10px 0;
    border-radius: unset;

}

.navbar-toggle .icon-bar {
    width: 50px;
    background-color: white;
    margin-bottom: 6px;
}

.pagination > li > a {
    background-color: rgba(0, 0,0, .2);
    color: white;
    margin: 3px;
    padding: 10px 15px;
    border: none;
    display: block;
    font-weight: bold;
}

.pagination > li > a:hover {
    background-color: #d7480e;
    font-weight: bold;
    color: white;
    border: none;
}


/* Section Navigation
* --------------------------------------- */

.fp-slidesNav.bottom {
    position: absolute;
    width: 200px;
    margin-left: -100px;
    left: 50%;
    bottom: 80px; 
}


.fp-slidesNav.bottom ul li {
    padding: 10px;
    background-color: transparent;
}

.fp-slidesNav.bottom ul li:first-child {
    display: inline-block;
}

.fp-slidesNav.bottom ul li a {
    padding: 10px;
    border-bottom-width: 2px;
    border-bottom-style: solid;
}

.fp-slidesNav.bottom ul li a.active {
    border-width: 1px;
    border-style: solid;
}

.fp-slidesNav {
    position: relative;
    left: 0;
    margin-bottom: 30px;
}

.fp-slidesNav .icon {
    display: block;
}


.fp-slidesNav ul li:first-child {
    display: none;
}


.fp-slidesNav ul li {
    width: 30%;
    height: auto;
    margin: 0;
    padding: 0;
}


.fp-slidesNav ul li a {
    color: white;
    text-transform: uppercase;
    font-size: smaller;
    padding-bottom: 20px;
    background-color: transparent;
}

.fp-slidesNav ul li>a.active,
.fp-slidesNav ul li>a:hover
 {
    border-bottom-width: 2px;
    border-bottom-style: solid;
}



/* Slide Arrows
* --------------------------------------- */

.fp-controlArrow {
    width: 29px !important;
    height: 118px;
    background-image: url('../img/arrows_leftright.png');
    background-repeat: no-repeat;
    border: none;
}

.fp-controlArrow.fp-next {
    background-position-x: -29px;
    right: 25px;
}
.fp-controlArrow.fp-prev {
    background-position-x: 0px;
    left: 25px;
}



/* Bar Graph
* --------------------------------------- */

#graph ul {
    margin: 0;
    padding: 0;
}

#graph ul li {
    height: 50px;
    list-style-type: none;
    display: block;
    background-color: rgba(255, 255, 255, .2);
    font-size: 16px;
    border-bottom: solid 2px;
    line-height: 50px;
    text-align: left;
    margin: 20px 0;
    padding-left: 20px;
    
}

#graph ul li div {
    float: right;
    padding: 0 15px;
    text-align: center;
}

#graph li.eu {width: 332px;}
#graph li.eu.end {width: 351px;}

#graph li.asia {width: 213px;}
#graph li.asia.end {width: 870px;}

#graph li:nth-child(1) {border-color: #00a0dc }
#graph li:nth-child(2) {border-color: #8d6cab }

#graph li:nth-child(1) div {background-color: #00a0dc }
#graph li:nth-child(2) div {background-color: #8d6cab }

#graph #year {
    padding: 10px 20px;
    border-bottom: solid 2px white;
}



/* Project
* --------------------------------------- */


.project {
    text-align: left;
}

.project h1 {
    padding-bottom: 0;
}

.project h1 span {
    padding-left: 0;
    font-size: 75%;
}

.project-block {
    margin-top: 40px;
}

.project-info {

    text-align: left;
    padding: 0 0 0 30px;
}

.project-info p {
    font-size: 18px;
    line-height: 1.6;
}

.project-info span {
    font-size: 18px;
    background: transparent;
    padding: 10px;
}

.project-info ul {
    margin: 0;
    margin-left: -30px;
    padding: 15px 30px;
}

.project-info ul li {
    display: inline-block;
    margin: 0;
    color: white;
    padding: 0;
    text-transform: uppercase;
    font-size: smaller;
}




/* Circle
* --------------------------------------- */


.circle-wrapper {
    position: relative;
    margin: auto;
    display: table; 
    background-repeat: no-repeat;
    margin-bottom: 40px;
}

.circle-wrapper ul {
    padding: 0;
}

.circle-wrapper li {
    display: inline-block;
    margin: 0;
    padding: 10px;
    position: absolute;
    width: 180px;
    color: white;
    text-align: center;   
    border-bottom-width: 1px;
    border-bottom-style: solid;
    background-color: transparent;
}

.circle-wrapper li:hover {
    background-color: rgba(0, 0,0, .5);
    cursor: pointer;
}

.circle-wrapper li span {
    text-transform: uppercase;
    font-weight: 300;
    font-size: 12px;
}

.circle-middle {
    display: table-cell;
    vertical-align: middle;
}

.circle {
    border-radius: 50%;
    background-color: rgba(0, 0,0, .7);
    width: 270px;
    height: 270px;
    margin: auto;
    padding-top: 30px;
    overflow: hidden;
    color: white !important;
}

.circle h4 {
    text-transform: uppercase;
    line-height: 20px !important;
    padding: 0 40px;
}

.circle p {
    font-size: 12px;
    padding-top: 10px;
}

.circle:hover {
    background-color: rgba(255, 255, 255, 0.1);
    cursor: pointer;
}

.circle:hover .icon {
    background-position-y: 0;
}


/* profile */

.circle-wrapper.profile {
    width: 600px;
    height: 339px;
    background-image: url('../img/circle_dashes-down.png');
    background-position-y: -55px;
}

.circle-wrapper.profile .circle {
    padding: 0;
    margin-top: -50px;
}


/* spokes */

.circle-wrapper.spokes {    
    width: 600px;
    height: 400px;
    background-image: url('../img/circle_dots.png');
}

.circle-wrapper.spokes li:nth-child(1) { right: 540px; top: 55px; }
.circle-wrapper.spokes li:nth-child(2) { right: 560px; top: 115px; }
.circle-wrapper.spokes li:nth-child(3) { right: 560px; bottom: 115px; }
.circle-wrapper.spokes li:nth-child(4) { right: 540px; bottom: 55px;}
.circle-wrapper.spokes li:nth-child(5) { left: 540px; top: 55px; }
.circle-wrapper.spokes li:nth-child(6) { left: 560px; top: 115px; }
.circle-wrapper.spokes li:nth-child(7) { left: 560px; bottom: 115px; }
.circle-wrapper.spokes li:nth-child(8) { left: 540px; bottom: 55px;}

/* spokes tablet */

.circle-wrapper.spokes.tablet {
    margin-top: 50px;
    width: 300px;
    height: 200px;
    background-size: 100%;
    background-image: url('../img/circle_dots-compact.png');
}

.circle-wrapper.spokes.tablet .circle { 
    width: 50%;
    height: 150px;
    padding-top: 55px;
}  

.tablet li {
    padding: 5px 0;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    width: 155px;
    background-color: transparent;
}

.circle-wrapper.spokes.tablet li span {
    font-size: 11px;
}

.circle-wrapper.spokes.tablet .circle h4 {
    text-transform: uppercase;
    padding: 0 10px;
    line-height: 20px !important;
    font-size: 16px;
    margin: 0;
}

.circle-wrapper.spokes.tablet .circle p {
    display: none;
}

.circle-wrapper.spokes.tablet li:nth-child(1), ul.services li:nth-child(1) { right: 250px; top: -20px;}
.circle-wrapper.spokes.tablet li:nth-child(2), ul.services li:nth-child(2) { right: 270px; top: 20px;}
.circle-wrapper.spokes.tablet li:nth-child(3), ul.services li:nth-child(3) { right: 270px; bottom: 35px;}
.circle-wrapper.spokes.tablet li:nth-child(4), ul.services li:nth-child(4) { right: 250px; bottom: -5px;}
.circle-wrapper.spokes.tablet li:nth-child(5), ul.services li:nth-child(5) { left: 250px; top: -20px;}
.circle-wrapper.spokes.tablet li:nth-child(6), ul.services li:nth-child(6) { left: 270px; top: 20px;}
.circle-wrapper.spokes.tablet li:nth-child(7), ul.services li:nth-child(7) { left: 270px; bottom: 35px;}
.circle-wrapper.spokes.tablet li:nth-child(8), ul.services li:nth-child(8) { left: 250px; bottom: -5px;}


/* spokes phone */

.circle-wrapper.spokes.phone {
    width: auto;
    height: auto;
    background: none;
}


.circle-wrapper.spokes.phone .circle-middle {
    display: none;
}


.circle-wrapper.spokes.phone li {
    display: block;
    margin: 0;
    padding: 10px;
    width: 47%;
    right: 0;
    left: 0;
    top: 0;
    position: relative;
    color: white;
    text-align: center;
    background: transparent;
    line-height: 1;
}

.circle-wrapper.spokes.phone li span {
    font-size:10px;
}



/* Lists
* --------------------------------------- */

ul.post-it, ul.services  {
    margin: 0;
    padding: 0;
}

ul.post-it li:first-child {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    padding: 0;
    background-color: transparent;
}

ul.post-it li .header {
    color: white;
    padding: 15px 10px;
    font-size: larger;
    letter-spacing: 1px;
    line-height: 1;
}

ul.post-it li, ul.services li {
    display: block;
    margin: 0;
    color: white;
    text-align: center;
    background-color: rgba(255, 255,255, .1);
    margin: 5px 0;
    text-transform: uppercase;
    padding: 10px;
    font-size: smaller;
    min-height: 40px;
}


/* Colours
* --------------------------------------- */

.blue {color: #00a0dc; border-color: #00a0dc; background-color: rgba(0, 160, 220, .5);}
.purple {color: #8d6cab; border-color: #8d6cab; background-color: rgba(141, 108, 171, .5);}
.orange {color: #fff; border-color: #d7480e; background-color: rgba(215, 72, 14, 1);}
.white {color: #000 !important; border-color: #fff; background-color: rgba(255, 255, 255, 1);}
.yellow {color: #e68523; border-color: #e68523; background-color: rgba(230, 133, 35, .5);}
.cyan {color: #00aeb3; border-color: #00aeb3; background-color: rgba(0, 174, 179, .5);}
.yellow-light {color: #edb220; border-color: #edb220; background-color: rgba(237, 178, 32, .5);}
.pink {color: #dc4b89; border-color: #dc4b89; background-color: rgba(220, 75, 137, .5);}
.green {color: #7cb82f; border-color: #7cb82f; background-color: rgba(124, 184, 47, .5);}
.dark-gray {color: #303030; border-color: #707070; background-color: rgba(0, 0, 0, .7);}


/* Rectangle
* --------------------------------------- */


.rectangle ul {
    margin: 0;
    padding: 0;
    border-spacing: 10px;
    border-collapse: separate;
}

.rectangle li {
    list-style-type: none;
    display: table-cell;
    margin: 0 2px;
    background-color: rgba(255, 255,255, .1);
    width: 25%;
    height: 200px;
    vertical-align: middle;
    font-size: 18px;
    padding: 30px;
    border-bottom: solid 2px;
}

.rectangle .circle {
    width: 50px;
    height: 50px;
    margin-bottom: 25px;
    padding-top: 13px;
    font-weight: 900;
}


.rectangle .circle:hover {
    background-color: rgba(255, 255, 255, 0.1);
}


.rectangle li:nth-child(1):hover { background-color: #00a0dc }
.rectangle li:nth-child(2):hover { background-color: #8d6cab }
.rectangle li:nth-child(3):hover { background-color: #dd5143 }
.rectangle li:nth-child(4):hover { background-color: #e68523 }

.rectangle li:nth-child(1) { border-color: #00a0dc }
.rectangle li:nth-child(2) { border-color: #8d6cab }
.rectangle li:nth-child(3) { border-color: #dd5143 }
.rectangle li:nth-child(4) { border-color: #e68523 }

/* Buttons 
* --------------------------------------- */

.button {
    color: white;
    padding: 10px 28px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 130%;
    font-family: "Goldman Light";
    border-radius: 20px;
    margin-right: 20px;
}

.button:hover{
    background-color: white;
    color: black !important;
    transition-duration: 500ms;
}

.button a, .button:hover{
    text-decoration: none;
    color: white;
}

a.link:hover {
    color: #e68523;
}





/* Area
* --------------------------------------- */

.area {
    padding: 10px;    
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.5);
    border-bottom: solid 1px #00a0dc;
    margin: 30px 0px;
}

.area.green {
    border-bottom: solid 1px #4CAF50;
}

.area.button {
    display: block;
}


.area.button a {
    display: block;    
    color: white;
}

.area.button a:hover{
    text-decoration: none;
    color: white;
}



/* Items
* --------------------------------------- */

.cards {

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4em 4em;

}

.cards a.card {
    text-decoration: none !important;
    color: inherit;
    transition: all 300ms ease-in-out;
    filter: grayscale(100%);
}

.cards a.card:focus, .cards a.card:hover {
    transform: scale(1.025);
    filter: grayscale(0);
}

.cards .card {
    position: relative;
    display: block;
    max-width: 100%;
}

.cards .card .card-image {
    position: relative;
    width: 100%;
    padding-bottom: 60%;
    transition: all 300ms ease-in-out;
    display: block;
}

.cards .card .card-image .card-image-inner {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    background-image: radial-gradient(circle at 50% 55%, #757575 0, #1f1f1f 125%);
    border-radius: 1em;
    border-bottom-left-radius: 0;
    overflow: hidden;
}

.cards .card .card-image .card-image-inner img {
    position: absolute;
    height: 140% !important;
    inset: 0px;
    color: transparent;
    width: auto !important;
    left: 50% !important;
    transform: translateX(-50%);
    border: 0;
}

.cards .card .card-description {
    padding-top: 2em;
    display: block;
}

.cards .card .card-description-title {
    display: flex;
    align-items: center;
    font-size: 150%;
    line-height: 1.5;
    text-decoration: none !important;
}

.cards .card .card-description-subtitle {
    display: block;
    font-size: 120%;
    line-height: 1.2;
    margin-top: .25em;
}


.video { /* This is to make the video appear behind everything else */
    position: fixed;
    left: 0;
    top: 0;
    min-width: 100%; 
    min-height: 100%;
    z-index: 1;
}

.story {
    padding: 40px;
    margin-top: 25px;
    color: white;
    font-size: 160%;
    line-height: 1.6;
    font-weight: 100;
    background-color: transparent;
    border-bottom-width: 1px;
    border-bottom-style: solid;

}

.logo-bottom
{
    width: 400px;
    position: absolute;
    left: 50%;
    margin-left: -200px;
    bottom: 150px;
}

.moveDown {
    margin-top: 60px;
    display: block;
}

.icons .wrapper {
    background-color: transparent;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

blockquote {

    border: none;
    padding: 0;
    text-align: left;

}

blockquote footer {
    margin-top: 20px;
}

.icon-caption {
    color: white;
    line-height: 58px;
    text-transform: uppercase;
    font-size: smaller;
}

.corner-icon {
    padding: 5px;
    position: absolute;
    top: 0;
    left: 0;
    color: white;
    background-color: transparent;
}

.corner-icon .glyphicon {
    font-size: 20px;
    display: block;
    padding-bottom: 10px;
}

.corner-icon a {
    color: #fff;
    text-decoration: none;
    display: block;
    text-transform: uppercase;
    font-size: 90%;
    padding: 15px;
    opacity: .7;
}

.corner-icon a:hover {
    opacity: 1;
}

.btn-icon {
    padding: 7px;
    text-align: center;
}

.btn-icon:hover {
    background-color: #00a0dc;
    cursor: pointer;
}


.tagline li {
    text-transform: uppercase;
    padding: 35px 15px;
    color: #fff;
    font-weight: 300;
    letter-spacing: 2px;
    font-size: 120%;
    opacity: 1
}

.tagline li:hover span {
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.tagline a, .tagline a:hover {
    text-decoration: none;
}

.tagline span {
    background-color: transparent;
}

.profile-photo {
    width: 300px;
    height: 300px;
    background-image: url('../img/profile-photo.jpg');
}

.footnote, .footnote a {
    color: white;
    opacity: 0.7;
    font-weight: 100;
}

.footnote a:hover {
    color: white;
    opacity: 1;
}

.locations li {
    font-size: 12px;
    font-weight: 400;
    text-transform: uppercase;
    padding: 0 10px !important;
}


.thumbnail {
    color: white;
    border-top-width: 0;
    border-left-width: 0;
    border-right-width: 0;
    background-color: transparent;
    padding: 0;
    padding-bottom: 20px;
    text-align: center;
    border-radius: 0;
}

.thumbnail a, .thumbnail a:hover {
    text-decoration: none !important;
}

.thumbnail:hover, .thumbnail.active { 
    
    border-bottom-width: 4px;
    border-bottom-style: solid;    
    cursor: pointer;
}

.thumbnail .caption {
    padding: 0;
    color: white;
    font-weight: 100;
}

.thumbnail .caption h3 {
    margin-top: 0;
    font-weight: 100;
}



/* Icons
* --------------------------------------- */

/* set context */

.icon { 
    background-image: url('../img/icons.png');
    border: none;
    margin: 0 auto;
    background-color: transparent;
    display: inline-block
}

/* set size */

.icon.big { width: 174px; height: 174px;}
.icon.med { width: 87px; height: 87px; background-size: 1100%; }
.icon.small {  width: 58px; height: 58px; background-size: 1100%; }

/* set image */

.icon.big.strategy { background-position-x: 0; }
.icon.med.strategy { background-position-x: 0; }
.icon.small.strategy { background-position-x: 0; }

.icon.big.fund { background-position-x: -174px; }
.icon.med.fund { background-position-x: -87px; }
.icon.small.fund { background-position-x: -58px; }

.icon.big.execute { background-position-x: -348px; }
.icon.med.execute { background-position-x: -174px; }
.icon.small.execute { background-position-x: -116px; }

.icon.big.insights { background-position-x: -522px;}
.icon.med.insights { background-position-x: -261px;}
.icon.small.insights { background-position-x: -174px;}

.icon.big.pdf { background-position-x: -696px; }
.icon.med.pdf { background-position-x: -348px; }
.icon.small.pdf { background-position-x: -232px; }

.icon.big.twitter { background-position-x: -870px; }
.icon.med.twitter { background-position-x: -435px; }
.icon.small.twitter { background-position-x: -290px; }

.icon.big.fb { background-position-x: -1044px; }
.icon.med.fb { background-position-x: -522px; }
.icon.small.fb { background-position-x: -348px; }

.icon.big.in { background-position-x: -1214px; }
.icon.med.in { background-position-x: -609px; }
.icon.small.in { background-position-x: -406px; }

.icon.big.email { background-position-x: -1392px; }
.icon.med.email { background-position-x: -696px; }
.icon.small.email { background-position-x: -464px; }

.icon.big.mob { background-position-x: -1566px; }
.icon.med.mob { background-position-x: -783px; }
.icon.small.mob { background-position-x: -522px; }

.icon.big.cv { background-position-x: -1740px; }
.icon.med.cv { background-position-x: -870px; }
.icon.small.cv { background-position-x: -580px; }


/* set colour */

.icon.big.blue { background-position-y: -0;}
.icon.big.white { background-position-y: -174px;}   /* = .icon-big.icon-blue -> width * 1 */
.icon.big.orange { background-position-y: -348px;}  /* = .icon-big.icon-blue -> width * 2 */
.icon.big.purple { background-position-y: -522px;}  /* = .icon-big.icon-blue -> width * 3 */

.icon.med.blue { background-position-y: -0;}
.icon.med.white { background-position-y: -87px;}    /* = .icon-med.icon-blue -> width * 1 */
.icon.med.orange { background-position-y: -174px;}  /* = .icon-med.icon-blue -> width * 2 */
.icon.med.purple { background-position-y: -261px;}  /* = .icon-med.icon-blue -> width * 3 */

.icon.small.blue { background-position-y: -0;}
.icon.small.white { background-position-y: -58px;}  /* = .icon-small.icon-blue - width * 1 */
.icon.small.orange { background-position-y: -116px;}/* = .icon-small.icon-blue - width * 2 */
.icon.small.purple { background-position-y: -174px;}/* = .icon-small.icon-blue - width * 3 */