@font-face {
    font-family: 'source_sans_probold';
    src: url('sourcesanspro-bold-webfont.eot');
    }

@font-face {
    font-family: 'source_sans_probold';
    src: url(data:application/x-font-woff;charset=utf-8;base64,[encoded data, 39564 characters]) format('woff'),
         url('sourcesanspro-bold-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'source_sans_proregular';
    src: url('sourcesanspro-regular-webfont.eot');
    }

@font-face {
    font-family: 'source_sans_proregular';
    src: url(data:application/x-font-woff;charset=utf-8;base64,[encoded data, 39896 characters]) format('woff'),
         url('sourcesanspro-regular-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}






html,body 
{
    width:100%;
    height:100%;
}



section, header {
    width:100%;
    padding-top:70px;  
    padding-bottom:50px; 
    //min-height:100vh;
}

a[data-toggle="popover"] {
    text-decoration-style: dotted !important;
    cursor: help;
}  
.well {
    border-color:transparent;
}

/* Horizontal Top Menu */
.navbar.bg-transparent {
    background: rgba(0,0,0,0);
}
nav.navbar {
    box-shadow: 0 2px 3px rgba(10,10,10,.1),0 0 0 1px rgba(10,10,10,.1);
    background-color:white;
}
a.navbar-brand > img {
    max-width:220px;
    width:100px;
    position: fixed;
    top:0px;
    left:0px;
}
.navbar-light a.navbar-brand, .navbar-light a.navbar-brand:hover {
    padding-left:100px;
    color:#318fc6;
    font-size:2em;
    font-weight:bold;
}
#btn-contact {
    position: fixed;
    bottom: -5px;
    right: 15px;
    z-index:999;
}
.navbar-light .navbar-nav .nav-link.active {
    padding-bottom:3px;
    border-bottom: 2px solid #0087be;
}
@media (max-width:991px) {
    .navbar-light .navbar-nav {
        padding-top:70px;
    }
}
.navbar-light .navbar-nav .nav-link.btn {
    color:white;
    padding-bottom:6px;
    border-bottom: 0;
    margin-left:0.5rem;
}
#navbarNav {
    background-color:white;
}
.navbar-light .navbar-nav .nav-link.btn.active {
    color:white;
    padding-bottom:6px;
    border-bottom: 0;
}
.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,0.75);
    font-weight:600;
}
.navbar-dark .navbar-nav .nav-link:hover {
    color: rgba(255,255,255,0.9);
}
#menu {
    height:57px;
}
body {
    position: relative;
} 
.rl-bg-color-3 {
    background-color: #f3f6f8;
}
.rl-bg-color-2 {
    background-color: #0b0b0b;
    color:white;
}
.rl-bg-color-2 a{
    color: white;
    text-decoration: underline;
}
.rl-bg-color-2 .card a, .rl-bg-color-2 .alert-light a{
    color: #0056b3;
}
.rl-bg-color-2 .card {
    color:#000;
}  
/* Header */
header {
    height:100%;
    background-color:#63bbf3;
    background-image: url("../img/header/screen.jpg");
    background-repeat: no-repeat;
    background-size: 100%;
    background-position: bottom;
}
/*#home-illustration {
    background-image: url("../img/header/task.png");
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: contain;
}*/
@media (min-width:992px) {
    .order-lg-first {
        order:-1;
        -ms-flex-order: -1;
    }
}
header span {
    font-family:Anton, Finger Paint, cursive, sans-serif;
    font-size:3rem;
    font-weight:400;
    color:rgba(0,0,0,0.75);
    line-height:1;
}
#home-feature {
    color:rgba(0,0,0,0.6);
    font-size:2rem;
}
@media (max-width:360px) {
    header span {
        font-size:1.5rem;
        line-height:1;
    }
    #home-feature {
        font-size:1.2rem;
    }
}
header .btn-outline-light:hover {
    background-color:rgba(255,255,255,0.1);
}
header {
    background-color:#aeb6cb;
}
/* Footer */
footer {
    background-color:#494949;
    color:#ddd;
    min-height:100px;
    padding-top:20px;
    padding-bottom:40px;
}
footer a, footer a:hover{
    color: white;
}

/* About */
#about .row {
    margin-top:40px;
    margin-bottom:40px;
}

/* Contact */
.contact-phone {
    font-size:3rem;
}
.contact-hours, .contact-name {
    display: block;
    font-size:2rem;
}
#register .form-group > label {
    display: none;
}

@media (max-width:767px) {
.contact-phone {
    font-size:1.5rem;
}
.contact-hours, .contact-name {
    font-size:1.2rem;
}
}


/* ICONS */
/* fallback */
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(../font/2fcrYFNaTjcS6g4U3t-Y5ZjZjT5FdEJ140U2DJYC3mY.woff2) format('woff2');
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  -moz-osx-font-smoothing: grayscale;
}

/* Rules for sizing the icon. */
.material-icons.md-18 { font-size: 18px; }
.material-icons.md-24 { font-size: 24px; }
.material-icons.md-36 { font-size: 36px; }
.material-icons.md-48 { font-size: 48px; }

/* ==========================================================================
   6 = Colors
   ========================================================================== */

.bluebg {
    background: #3498DB!important;
}
.bluebg:hover:after,
.bluebg:focus:after,
.bluebg:hover:before,
.bluebg:focus:before {
    background: #16527A!important;
}

.purplebg {
    background: #9B59B6!important;
}
.purplebg:hover:after,
.purplebg:focus:after,
.purplebg:hover:before,
.purplebg:focus:before {
    background: #532C64!important;
}

.redbg {
    background: #E74C3C!important;
}
.redbg:hover:after,
.redbg:focus:after,
.redbg:hover:before,
.redbg:focus:before {
    background: #921E12!important;
}

.orangebg {
    background: #F39C12!important;
}
.orangebg:hover:after,
.orangebg:focus:after,
.orangebg:hover:before,
.orangebg:focus:before {
    background: #7F5006!important;
}

.greenbg {
    background: #2ECC71!important;
}
.greenbg:hover:after,
.greenbg:focus:after,
.greenbg:hover:before,
.greenbg:focus:before {
    background: #176437!important;
}

.darkbluebg {
    background: #34495E!important;
}
.darkbluebg:hover:after,
.darkbluebg:focus:after,
.darkbluebg:hover:before,
.darkbluebg:focus:before {
    background: #07090C!important;
}

.lightbluebg {
    background: #6A93D4!important;
}
.lightbluebg:hover:after,
.lightbluebg:focus:after,
.lightbluebg:hover:before,
.lightbluebg:focus:before {
    background: #2B5394!important;
}

.yellowbg {
    background: #F1C40F!important;
}
.yellowbg:hover:after,
.yellowbg:focus:after,
.yellowbg:hover:before,
.yellowbg:focus:before {
    background: #796307!important;
}


.lightpinkbg {
    background: #F76F87!important;
}
.lightpinkbg:hover:after,
.lightpinkbg:focus:after,
.lightpinkbg:hover:before,
.lightpinkbg:focus:before {
    background: #DA0C31!important;
}

/* Following colors are not used yet */
.pinkbg {
    background: #D66D92!important;
}
.pinkbg:hover:after,
.pinkbg:focus:after,
.pinkbg:hover:before,
.pinkbg:focus:before {
    background: #992B52!important;
}

.turquoisebg {
    background: #1ABC9C!important;
}
.turquoisebg:hover:after,
.turquoisebg:focus:after,
.turquoisebg:hover:before,
.turquoisebg:focus:before {
    background: #0B4C3F!important;
}
.lightyellow {
    background: #FFC973!important;
}
.lightyellow:hover:after,
.lightyellow:focus:after,
.lightyellow:hover:before,
.lightyellow:focus:before {
    background: #F39500!important;
}
.lightgreen {
    background: #B5F36D!important;
}
.lightgreen:hover:after,
.lightgreen:focus:after,
.lightgreen:hover:before,
.lightgreen:focus:before {
    background: #77CF11!important;
}
.purpledarkbg {
    background: #8E44AD!important;
}
.purpledarkbg:hover:after,
.purpledarkbg:focus:after,
.purpledarkbg:hover:before,
.purpledarkbg:focus:before {
    background: #432051!important;
}

.hide {
    display:none;
}




#services .card-body .card-text, .hosting-card .list-group {
    font-size: 14px;
    line-height: 1.2;
    color: #2e4453;
}

#services .card-body {
    min-height:120px;
}

#services .card {
    margin-bottom:20px;
}
#services .card-body a.card-link {
    text-align:right;
    display:block;
}
#services .list-group.collapse {
    display:none;
}
#services .list-group.collapse.show {
    display:flex;
}

@media (max-width:767px) {
    .card-columns {
        column-count: 1;
    }
    #services .list-group li {
        padding-left:120px;
    }
}
@media (max-width:460px) {
    #services .list-group li {
        padding-left:20px;
    }
}
@media (min-width:768px) {
    .card-columns {
        column-count: 2;
    }
    #services .card-body {
        min-height:190px;
    }

}
@media (min-width:992px) {
    #services .list-group li {
        padding-left:120px;
    }
    #services .card-body {
        min-height:120px;
    }

}
#services span.oi, #services span.fa {
    float: left;
    font-size: 80px; 
    width: 80px;
    text-align: center;
    margin-right: 20px;
    color: #318fc6;
}

