header.askval.condensed,
header.askval {
	position: fixed;
	top: 0;
	z-index: 1000;
	width: 100%;
	height: 50px;
	background-color: #fff;
	transition: all .25s ease;
}

header.askval a {
	font-weight: 600;
}

header.askval .container-logo {
	position: relative;
    display: inline-block;
}

header.askval.condensed .askval .logo,
header.askval .askval .logo {
	background-color: #4c90cd;
	height: 50px;
	width: 50px;
	padding: 2px;
	transition: all .25s ease;
}

.alt-logo-divider {
    width: 1px;
    height: 30px;
    vertical-align: middle;
    margin-left: .5em;
    margin-right: .5em;
    display: inline-block;
    background: #6d6e71;
}

header.askval.condensed .alt-logo-divider {
    height: 30px;
}

.alt-logo {
    display: inline-block;
    vertical-align: middle;
    width: 50%;
}

.alt-logo img {
    max-height: 30px;
}

header.askval.condensed .alt-logo img {
    max-height: 30px;
}

header.askval .askval .logo.pinterest {
    background-color: #da474e;
}
header.askval .askval .logo.consult {
    background-color: #37685d;
}
header.askval .askval .logo.quiz {
    background-color: #f9a21a;
}
header.askval .askval .logo.projectquiz {
    background-color: #146c8a;
}
header.askval .askval .logo.upload {
    background-color: #43b09c;
}
header.askval .askval .logo.guarantee {
    background-color: #753868;
}
header.askval .askval .logo.trends {
    background-color: #bab9b9;
}

header.askval.condensed .valspar .logo,
header.askval .valspar .logo {
	position: absolute;
	padding: 1px 4px;
	width: 50px;
	height: 20px;
	background-color: #fff;
	top: 50px;
	transition: all .25s ease;
}

header.askval.condensed .valspar .lizard {
	visibility: hidden;
	opacity: 0;
}

header.askval .valspar .lizard {
	position: absolute;
	top: 55px;
	left: 30px;
	width: 60px;
	transition: all .25s ease;
}

header.askval .menu-toggle {
	height: 50px;
	font-size: 26px;
	line-height: 2;
	float: right;
	cursor: pointer;
	color: #6d6e71;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 50px;
}

header.askval .menu-toggle span{
    font-size: 10px;
    line-height: 9px;
    display: inline-block;
}

header.askval .mobile-navigation {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 0;
	font-size: 20px;
	background-color: #6d6e71;
	visibility: hidden;
	transition: all .25s ease;
	color: #fff;
	padding: 15px;
    pointer-events: none;
    z-index: 500;
}

header.askval .mobile-navigation.toggled {
	visibility: visible;
	height: 100%;
    pointer-events: all;
    overflow-y: scroll;
}

header.askval .mobile-navigation .menu-close {
	position: absolute;
	top: 0;
	right: 0;
	font-size: 26px;
	padding: 15px;
	cursor: pointer;
	transform: scaleY(0);
	transition: all .25s ease;
}

header.askval .mobile-navigation.toggled .menu-close {
	transform: scaleY(1);
}

header.askval .mobile-navigation a {
	color: #fff;
}

header.askval .mobile-navigation ul {
	list-style-type: none;
	opacity: 0;
	visibility: hidden;
	transition: all .25s ease;
}

header.askval .mobile-navigation.toggled ul {
	opacity: 1;
	visibility: visible;
}

header.askval .mobile-navigation ul.primary {
	padding: 0;
}

header.askval .mobile-navigation ul.primary li {
	margin-bottom: 15px;
}

header.askval .mobile-navigation ul.secondary {
	margin-top: 15px;
}

@media (min-width: 992px) {
	
	.row_bag {
		float: left;
		width: calc(100% - 50px);
	}
	.row_bag > .col-sm-3 {
		width: 15%;
	}
	.row_bag > .col-sm-9 {
		width: 85%;
	}

	header.askval {
		position: fixed;
		z-index: 1000;
		width: 100%;
		height: 80px;
		background-color: #fff;
	}

    .alt-logo-divider {
        width: 2px;
        height: 50px;
        vertical-align: middle;
        margin-left: 1em;
        margin-right: 1em;
        display: inline-block;
        background: #6d6e71;
    }

    .alt-logo img {
        max-height: 40px;
    }

	header.askval .askval .logo {
		background-color: #4c90cd;
		height: 80px;
		width: 80px;
		padding: 13px 5px;
		transition: all .25s ease;
	}

	header.askval .valspar .logo {
		padding: 2px 8px;
		width: 80px;
		height: 30px;
		background-color: #fff;
		position: absolute;
		top: 80px;
	}

	header.askval .valspar .lizard {
		position: absolute;
		top: 90px;
		left: 30px;
		width: auto;
		visibility: visible;
		opacity: 1;
	}
	
	header.askval.condensed .desktop-navigation {
		height: 50px;
	}
	
	header.askval .desktop-navigation {
		position: initial;
		display: initial;
		background-color: initial;
		height: 80px;
		font-size: 14px;
		color: #6d6e71;
		float: right;
	}

	header.askval .desktop-navigation a {
		color: inherit;
		text-decoration: none;
		display: block;
		height: 100%;
		width: 100%;
		padding: 0 15px;
	}

	header.askval .desktop-navigation ul.primary {
		list-style-type: none;
		padding: 0;
		margin: 0;
		height: 100%
	}

	header.askval .desktop-navigation ul.primary li {
		display: inline-block;
		position: relative;
		height: 100%;
		transition: all .1s ease;
        min-width: 115px;
	}

	header.askval .desktop-navigation ul.primary li:hover {
		background-color: #6d6e71;
		color: #fff;
	}

	header.askval.condensed .desktop-navigation ul.primary li a {
		line-height: 3.75;
	}
    li.discover-menu > a {
        padding-left: 20px;
    }
	
	header.askval .desktop-navigation ul.primary li a {
		line-height: 5.5;
		transition: line-height .25s ease;
	}

    header.askval .desktop-navigation ul.primary li .fa {
        margin-left: 15px;
        transition: all .25s ease;
        margin-right: 35px;
    }

    header.askval .desktop-navigation ul.primary li:hover .fa {
        transition: all .25s ease;
        transform: rotate(180deg);
    }

	header.askval .desktop-navigation ul.primary li ul.secondary {
		visibility: hidden;
        display: none;
		opacity: 0;
		position: absolute;
		left: 0;
		top: 100%;
		padding: 0;
		margin: 0;
		transition: all .1s ease;
	}

	header.askval .desktop-navigation ul.primary li:hover ul.secondary {
		visibility: visible;
        display: block;
		opacity: 1;
		background-color: #6d6e71;
		color: #fff;
	}

	header.askval .desktop-navigation ul.primary li ul.secondary li a {
		line-height: normal;
		padding: 10px 20px;
	}

	header.askval .desktop-navigation ul.primary li ul.secondary li a:hover {
		text-decoration: underline;
	}
}
