.slide img { width:450px; border:none; }
#multiviewAndBreadCrumbContainer { border-bottom: 1px solid #efefef; }

.mockupContainer {
    width:480px;
    height:280px;
    padding:10px;
    border:1px solid #222;
    position:relative;
}

.mockupContainer .screenTitle {
    width:320px;
    height:50px;
    margin:0 0 50px 0;
    float:left;
    text-align:left;
    color:#222;
    font-size:24px;
    overflow:hidden;
}

.mockupContainer .upperButton {
    width:150px;
    height:30px;
    margin:-10px 0 0 0;
    background:#222;
    color:#fff;
    float:right;
    text-align:center;
    padding:5px 0;
    font-size:14px;
    word-break:break-all;
    overflow:hidden;
}

.mockupContainer .upperReturnButton {
    width:80px;
    height:40px;
    margin:-10px 0 0 0;
    background:url('../../images/navsys/popups/returnArrow.png') no-repeat;
    color:#fff;
    float:right;  
}

.mockupContainer .largeMenuButton {
    width:150px;
    height:30px;
    float:left;
    margin:5px;
    background:#222;
    color:#fff;
    text-align:center;
    padding:10px 0;
    font-size:14px;
    word-break:break-all;
    overflow:hidden;
}

.mockupContainer .scrollButtonsContainer {
    width:45px;
    height:150px;
    float:left;
    position:relative;
    margin:-20px 0 0 0;
}

.mockupContainer .scrollButtonsContainer .scrollButtonUp-ttg {
    background:url('../../images/navsys/popups/scrollButtonUp.png') no-repeat;
    top:0;
}

.mockupContainer .scrollButtonsContainer .scrollButtonDown-ttg {
    background:url('../../images/navsys/popups/scrollButtonDown.png') no-repeat;
    bottom:5px;
}

.mockupContainer .scrollButtonsContainer .scrollButton {
    position:absolute;
    width:45px;
    height:60px;
}

.mockupContainer .longMenuButtonContainer {
    width:430px;
    height:150px;
    margin:-20px 0 0 5px;
    padding:0;
    float:left;
}

.mockupContainer .longMenuButton .longMenuButtonSetting {
    float:right;
    color:#bbb;
    padding:0 10px 0 0;
}

.mockupContainer .longMenuButton {
    width:420px;
    height:15px;
    clear:both;
    margin:0 0 5px 0;
    background:#222;
    color:#fff;
    text-align:center;
    padding:5px 0 5px 5px;
    font-size:14px;
    word-break:break-all;
    overflow:hidden;
    text-align:left;
}

.mockupContainer .buttomMenuButtons {
    position:absolute;
    bottom:0;
    width:480px;
    height:30px;
}

.mockupContainer .buttomMenuButton {
    float:right;
    width:80px;
    height:25px;
    background:#222;
    color:#fff;
    font-size:14px;
    text-align:center;
    padding:5px 0 0 0;
    word-break:break-all;
    overflow:hidden;
}

.mockupContainer .buttomLargeMenuButton {
    width:200px;
    height:25px;
    text-align:center;
    background:#222;
    color:#fff;
    font-size:14px;
    padding:5px 0 0 0;
    float:right;
    word-break:break-all;
    overflow:hidden;
}

.mockupContainer .idTextBox {
    padding:5px;
    overflow:auto;
    font-size:18px;
    color:#fff;
    background:#222;
    float:left;
    margin:10px 10px 10px 0;
}

.mockupContainer .mockTextLine {
    color:#222;
    font-size:18px;
    text-align:left;
    clear:both;
}

.mockupContainer .bottom {
    position:absolute;
    bottom:20px;
    width:260px;
    word-break:break-all;
}

.mockupContainer .clearFloat {
    clear:both;
}

.mockupContainer .redArrow {
    background:url('../../images/navsys/popups/redArrow.png') no-repeat;
    height:60px;
    width:60px;
    position:absolute;
}

.mockupContainer .redArrowDown {
    background:url('../../images/navsys/popups/redArrowDown.png') no-repeat;
    height:60px;
    width:60px;
    position:absolute;
}

.mockupContainer .red {
    color:#e71b2e !important;
}

#ttg-m002-pointer {
    top:148px;
    left:60px;
}

#ttg-m003-pointer {
    right:0;
    bottom:30px;
    z-index:99;
}

#ttg-m004-pointer {
    top:135px;
    left:60px;
}

#ttg-m005-pointer {
    bottom:40px;
    left:100px;
}

#hdd-m002-pointer {
    bottom:65px;
    right:40px;
}

#hdd-m003-pointer {
    left:210px;
    top:55px;
}

#TTG_05 .screenTitle {
    margin:0 0 25px 0 !important;
}

.mockupContainer .iconMenu {
    clear:both;
    margin:0 0 0 20px;
    padding:50px 0 0 0;
}

.mockupContainer .iconMenuButton {
    width:75px;
    height:100px;
    float:left;
    margin:0 15px 0 0;
    text-align:center;
    word-break:break-all;
    overflow:hidden;
    color:#222;
    font-size:12px;
}


.mockupContainer .hddMapIdBox {
    background:#222;
    color:#fff;
    text-align:center;
    padding:10px 5px;
    font-size:18px;
    width:300px;
    margin:0 auto;
}

.mockupContainer .hddMapIdText {
    font-size:18px;
    color:#222;
    padding:10px;
    text-align:left;
    width:350px;
    margin:0 auto 30px auto;
}

.mockupContainer .footerButtons {
    width:480px;
}

.mockupContainer .footerButton {
    width:220px;
    padding:5px 0;
    height:20px;
    text-align:center;
    font-size:16px;
    background:#222;
    color:#fff;
    word-break:break-all;
    overflow:hidden;
}

/* Begin TT2G */

#TT2G_02 .mockupContainer {
    background: url("../../images/navsys/popups/tt2g/tt2g_setup_bg.png") top right no-repeat;
}

#TT2G_02 .top_spacer {
    width:100%;
    height:40px;
}

#tt2g-m002-pointer {
    left:100px;
    top:85px;
}

.horizontal-wide-container {
    width:100%;
    height:40px;
    margin:5px 0 0 0;
    border-bottom:1px solid #efefef;
}

.horizontal-wide-container .tt2g-ico-text {
    height:20px;
    float:left;
    text-align:right;
    margin:0 10px 0 0;
    padding:20px 0 0 0;
    color:#222;
    font-size:14px;
    word-break:break-all;
    overflow:hidden;
}

.horizontal-wide-container .tt2g-ico {
    height:40px;
    width:50px;
    float:left;
}

.horizontal-wide-bottom-container {
    position:absolute;
    bottom:0;
}

.horizontal-wide-bottom-container .screenTitle {
    font-size:18px;
    width:200px;
    height:20px;
    margin:0;
    padding:0;
    float:left;

}

.horizontal-wide-bottom-container .tt2g-scroll {
    width:280px;
    height:20px;
    float:left;
}

.horizontal-wide-bottom-container .tt2g-scroll-left {
    width:30px;
    height:20px;  
    background:url("../../images/navsys/popups/tt2g/tt2g_scroll_left.png") no-repeat;
    float:left;
}

.horizontal-wide-bottom-container .tt2g-scroll-info {
    width:40px;
    height:20px;  
    float:left;
    color:#222;
    font-size:14px;
    text-align:center;
}

.horizontal-wide-bottom-container .tt2g-scroll-right {
    width:30px;
    height:20px;    
    background:url("../../images/navsys/popups/tt2g/tt2g_scroll_right.png") no-repeat;
    float:left;
}

.tt2g-ico-text-general { width:130px; }
.tt2g-ico-text-display { width:200px; }
.tt2g-ico-text-audio { width:270px; }
.tt2g-ico-text-connectivity { width:340px; }

.tt2g-ico-general { background:url("../../images/navsys/popups/tt2g/tt2g_general_ico.png") no-repeat; }
.tt2g-ico-display { background:url("../../images/navsys/popups/tt2g/tt2g_display_ico.png") no-repeat; }
.tt2g-ico-audio { background:url("../../images/navsys/popups/tt2g/tt2g_audio_ico.png") no-repeat; }
.tt2g-ico-connectivity { background:url("../../images/navsys/popups/tt2g/tt2g_connectivity_ico.png") no-repeat; }

#tt2g-m003-pointer { bottom:-16px; right:-6px; z-index:99; }

.TT2G_classic_col1 { width:79px; height:280px; float:left; position:relative; }
.TT2G_classic_col2 { width:370px; height:280px; float:left; border-left:1px solid #888; }
.TT2G_classic_col3 { width:30px; height:280px; float:left; position:relative; }
.TT2G_classic_topIcon { width:50px; height:40px; background:url("../../images/navsys/popups/tt2g/tt2g_general_ico.png") no-repeat; }
.TT2G_classic_returnButton { width:80px; height:40px; background: url('../../images/navsys/popups/returnArrow.png') no-repeat; position:absolute; bottom:0; margin:0 0 0 -12px; }

.TT2G_classic_menuItem { 
    width:100%; 
    height:20px; 
    border-bottom:1px solid #222; 
    padding:12px 0 8px 4px; 
    color:#222; 
    word-break:break-all;
    overflow:hidden;
}

.TT2G_classic_menuItem_setting {
    float: right;
    color: #bbb;
    padding: 0 10px 0 0;
}

.TT2G_classic_scrollup { width:40px; height:36px; background:url('../../images/navsys/popups/tt2g/tt2g_scroll_up.png') -5px 0 no-repeat; }
.TT2G_classic_scrollbar { margin:0 auto; width:6px; height:196px; background:#222; padding:2px 0; position:relative; }
.TT2G_classic_scrolldown { width:40px; height:36px; background:url('../../images/navsys/popups/tt2g/tt2g_scroll_down.png') -5px 0 no-repeat; }
.TT2G_classic_menuItem_checkbox { display:block; width:15px; height:15px; float:left; background:#222; margin:0 5px; }
.TT2G_classic_menuItem_checkbox_text { float:left; }
#TT2G_03 .TT2G_classic_innerscrollbar { margin:0 auto; width:2px; height:100px; background:#fff; }
#TT2G_04 .TT2G_classic_innerscrollbar { margin:0 auto; width:2px; height:100px; background:#fff; position:absolute; bottom:2px; left:2px; }

#tt2g-m004-pointer { top:115px; left:140px; z-index:99; }

#TT2G_classic_col2_span_col3_spacer { width:400px; height:50px; }
.TT2G_classic_col2_span_col3 { width:400px; height:280px; float:left; position:relative; }
.TT2G_mapinfo_container { width:300px; padding:10px; background:#222; margin:0 auto; line-height:20px; color:#fff; font-size:13px; }
.TT2G_key_global_container { width:390px; overflow:auto; padding:10px; border-top:1px solid #222; border-left:1px solid #222; }

.TT2G_key_label { margin:10px 0; width:390px; overflow-y:auto; overflow-x:hidden; color:#222; }
.TT2G_key_container { width:390px; overflow-y:auto; overflow-x:hidden; }

.TT2G_key_box { padding:4px 0; width:60px; text-align:center; background:#222; color:#fff; float:left; margin:0 1px 0 0; font-size:16px; }
.TT2G_mapinfo_titlebar { position:absolute; bottom:0; right:0; overflow:auto; width:410px; padding:10px 0 }
.TT2G_mapinfo_titlebar_title { float:left; color:#222; font-size:16px; padding:4px; }
.TT2G_mapinfo_titlebar_audioInfo { float:right; background:#222; color:#fff; padding:4px; font-size:16px; }

#tt2g-m005-pointer { top:105px; left:190px; z-index:99; }

#HDD_03 .clearFloat { position:relative; top:-40px; }
.HDD_03_widebox { width:460px; margin:5px 0; padding:10px; border-top:1px solid #efefef; border-bottom:1px solid #efefef; text-align:center; color:#222; } 

#hdd-m003-pointer { z-index:99; top:20px; }

.alignLeft { text-align:left; padding-left:10px; }

/* End TT2G */