@font-face {
    font-family: Source Code Pro;
    font-weight: 400;
    src: url(../fonts/SourceCodePro-Regular.ttf) format('truetype');
}

@font-face {
    font-family: Nonito Sans;
    font-weight: 400;
    src: url(../fonts/NunitoSans-Regular.ttf) format('truetype');
}

@font-face {
    font-family: Nonito Sans Bold;
    font-weight: 600;
    src: url(../fonts/NunitoSans-Bold.ttf) format('truetype');
}

@font-face {
    font-family: Nonito Sans Bold Italic;
    font-style: italic;
    font-weight: 600;
    src: url(../fonts/NunitoSans-BoldItalic.ttf) format('truetype');
}

html {
    --darkBlue: #3B4856;
    --midBlue: #006699;
    --ligthBlue: #9FADBD;
    --midFush: #91496A;
    --lightFush: #C97B9D;
    --midYelo: #E49D22;
    --lightYelo: #FFECCC;
    --midBrown: #8B7356;
    --midGreen: #5CA700;
    --midRed: #FF3C26;
}

body {
    font-family: Nonito Sans, sans-serif;
    font-style: normal;
    -webkit-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
}

.dark-green {color: #354422;}
.dark-blue  {color: #3B4856;}
.mid-blue   {color: #006699;}
.light-blue {color: #9FADBD;}
.mid-fush   {color: #91496A;}
.light-fush {color: #C97B9D;}
.mid-yelo   {color: #E49D22;}
.light-yelo {color: #FFECCC;}
.mid-brown  {color: #8B7356;}
.mid-green  {color: #5CA700;}
.mid-red    {color: #FF3C26;}

.code {
    font-family: Source Code Pro;
}

.bold {
    font-family: Nonito Sans Bold;
    font-weight: bold;
}

.boldi {
    font-family: Nonito Sans Bold Italic;
    font-weight: bold;
    font-style: italic;
}

.loader {
    position:fixed;
    top:0;
    left:0;
    background-color:rgba(255,255,255,1.0);
    z-index:5;
    width:100%;
    height:100%;
    overflow: hidden;
}

@keyframes fa-blink {
    0% { opacity: 1; }
    12% { opacity: 0.75; }
    25% { opacity: 0.5; }
    37% { opacity: 0.25; }
    50% { opacity: 0; }
    62% { opacity: 0.25; }
    75% { opacity: 0.5; }
    87% { opacity: 0.75; }
    100% { opacity: 1; }
}

.fa-blink {
    -webkit-animation: fa-blink 1.5s ease-in-out infinite;
    -moz-animation: fa-blink 1.5s ease-in-out infinite;
    -ms-animation: fa-blink 1.5s ease-in-out infinite;
    -o-animation: fa-blink 1.5s ease-in-out infinite;
    animation: fa-blink 1.5s ease-in-out infinite;
}

.overflow-y {
    overflow-y: auto;
}

.main h2,
.main h3,
.main h4 {
    white-space: nowrap;
    font-family: Nonito Sans;
}

.main .page-title {
    font-weight: initial;
    text-align: left;
}

.main .glyphicon {
    vertical-align: bottom;
    margin-bottom: -1px;
}

@media (min-width: 768px) {
    body {
        font-size: 14px;
    }
    .main h2 {
        font-size: 30px;
    }
}

@media (min-width: 377px) and  (max-width: 767px) {
    body{
        font-size: 16px;
    }
    .main h2 {
        font-size: 30px;
    }
}

@media (max-width: 376px) {
    body{
        font-size: 18px;
    }
    .main h2 {
        font-size: 26px;
    }
    .main .page-title {
        text-align: center;
    }
}

@media (orientation: landscape) and (max-height: 639px) {
    .main .footer {
        display: none;
    }
}