/* Base
 ========================================================================== */

html {
  overflow-y: scroll;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


/*
 * Small Pages
 */
html , body { height: 100% }

/*
 * Emphasize
 */
em {
  color: #444;
}


/* UIkit component modifiers
 ========================================================================== */

/*
 * Navbar
 */

.rumbic-navbar {
  position: relative;
  padding: 15px 0;
  border: none;
  background: transparent;
}


.rumbic-navbar .uk-navbar-content,
.rumbic-navbar .uk-navbar-brand,
.rumbic-navbar .uk-navbar-toggle {
    height: 40px;
    margin-top: 0;
    text-shadow: none;
}


.rumbic-navbar .uk-navbar-nav > li > a {
    height: 40px;
    margin: 0;
    border: none;
    border-radius: 10px !important;
    text-shadow: none;
    font-size: 15px;
    color: #999;
}


.rumbic-navbar .uk-navbar-nav > li { margin-left: 20px; }

/* Hover */
.rumbic-navbar .uk-navbar-nav > li:hover > a,
.rumbic-navbar .uk-navbar-nav > li > a:focus,
.rumbic-navbar .uk-navbar-nav > li.uk-open > a {
    border: none;
    color: #FFF;
}

/* Active */
.rumbic-navbar .uk-navbar-nav > li.uk-active > a {
    background-color: #2BA300;
    color: #FFF;
}

/* OnClick */
.rumbic-navbar .uk-navbar-nav > li > a:active { background-color: transparent; }


/*
 * Nav
 */

.rumbic-nav > li > a { color: #777; }

/* Hover */
.rumbic-nav > li > a:hover,
.rumbic-nav > li > a:focus,
.rumbic-nav > li.uk-active > a  {
    background: #F5F5F5;
    color: #444;
}

/* Sub-object: `nav-header` */
.rumbic-nav .uk-nav-header {
    color: #222;
    font-weight: normal;
}

/*
 * Nav
 */

.rumbic-subnav > li:nth-child(n+2) { margin-left: 20px; }

/*
 * Layout
 */

.rumbic-background { background: #252525; }

.rumbic-middle { padding: 20px 0; }
.rumbic-middle { background: #fff; }

/*
 * Footer
 */

.rumbic-footer { 
  background: #252525;
  padding: 30px 0;
}

.rumbic-footer .uk-subnav-line > li:before { border-color: #ddd; }

.rumbic-footer,
.rumbic-footer a { color: #ddd !important; }
.rumbic-footer a:hover { color: #fff !important; }

/*
 * Title image
 */

.rumbic-image-title {
  border-radius: 5px;
  border: 1px solid #D0D0D0;
  -webkit-box-shadow: 2px 2px 10px #7C7C7C;
  box-shadow: 2px 2px 10px #7C7C7C;
}

/* Icons
 * See https://www.designcontest.com/ecommerce-and-business-icon-set/ for more icons
 */

.rumbic-icon-features {
  background: url(/assets/images/title_icon_features.png) no-repeat 0% 0%;
  height:32px; 
  padding-left:34px; 
  padding-top:6px; 
  margin-bottom:-10px;
}

.rumbic-icon-languages {
  background: url(/assets/images/title_icon_languages.png) no-repeat 0% 0%;
  height:32px; 
  padding-left:34px; 
  padding-top:6px; 
  margin-bottom:-10px;
}

.rumbic-icon-news {
  background: url(/assets/images/title_icon_news.png) no-repeat 0% 0%;
  height:32px; 
  padding-left:34px; 
  padding-top:6px; 
  margin-bottom:-10px;
}

.rumbic-icon-platforms {
  background: url(/assets/images/title_icon_platforms.png) no-repeat 0% 0%;
  height:32px; 
  padding-left:34px; 
  padding-top:6px; 
  margin-bottom:-10px;
}

.rumbic-icon-screenshots {
  background: url(/assets/images/title_icon_screenshots.png) no-repeat 0% 0%;
  height:32px; 
  padding-left:34px; 
  padding-top:6px; 
  margin-bottom:-10px;
}

.rumbic-icon-email {
  background: url(/assets/images/title_icon_email.png) no-repeat 0% 0%;
  height:32px; 
  padding-left:34px; 
  padding-top:6px; 
  margin-bottom:-10px;
}

.rumbic-icon-idea {
  background: url(/assets/images/title_icon_idea.png) no-repeat 0% 0%;
  height:32px; 
  padding-left:34px; 
  padding-top:6px; 
  margin-bottom:-10px;
}

.rumbic-icon-chat {
  background: url(/assets/images/title_icon_chat.png) no-repeat 0% 0%;
  height:32px; 
  padding-left:34px; 
  padding-top:6px; 
  margin-bottom:-10px;
}

/*
  Social buttons
*/
.sc-btn {
  display: inline-block;
}
.sc-facebook svg,
.sc-twitter svg,
.sc-google-plus svg {
  fill: #999; 

   // Set animation
  -webkit-transition: fill .2s ease;
          transition: fill .2s ease;
}
.sc-facebook svg {
  height: 35px;
  width: 35px;
}
.sc-twitter svg {
  height: 35px;
  width: 32px;
}

.sc-google-plus svg {
  height: 35px;
  width: 32px;
}

.sc-facebook svg:hover {
  fill: #3B5999; 
}
.sc-twitter svg:hover {
  fill: #5aacf1; 
}
.sc-google-plus svg:hover {
  fill: #db4a39; 
}