/* #### Mobile Phones Portrait #### */
@media screen and (max-device-width: 480px) and (orientation: portrait){
  .galeryBG{display: block; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background-color: black; opacity: 0.8; z-index: 2147483600;}
}

/* #### Mobile Phones Landscape #### */
@media screen and (max-device-width: 640px) and (orientation: landscape){
  .galeryBG{display: block; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background-color: black; opacity: 0.8; z-index: 2147483600;}
}
/*

@media screen and (max-device-width: 640px){
  .galeryBG{display: block; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background-color: black; opacity: 0.8; z-index: 2147483600;}
}

@media screen and (max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2){
  .galeryBG{display: block; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background-color: black; opacity: 0.8; z-index: 2147483600;}
}

@media screen and (min-device-width: 768px) and (max-device-width: 1024px){
  .galeryBG{display: block; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background-color: black; opacity: 0.8; z-index: 2147483600;}
}
@media screen and (max-width: 1024px){
  .galeryBG{display: block; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background-color: black; opacity: 0.8; z-index: 2147483600;}
}
@media screen and (min-width: 1024px){
    */
  #galery{display: block; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; display: none;}
  .galeryBG{display: block; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; background-color: black; opacity: 0.8; z-index: 2147483600;}
  .galeryContainer{display: block; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; text-align: center; z-index: 2147483601;}
  .galeryImage{display: block; position: absolute; top: 50%; left: 50%; border: /*CALC BY JS*/ 0px solid white; background-color: #E6E6E6; -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.8); -moz-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.8); box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.8); z-index: 2147483604;}
  .galeryTopContainer{display: block; position: fixed; left: 0px; top: 0px; width: 100%; /*CALC BY JS*/ height: 100%; z-index: 2147483605;}
  #galeryMain .galeryLeftButton{display: block; position: absolute; left: 0%; top: 50%; margin-top: -20px; background-color: black; background-image: url("leftButton.png"); background-repeat: no-repeat; background-size: contain; background-position: center center; /*KONSTATNI HODNOTA*/ width: 20px; height: 40px; opacity: 0.8; z-index: 2147483606;}
  #galeryMain .galeryLeftButton:hover{display: block; position: absolute; left: 0%; top: 50%; margin-top: -20px; background-color: black; background-image: url("leftButton.png"); background-repeat: no-repeat; background-size: contain; background-position: center center; /*KONSTATNI HODNOTA*/ width: 20px; height: 40px; opacity: 0.9; cursor: pointer; z-index: 2147483606;}
  #galeryMain .galeryRightButton{display: block; position: absolute; left: 100%; top: 50%; background-color: black; background-image: url("rightButton.png"); background-repeat: no-repeat; background-size: contain; background-position: center center; /*KONSTATNI HODNOTA*/ width: 20px; height: 40px;/*KONSTATNI HODNOTA*/ margin-left: -20px; margin-top: -20px; opacity: 0.8; z-index: 2147483606;}
  #galeryMain .galeryRightButton:hover{display: block; position: absolute; left: 100%; top: 50%; background-color: black; background-image: url("rightButton.png"); background-repeat: no-repeat; background-size: contain; background-position: center center; /*KONSTATNI HODNOTA*/ width: 20px; height: 40px;/*KONSTATNI HODNOTA*/ margin-left: -20px; margin-top: -20px; opacity: 0.9; cursor: pointer; z-index: 2147483606;}
  .galeryBottomContainer{display: block; position: fixed; left: 0%; top: 100%; width: 100%; /*CALC BY JS*/ height: 80px; margin-top: /*CALC BY JS*/ -80px; background-color: black; opacity: 0.8; z-index: 2147483605;}
  .galeryOptions{display: none; position: relative; left: 100%; top: 0%; width: /*CALC BY JS*/ 80px; height: 100%; margin-left: /*CALC BY JS*/ -80px; background-image: url("options.png"); background-repeat: no-repeat; background-position: center center; z-index: 2147483607;}
  .galeryOptions:hover{display: block; position: relative; left: 100%; top: 0%; width: /*CALC BY JS*/ 80px; height: 100%; margin-left: /*CALC BY JS*/ -80px; background-image: url("options.png"); background-repeat: no-repeat; background-position: center center; background-color: black; opacity: 0.8; cursor: pointer; z-index: 2147483607;}
  .galeryCross{display: block; position: fixed; left: 100%; top: 0%; width: /*CALC BY JS*/ 20px; height: 20px; margin-left: /*CALC BY JS*/ -20px; background-image: url("cross.png"); background-repeat: no-repeat; background-position: center center; z-index: 2147483607; background-size: contain; background-color: rgba(0, 0, 0, 0.8);}
  .galeryNumber{display: none; position: relative; height: 80px; line-height: 80px; color: white; font-size: 60px; text-align: center; background-color: black; font-family: Arial,Helvetica Neue,Helvetica,sans-serif; opacity: 0.8; z-index: 2147483607;}
  .galeryCross:hover{display: block; position: fixed; left: 100%; top: 0%; width: /*CALC BY JS*/ 20px; height: 20px; margin-left: /*CALC BY JS*/ -20px; background-image: url("cross.png"); background-repeat: no-repeat; background-position: center center; opacity: 0.8; cursor: pointer; z-index: 2147483607; background-size: contain; background-color: rgba(0, 0, 0, 0.8);}
  #galeryLoading{display: none; position: absolute; left: 50%; top: 50%; width: 300px; height: 300px; margin-left: -150px; margin-top: -150px; background-image: url("loading.gif")}
  #galeryTitleSpan{color: white; padding-left: 60px; display:inline-block; position: absolute; top: 3px; left: 3px; width:250px; white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis; text-align: left;}
  #galeryTextSpan{color: #B4B4B6; padding-left: 60px; display:inline-block; position: absolute; top: 23px; left: 3px; width:250px; white-space: nowrap; overflow: hidden !important; text-overflow: ellipsis; text-align: left;}
  #galeryMain{position: absolute; left: 50%; top: 50%; }

  .galeryTable{display: block; width: 600px; position: relative;}
  .galeryTable .TableColumn{display: block; position: relative; width: 600px; height: 200px;}
  .galeryTable .TableColumn .ImgBox{display: block; position: absolute; top: 0px; left: 0px; width: 180px; height: 180px; padding: 10px; text-align: center; vertical-align: middle;}
  .galeryTable .TableColumn .ImgBox .Miniature{width: 180px; height: 180px; cursor: pointer;}
  .galeryTable .TableColumn .ContextBox{display: block; position: absolute; top: 0px; left: 200px; width: 400px; height: 200px;}
  .galeryTable .TableColumn .ContextBox .ImgName{display: block; position: absolute; top: 0px; left: 0px; width: 400px; height: 30px;}
  .galeryTable .TableColumn .ContextBox .ImgTitle{display: block; position: absolute; top: 30px; left: 0px; width: 400px; height: 30px;}
  .galeryTable .TableColumn .ContextBox .ImgText{display: block; position: absolute; top: 60px; left: 0px; width: 400px; height: 110px;}
  .galeryTable .TableColumn .ContextBox .ImgText .textArea{width: 400px; height: 90px;}
  .galeryTable .TableColumn .ContextBox .ImgDelete{display: block; position: absolute; top: 170px; left: 0px; width: 200px; height: 30px; text-align:center;}
  .galeryTable .TableColumn .ContextBox .ImgSave{display: block; position: absolute; top: 170px; left: 200px; width: 200px; height: 30px; text-align:center;}
/*}*/