body {
  /* font-family: "Lato", sans-serif */
  font-family: "verdana";
  background-color: black;
  /* background-color: green; */

}

table.pointer
{
   cursor:pointer;
   padding:10px;
}

td.cubes
{
  padding:10px;
  /* border-color: 10px solid red;  */
  /* background-color: lime; */
}


h4,h2
{
  margin:2px;
  padding:0px;
  padding-bottom:10px;

}

h2
{
  font-size:20px;
}

a.adecnone
{
  text-decoration: none;
}

div
{
  border:0px solid red;
}

div.dclientname
{
  /* background-color: lime; */
  padding-bottom:10px;
}

div.spaceaboveheading
{
  border:1px solid #666;
  height:70px;
  width:97%;
  margin-left:auto;
  margin-right:auto;
}

div.spaceabovestills
{
  border:0px solid cyan;
  height:00px;
  width:97%;
  margin-left:auto;
  margin-right:auto;
}

div.spaceabovevideo
{
  border:0px solid lime;
  height:0px;
  width:97%;
  margin-left:auto;
  margin-right:auto;
}

div.spaceaboveslides
{
  border:0px solid pink;
  height:0px;
  width:97%;
  margin-left:auto;
  margin-right:auto;
}

div.spaceabovecontact
{
  border:0px solid yellow;
  height:20px;
  width:97%;
  margin-left:auto;
  margin-right:auto;
}

div.spacebelowcontact
{
  border:0px solid blue;
  height:5px;
  width:97%;
  padding:0px;
  margin:0px;
  margin-left:auto;
  margin-right:auto;
}

div.footer
{
  margin:0px;
  padding:0px;
  border:0px solid lime;
}

p.footer
{
  color: #333;
  text-align: center; 
  margin:0px;
  padding:0px;
}

p.footer:hover
{
  color: white;
}

h6.footer
{
  color: #333;
  text-align: center; 
  margin:0px;
  padding:0px;
}

h6.h6footer:hover
{
  color: white;
  /* background-color: lime; */
}

span.pageinfo
{
  font-size:12px;
  line-height: 15px;
}


div.menublank
{
  margin:0px;
  padding:0px;
  height:55px;
  background-color: black;
  color: black;
}

p.ptight, div.dtight
{
  margin:0px;
  padding:0px;
}

h1.h1tight
{
  margin:0px;
  padding:0px;
}

p.pdesign,button.btndesign
{
  margin:0px;
  padding:4px;
  padding-left:10px;
  padding-right:10px;
  line-height: 24px;
}

img.gif
{
  margin-bottom:5px;
}

.mySlides 
{
  display: none;
}

div.modalcaption
{
  text-align: center;
}

video.videoplayer
{
  margin-left:auto;
  margin-right:auto;
}

div.divvideoplayer
{
  border: 0px ;
}


button, a
{
  cursor:pointer;
}


/* sp an
{

  font-family: verdana;
  font-size: 25px;
  line-height: 28px;
  margin:0px;
  padding:0px;
} */


img.homegif, img.workgif
{
  border-radius: 10px;
  margin-top:2px;
  margin-bottom:2px;
  margin-left:2px;
  margin-right:2px;
}

img.still
{
  margin-bottom:10px;
}

p.contact,i.contact
{
  font-size: 15px;
  padding:0px;
  margin:0px;
  /* color:red; */
}

p.contactword,a.contactword
{
  font-family: verdana;
  font-size: 15px;
  text-decoration: none;
  /* color:red; */
}

table.tbprojnav
{
  width : 100%;
  padding:0px;
  margin:0px;
}

th.thprojnavl,th.thprojnavr,th.thtdprojnavc
{
  text-align: center;
  padding:0px;
  margin:0px;
}


th.thprojnavl,th.thprojnavr
{
  width : 50px;
  color: #666;
}

a.aprojnav
{
  color:#666;
  background-color: black;
  margin:10px;
  font-weight: 700;
  font-size :24px;
  text-decoration: none;
} 

a.aprojnav:hover
{
  color: white;
  background-color: black;
} 

table.tbvisitinfo
{
  margin-left: auto;
  margin-right: auto;
}
            
table.tbvisitinfo,th.thvisitinfo,td.tdvisitinfo
{
   color: white;
   text-align: center;
   padding:0px;
   padding-left:5px;
   padding-right:5px;
}

a.avisitinfo
{
  text-decoration: none;
  padding:3px;
}

a.avisitinfoa
{
  text-decoration: none;
  color : white;
  background-color: blue;
  padding:3px;
}

p.upper
{
    text-transform: uppercase;
}

.upperhelp
{
  text-transform: uppercase;
}

a.upperhelp1
{
  text-transform: uppercase;
}

a.upperhelp1:hover
{
  text-transform: lowercase;
}

h6.upperhelp
{
  text-transform: uppercase; 
}

/* width */
::-webkit-scrollbar 
{
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track 
{
  /* background: black; */
  background: #666;
}

/* Track */
::-webkit-scrollbar-track:hover 
{
  /* background: black; */
  background: #d0d0d0;
}


/* Handle */
::-webkit-scrollbar-thumb {
  background: #222;
  width: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #777;
  width: 10px;
  background: orange; 
}


div.divsixc
{
  padding:0px;
  margin:0px;
  /* margin-bottom:20px; */
  border:0px solid red;
  border-radius :10px;
}

img.imgradius
{
  padding:0px;
  margin:0px;
  border-radius :10px;
  margin-bottom: 10px; 

}

div.divtight
{
  padding:0px;
  margin:0px;
}

img
{
  border:0px solid red;
}


dialog.dialognonmodal 
{
  z-index: 10;
  margin-top: 0px;
  background: pink;
  border: none;
  border-radius: 1rem;
}

dialog.dialogmodal 
{
  z-index: 10;
  margin-top: 20px;
  width: 100%;
  /* background: beige; */
  background-color: black;
  color:white;
  border: none;
  border-radius: 1rem;
}

dialog.dialogmodal::backdrop 
{
  background-color: rgba(60, 60, 60, 0.75);  /* background-color: hsl(250, 100%, 50%, 0.25); */
  border: 2px solid red;
}

span.daynames
{
  font-size:13px;
  font-family: ui-sans-serif, system-ui, sans-serif;
  margin:0px;
  padding:0px;
  line-height: 15px;
}


:where(kal-el) {
  /* --kalel-day-hover-bgc: hsl(0, 0%, 90%); */
  --kalel-day-hover-bgc: hsl(0, 0%, 50%);
  font-family: ui-sans-serif, system-ui, sans-serif;
  inline-size: 100%;
}
/* weekdays */
kal-el abbr {
  text-decoration: none;
}
/* month */
kal-el > time {
  display: var(--kalel-month-d, inline);
  font-size: var(--kalel-month-fz, inherit);
  font-weight: var(--kalel-month-fw, 700);
  text-align: var(--kalel-month-tal, initial);
  color:white;
}
/* year */
kal-el i {
  display: var(--kalel-year-d, inline);
  font-style: normal;
  font-weight: var(--kalel-year-fw, 100);
}
/* grid */
kal-el :is(ol, ul) {
  display: grid;
  font-size: var(--kalel-fz, small);
  /* grid-row-gap: var(--kalel-row-gap, .33em); */
  grid-row-gap: var(--kalel-row-gap, .22em);
  grid-template-columns: var(--kalel-gtc, repeat(7, 1fr));
  list-style: none;
  margin: unset;
  padding: unset;
  position: relative;
  /* border:1px solid blue; */
  /* border around the block of date numbers */
}
/* days */
kal-el :is(ol, ul) :is(abbr, time) {
  background-color: var(--kalel-day-bg, none);
  block-size: var(--kalel-day-h, 2em);
  border-radius: var(--kalel-day-bdrs, 50%);
  /* color: var(--kalel-day-c, inherit); */
  color: var(--kalel-day-c, #fff);
  display: var(--kalel-day-d, inline-block);
  font-size: var(--kalel-day-fz, inherit);
  font-weight: var(--kalel-day-fw, 400);
  inline-size: var(--kalel-day-w, 2em);
  line-height: var(--kalel-day-lh, 2em);
  margin-block: var(--kalel-day-mb, 0 var(--kalel-row-gap, .33em));
  text-align: var(--kalel-day-tal, center);
  user-select: none;
  /* border:1px solid cyan; */
  /* border around days and dates is a circle */
}
/* day hover */
:where(kal-el ol time):hover {
  background: var(--kalel-day-hover-bgc);
}
/* day wrappers */
kal-el :is(ol, ul) li {
  /* border-color: var(--kalel-li-bdc, hsl(0, 0%, 80%)); */
  border-color: var(--kalel-li-bdc, #666);
  border-style: var(--kalel-li-bds, solid);
  /* border-width: var(--kalel-li-bdw, 0 0 1px 0); */
  border-width: var(--kalel-li-bdw, 0 0 1px 0);
  grid-column: var(--kalel-li-gc, initial);
  text-align: var(--kalel-li-tal, end); 
  /* bottom border only - so draws a line under a week */
}
/* weekdays wrapper */
kal-el ul {
  margin-block-end: var(--kalel-row-gap, .33em);
  /* border:1px solid orange;  */
  /* border around the week day names */
  background-color: #666 ;
  color: white;
}

[data-day="1"] { background: var(--kalel-day-1-bg, #0000); }
[data-day="2"] { background: var(--kalel-day-2-bg, #0000); }
[data-day="3"] { background: var(--kalel-day-3-bg, #0000); }
[data-day="4"] { background: var(--kalel-day-4-bg, #0000); }
[data-day="5"] { background: var(--kalel-day-5-bg, #0000); }
[data-day="6"] { background: var(--kalel-day-6-bg, #0000); }
[data-day="7"] { background: var(--kalel-day-7-bg, #0000); }

[data-firstday="1"] [data-day="1"]:first-child { --kalel-li-gc: 1 / 2; }
[data-firstday="1"] [data-day="2"]:first-child { --kalel-li-gc: 1 / 3; }
[data-firstday="1"] [data-day="3"]:first-child { --kalel-li-gc: 1 / 4; }
[data-firstday="1"] [data-day="4"]:first-child { --kalel-li-gc: 1 / 5; }
[data-firstday="1"] [data-day="5"]:first-child { --kalel-li-gc: 1 / 6; }
[data-firstday="1"] [data-day="6"]:first-child { --kalel-li-gc: 1 / 7; }
[data-firstday="1"] [data-day="7"]:first-child { --kalel-li-gc: 1 / 8; }

[data-firstday="6"] [data-day="1"]:first-child { --kalel-li-gc: 1 / 4; }
[data-firstday="6"] [data-day="2"]:first-child { --kalel-li-gc: 1 / 5; }
[data-firstday="6"] [data-day="3"]:first-child { --kalel-li-gc: 1 / 6; }
[data-firstday="6"] [data-day="4"]:first-child { --kalel-li-gc: 1 / 7; }
[data-firstday="6"] [data-day="5"]:first-child { --kalel-li-gc: 1 / 8; }
[data-firstday="6"] [data-day="6"]:first-child { --kalel-li-gc: 1 / 1; }
[data-firstday="6"] [data-day="7"]:first-child { --kalel-li-gc: 1 / 3; }

[data-firstday="7"] [data-day="1"]:first-child { --kalel-li-gc: 1 / 3; }
[data-firstday="7"] [data-day="2"]:first-child { --kalel-li-gc: 1 / 4; }
[data-firstday="7"] [data-day="3"]:first-child { --kalel-li-gc: 1 / 5; }
[data-firstday="7"] [data-day="4"]:first-child { --kalel-li-gc: 1 / 6; }
[data-firstday="7"] [data-day="5"]:first-child { --kalel-li-gc: 1 / 7; }
[data-firstday="7"] [data-day="6"]:first-child { --kalel-li-gc: 1 / 8; }
[data-firstday="7"] [data-day="7"]:first-child { --kalel-li-gc: 1 / 2; }

[data-today] {
  --kalel-day-bdrs: 50%;
  --kalel-day-bg: hsl(0, 86%, 40%);
  --kalel-day-hover-bgc: hsl(0, 86%, 70%);
  --kalel-day-c: #FFF;
}

/* [data-weekend]:not([data-today]) { --kalel-day-c: var(--kalel-weekend-c, hsl(0, 86%, 46%)); } */
/* [data-weekend]:not([data-today]) { --kalel-day-c: var(--kalel-weekend-c, rgb(255, 255, 192)); } */
[data-weekend]:not([data-today]) { --kalel-day-c: var(--kalel-weekend-c, rgb(255, 160, 160)); }

[data-weeknumber]::before {
  /* color: var(--kalel-weeknumber-c, hsl(0, 0%, 50%)); */
  color: var(--kalel-weeknumber-c,rgb(130, 130, 255));
  display: var(--kalel-weeknumber-d, inline-block);
  content: attr(data-weeknumber);
  position: absolute;
  font-size: var(--kalel-weeknumber-fz, 11px);
  inset-inline-start: 0;
}

jor-el {
  background: var(--jorel-bg, none);
  display: var(--jorel-d, grid);
  gap: var(--jorel-gap, 2.5rem);
  /* grid-template-columns: var(--jorel-gtc, repeat(auto-fill, minmax(320px, 1fr))); */
  grid-template-columns: var(--jorel-gtc, repeat(auto-fill, minmax(240px, 1fr)));
  padding: var(--jorel-p, 0);
  /* border:1px solid lime; */
  /* around the whole year */
}


div.divtight
{
    margin:0px;
    padding:4px;
    border:0px solid red;
}

span.stopwatchtime 
{
    font-size: 450px;
    line-height: 450px;
    color: #ffffff;
    margin:0px;
    padding:4px;
    border:1px solid #333
}

span.spandate
{
    font-size: 20px;
    line-height: 25px;
    color: snow;
    margin:4px;
    padding:0px;   
}

.stopwatchttext {
    font-size: 18px;
    line-height: 20px;
    color: #fffcd6;
    margin:4px;
    padding:0px;
}


span.stopwatch 
{
    margin:4px;
    padding:0px;
}



button.stopwatchbtn
{
    margin:20px;
    /* margin-left:100px;
    margin-right:100px; */
    padding:8px;
    width:100px;
}

/* .loader {
  border: 16px solid #f3f3f3;
  border-top: 16px solid #3498db; 
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
} */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap');

* {
  box-sizing: border-box;
}

/*
.loading-container {
  width: 100%;
  max-width: 520px;
  text-align: center;
  color: #fff;
  position: relative;
  margin: 0 32px;
  
   &:before { 
    content: '';
    position: absolute;
    width: 100%;
    height: 3px;
    background-color: #fff;
    bottom: 0;
    left: 0;
    border-radius: 10px;
    animation: movingLine 2.4s infinite ease-in-out;
  }
/* } */

/*
@keyframes movingLine {
  0% {
    opacity: 0;
    width: 0;
  }

  33.3%, 66% {
    opacity: 0.8;
    width: 100%;
  }
  
  85% {
    width: 0;
    left: initial;
    right: 0;
    opacity: 1;
  }

  100% {
   opacity: 0;
   width: 0;
  }
}
*/


div.gallerys
{
  padding:30px;
  cursor:pointer;
}

div.rotate1,div.rotate2
{
  cursor:pointer; 
}