/* Body */
body{
  text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;

  color: #253858;
  background-color: #F7F7F7;

  font-family: 'atlantic-reguler';
  font-size: 1rem;
  line-height: 1.6;
}

/* Color */
.c-primary{
  color: #000070;
}

.c-black{
  color: #253858;
}

.c-black-weak{
  color: #25385860;
}

.c-white{
  color: #fff;
}

.c-white-weak{
  color: #ffffff60;
}

.c-red{
  color: #E01E37;
}

/* Background Color */
.b-primary{
  background-color: #000070;
}

/* Font */
@font-face {
  font-family: 'atlantic-reguler';
  src: url('../garnis/font/RobotoMono-Regular.woff2') format('woff2')
}

@font-face {
  font-family: 'atlantic-bold';
  src: url('../garnis/font/RobotoMono-Bold.woff2') format('woff2')
}

@font-face {
  font-family: 'atlantic-head-reguler';
  src: url('../garnis/font/ScreenerW01-Regular.woff2') format('woff2')
}

@font-face {
  font-family: 'atlantic-head-bold';
  src: url('../garnis/font/ScreenerW01-Bold.woff2') format('woff2')
}

.atlantic-reguler{
  font-family: "atlantic-reguler";
}

.atlantic-bold{
  font-family: "atlantic-bold";
}

.atlantic-head-reguler{
  font-family: "atlantic-head-reguler";
}

.atlantic-head-bold{
  font-family: "atlantic-head-bold";
}

/* Font Size */
h1{
  font-family: "atlantic-head-reguler";
  font-size: 62px;
  line-height: 1.1;
}

h2{
  font-family: "atlantic-head-reguler";
  font-size: 52px;
  line-height: 1.1;
}

h3{
  font-family: "atlantic-head-bold";
  font-size: 36px;
  line-height: 1.1;
}

h4{
  font-family: "atlantic-head-bold";
  font-size: 28px;
  line-height: 1.1;
}

h5{
  font-family: "atlantic-reguler";
  font-size: 20px;
  line-height: 1.6;
}

h6{
  font-family: "atlantic-reguler";
  font-size: 14px;
  line-height: 1.6;
}

p{
  font-family: "atlantic-reguler";
  font-size: 16px;
  line-height: 1.6;
}

.tittle-info{
  font-family: "atlantic-bold";
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  line-height: 1.4;
}

/* Preloader */
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
.loader {
    width: 40px;
    height: 40px;
    left: calc(50% - 20px) !important;
    top: calc(50% - 20px);
    -webkit-animation: spin .7s linear infinite;
    position: fixed;
    animation: spin .7s linear infinite;
    background: url(../garnis/svg/icon-prelaoder.svg);
    background-size: cover;
}

#loading .textLoader{
	position: fixed;
	top: calc(50% + 40px);
	color: #fff;
	width: 100%;
    left: unset !important;
}

#loading {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: center no-repeat #000070;
}