#charnav {padding: 6px; background: #000;} #charnav .progress-bar {background-color: rgba(45, 110, 185, 0.6);} #charnav .progress-bar span {background: #2d6eb9;} #charnav li.character {position: relative; float: left; width: 239px; height: 151px; margin: 4px 2px 2px 0;} #charnav li.character a {background: url(/images/games/GTAV/nav/card-bg-20131015.jpg) no-repeat left top; width: 239px; height: 151px; display: block; padding: 8px; opacity: .4; filter: alpha(opacity=40); -webkit-transition: all 200ms cubic-bezier(0.44, 0.435, 0.43, 0.88); -ms-transition: all 200ms cubic-bezier(0.44, 0.435, 0.43, 0.88); transition: all 200ms cubic-bezier(0.44, 0.435, 0.43, 0.88);} #charnav li.character.freemode {margin-right: 0;} #charnav li.character.freemode h3.charName {line-height: 36px;} #charnav li.character li {background: none; color: #000; width: auto; float: none; margin: 0 0 12px; padding: 0 0 0 100px; height: 36px;} #charnav li.character li h3 {color: #000; text-transform: uppercase; font-size: 15px; font-family: "Chalet-NewYorkSixty", helvetica, arial, sans-serif; margin: 0; padding: 0 0 0px 40px; line-height: 18px;} #charnav li.character li h3.charName {text-transform: none;} #charnav li.character li p {padding: 0 0 0 40px; font-size: 15px;} #charnav li.character .mugshot {position: absolute; top: 12px; left: 12px; width: 128px; height: 128px;} #charnav li.character .mugshotFace {position: absolute; top: 0; left: 0; width: 128px; height: 128px;} #charnav li.character.michael .mugshotFace {background: url(/images/games/GTAV/nav/mug-michael.png) no-repeat -4px; border: 4px solid #65b4d4;} #charnav li.character.trevor .mugshotFace {background: url(/images/games/GTAV/nav/mug-trevor.png) no-repeat -4px; border: 4px solid #ffa357;} #charnav li.character.franklin .paperclip {background-position: -58px;} #charnav li.character.franklin .mugshotFace {background: url(/images/games/GTAV/nav/mug-franklin.png) no-repeat -4px; border: 4px solid #abedab;} #charnav li.character.freemode .paperclip {background-position: right;} #charnav li.character.freemode .mugshotFreemode {position: absolute; border: 4px solid #2d6eb9; top: 0; left: 0; width: 128px; height: 128px;} #charnav a {text-decoration: none;} #charnav li.active a {opacity: 1; filter: alpha(opacity=100);} #charnav li:hover a {opacity: 1; filter: alpha(opacity=100);} #charnav li.disabled {cursor: default;} #charnav li.disabled a {opacity: 0.4 !important; filter: alpha(opacity=40) !important; pointer-events: none; cursor: default;} #charnav li.disabled .mugshotFace {background-position: -132px !important;} #charnav li.active {pointer-events: none; cursor: default;}#charnav .singlep {width: 723px; height: 156px; float: left;} #charnav .singlep li.character {background: url(/images/games/GTAV/nav/card-bg-20131015.jpg) no-repeat left top; width: 239px; height: 151px; display: block; padding: 8px; opacity: .4; filter: alpha(opacity=40); -webkit-transition: all 200ms cubic-bezier(0.44, 0.435, 0.43, 0.88); -ms-transition: all 200ms cubic-bezier(0.44, 0.435, 0.43, 0.88); transition: all 200ms cubic-bezier(0.44, 0.435, 0.43, 0.88);} #charnav .singlep .active {pointer-events: none; cursor: default;} #charnav .singlep .active li.character {opacity: 1; filter: alpha(opacity=100);} #charnav .singlep:hover li.character {opacity: 1; filter: alpha(opacity=100);} #charnav .singlep .disabled {pointer-events: none; cursor: default;} #charnav .singlep .disabled li.character {opacity: .4; filter: alpha(opacity=40);} #charnav .singlep .michael .disabled-navigation, #charnav .singlep .trevor .disabled-navigation, #charnav .singlep .franklin .disabled-navigation {display: none !important;}.disabled-navigation {opacity: 0; filter: alpha(opacity=0); display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; text-align: center; padding-top: 62px; text-transform: uppercase; font-size: 30px; font-family: "Chalet-ParisSixty", helvetica, arial, sans-serif; color: white !important; z-index: 1; -webkit-transition: all 200ms cubic-bezier(0.44, 0.435, 0.43, 0.88); -ms-transition: all 200ms cubic-bezier(0.44, 0.435, 0.43, 0.88); transition: all 200ms cubic-bezier(0.44, 0.435, 0.43, 0.88);} .disabled-navigation:hover {opacity: 1; filter: alpha(opacity=100);}.compareOpen .disabled-navigation {top: 84px;}.compareOpen .freemode.disabled .disabled-navigation {top: 0;}#charnav .singlep .disabled-navigation {width: 720px; height: 152px; margin: 10px 0 0 6px;} #charnav .singlep .disabled-navigation:hover {display: none;}