﻿
body, body td, body pre 
    {color:#000; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:14px; margin:8px;}
body {padding:0 0 0 0; margin:0 0 0 0; height:100%; width:100%;}
    body > div { position:relative; padding: 0 0 0 0;  margin: 0 0 0 0; }
    
                                            /* to hide fantom td borders*/
                                            body table td {margin: -1px -1px -1px -1px !important;}
                                            body table td {padding: -1px -1px -1px -1px !important; }
           

#pageLogoImage { position: absolute; top: 5px; left: 10px }

.pageCaption { font-size:large; width:100%                               ;border:1px solid red; }

#imgPageCaption {margin-left:50px; margin-right:30px }

#imgBack { position:fixed; top:70px; left:0px; cursor:pointer; display:none; 
           -webkit-box-shadow:0 3px 8px rgba(0,0,0,0.8);
            -moz-box-shadow:0 3px 8px rgba(0,0,0,0.8);
            box-shadow:0 3px 8px rgba(0,0,0,0.8);
         }

.img-content { margin:3px; max-width:100%; max-height:100%;}

h1 { color:#214f68 }
li { color:#214f68 }		

.ACap, .tbCap { font-size:18pt; width:99%; color: #222222;
                text-shadow: 1px 1px 3px #eeeeee; filter:progid:DXImageTransform.Microsoft.Shadow(strength=1,direction=120,color=#eeeeee); }	

.ABody, .tbBody {color:#303030; }	
.tbBody { width:100%; height:40em;}

.divAllItms { position:relative; top:2px; width:100%; margin-left:auto; margin-right:auto }

.divAllItms > table {width:100%;}

/*     .FMACapContainer {  position:absolute; display:block;  left:50%; transform: translateX(-50%); }     #################!!!!!!###########?????????
    */




#ListOfContent {
    margin-top: 40px;
    margin-bottom: 40px;
    margin-left: 30px
}

.LOC {
    font-size: 18pt;
    color: #222222;
    text-shadow: 1px 1px 3px #eeeeee;
    filter: progid:DXImageTransform.Microsoft.Shadow(strength=1,direction=120,color=#eeeeee);
}
.LOC:hover { cursor:pointer; text-decoration:underline }	

/*
table tr td { width:30% } 

.rowOdd {background-color: Transparent}               
.rowEven {background-color: Transparent}              */

.itm { border:1px solid Transparent; border-bottom:1px solid Transparent; }   
.imgBtns {vertical-align:top; width:18px; min-width:18px; max-width:18px; min-height:18px; background-color:#eee;}

.hov:hover,.hovI:hover {border: 1px solid Red;  background-color:Yellow}   
.hov,.hovI {border: 1px solid Transparent}     

.redBorder {border: 1px solid Red}
.redBorderTop {border-top :1px solid red}




.aMore { position: absolute; bottom: 2px; right: 105px;}
.aMore .divMore { position:absolute; right:0; bottom:0;
    height:28px; width:30px; background-image: url("/res/more.png"); background-repeat: no-repeat; background-size:contain; border:0px solid red;
}

.divCommentsIcon { position: absolute;  bottom: 0px; right: 48px; height: 30px;  width:40px;
    line-height: 1.3rem; font-size: 0.8rem;    
    display: flex; justify-content: center; overflow:visible; 
    background-image: url("/res/comment-icon8.png"); background-repeat: no-repeat; background-size:contain; 
    color:#FFF; cursor:pointer;                                                                                             border:0px solid red;
}

.imgSoundIcon { position: absolute; bottom: 0px; right: 2px; height: 32px!important ; z-index: 9; cursor:pointer!important; border:0px solid red!important;}




#btnInsertNewLast {
    position: absolute;
    left: 3px
}

#imgCloseMoreWindow {position:absolute; right:-3px; top:-3px; cursor:pointer; width:24px; height:24px; z-index:999;}
.semiTransparent  
{
     background-color:rgba(51,51,51,0.33);            
}

.footer { position:fixed; bottom:0px; width:100%; border-top:1px solid #e0e0e0; background-color:#f0f0f0; text-align:center; font-size:0.8em; font-family:Calibri; color:#888888; }

.displayNone {display:none}

#ifrTempWorker {width:99%; height:94%; position:absolute; left:0px; top:0px; border:1px solid #f0f; visibility:visible; display:block;  }     /*pointer-events:none;*/

/*
.canvas100 {width:100%; height:100%; position:absolute; left:0px; top:0px;}
*/

/***** Is USED IN TYNYMCE *****/
.rounded6 {-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;
          -webkit-box-shadow:1px 1px 3px rgba(0,0,0,0.5),inset 1px 1px 1px rgba(255,255,255,0.1);
            -moz-box-shadow:1px 1px 3px rgba(0,0,0,0.5),inset 1px 1px 1px rgba(255,255,255,0.1);
              box-shadow:1px 1px 3px rgba(0,0,0,0.5),inset 1px 1px 1px rgba(255,255,255,0.1)}                            
/**** /Is USED IN TYNYMCE *****/              

/**** For Pop-up panels "Border", "Shadow", "Background image" *****/
.divSetPanel {padding:0px 5px 10px 15px; border:1px solid #789; background-color:#abc; height:auto;
              box-shadow:1px 1px 3px 0px rgba(0,0,0,0.5),inset 0px 0px 2px 0px rgba(255,255,255,0.2) }

.divExample { position:absolute; overflow:hidden; border:1px solid #abc; left:190px; top:10px; width:200px; height:150px; }                    
.divExample div {background-color:#def;}  
.SetBoxShadow .number {width:30px;}                  
.info {font-family:Calibri Light; font-size:12px; color:#248; margin-top:2px; margin-left:4px; padding-top:0px; }
.imageButton {border:1px solid #888; width:16px; height:16px} 
input[type='checkbox'] {margin-left:0px;}           
#divBgImageExample { position:absolute; width:100%; height:150%; }           
/**** /For Pop-up panels "Border", "Shadow", "Background image" *****/ 

#divContextMenu {border:1px solid #456;background-color: #567; color:#123;   box-shadow:3px 3px 7px rgba(0,0,0,0.4);}
#divContextMenu ul {background-color:#cde; margin:3px; padding:0; }
#divContextMenu ul li {background-color: #cde; margin:1px 0px 0px 0px; display:block; } 
#divContextMenu ul li input {width:100%; border-style:none; background-color:#cde;  text-align:left; }
#divContextMenu ul li input:hover {background-color:#f0f8ff;}
 /* #divContextMenu ul li input[type="submit"]:enabled { color:#123; } */
#divContextMenu ul li input:enabled { color:#123; cursor:pointer; }
#divContextMenu ul li input:disabled { color:#777; cursor:auto; }

/*   Google transalator */
#googleTtranslate {position:absolute; top:0px; left:24px; width:24px; height:24px; z-index:9998 !important;
                   transform: rotate(-90deg); transition-duration: 0.3s;}
#google_translate_element { position:absolute !important; top:0 !important; left:0 !important; z-index:9999 !important;}
#googleTtranslate:hover { transform: rotate(0deg); transition-duration: 0.3s;}
.goog-te-banner-frame.skiptranslate {display: none !important;} 
body { top: 0px !important; }
/*  /Google transalator  */

/* Slideshow */
.SSImg { display:inline-block; }
.SSImg {position:relative; width:100px; height:130px; margin-left:5px; margin-top:5px; border:1px solid #aab; background-color:#bcd;}
.SSImgSelected {border-color: #f55; box-shadow: #f55 0px 0px 10px;}
.SSImageBox { width:100%; height:100px; position:relative;}
.SSImageBox img { max-width:100%; max-height:100%; position:absolute; top:0; bottom:0; right:0; left:0; margin:auto; }

.ssTexth {white-space:pre-wrap;}
.ssText {white-space:pre-wrap;}
/*
.divSSControlPanel { position:absolute; display:block;  left:50%; transform: translateX(-50%); width:97%; height:2em; padding: 1px 2px 1px 3px;  vertical-align:middle;
    background-color: #605f60; border: 1px solid #222;        font-size:14px;
}
*/
.divSSControlPanel { position:fixed; bottom:0; display:block; left:50%; transform: translateX(-50%); width:100%; height:2em; padding: 1px 25px 1px 25px; vertical-align:middle;
    background-color: #605f60; border: 1px solid #222;        font-size:14px;}

#imgFullStartStop {height:100%; margin-left:1em; vertical-align:middle; }
/*  #imgSSCP {height:100%; margin-left:1em; vertical-align:middle; }  */

#imgStartStop {margin-left:1em; margin-right:0.5em; height:1.6em; vertical-align:middle;}
#btnSSToBeginning, #btnSSBack, #btnSSForward, #btnSSToEnd { margin: 0; padding: 0;  border:1px solid #a6a6a6; color:#ddd; background-color: #605f60;}
#txtImageNumber { margin-left:0px; margin-right:0px; width:2em; text-align:center;  border:1px solid #a6a6a6; color:#ddd; background-color: #605f60;}
#spSSImagesTotal, #proSS, #imgSSSound { margin-left: 0.7em; }

#spSSImagesTotal, #spSSSecondsTotal { color: #ddd; border: 1px solid #a6a6a6; padding-left:0.3em; padding-right:0.3em;}
    
#proSS { height: 15px; vertical-align: middle; width: 50px; }

#SSAudio {height:20px; width:280px; position:absolute; top:3px; right:2.5em; padding:0px; margin:2px; z-index:9999 }

#imgSSSound { height: 1.3em; vertical-align: middle; }
.SSimgEnvelop { overflow:hidden; position:relative; }
    .SSimgEnvelop img { max-height:100%; max-width:100%; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); }
    
.FMACapContainer table { table-layout: fixed; }

.FMACapContainer table tr td {position:relative;}
    .FMACapContainer table td div {
        position: absolute;
        top: 0;
        left: 0;
        display: block;
        overflow-y: hidden;
        overflow-wrap: normal;
        width: 100%;
        height: 100%;
        max-height: 100%;        
    }
/* top:0; left:0; height:100%; max-height:100%; background-color:green; } */

    /* /Slideshow */
    .scaled40 {
        left: 0;
        top: 0;
        transform: scale(0.4);
        transform-origin: left top;
    }
.popupMsg { border: 0px solid #f00; color: #f00;  background-color: transparent; z-index:4;}  
.popupPos { position: absolute; top:250px; left:200px; transform:rotate(-30deg);  }


.dashBordered { border: 3px dashed #f00;}



