body { font-family: 'Droid Sans', sans-serif; background:#464646; color:#333}
#pageWrapper {background:#efefef;}

/*** NAVIGATION ***/
#headerNav .navbar-nav > li > a { padding:15px; font-size:14px; line-height:20px}
/*.homePage #headerNav .navbar-nav > li > a { padding-top:30px; padding-bottom:30px}*/

#headerNav .navbar-nav > li > a.dealerLink{ color:#B5121B}

#subNavWrapper{ background:#222; height:50px}
#subNav{ background:#222}
#subNav.affix{ position:fixed; top:50px; width:100%; z-index:100}

#subNav .navbar-nav > li > a { padding:0 15px; line-height:50px; color:#fff}
#subNav .navbar-nav > li > a:hover{ background:#171717; }
#subNav .navbar-nav > li > a:active, #subNav .navbar-nav > li > a:focus{ background:none; }
#subNav .secondaryLinks > li > a { color:#d1d0d1}

#subNav .scrollTop{ display:none}


.transLink{ display: block; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 5 !important; border: 3px solid transparent;}
.transLink:hover{ border-color: #1463a6}
a.transLink a img{ width:100%}

#imageList .transLink{ border:none}

/*** LAYOUT ***/
#header{ z-index:100; border:none; margin:0; background:#fff; border-radius:0}
#header.mini{ height:50px}

#header .navbar-brand{ padding:0}
#header .navbar-brand > img{ margin:0; max-width:251px}
.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand{ margin:0}

#headerNav{ margin-left:220px; padding-right: 0;}
#headerNav li, #footerNav li{ background:url(../graphics/icon_bull.png) no-repeat right; padding-right:5px}
#headerNav li.lastNav, #footerNav li.lastNav{ background:none; padding:0}

.contentSection{ padding-top:50px !important; padding-bottom:50px !important}

#footerWrapper{ background: #464646;}
#footer{ color:#fff; font-size:12px; text-align:center; padding:20px 0}

/*** CONTENT ***/
h1, .h1, h2, .h2, h3, .h3 {
    margin-top: 0px !important;
}

/*** NAVIGATION ***/

#sideNav ul, #sideNav li{ margin:auto; padding:0; list-style:none}
#sideNav ul{ margin-bottom:20px}

#sideNav li{ border-bottom:1px solid #222;}
#sideNav a{ display:block; line-height:30px; padding:0 5px; color:#fff;}
#sideNav a:hover{ background:#222}

.navSubTitle{ font-weight:bold; border:none; margin-top:15px !important; font-size:16px}

a.btn-primary{ color:#fff}

/*** LAYOUT ***/
#testWarning{ position:fixed; top:0; left:0; right:0; background:#b5121b; color:#fff; text-align:center; font-size:14px; line-height:50px; height:50px; z-index: 10000;}
#messageText{ position:fixed; top:0px; right:0; padding:0 20px; background:#b5121b; color:#fff; font-weight:bold; text-align:center; font-size:14px; line-height:40px; height:40px; z-index: 20000; display:none}

.isTesting #messageText{ top:50px;}

.isTesting{ padding-top:50px}

.isTesting .modal-dialog{ margin-top:70px}

.row.equalHeight{ overflow:hidden}
.fullHeight{ margin-bottom: -99999px; padding-bottom: 99999px; }

#sideNav{ background:#464646; color:#fff; padding-top:20px; padding-left:10px; padding-right:10px; margin-top:-20px}
.actionBtns{ margin-bottom:20px}
.actionBtns .btn-group{ width:100%}
.actionBtns .btn{ display: block; margin-bottom:20px; float:none !important; width:100%}
.actionBtns .dropdown-menu{ margin-top:-20px}

#header{ background:#fff}

#countrySelect, #brandSelect{ float:right; margin:0; padding: 8px 10px 0; background: #ccc; height: 50px;}
#brandSelect{ margin:0 10px 0 0}

#contentWrapper{ padding-top:20px; min-height:450px}
#content{ padding-bottom:60px}

.buttons{ margin:20px 0; text-align:right}

.table{ font-size:14px}

.displayNone{ display:none}

.filterWrapper, .downloadWrapper{ margin-bottom:20px}
.filterTitle, .downloadTitle{ font-size:18px; font-weight:bold}
.filterWrapper label, .downloadWrapper label{ font-weight:normal}

.filterWrapper .help-block, .downloadWrapper .help-block{ font-size:12px}

#logoutBtnWrapper{ padding-top:8px !important}

#MainContent_editNotice, #MainContent_updateText{ background:#b5121b; border-color:#b5121b}
.bg-primary a{ color:#fff; font-weight:bold; text-decoration:underline}

.transition, .btn, a{ -webkit-transition: background 0.2s linear, border 0.2s linear, color 0.2s linear;
-moz-transition: background 0.2s linear, border 0.2s linear, color 0.2s linear;
-ms-transition: background 0.2s linear, border 0.2s linear, color 0.2s linear;
-o-transition: background 0.2s linear, border 0.2s linear, color 0.2s linear;
transition: background 0.2s linear, border 0.2s linear, color 0.2s linear;}

.dropdown-menu{ min-width: 200px !important;}

/* admin pages/checklist */
#pageList, #pageList ul, #pageList li, .checkList, .checkList ul, .checkList li{ margin:0; padding:0; list-style:none}
#pageList, .checkList{ margin-bottom:20px}
#pageList li, .checkList li{ border-bottom:1px solid #cfcfcf; line-height:35px}

#pageList ul.subPageList{ border-top:2px solid #cfcfcf}
#pageList ul.subPageList li{ background:url(../graphics/icon_page-node.png) no-repeat 8px center; padding-left:30px}

.page-actions{ float:right}
.check-actions{ float:left; margin-right:10px; height:35px}
.page-actions input, .check-actions input{ /*height:35px;*/ margin:0; padding:0}
.check-actions input{ height:35px;}
.toggleSubPages{ display:block; line-height:35px; float:left; margin-right:20px}

.parentToggle label, .pageToggle label, .check-actions label{ display:none}

.parent-page td.sub-page { font-weight:bold}
.sub-page td.sub-page { background: url(../graphics/icon_page-node.png) no-repeat 8px center; padding-left: 30px !important;}
.sub-page .add-link { display: none;}

.sub-input{ padding-bottom:10px; margin-bottom:10px; border-bottom:1px solid #464646}


/* FORMS *******************/
form{ margin:0 !important}

.has-error{ color:#a94442}

.file-upload{ margin-bottom:15px}

table.form-control{ height:auto}

ul.form-control{ height:auto; list-style:none}

/* UPLOADER ***************/
#dropbox{ text-align:center; padding:100px 0; font-size:18px; border:5px dashed transparent; background:url(/graphics/dropAreaBg.png) #CCCCCC;}
#dropbox.dragOver{ border-color:#1463a6}

/*.imgHolderHighlight{ height:200px; background:#fff}*/

/* IMAGE LIST **************/ 
#imageList .imageItem{ position: relative; text-align: center; background: #ddd; box-shadow: 0 1px 1px rgba(0,0,0,0.2); margin-bottom: 20px;}
.uploadedImages .imageItem{ padding:10px}

#imageList .imageItem img{ display: block; margin:0 auto}

#imageList .imageItem .form-group{ margin-bottom:0}
#imageList .imageItem .imgDescField{ display:none}
#imageList .done .imageItem .imgDescField{ display:block}

#imageList .imageHolder{   display: block; margin-bottom: 10px; text-align:center}

#imageList .uploaded{ position: absolute; right:10px; bottom:10px; display: none; width:30px; height:30px; border-radius:50%; background:rgba(0, 0, 0, 0.3); color:#fff; text-align: center; font-size: 16px; line-height: 18px; padding: 6px 0;}

#imageList .done .uploaded{ display: block;}

#imageList .progressHolder{ height:12px; width:100%; }

#imageList .progress{ background-color:#1463a6; position: absolute; height:12px; left:0; width:0; -moz-transition:0.25s; -webkit-transition:0.25s;-o-transition:0.25s; transition:0.25s;}

#imageList .done .progress{ width:100% !important;}

#imageList .error .imageItem{ background:#c00; color:#fff}

#imageList .imageIndicators{ position:absolute; left:5px; top:5px; z-index:20; width:30px}

#imageList .webHiddenIcon, #imageList .webListIcon, #imageList .webSearchIcon {
    background: #000;
    color: #fff;
    opacity: 0.6;
    border-radius: 50%;
    width: 30px;
    line-height: 30px;
    text-align: center;
    display: none;
    margin-bottom: 5px
}
#imageList .hiddenFromWeb .webHiddenIcon, #imageList .webListImage .webListIcon, #imageList .searchListImage .webSearchIcon {
    display: block;
}
#imageList .webListImage .btnListImage, #imageList .searchListImage .btnSearchImage {
    display: none;
}

#imageList .hiddenFromWeb .btnHideFromWeb .glyphicon:before{ content: "\e105";}
 
.imagesSortHighlight{ height:160px; background:#CCCCCC; float: left; width: 33.33333333%; margin-bottom:20px; border:1px solid #EFEFEF; border-width:0 10px; box-shadow:0 2px 2px rgba(0,0,0,0.3) inset}

#uploadBtnHolder{ position:relative; overflow:hidden}
#uploadBtn{ position:absolute; width:500px; height:500px; opacity:0; top:0; right:0;}

#uploadComplete{ margin-top:20px}

.imageToolbar{ position:absolute; top:0; right:5px; z-index:10; background:#000; background:rgba(0,0,0,0.6); border-radius:0 0 5px 5px; display:none}
.imageItem:hover .imageToolbar{ z-index:20; display:block}
.imageToolbar .btn-link{ color:rgba(255,255,255,0.6); padding: 3px 6px; font-size: 12px;}
.imageToolbar .btn-link:hover{ color:#fff}
.imageToolbar .btn-link.lightboxSelected{ color:#B5121B}
.imageToolbar .btn-link.lightboxSelected .glyphicon:before { content: "\2212";}

.imageDesc{ position:absolute; bottom:0; left:0; right:0; background:#000; background:rgba(0,0,0,0.6); color:#fff; max-height: 0; overflow:hidden; transition: max-height 0.15s ease-out; z-index:10}
.imageDesc p{ margin:0; font-size:12px; padding:10px}
.imageDesc textarea{ border:none; width:100%; padding:10px 20px 10px 10px; font-size:12px; text-align: center; display:none; background:none}
.imageDesc .btnSaveDescription{ position:absolute; right:5px; bottom:5px; display:none; padding: 0; color: #fff;}
.imageItem:hover .imageDesc{ max-height: 500px; transition: max-height 0.25s ease-in;}
.imageDesc.active{ max-height:500px !important}
.imageDesc.active textarea{ display:block}
.imageDesc.active .btnSaveDescription{ display:inline-block}
.imageDesc.active p{ display:none}

.customImageSettings{ padding:3px 20px}
.customImageSettings a{ display: inline-block !important; padding: 3px 5px !important; color:#fff !important}
.customImageSettings a:hover{ background-color: #053b69 !important;}

.imgCustomWidth, .imgCustomHeight{ width:55px !important}

#imageList .deleted{ background:#B5121B; color:#fff; padding:20px}

.iconLg{ font-size:40px}

#imageList .tooltip{ width:100px}

/* image popup */
#imagePlaceholder{ background:url(/graphics/imagePreloader2.gif) no-repeat center center; min-height:70px; text-align:center}
.imageHolder{ background:url(/graphics/imagePreloader.gif) no-repeat center center; min-height:50px; text-align:center}
.error .imageHolder{ background:none}

#imagePlaceholder img, .imageHolder img{ margin:0 auto}

#imageDescPlaceholder{ margin-top:10px; text-align:center}
#imageUtilityActions > .btn-group{ margin-left:20px}

/* LIGHTBOX ***************/
#lightboxWrapper{ display:none; background:#464646; padding:20px; position:fixed; right:0; bottom:0; top:0; width:260px; color:#fff; z-index:1000; margin-right:-260px}
.isTesting #lightboxWrapper{ top:50px}

#lightboxWrapper p{ font-size:12px}

#lightboxWrapper .dropdown-menu{ color:#464646}

#lightbox{   position: absolute; top: 130px; bottom: 75px; left: 20px; right: 10px; overflow-y:auto}
#lightbox{ margin:0 -5px 10px}
#lightbox:after{ content: " "; display: table; clear:both}

.lightboxItem{ background:url(/graphics/imagePreloader3.gif) no-repeat center center; min-height:50px; width:50%; float:left; position:relative}
.lightboxItem .inner{ margin:5px}
.lightboxToolbar{ position:absolute; top:32px; left:10px; opacity: 0; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out;}
.lightboxItem:hover .lightboxToolbar{ opacity:1}
.lightboxToolbar .btn{ background:rgba(0,0,0,0.6); color:rgba(255,255,255,0.6); border-radius: 50%; padding: 6px 0; width: 35px; margin:0 5px}
.lightboxToolbar .btn:hover{ color:#fff}

#lightboxBtn{ position:absolute; right:260px; top:200px; border-radius:5px 5px 0 0; -moz-transform:rotate(-90deg); -webkit-transform:rotate(-90deg); -o-transform:rotate(-90deg); -ms-transform:rotate(-90deg); transform:rotate(-90deg); transform-origin: 100% 100%;}
#lightboxBtn .glyphicon{ -moz-transition: all .25s ease-in-out; -webkit-transition: all .25s ease-in-out; -o-transition: all .25s ease-in-out; transition: all .25s ease-in-out;}
#lightboxBtn.active .glyphicon{ -moz-transform:rotate(180deg); -webkit-transform:rotate(180deg); -o-transform:rotate(180deg); -ms-transform:rotate(180deg); transform:rotate(180deg)}
#lightboxOverlay{ position:fixed; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,0.6); cursor:pointer; display:none; z-index:999}

#downloadLightboxBtn{ position:absolute; bottom:20px; right:20px}

#MainContent_addAllBtn{ margin-bottom:20px}

/* LOADING MODAL*/
#loadingModal{ text-align:center}
.loadingTitle{ font-size:20px; font-weight:bold;}

/* pagination ***************/
.pagination { display: table-row; padding-left: 0; margin: 20px 0; border-radius: 4px;}

.pagination table > tbody > tr > td { display: inline;}

.pagination table > tbody > tr > td > a, .pagination table > tbody > tr > td > span { position: relative; float: left; padding: 8px 12px; line-height: 1.42857143; text-decoration: none; color: #dd4814; background-color: #ffffff; border: 1px solid #dddddd; margin-left: -1px;}

.pagination table > tbody > tr > td > span { position: relative; float: left; padding: 8px 12px; line-height: 1.42857143; text-decoration: none;     margin-left: -1px; z-index: 2; color: #aea79f; background-color: #f5f5f5; border-color: #dddddd; cursor: default;}

.pagination table > tbody > tr > td:first-child > a, .pagination table > tbody > tr > td:first-child > span { margin-left: 0; border-bottom-left-radius: 4px; border-top-left-radius: 4px;}

.pagination table > tbody > tr > td:last-child > a, .pagination table > tbody > tr > td:last-child > span { border-bottom-right-radius: 4px; border-top-right-radius: 4px;}

.pagination table > tbody > tr > td > a:hover, .pagination table > tbody > tr > td > span:hover, .pagination table > tbody > tr > td > a:focus, .pagination table > tbody > tr > td > span:focus { color: #97310e;
background-color: #eeeeee; border-color: #dddddd;}