﻿/*
.wrapper #sub-menu
.wrapper #burger-menu {
	display: none;
}
*/

html { 
	-ms-overflow-style: scrollbar; /* this fix addresses IE's floating, transparent scrollbar behaviors */
}


.wrapper.prod-drop #sub-menu {
	display: block !important;
}	

.wrapper.old-content.old-main-dropdown #burger-menu {
	display: block !important;
}

/* SUB-MENU/BURGER-MENU STYLES */

.wrapper.old-content #sub-menu,
.wrapper.old-content #burger-menu {
	position: absolute;
}

.wrapper.new-content #sub-menu,
.wrapper.new-content #burger-menu {
	
}
.wrapper #sub-menu,
.wrapper #burger-menu {
	display: none;
	position: fixed; /* consider STATIC for menus for old layout as they have preposterous z-indexing therein */ 
	top: 71px;
	left: 0;
	/*background-color: rgba(51, 51, 51, 0.95);*/
	background-color: #333333;
	width: 100%;
	min-height: 300px;
	/*font-family: 'Gotham SSm 4r', 'Gotham SSm A', 'Gotham SSm B';*/
	padding: 3em 1em 30px 1em;
	z-index: 1000;	
}		

.wrapper nav#header.prod-drop #sub-menu .inner,
.wrapper nav#header.prod-drop #burger-menu .inner {
	width: 90%;
	margin: 0 auto !important;
}	

.wrapper #sub-menu .menu,
.wrapper #burger-menu .menu {
	font-size: 2em;
}

.wrapper #sub-menu .menu .icon span {
	display: block;

	height: 64px;
}

.wrapper #sub-menu .menu.software .icon span { background: url('../../Images/gwir/menus/icon-submenu-software.png') no-repeat right 0; }
.wrapper #sub-menu .menu.hardware .icon span { background: url('../../Images/gwir/menus/icon-submenu-hardware.png') no-repeat right 0; }
.wrapper #sub-menu .menu.services .icon span { background: url('../../Images/gwir/menus/icon-submenu-services.png') no-repeat right 0; }
.wrapper #sub-menu .menu.training .icon span { background: url('../../Images/gwir/menus/icon-submenu-training.png') no-repeat right 0; }

.wrapper #sub-menu .menu.software .links a:link,
.wrapper #sub-menu .menu.software .links a:active,
.wrapper #sub-menu .menu.software .links a:hover,
.wrapper #sub-menu .menu.software .links a:visited {
	text-transform: none !important;
}

.wrapper #sub-menu .menu .links h3,
.wrapper #burger-menu .menu h3 {
	color: #ccc;
	font-size: 1em;
	/*font-family: 'Gotham SSm 4r', 'Gotham SSm A', 'Gotham SSm B';*/
	font-weight: 300;
	text-transform: capitalize;
	margin: 0 0 .5em 0;
}

.wrapper #sub-menu .menu .links ul,
.wrapper #burger-menu .menu ul {
	margin: 0 !important;
	padding: 0 !important;
}

.wrapper #sub-menu .menu .links li { /* .wrapper #burger-menu .menu li */
	display: block !important;
	width: 100% !important;
	text-align: left !important;
}
.wrapper #burger-menu .menu ul {
	margin-bottom: 30px !important;
}
.wrapper #burger-menu .menu li {
	margin-bottom: 10px !important;
}
.wrapper #sub-menu .menu .links a:link,
.wrapper #burger-menu .menu a:link,
.wrapper #sub-menu .menu .links a:active,
.wrapper #burger-menu .menu a:active,
.wrapper #sub-menu .menu .links a:hover,
.wrapper #burger-menu .menu a:hover,
.wrapper #sub-menu .menu .links a:visited,
.wrapper #burger-menu .menu a:visited {
	color: #ccc !important;
	font-size: .65em;
	line-height: 1.75em;
	font-weight: 300;
	text-transform: capitalize;
	text-decoration: none !important;
}

.wrapper #sub-menu .menu .links a:hover,
.wrapper #burger-menu .menu a:hover {
	color: #01c0ff !important;
	text-decoration: none;
}

/* RIGHT-DRAWER-MENU STYLES */

.wrapper #right-drawer {
	position: fixed;
	top: 0;
	bottom: 0;
	right: -300px; /* IE9 = -16 */
	background-color: #333;
	width: 300px;
	padding: 1.5em 1em 11em 2em;
	overflow-x: hidden;
	overflow-y: scroll;
	z-index: 1030;

	-webkit-overflow-scrolling: touch;
	-webkit-transition: -webkit-transform .15s ease;
	-moz-transition: -moz-transform .15s ease;
	-o-transition: -o-transform .15s ease;
	-ms-transition: -o-transform .15s ease; /* ms */
	transition: transform .15s ease;
}

.wrapper #right-drawer a:link,
.wrapper #burger-menu a:link,
.wrapper #burger-menu a:hover,
.wrapper #right-drawer a:visited,
.wrapper #burger-menu a:visited,
.wrapper #right-drawer a:active,
.wrapper #burger-menu a:active {
	text-decoration: none !important;
}

.wrapper #right-drawer a:hover {
	color: #01c0ff !important;
}

.wrapper #right-drawer h1.logo-white { 
	background: url('../../Images/gwir/menus/logo-grey.png') no-repeat 0 0;
	text-indent: -9999px;
	margin: 0 0 .5em 0 !important;
	cursor: pointer;
	width: 50%; /* 127px */
}

.wrapper #right-drawer .closemenu {
	position: relative;
	background: url('../../Images/gwir/menus/btn-close.png') no-repeat 0 0;
	width: 16px;
	height: 17px;
	margin-right: 2em;
	z-index: 1000;
	cursor: pointer;
}

.wrapper #right-drawer .closemenu .fat-thumb {
	position: absolute;
	width: 82px;
	height: 75px;
	top: -18px;
	right: -19px;
}


.wrapper .cart h3,
.wrapper .cart a {
	color: #ccc !important;
}

.wrapper .cart h3 {	
	font-weight: 300;
	text-transform: capitalize;
}

.wrapper #right-drawer ul,
.wrapper #burger-menu ul {
	margin-bottom: 1.5em;
	padding-left: 0 !important;
}

.wrapper #right-drawer ul li a,
.wrapper #burger-menu ul li a {
	color: #ccc !important;
	text-transform: capitalize;
}

.wrapper #burger-menu ul li a {
	line-height: 1.75em;
}

.wrapper #burger-menu .cart {
	margin-bottom: 1em;
}

.wrapper ul.general li a,
.wrapper ul.login-lang li a {
	font-size: 1.5em;
	line-height: 1.75em;
	font-weight: 300;
}

.wrapper ul.additional li a {
	font-size: 1.2em;
	line-height: 2em;
}

.wrapper #right-drawer .cta {
	  margin: 2em 0;
}

.wrapper #right-drawer ul.login-lang .language ul,
.wrapper #right-drawer ul.login-lang .login ul {
	display: none;
	margin-bottom: 0;
}
.wrapper #right-drawer ul.login-lang .language a,
.wrapper #right-drawer ul.login-lang .login a {
	font-weight: 300;
}

.wrapper #right-drawer ul.login-lang .language ul.lang-drop,
.wrapper #right-drawer ul.login-lang .login ul.log-drop {
	display: block;
}

.wrapper #right-drawer ul.login-lang .language ul.lang-drop li a,
.wrapper #right-drawer ul.login-lang .login ul.log-drop li a {
	font-size: 1em;
	padding-left: 1em;
}

.wrapper #right-drawer .cart {
	margin-bottom: 3em !important;
}

.wrapper #right-drawer .cart li:last-child a {
	font-size: 1em;
}

.wrapper #right-drawer ul.social {
	width: 83%;
	margin: 0 0 1.5em 0;
}

.wrapper #burger-menu ul.social {
	/*width: 83%;*/
	margin-bottom: .5em !important;
}

.wrapper #right-drawer ul.social li,
.wrapper #burger-menu ul.social li {
	display: inline-block !important;
	margin-right: .5em;
	margin-right: .25em \9;
}

.wrapper #right-drawer ul.social li a,
.wrapper #burger-menu ul.social li a {
	display: block;
	width: 35px;
	height: 35px;
	text-indent: -9999px;
}

.wrapper #right-drawer ul.social li.linkedin a,
.wrapper #burger-menu ul.social li.linkedin a { background: url('../../Images/gwir/menus/btn-social-linkedin.png') no-repeat 0 0; }
.wrapper #right-drawer ul.social li.facebook a,
.wrapper #burger-menu ul.social li.facebook a { background: url('../../Images/gwir/menus/btn-social-facebook.png') no-repeat 0 0; }
.wrapper #right-drawer ul.social li.twitter a,
.wrapper #burger-menu ul.social li.twitter a { background: url('../../Images/gwir/menus/btn-social-twitter.png') no-repeat 0 0; }
.wrapper #right-drawer ul.social li.youtube a,
.wrapper #burger-menu ul.social li.youtube a { background: url('../../Images/gwir/menus/btn-social-youtube.png') no-repeat 0 0; }

.wrapper #right-drawer ul.social li.linkedin a:hover,
.wrapper #burger-menu ul.social li.linkedin a:hover { background: url('../../Images/gwir/menus/btn-social-linkedin-over.png') no-repeat 0 0; }
.wrapper #right-drawer ul.social li.facebook a:hover,
.wrapper #burger-menu ul.social li.facebook a:hover { background: url('../../Images/gwir/menus/btn-social-facebook-over.png') no-repeat 0 0; }
.wrapper #right-drawer ul.social li.twitter a:hover,
.wrapper #burger-menu ul.social li.twitter a:hover { background: url('../../Images/gwir/menus/btn-social-twitter-over.png') no-repeat 0 0; }
.wrapper #right-drawer ul.social li.youtube a:hover,
.wrapper #burger-menu ul.social li.youtube a:hover { background: url('../../Images/gwir/menus/btn-social-youtube-over.png') no-repeat 0 0; }

.wrapper #right-drawer input#search-right {
	float: left;
	width: 68%;
}

.wrapper #burger-menu input#search-burger {
	float: left;
	width: 72%;
}

.wrapper button.search {
	float: left;
	background: url('../../Images/gwir/menus/btn-searchulous.png') no-repeat 0 0;
	width: 35px;
	height: 35px;
	border: none !important;
}

/* MENU RESPONSIVE: MEDIA QUERIES */

@media (max-width: 1200px) {

	.wrapper nav#header.prod-drop #sub-menu {
		padding: 5% 10% 0 10% !important;
	}

	.wrapper #sub-menu .menu .links {
		width: 100%;
	}

	.wrapper #sub-menu .menu .icon {
		display: none;
	}
}

@media (max-width: 1024px) {

}

@media (max-width: 768px) {

	.wrapper #right-drawer li,
	.wrapper #right-drawer li span {
		font-size: 1.35em !important;
		line-height: 1.5em !important;
		
	}	
	.wrapper #burger-menu {
		height: auto;
		position: absolute;		
	}
}

@media (max-width: 480px) {
	.wrapper ul.additional li a {
		font-size: 1.2em;
	}
	

}




