@font-face {
  font-family: 'OpenSans-Regular';
  src: url('../font/OpenSans-Regular.ttf');
}
@font-face {
  font-family: 'OpenSans-Semibold';
  src: url('../font/OpenSans-Semibold.ttf');
}
@font-face {
  font-family: 'OpenSans-Bold';
  src: url('../font/OpenSans-Bold.ttf');
}
@-webkit-keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}
@keyframes fadeIn {
    from { opacity: 0; }
      to { opacity: 1; }
}
*{
	font-family: OpenSans-Regular, helvetica, arial, sans-serif;
    margin: 0;
    padding: 0;
}
body {
	width: 100%;
    margin: 0;
    padding: 0;
    text-align: justify;
}
a {
    text-decoration: none;
    outline: none;
}
.gs-semibold {
    font-family: OpenSans-Semibold, helvetica, arial, sans-serif;
}
.gs-bold, h1, h2, h3, h4, h5 {
    font-family: OpenSans-Bold, helvetica, arial, sans-serif;
}
.gs-display-none {
    display: none;
}
.gs-nav-bar {
    padding: 1em 0;
    position: fixed;
    display: none;
    width: 100%;
    height: 64px;
    z-index: 9999;
    background: #fff;
    opacity: 1;
}
.gs-nav-ul {
    float: right;
    list-style: none;
    display: inline-block;
    height: 64px;
    vertical-align: middle;
    float: right;
    line-height: 64px;
    padding-right: 5%;
}
.gs-nav-li {
    display: inline-block;
    padding-left: 4em;
}
.gs-nav-li a {
    font-family: OpenSans-Semibold, helvetica, arial, sans-serif;
    text-decoration: none;
    color: #000;
    font-size: 14px;
    border-bottom: 3px solid transparent;    
    transition: 1.5s ease;
    padding: 0 0 3px;
    width: 0px;
    white-space: nowrap;
    height: 25px;
}
.gs-nav-li a:hover {
    border-bottom: 3px solid red;
    width: 200px;
}
.gs-dropdown-nav-ul {
    display: none;
    list-style: none;
    position: absolute;
    background: #fff;
    line-height: 32px;
    padding-bottom: .5em;
}
.gs-nav-li-capabilities:hover .gs-dropdown-nav-ul {
    display: block;
    -webkit-animation: fadeIn .75s;
    animation: fadeIn .75s;
}
.gs-dropdown-nav-li {
    padding: 0 1.5em;

}
.gs-dropdown-nav-li a {
    font-family: OpenSans-Semibold, helvetica, arial, sans-serif;
    text-decoration: none;
    color: #000;
    border-bottom: none;    
    transition: none;
    padding: 0;
}
.gs-dropdown-nav-li a:hover {
    border-bottom: none;
    color: red;
}
.gs-logo-container {
    display: inline-block;
    padding-left: 5%;
}
.gs-logo {
    width: 150px;
}
.gs-icon {
    width: 100px;
    height: 100px;
    border-radius: 100%;
}
.gs-icon-design {
    background-image: url("../img/gs-icon-design-1.png");
}

.gs-icon-sourcing {
    background-image: url("../img/gs-icon-sourcing-1.png");
}
.gs-icon-distribution {
    background-image: url("../img/gs-icon-distribution-1.png");
}
.gs-icon-design:hover {
    background-image: url("../img/gs-icon-design-2.png");
}

.gs-icon-sourcing:hover {
    background-image: url("../img/gs-icon-sourcing-2.png");
}
.gs-icon-distribution:hover {
    background-image: url("../img/gs-icon-distribution-2.png");
}
.gs-icon-design-3 {
    background-image: url("../img/gs-icon-design-3.png");

}
.gs-icon-sourcing-3 {
    background-image: url("../img/gs-icon-sourcing-3.png");
}
.gs-icon-distribution-3 {
    background-image: url("../img/gs-icon-distribution-3.png");
}
.gs-footer-container {
    background: #35363A;
    color: #fff;
    text-align: center;
    padding: 1.5em 0;
    position: relative;
    bottom: 0;
    width: 100%;
}
.gs-footer-container p {
    font-size: 12px;
}
@media screen and (max-width: 55em) {
    .gs-nav-li {
        padding-left: 2em;
    }
}
@media screen and (max-width: 45em) {
    .gs-nav-bar {
        opacity: 1 !important;
        display: block;
        height: 101px;
    }
    .gs-dropdown-nav-ul {
        top: 132px;
    }
    .gs-logo-container {
        padding: 0;
        display: block;
        margin: auto;
    }
    .gs-logo {
        display: block;
        margin: auto;
    }
    .gs-nav-ul {
        float: none;
        padding: 0 5%;
        margin: 0 auto;
        max-width: 450px;
        display: flex;
        justify-content: space-between;
        background: #fff;
    }
    .gs-nav-li {
        padding-left: 0;
    }
    .gs-nav-li a {
        font-size: 12px;
    }
}