/* Notes about CSS calc() function.  The + (addition) and - (subtraction) binary operators must be preceded and followed by
   whitespace.  E.g, width:calc(100% - 60px), NOT width:calc(100%-60px).  The * (multiplication) and / (division) ops
   do not require whitespaces.
*/   

/* -----------------------------------------------------------------------------------------------------------------------
    T E M P L A T E    B E G I N     t o p    b a n n e r    s e c t i o n s
   -----------------------------------------------------------------------------------------------------------------------
*/

body {background-color:#FFF;  font-family:Arial,Helvetica,sans-serif; font-size:16px; text-size-adjust: none;   -width:100%;}
@media (max-width: 400px) { body { font-size:14px; }}
body { --htTopDiv:70px;  }     /*  230829 1730  */ 

#TopDiv {position:relative;  -width:100%;  -height:70px;  height:calc(var(--htTopDiv));  background-color:#BBB;   -background-size:auto 100%;  }

#AgathosTitle {position:absolute;  top:calc(50% - 0.6em);  width:100%;	text-align:center;
                color:#FFF;  font-size:2.8em; letter-spacing:.25em; margin:0;  font-style:italic;  font-weight:700; }
				
#MainDiv  { width:100%; -width:95%;  text-align:center;  -margin:0 1rem;  -padding:0 1rem; -background-color:#FF0}


/* -----------------------------------------------------------------------------------------------------------------------
    H O M E     p a g e  
   -----------------------------------------------------------------------------------------------------------------------
*/

#divHomeImage  { width:min(96vw,600px);  height:min(96vw,600px);   display:flex; justify-content:center; align-items:center;
                 margin:auto;  background-color:#EEE;  }
#imgHome       { max-width:95%; max-height:95%; }  



/* -----------------------------------------------------------------------------------------------------------------------
    G A L L E R Y     p a g e  
   -----------------------------------------------------------------------------------------------------------------------
*/

.SelSubTyp {padding:6px;   -background-color:#CCC;  color:#888; }

#image-grid {position:relative;   -top:200px;  -width:80%; -height:50px;   -background-color:#AAD;  -margin:auto;} 

 
.bwg-item  {position:absolute; font-size:0.8em; }

.bwg-view {position:absolute; opacity:0;  left:1em;  right:1em;  top:0.5em; 
                color:#FFF; text-align:center; padding:0.5em;  border:1px solid white; }

.bwg-title {position:absolute; opacity:0; left:1em;  right:1em;  bottom:0.5em; 
                color:#FFF;  text-align:center;    padding:0 0.5em;          border:1px solid white; }
.bwg_lightbox {text-decoration:none;  color:#FFF;}

/*.bwg-item:hover  .bwg-title { opacity:0.6; } */
.bwg-item:hover  .bwg-title { opacity:1; }
.bwg-item:active .bwg-title { opacity:1; }
.bwg-item:hover  .bwg-view  { opacity:1; }
.bwg-item:active .bwg-title { opacity:1; }

.bwg-info { position: absolute;  left:1em;  right:1em;  top:1em;  color:blue;	background-color:#FFF; text-align:center;  }	

/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on August 22, 2023 */
/*
@font-face {
    font-family: 'freestyle_script_regular';
    src: url('freestyle_script_regular.ttf');
    font-weight: normal;
    font-style: normal;
}
.signature {font-family:freestyle_script_regular; color:green; font-size:2.0em}  /* 230823 */


/* -----------------------------------------------------------------------------------------------------------------------
    V I E W    P A I N T I N G   ( V P - O N L Y    a n d    V P - P L U S)   p a g e s 
   -----------------------------------------------------------------------------------------------------------------------
*/

#divVPO_Layout    {position:relative;   width:100%;  --htDescr:0px;  height:100%; 
                                        color:#FFF;  -background-color:#080; text-align:center;    --htInfo:95px}
#divVPP_Layout    {position:relative;   width:100%;  --htDescr:70px;  height:calc(100% - var(--htTopDiv)); 
                                        color:#FFF;  background-color:#666; text-align:center;    --htInfo:105px}

#divVP_Image         {-width:98vw; -width:100%;   height:calc(100% - var(--htInfo)  - var(--htDescr) -  1px);  
                               display: flex; justify-content: center; align-items: center;
                               -margin:auto;  -margin:0; -background-color:#EEE; }
#imgVP_Item       {max-width:99%; max-height:99%; }

#divVP_Info       {position:absolute; left:0; width:100%;  margin:0; height:calc(var(--htInfo)); bottom:var(--htDescr);  -background-color:#AAF; }

#msgVP_Title      {font-size:1.1em;  margin:0.4em;  -background-color:#660;}
#msgVP_Info       {font-size:0.80em; margin:0.3em;  -background-color:#060;}

#btnVPO_MoreInfo  {font-size:0.75em; font-style:italic;  color:#FFF;  background-color:#666;   }
#btnVPP_Enquire   {margin:0.3em;  font-size:0.80em; font-style:italic;  background-color:#DDD;  color:#000;  padding:3px 12px;  }
#divVPO_Color     {position:absolute; left:0;   bottom:0;   padding:3px;  -background-color:#888; }
#btnVPO_Color     {font-size:0.7em;   color:#FFF;  background-color:#666;  }


#divVP_IdxId      {position:absolute;  right:0;   bottom:3px;  font-size:0.7em;  padding:3px;  }

#divDragBar {position:absolute; width:100%;  left:0;  height:8px;  bottom:calc(var(--htDescr));  background-color:#00F;  }

#divVPP_Descr     {position:absolute; margin:0;  width:80%;  left:10%; bottom:3px;  height:calc(var(--htDescr) - 5px);  text-align:center; 
                         color:#000;  background-color:#EEE;  padding:0px;  overflow:scroll;  overflow-x:hidden;  -resize:vertical; }
#btnRestoreDragBar  {position:absolute;  left:4px;  -bottom:3px;  -height:40px; font-size:2em;  font-weight:900;  color:#00F; visibility:hidden; }


/* 230426  Hidden side (L & R) Arrow Buttons for navigating View Painting pages */
.divVP_SideArrow        {position:absolute;  width:max(60px,3%); top:20%;  bottom:20%;   background-color:#444;   opacity:0; }
.divVP_SideArrow:hover  { opacity:0.4;  }  
.btnVP_SideArrow        {position:absolute;  top:50%;  font-size:3em;  font-weight:bold;  color:#FFF;  }


/* -----------------------------------------------------------------------------------------------------------------------
    C O L O R   S E L E C T O R   P A D     ( p a r t    of  V P - O N L Y   p a g e ) 
   -----------------------------------------------------------------------------------------------------------------------
*/
#divColorSelPad   {position:absolute;  left:0; bottom:25px; width:310px; height:180px; padding:6px; 
                                                         color:#FFF; background-color:#888; display:none; }
#divHeading       {position:absolute;  left:15px; bottom:167px;  font-size:0.8em; text-align:centre; }
#imgColorPad      {position:absolute;  left:0;    top:0;        display:none; }
#cvsColorPad      {position:absolute;  left:15px; bottom:52px; } 
#divInstruct      {position:absolute;  left:75px; bottom:36px;  font-size:0.7em; }
#divSelColor      {position:absolute;  left:15px; bottom:15px;  width:48px; height:27px;   border-style:solid;  border-color:#FFF; }
#rgbSelColor      {position:absolute;  left:72px; bottom:15px;  width:36px;  font-size:0.7em; }
#btnApplySelColor {position:absolute; right:66px; bottom:15px;    font-size:0.8em;}
#btnClosePad      {position:absolute; right:12px; bottom:15px;    font-size:0.8em;}
#idLog            {position:absolute;  left:0;    bottom:0;     width:100%; height:12px;  font-size:0.6em; color:blue; background-color:#FFF; }


/* -----------------------------------------------------------------------------------------------------------------------
    A B O U T   :   A G A T H O S    a n d    H E A L I N G      p a g e s  
   -----------------------------------------------------------------------------------------------------------------------
*/
.divAboutTopic      {max-width:min(95%, 900px);  margin:auto; text-align:left; }
#divPortraitImage   {float:right;   margin:0 1em 1em;  max-width:55%;  -background-color:red; }

/* -----------------------------------------------------------------------------------------------------------------------
    A B O U T   :   P H Y S I C A L     G A L L E R I E S     p a g e  
   -----------------------------------------------------------------------------------------------------------------------
*/
#divListGalleries     {width:min(1500px, 100%);  margin:auto;  background-color:#DDD; text-align:left; }
.PG_divGallery        {margin:0;  --htBanner:min(300px, 20vw);  }
.PG_Heading           {text-align:center; padding:6px;  color:#FFF;  background-color:#AAA;  letter-spacing:.25em; }
.PG_divMontageBanner  {height:var(--htBanner);  width:96%; margin:0 2%;  text-align:center;  background-color:#FFF;}
.PG_divBannerItem     {display:inline-block;         height:var(--htBanner);      -background-color:#FF8; }
.PG_imgBannerItem     {height:100%; }
.PG_divBlurb          {width:96%;  margin:0 2%; } 
.PG_divIncludedHTML   {width:96%;  margin:0 2%;  text-align:left; }


/* -----------------------------------------------------------------------------------------------------------------------
    C O N T A C T     U S      p a g e 
   -----------------------------------------------------------------------------------------------------------------------
*/
.popup {background-color:#AAA;  font-family:Arial,Helvetica,sans-serif; 
                                            -text-size-adjust: none;   font-size:16px;  text-align:center;}
#CU_h3Heading  {margin:4px; }
#CU_h3Title    {margin:6px;  color:#FFF; }
#CU_imgItem    {max-width:min(95vw, 1200px); -max-width:600px;  max-height:min(50vh, 600px);  margin:8px 0; }
#CU_msgInfo    {margin:3px;  font-size:0.75em;  color:#FFF;  -background-color:#060;}

#divSendMail   {margin:8px;  padding:5px;  font-size:0.8em;  background-color:#8A8; }
#msgDidSend    {font-size:12pt; color:#FFF; }

.CU_divField   {padding:5px 0;   -background-color:#8F8;  }
.CU_labField   {display:inline-block;   width:max(4.5em, 8%);  vertical-align:top;  text-align:right;  -background-color:#FF8; }
.CU_txtField   {display:inline-block;   width:75%;   }
.CU_txaMsg     {display:inline-block;   width:75%;   resize:vertical; }

#CU_divButtons input { margin:5px; padding:.2em 1em;  font-size:1.1em;  font-weight:700; -background-color:yellow; }


/* -----------------------------------------------------------------------------------------------------------------------
    E D I T I N G    C O N T R O L S
   -----------------------------------------------------------------------------------------------------------------------
*/
/* Included File Editing Controls  (from 230412) */
.InclFileEditingControls  {background-color:#FFC; padding:5px; border-style:double; border-color:#00F; }


#Welcome  { text-align:center;  width:min(90%,800px); -padding:0 1rem; margin:auto; -margin:0 1rem;  -background-color:#FFC;}

.LastUpdated { BAD-font-size:8pt; font-size:0.7em; }