/** ====================================================================== **/
/** IMAGE GALLERY VIEWS                                                    **/
/** ====================================================================== **/
/** Selectors used throughout the primary views of the image gallery       **/
/** module.                                                                **/
/** ====================================================================== **/

/** DNN inserts a <br> after every DNN label; this disables it. */
.inlineEditField br { display: none; }
.clear { clear: both; }

.mg_gallery .filmStrip h2 { margin-bottom: 24px; margin-left: 8px; }

/*  Use wide 3.25x1 aspect ratio for lseder view if selected in settings.
    Default setting for Blueimp is 16:9.
*/
.mg_gallery .blueimp-gallery.wide {padding-bottom:30.75%;}

/** ====================================================================== **/
/** IMAGE GALLERY SETTINGS                                                 **/
/** ====================================================================== **/
/** Selectors used throughout the various "settings" views of the image    **/
/** gallery module.                                                        **/
/** ====================================================================== **/
#imagePreviewPane, #testImagePreviewPane {
	position:absolute;
	border:1px solid #CCCCCC;
	background:#000000;
	padding:3px;
	display:none;
	color:#fff;
	font-size: 10px;
	z-index: 9999;
}

.img-settings-pnlError {
  background-color: #f2dede;
  border: 1px solid red;
  color: red;
  padding: 10px;
  margin: 10px;
  display: block;
}

.mg_gallery_settings label  { font-size: 11px; }
.mg_gallery_settings button { font-size: 11px; }
.mg_gallery_settings select { padding: 6px 12px; margin: 6px 0; }

.mg_gallery_settings .margin-left-250 { margin-left: 250px; }
.mg_gallery_settings .margin-left-20 { margin-left: 20px; }

.buildingAndLocationContainer   {width: 800px;}
.buildingAndLocationSelector    {float: left; margin-left: 10px;}
.rBtnListLocatioBuilding        {margin-left: 210px; float: left; text-align:right}
.radioBtnListOverride           {margin-left: 160px; float: left; text-align:right}

.mg_gallery_settings .buildingSelectionContainer        { margin: 10px 0 10px 0; }
.mg_gallery_settings .buildingSelectionContainer div    { margin-top: 5px;  }
.mg_gallery_settings .buildingSelectionContainer label  { width: 150px; display: block; float: left; margin-right: 5px; clear: both }
.mg_gallery_settings .buildingSelectionContainer select
.mg_gallery_settings  .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) { width: 300px; }
.mg_gallery_settings .bootstrap-select>.dropdown-toggle { background: none;font-size: 14px; }
.mg_gallery_settings .bs-searchbox input{ margin-bottom: 0; width: 100% }
.dnnFormItem .dnnLeft{ margin:0 }

.mg_gallery_settings .sectionHeading { font-family: "Arial,Helvetica,sans-serif"; font-size: 17px; color: #EE2424; display: block; text-align: left;padding-left: 150px; margin-bottom: 10px}

.mg_gallery_settings div.header { float: left; }
.mg_gallery_settings div.header .menu { margin-top: 5px; margin-bottom: 20px; }
.mg_gallery_settings div.header .menu a { margin-right: 20px; }

.mg_gallery_settings .itemListing             { width: 100%; }
.mg_gallery_settings .itemListing .header     { padding: 5px 5px 5px 0px; text-align: left; vertical-align: bottom; }
.mg_gallery_settings .itemListing .footer     { padding: 5px 5px 5px 0px; }
.mg_gallery_settings .itemListing .standard   { margin: 2px 2px 2px 0px; font-weight: normal; }
.mg_gallery_settings .itemListing .selected   { margin: 2px 2px 2px 0px; font-weight: bold;   }
.mg_gallery_settings .itemListing td         { font-size: 12px;  }
.mg_gallery_settings .itemListing td a        { margin: 0 2px 0 2px; }
.mg_gallery_settings .itemListing td.footer a {color: #007cc3; margin: 0 2px 0 0; }

.mg_gallery_settings .itemListing .imageTypeName          { width: 18%; }
.mg_gallery_settings .itemListing .imageTypeDescription   { width: 42%; }
.mg_gallery_settings .itemListing .imageTypeProtoWidth    { width: 8%; text-align: right; padding-right: 10px; }
.mg_gallery_settings .itemListing .imageTypeProtoHeight   { width: 8%; text-align: right; padding-right: 10px; }
.mg_gallery_settings .itemListing .imageTypeIsGalleryType { width: 6%; text-align: center; }
.mg_gallery_settings .itemListing .imageTypeImageCount    { width: 6%; text-align: right; padding-right: 20px; }

.mg_gallery_settings .itemListing .imageGroupName        { width: 18%; }
.mg_gallery_settings .itemListing .imageGroupPortal      { width: 35%; }
.mg_gallery_settings .itemListing .imageGroupDescription { width: 27%; }
.mg_gallery_settings .itemListing .imageGroupImageCount  { width: 10%; text-align: right; padding-right: 20px; }

.mg_gallery_settings .itemListing .imageGroupingGroupName { width: 40%; text-align: left;  padding-right: 10px; }
.mg_gallery_settings .itemListing .imageGroupingSortOrder { width: 30%; text-align: right; padding-right: 10px; }

.mg_gallery_settings .itemListing .imageMetaDataPropertyName  { width: 25%; text-align: left;  padding-right: 10px; }
.mg_gallery_settings .itemListing .imageMetaDataPropertyValue { width: 45%; text-align: left;  padding-right: 10px; }

.mg_gallery_settings .itemEdit { width: 500px; margin: 20px 0px 0px 0px; }
.mg_gallery_settings .imageEdit .fieldRow { margin: 2px 0px 2px 0px; }

.mg_gallery_settings .imageGroupEditPanel {margin:20px 0 10px 0}
.mg_gallery_settings .imageGroupEditPanel .itemEdit { width: 800px; }
.mg_gallery_settings .imageGroupEditPanel .itemEdit select { width: 250px; height: 107px; }
.mg_gallery_settings .imageGroupEditPanel .create_new_image_group{ float: none;}
.mg_gallery_settings .imageGroupEditPanel .edit_image_group{ float: left;}
.mg_gallery_settings .imageGroupEditPanel .label{width: 112px; margin-top: 3px; margin-right: 5px; text-align: right; float: left;}
.mg_gallery_settings .imageGroupEditPanel .label span{ padding-right: 20px;}
.mg_gallery_settings .imageGroupEditPanel .ddl{ margin-top: 2px; margin-left: 116px;}
.mg_gallery_settings .imageGroupEditPanel .txt_description{margin-left: 118px; margin-top: 2px;}
.mg_gallery_settings .imageGroupEditPanel .update_cancel_btn{padding-left: 117px;}
.mg_gallery_settings .imageGroupEditPanel .img_list_box{margin-bottom: 2px; margin-left: 119px;}
.mg_gallery_settings .imageGroupEditPanel .move_up_down_btn{padding-left: 170px;}

.mg_gallery_settings .restriction { width: 100%; float: left; margin-bottom: 10px; border-bottom: solid 1px #636363; }
.mg_gallery_settings .restriction .sectionHeading { display: block; }
.mg_gallery_settings .restriction .restrictionField { margin: 0px 0px 10px 0px; float: left; width:230px }
.mg_gallery_settings .restriction .restrictionField select { margin: 2px 20px 0px 0px; width: 130px; }
.mg_gallery_settings .restriction .restrictionField .dnnLabel { display: block;float: none;position: inherit;text-align: left; }

.mg_gallery_settings .navigation  { float: left; text-align: center; }
.mg_gallery_settings .navigation .currentPageLabel      { display: block; margin-bottom: 2px; clear: both; }
.mg_gallery_settings .navigation .imageNavigationLeft   { float: left; background-image: url('/DesktopModules/ImageGallery/Images/buttons.png'); background-position: left bottom;  width: 27px; height: 27px; border: none; clear: both; cursor: pointer; }
.mg_gallery_settings .navigation .imageNavigationRight  { float: left; background-image: url('/DesktopModules/ImageGallery/Images/buttons.png'); background-position: right bottom; width: 27px; height: 27px; border: none; cursor: pointer;  }
.mg_gallery_settings .navigation div.imageNavigator     { clear: both; margin-bottom: 5px; border: solid 1px #A7A7A7; background-color: #D7D7D7; }
.mg_gallery_settings .navigation a.navigationLeft,
.mg_gallery_settings .navigation a.navigationRight { display: block; float: left; }
.mg_gallery_settings .navigation a.navigationLeft  { margin: 0 2px 2px 20px; }
.mg_gallery_settings .navigation a.navigationRight { margin: 0 2px 2px 0; }

/** Settings that are specific to image navigator operation. */
.mg_gallery_settings .navigation div.imageNavigator                  { position: relative; height: 450px; width: 95px; overflow: auto; }
.mg_gallery_settings .navigation div.imageNavigator_strip            { margin: 5px; padding: 0px; }
.mg_gallery_settings .navigation div.imageNavigator_strip a          { display: block; width: 80px; margin-bottom: 5px; color: #FFFFFF; background: #4F4F4F; border: 2px #4F4F4F solid; }
.mg_gallery_settings .navigation div.imageNavigator_strip a:hover    { border-color: rgb(130, 130, 130); border-style: dotted; }
.mg_gallery_settings .navigation div.imageNavigator_strip a.selected { border: solid 2px #F8F7EF; }
.mg_gallery_settings .navigation div.imageNavigator_strip img        { display: block; border: none; width: 80px; }
.mg_gallery_settings .navigation div.imageNavigator .loading         { position: absolute; top: 215px; left: 5px; margin: 0px; padding: 5px 0px 5px 0px; width: 82px; text-align: center; color: #FFFFFF; border: 1px solid #4F4F4F; background: #1F1D1D; }

.mg_gallery_settings .configuration { margin-left: 15px; width: 450px; float: left; }
.mg_gallery_settings .configuration .imageDetails .inlineEditField { margin-bottom: 5px; }
.mg_gallery_settings .configuration .imageDetails .inlineEditField label { width: 100px; float: left; }
.mg_gallery_settings .configuration .imageDetails .inlineEditField input[type="text"] { width: 275px; margin-left: 9px; }
.mg_gallery_settings .configuration .imageDetails .commandFooter { margin-top: 15px; margin-bottom: 15px; text-align: center; }

.mg_gallery_settings .configuration #imagePreviewHeader { width: 100%; float: left;  margin-bottom: 5px; }
.mg_gallery_settings .configuration #imagePreviewPanel { width: 450px; overflow: hidden; vertical-align: middle; text-align: center; }
.mg_gallery_settings .configuration #imagePreviewPanel .imagePreviewStage { width: 450px; overflow: hidden; vertical-align: middle; text-align: center; }
.mg_gallery_settings .configuration #imagePreviewPanel img { max-width: 450px; }

.mg_gallery_settings .configuration #imageDetailPanel { margin-top: 5px; }
.mg_gallery_settings .configuration #imageDetailsPanel { margin-top: 10px; }
.mg_gallery_settings .configuration #imageThumbnailPanel { margin-left: 15px; text-align: right; max-width: 140px; }
.mg_gallery_settings .configuration #imageThumbnailPanel img { max-width: 140px; }

.mg_gallery_settings .categorisation                                { float: left; margin: 0px 0px 0px 15px; width: 280px; }
.mg_gallery_settings .categorisation .categoryPanel                 { margin: 0px 0px 30px 0px; }
.mg_gallery_settings .categorisation .itemEdit                      { margin: 30px 0px 0px 0px; width: 240px; text-align: right; vertical-align: top; }
.mg_gallery_settings .categorisation .itemEdit .editTitle           { margin-bottom: 5px; text-align: left; }
.mg_gallery_settings .categorisation .itemEdit .editTitle span      { font-size: larger; margin-bottom: 5px; display: block; }
.mg_gallery_settings .categorisation .itemEdit .SubHead             { vertical-align: middle; padding-right: 5px; }
.mg_gallery_settings .categorisation .itemEdit select               { width: 139px; margin-bottom: 4px; margin-right: 0px; }
.mg_gallery_settings .categorisation .itemEdit input[type="text"]   { width: 133px; margin-bottom: 4px; }
.mg_gallery_settings .categorisation .itemEdit input[type="submit"] { margin-top: 8px; }

.mg_gallery_settings .categorisation .itemEdit.imageTypings                        { margin-top: 20px; }
.mg_gallery_settings .categorisation .itemEdit.imageTypings table                  { width: 320px; }
.mg_gallery_settings .categorisation .itemEdit.imageTypings table tr td { text-align: left; }
.mg_gallery_settings .categorisation .itemEdit.imageTypings .inlineEditField       { margin-left: 30px; }
.mg_gallery_settings .categorisation .itemEdit.imageTypings .inlineEditField td    { font-size: 12px; }
.mg_gallery_settings .categorisation .itemEdit.imageTypings .inlineEditField label { font-weight: normal; }

.mg_gallery_settings .changeImageManager { display: inline; }
.mg_gallery_settings .changeImageManager input[type="text"] { display: none; }
.mg_gallery_settings .newImageManager { display: block; margin-bottom: 5px; }
.mg_gallery_settings .newImageManager input[type="text"] { display: none; }

.sourcePortalDisplay { display: none; }

div.imageNavigator .tooltip {
    display: block;
    position: absolute;

    padding: 6px;
    font-size: 12px;  
    color: #fff;

    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;

    border: 1px solid rgb(79, 79, 79);
    background: rgb(0, 0, 0);
    /* Make background a bit transparent for browsers that support rgba */    
    background: rgba(0, 0, 0, 0.5);
}
.dnnCheckbox .mark,.dnnRadiobutton .mark { background-color: inherit; }
div.dropdown-menu.open{ max-height: 290px !important; overflow: hidden; }
ul.dropdown-menu.inner{ max-height: 190px !important; overflow-y: auto; }
/** ====================================================================== **/

.RadWindow{ overflow: hidden;}
.rwTable.ie9 { height: 410px !important; }

/**====== Slide Show Setting ======**/
#SlideShowSettingContainer{margin-top: 10px;}
#SlideShowSettingTitle{font-weight: bold;}
#SlideShowSettingSourcelbl{float:left; margin-right:30px;}
#SlideShowSettingImagelbl{float:left; margin-right:77px;}
#SlideShowSettingCBL{border-style: groove; border-width: 1px; overflow-y: scroll; width: 300px; height: 100px; position: relative;}

/** ====================================================================== **/
/** THUMBNAIL GALLERY                                                      **/
/** ====================================================================== **/
/** Selectors used in ThumbnailGallery.ascx                                **/
/** ====================================================================== **/
.thumbnailGallery               { clear: both; overflow: auto; }
.thumbnailGallery li            { list-style-type: none; float: left; margin: 0 10px 7px 0; }

/* =========== Validation =================== */
.validation {text-align:left;font-size: small;color: #FF0000;}
/* =========== Validation =================== */