html{
        cursor: url('cursor.gif'),auto !important;
}

::-webkit-scrollbar {
    width: 10px;
}
::-webkit-scrollbar-track {
  background: gray;
}
::-webkit-scrollbar-thumb {
  background: #FFB600;
}
::-webkit-scrollbar-thumb:hover {
  background: #EB9B00;
} 


body {
    background-color: black;
    font-family: Courier New;
    color:white;
    font-weight:600;
}

p {
    font-size:20;
    color:black; 
}

p2 {
    font-size:15;
    color:white; 
}


h1{
    font-size:40;
    
}

.container{
    width: 100%;
  text-align: left;
  height: 100%;
  overflow-y: scroll;
}

.container:before {
  content: '';
  position: fixed;
  bottom: 0;
  background: url('scroller_bot.png');
  height: 7%;
  width: 99%;
  pointer-events: none;
    opacity:70%;
}

#projimgcontainer
{
    width:73%;
    height:560;
    padding-top:0;
    float:left;
    
}

#projtxtcontainer
{
    font-family: Courier New;
    width:25%;
    height:620;
    padding:10;
    float:right;
    text-align: left;
    line-height:1 ;
  
   
}



#aboutcontainer
{
    width:540;
    padding-left:25;
    padding-top:0;
    float:left;
    line-height:1.04;
    text-align:left;
    
}

#skillscontainer
{
    font-family:;
    background-color:black;
    width:330;
    padding-right:20;
    float:right;
    text-align: left;
   
}

.skill
{ 
    line-height:.92;
    background-color: black;
    font-family: Courier New;
    color:white;
    font-size:20;
    
}

#miicontainer
{
     width:280;
    float:right;
    padding-top:30;
    
}

#packagecontainer
{
     width:650;
    float:right;
    text-align:center;
 
}

.package {
    font-size:20;
    color:white; 
    font-family: Courier New;
    font-weight:600;
    margin: 0;
    padding-bottom:24;
}

/* (B) GALLERY WRAPPER */
.gallery {
  /* (B1) GRID LAYOUT - */
  line-height: 0;       
    -webkit-column-count: 4;    
    -webkit-column-gap: 0px;    
    -moz-column-count: 4;
    -moz-column-gap: 0px;
     column-count: 4;    
     column-gap: 0px; 
}

/* (C) GALLERY IMAGES */
.gallery img {
  /* (C1) DIMENSION */
  width: 300;
  height: 100%; /* optional */
  margin-top: 6px;
 
  /* (C2) COLORS */
  border: 1px solid black;
  background: black;
 
  /* (C3) IMAGE RESIZE */
  /* cover | contain | fill | scale-down */
  object-fit: cover;
}

/* (E) OPTIONAL ZOOM ON HOVER */
.gallery img:hover {
  z-index: 2;
  transform: scale(1.1);
  /* linear | ease | ease-in | ease-out | ease-in-out */
}

/* (F) FULLSCREEN MODE */
.gallery img.full {
  position: fixed;
  top: 0; left: 0; z-index: 980;
  width: 99vw; height: 99vh;
  object-fit: contain;
  border: 2px solid black;
  background: rgba(0, 0, 0, 0.7);
}
.gallery img.full:hover {
  z-index: 999;
  transform: none;
}





/* (B) GALLERY WRAPPER */
.gallery2 {
  /* (B1) GRID LAYOUT - */
  line-height: 0;       
    -webkit-column-count: 2;    
    -webkit-column-gap: 0px;    
    -moz-column-count: 2;
    -moz-column-gap: 0px;
     column-count: 2;    
     column-gap: 0px; 
}

/* (C) GALLERY IMAGES */
.gallery2 img {
  /* (C1) DIMENSION */
  width: 610;
  height: 100%; /* optional */
  margin-top: 6px;
 
  /* (C2) COLORS */
  border: 1px solid black;
  background: black;
 
  /* (C3) IMAGE RESIZE */
  /* cover | contain | fill | scale-down */
  object-fit: cover;
}

/* (E) OPTIONAL ZOOM ON HOVER */
.gallery2 img:hover {
  z-index: 2;
  transform: scale(1.1);
  /* linear | ease | ease-in | ease-out | ease-in-out */
}

/* (F) FULLSCREEN MODE */
.gallery2 img.full {
  position: fixed;
  top: 0; left: 0; z-index: 980;
  width: 99vw; height: 99vh;
  object-fit: contain;
  border: 2px solid black;
  background: rgba(0, 0, 0, 0.7);
}
.gallery2 img.full:hover {
  z-index: 999;
  transform: none;
}


/* (B) GALLERY WRAPPER */
.gallery3 {
  /* (B1) GRID LAYOUT - */
  line-height: 0;       
    -webkit-column-count: 3;    
    -webkit-column-gap: 0px;    
    -moz-column-count: 3;
    -moz-column-gap: 0px;
     column-count: 3;    
     column-gap: 0px; 
}

/* (C) GALLERY IMAGES */
.gallery3 img {
  /* (C1) DIMENSION */
  width: 290;
  height: 100%; /* optional */
  margin-top: 6px;
 
  /* (C2) COLORS */
  border: 1px solid black;
  background: black;
 
  /* (C3) IMAGE RESIZE */
  /* cover | contain | fill | scale-down */
  object-fit: cover;
}

/* (E) OPTIONAL ZOOM ON HOVER */
.gallery3 img:hover {
  z-index: 2;
  transform: scale(1.1);
  /* linear | ease | ease-in | ease-out | ease-in-out */
}

/* (F) FULLSCREEN MODE */
.gallery3 img.full {
  position: fixed;
  top: 0; left: 0; z-index: 980;
  width: 99vw; height: 99vh;
  object-fit: contain;
  border: 2px solid black;
  background: rgba(0, 0, 0, 0.7);
}
.gallery3 img.full:hover {
  z-index: 999;
  transform: none;
}