@font-face {
    font-family: 'rubik';
    src: url('../../fonts/rubik/Rubik-Light.eot');
    src: url('../../fonts/rubik/Rubik-Light.eot?#iefix') format('embedded-opentype'),
        /*url('../../fonts/rubik/Rubik-Light.woff2') format('woff2'),*/
        url('../../fonts/rubik/Rubik-Light.woff') format('woff'),
        url('../../fonts/rubik/Rubik-Light.ttf') format('truetype'),
        url('../../fonts/rubik/Rubik-Light.svg#Rubik-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'rubik';
    src: url('../../fonts/rubik/Rubik-Regular.eot');
    src: url('../../fonts/rubik/Rubik-Regular.eot?#iefix') format('embedded-opentype'),
        /*url('../../fonts/rubik/Rubik-Regular.woff2') format('woff2'),*/
        url('../../fonts/rubik/Rubik-Regular.woff') format('woff'),
        url('../../fonts/rubik/Rubik-Regular.ttf') format('truetype'),
        url('../../fonts/rubik/Rubik-Regular.svg#Rubik-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'rubik';
    src: url('../../fonts/rubik/Rubik-Bold.eot');
    src: url('../../fonts/rubik/Rubik-Bold.eot?#iefix') format('embedded-opentype'),
        /*url('../../fonts/rubik/Rubik-Bold.woff2') format('woff2'),*/
        url('../../fonts/rubik/Rubik-Bold.woff') format('woff'),
        url('../../fonts/rubik/Rubik-Bold.ttf') format('truetype'),
        url('../../fonts/rubik/Rubik-Bold.svg#Rubik-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'rubik';
    src: url('../../fonts/rubik/Rubik-Medium.eot');
    src: url('../../fonts/rubik/Rubik-Medium.eot?#iefix') format('embedded-opentype'),
        /*url('../../fonts/rubik/Rubik-Medium.woff2') format('woff2'),*/
        url('../../fonts/rubik/Rubik-Medium.woff') format('woff'),
        url('../../fonts/rubik/Rubik-Medium.ttf') format('truetype'),
        url('../../fonts/rubik/Rubik-Medium.svg#Rubik-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
  font-family: "gsl-icon-font";
  src:url("../../fonts/gsl-font/global-sun-logistics.eot");
  src:url("../../fonts/gsl-font/global-sun-logistics.eot?#iefix") format("embedded-opentype"),
    url("../../fonts/gsl-font/global-sun-logistics.woff") format("woff"),
    url("../../fonts/gsl-font/global-sun-logistics.ttf") format("truetype"),
    url("../../fonts/gsl-font/global-sun-logistics.svg#global-sun-logistics") format("svg");
  font-weight: normal;
  font-style: normal;

}

[data-icon]:before {
  font-family: "gsl-icon-font" !important;
  content: attr(data-icon);
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class^="gsl-icon-"]:before,
[class*=" gsl-icon-"]:before {
  font-family: "gsl-icon-font" !important;
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.gsl-icon-angle-down:before {
  content: "\e014";
}
.gsl-icon-angle-left:before {
  content: "\e015";
}
.gsl-icon-angle-right:before {
  content: "\e016";
}
.gsl-icon-angle-up:before {
  content: "\e017";
}
.gsl-icon-chevron-down:before {
  content: "\e018";
}
.gsl-icon-chevron-left:before {
  content: "\e019";
}
.gsl-icon-chevron-right:before {
  content: "\e01a";
}
.gsl-icon-chevron-up:before {
  content: "\e01b";
}
.gsl-icon-arrows:before {
  content: "\e000";
}
.gsl-icon-arrows-alt:before {
  content: "\e001";
}
.gsl-icon-caret-down:before {
  content: "\e002";
}
.gsl-icon-caret-left:before {
  content: "\e003";
}
.gsl-icon-caret-right:before {
  content: "\e004";
}
.gsl-icon-caret-up:before {
  content: "\e005";
}
.gsl-icon-check:before {
  content: "\e006";
}
.gsl-icon-ellipsis-h:before {
  content: "\e007";
}
.gsl-icon-ellipsis-v:before {
  content: "\e008";
}
.gsl-icon-arrow-down:before {
  content: "\e009";
}
.gsl-icon-arrow-left:before {
  content: "\e00a";
}
.gsl-icon-arrow-right:before {
  content: "\e00b";
}
.gsl-icon-arrow-up:before {
  content: "\e00c";
}
.gsl-icon-boat:before {
  content: "\e00d";
}
.gsl-icon-check-product:before {
  content: "\e00e";
}
.gsl-icon-company:before {
  content: "\e00f";
}
.gsl-icon-fax:before {
  content: "\e010";
}
.gsl-icon-fax-bold:before {
  content: "\e011";
}
.gsl-icon-mail:before {
  content: "\e012";
}
.gsl-icon-mail-bold:before {
  content: "\e013";
}
.gsl-icon-phone:before {
  content: "\e01c";
}
.gsl-icon-phone-bold:before {
  content: "\e01d";
}
.gsl-icon-phone-fill:before {
  content: "\e01e";
}
.gsl-icon-pin:before {
  content: "\e01f";
}
.gsl-icon-pin-bold:before {
  content: "\e020";
}
.gsl-icon-pin-fill:before {
  content: "\e021";
}
.gsl-icon-plane:before {
  content: "\e022";
}
.gsl-icon-shipping:before {
  content: "\e023";
}
.gsl-icon-truck:before {
  content: "\e024";
}
.gsl-icon-truck-left:before {
  content: "\e025";
}
.gsl-icon-worldwide:before {
  content: "\e026";
}
.gsl-icon-play:before {
  content: "\e027";
}
.gsl-icon-play-stroke:before {
  content: "\e028";
}


/* --- font weight --- */

.font-light {
	font-weight: 300 !important;
}
.font-regular {
	font-weight: 400 !important;
}
.font-medium, strong {
	font-weight: 500 !important;
}
.font-bold {
	font-weight: 700 !important;
}

/* --- text color --- */

.textcolor-main {
	color:rgba(71,73,86,1) !important;
}
.textcolor-black {
	color:rgba(23,23,25,1) !important;
}
.textcolor-gray {
	color:rgba(149,153,163,1) !important;
}
.textcolor-white {
	color:rgba(255,255,255,1) !important;
}
.textcolor-red {
	color:rgba(236,34,46,1) !important;
}
.textcolor-dark-blue {
	color:rgba(28,34,102,1) !important;
}


/* --- font size --- */

html, body {
	font: 400 14px/25px 'rubik';
	letter-spacing:0;
	color:rgba(71,73,86,1);
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
	margin: 0;
}
h1, h2, h3, h4, h5, .h1, .h2, .h3, .h4, .h5 {
	font-weight:400;
}
h1, .h1, .main-topic {
	font-size:28px;
	line-height:35px;
}
h2, .h2, .sub-topic {
	font-size:22px;
	line-height:25px;
}
h3, .h3 {
	font-size: 20px;
	line-height:25px;
}
h4, .h4 {
	font-size: 16px;
	line-height:25px;
}
h5, .h5 {
	font-size: 14px;
	line-height: 20px;
}
h6, .h6 {
	font-size: 12px;
	line-height: 15px;
	font-weight:400;
}
.main-topic, .sub-topic {
	word-spacing: 5px;
}

/*.main-topic, .sub-topic {
	text-transform:uppercase !important;
}*/

.none-letter-spacing {
	letter-spacing:0 !important;
}
.text-center {
	text-align: center;
}
.text-upper {
	text-transform: uppercase !important;
}
.text-lower {
	text-transform: lowercase !important;
}
.text-capitalize {
	text-transform: capitalize !important;
}

i {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}
i:before {
	display:block;
}

/* lg customized */
@media (min-width:1200px) and (max-width:1649px) {
h1, .h1, .main-topic {
	font-size:25px;
	line-height:30px;
}
h2, .h2, .sub-topic {
	font-size:20px;
	line-height:25px;
}
h3, .h3 {
	font-size: 18px;
	line-height:25px;
}
h4, .h4 {
    font-size: 15px;
    line-height: 25px;
}
h5, .h5 {
	font-size: 12px;
	line-height: 20px;
}
h6, .h6 {
	font-size: 12px;
	line-height: 15px;
	font-weight:400;
}
}

/* md */
@media (min-width:992px) and (max-width:1199px) {
html, body {
	font-size:13px;
	line-height:20px;
}
h1, .h1, .main-topic {
	font-size:22px;
	line-height:30px;
}
h2, .h2, .sub-topic {
	font-size:19px;
	line-height:25px;
}
h3, .h3 {
	font-size: 17px;
	line-height:22px;
}
h4, .h4 {
	font-size: 15px;
	line-height:20px;
}
h5, .h5 {
	font-size: 13px;
	line-height: 20px;
}
h6, .h6 {
	font-size: 12px;
	line-height: 15px;
	font-weight:400;
}
.main-topic, .sub-topic {
	word-spacing: 3px;
}
}

/* sm - xs */
@media (max-width:991px) {
}

/* sm */
@media (min-width:768px) and (max-width:991px) {
html, body {
	font-size:13px;
	line-height:20px;
}
h1, .h1, .main-topic {
	font-size:25px;
	line-height:30px;
}
h2, .h2, .sub-topic {
	font-size:22px;
	line-height:25px;
}
h3, .h3 {
	font-size: 18px;
	line-height:25px;
}
h4, .h4 {
	font-size: 14px;
	line-height:20px;
}
h5, .h5 {
	font-size: 14px;
	line-height: 20px;
}
h6, .h6 {
	font-size: 12px;
	line-height: 15px;
	font-weight:400;
}
.main-topic, .sub-topic {
	word-spacing: 3px;
}
}

/* xs */
@media (max-width:767px) {	
html, body {
	font-size:13px;
	line-height:22px;
}
h1, .h1, .main-topic {
	font-size:18px;
	line-height:25px;
	font-weight:500;
}
h2, .h2, .sub-topic {
	font-size: 16px;
	line-height:25px;
}
h3, .h3 {
	font-size: 15px;
	line-height:25px;
}
h4, .h4 {
	font-size: 12px;
	line-height:20px;
}
h5, .h5 {
	font-size: 12px;
	line-height: 20px;
}
h6, .h6 {
	font-size: 10px;
	line-height: 15px;
	font-weight:400;
}
.main-topic.font-medium { font-weight:700 !important; }

}

/* xs customized */
@media (max-width:399px) {
}