/* ---------------------------------------- */
/* ----- White Style----- */
/* ---------------------------------------- */

body {
    background: #a0a0a0;
}

::selection {
    background: #505050;
    color: white;   
}

::-moz-selection {
    background: #505050;
    color: white;
}

/* ---------------------------------------- */
/* ----- Navigation ----- */
/* ---------------------------------------- */

.nav {
    background: #505050;
}

.nav li:nth-child(2) a {
    background: #f2f2f2;
}

.nav a {
    color: #505050 !important;
}

.nav li:nth-child(2) a:hover, .nav li:nth-child(2).active a {
    color: #000 !important;
}

.nav li:nth-child(3) a {
    background: #f2f2f2;
}

.nav li:nth-child(3) a:hover, .nav li:nth-child(3).active a {
    color: #000 !important;
}

.nav li:nth-child(4) a {
    background: #f2f2f2;
}

.nav li:nth-child(4) a:hover, .nav li:nth-child(4).active a {
    color: #000 !important;
}

.nav li:nth-child(5) a {
    background: #f2f2f2;
}

.nav li:nth-child(5) a:hover, .nav li:nth-child(5).active a {
    color: #000 !important;
}

/* ---------------------------------------- */
/* ----- Resume ----- */
/* ---------------------------------------- */

/* ----- Icon Color ----- */
.ro-timeline > li .ro-icon {
    color: #505050;
}

/* ---------------------------------------- */
/* ----- Skills ----- */
/* ---------------------------------------- */

.sidebar h3 {
    padding-bottom: 10px;
    border-bottom: 1px solid #505050;
}

.skills span {
    background: #505050;
}

.skills li:nth-child(even) span {
    background: #303030;
}

.skills span:hover {
    background: #4d4a46 !important;
}

.rt-spanbg {
    background: #505050 !important;
}

/* ---------------------------------------- */
/* ----- Profile ----- */
/* ---------------------------------------- */

.p-details a:hover {
    background: #505050;
    color: white;
}

/* ---------------------------------------- */
/* ----- Social Icons ----- */
/* ---------------------------------------- */

.social a:hover {
    background: #505050;
    color: white;
    height: 35px;
}

/* ---------------------------------------- */
/* ----- Work ----- */
/* ---------------------------------------- */

/* ----- Filter ----- */

.gridfilter li:hover {
    color: white !important;
    background: #4d4a46;
}

.activefilter {
    background: #505050 !important;
    color: white;
}

/* ---------------------------------------- */
/* ----- Single Project ----- */
/* ---------------------------------------- */

.project-nav a:hover {
    background: #4d4a46;
    color: white;
}


/* ---------------------------------------- */
/* ----- Nivo Slider ----- */
/* ---------------------------------------- */

/* ----- Control Navigation ----- */

.theme-default .nivo-controlNav a {
  background: #4d4a46;
  border: 2px solid #4d4a46;
  box-shadow: inset 0 0 0 4px white;
}

.theme-default .nivo-controlNav a:hover {
  background: #505050;
  border: 2px solid #505050;
  box-shadow: inset 0 0 0 3px white;
}

.theme-default .nivo-controlNav a.active {
  background: #505050;
  border: 2px solid #505050;
  box-shadow: inset 0 0 0 2px white;
}


/* ---------------------------------------- */
/* ----- Contact ----- */
/* ---------------------------------------- */

.contact form input[type="text"]:focus, 
.contact form input[type="email"]:focus, 
.contact form textarea:focus { 
    border: 2px solid #505050;
    color: #999;
}

.contact form input[type="text"]:required:valid, 
.contact form input[type="email"]:required:valid, 
.contact form textarea:required:valid { 
    border: 2px solid #505050;
    color: #505050;
} 

.contact form .radio:hover {
    background: #505050;
    color: white;
}

.contact form input[type="radio"]:checked + label {
    background: #505050;
}

.contact form .required { 
    color: #505050;
}

.contact form input[type="submit"]:hover { 
    color: #fff;
    background: #505050;
    cursor: pointer;
}

/* ---------------------------------------- */
/* ----- Media Queries ----- */
/* ---------------------------------------- */

@media screen and (max-width: 767px) {

    .nav a {
        color: white !important;
        background: #505050 !important;
    }
    
    .nav a:hover, .active a {
        background: white !important;
    }

    #nav-toggle {
        background: #505050 url("../../img/hamburger.gif") no-repeat 50% 50%;
    }
}