/* Nightly Fox - about:newtab
 * V15.07.21
 * By NADIRP.DEVIANTART.COM */
/* i really want this to be global */

/* SETTINGS */
:root {
  --main-page-bg-color: #22252c;
  --main-page-cell-bg-color: rgba(255,255,255,.05);

  --main-page-text-color: #FFFFFF;
  --main-page-text-color-two: #185B75;
  --main-page-text-invert-color-two: #FFFFFF;
  --main-page-link-color: #185B75;

  --main-border-radius: 2px;
  --main-theme-border-color: rgba(0, 0, 0,.2);
  --main-page-border-color: rgba(0, 0, 0,.2);

  --main-font-family: "Terminus", sans-serif;
}
 
/* :::::: NEW TAB :::::: */
@-moz-document url("about:newtab"){
  
  body {
    background: var(--main-page-bg-color);
    color: #ccc;
  }
  
  #newtab-search-container { display: none; }
  
  /* BG */
  #newtab-scrollbox {
    background: url("") top center /cover, var(--main-page-bg-color) !important;
    background-color: var(--main-page-bg-color) !important;
  }

  /* SEARCH */
  #newtab-search-container {
    padding-top: 10px !important;
    padding-bottom: 20px !important;
  }

  #newtab-search-logo {
    display: none;
  }
  
  #newtab-search-text {
    padding: 0px 15px 0px 15px !important;
    min-height: 55px;
    -moz-appearance: none !important;
    background: transparent !important;
    border: 1px solid var(--main-page-border-color)!important;
    border-radius: 0px !important;
    outline: 0 none !important;
    box-shadow: none !important;
    font-size: 16px !important;
    color: var(--main-page-text-color-two) !important;
    font-family: var(--main-font-family) !important;
    transition-property: border;
    transition-duration: 150ms;
  }
    
  #newtab-search-text:focus,
  #newtab-search-text[autofocus] {
    border: 1px solid var(--main-page-text-color-two)!important;
    border-radius: 0px !important;
    transition-property: border;
    transition-duration: 150ms;
  }
    
  #newtab-search-submit {
    padding: 0px 15px 0px 15px !important;
    height: 55px;
    -moz-appearance: none !important;
    background: transparent !important;
    border: 1px solid var(--main-page-border-color)!important;
    border-left: 1px solid transparent!important;
    border-radius: 0px !important;
    box-shadow: none !important;
    font-family: var(--main-font-family) !important;
    font-size: 12px !important;
    text-transform: uppercase;
    color: var(--main-page-text-color) !important;
  }
    
  #newtab-search-text:focus + #newtab-search-submit,
  #newtab-search-text[autofocus] + #newtab-search-submit{
    background: transparent !important;
    border: 1px solid var(--main-page-text-color-two)!important;
    border-radius: 0px !important;
    box-shadow: none !important;
    color: var(--main-page-text-color-two) !important;
  }
    
  #newtab-search-text + #newtab-search-submit:hover {
    background: var(--main-page-text-color-two) !important;
    border: 1px solid var(--main-page-text-color-two)!important;
    color: var(--main-page-text-invert-color-two) !important;
  }
    
  #newtab-search-text +#newtab-search-submit:hover:active {
    background: var(--main-page-text-invert-color-two) !important;
    border: 1px solid var(--main-page-text-color-two)!important;
    color: var(--main-page-text-color-two) !important;
  }
  
  /* SITES */
  
  .newtab-title {
    border-radius: 0;
  }
  
  .newtab-site {
    box-shadow: none !important;
    border: none !important;
    color: var(--main-page-text-color-two) !important; 
    margin: 0px;
    border-radius: 0px;
  }

  .newtab-cell:not([ignorehover]) > .newtab-site:hover,
  .newtab-site[dragged] {
    border: none;
    box-shadow: none ;
    margin: 0px;
  }

  /* TITLES */
  .newtab-sponsored,
  .newtab-title,
  .newtab-suggested {
    /*text-align: left;*/
    background-color: var(--main-page-bg-color) !important;
    border: 1px solid var(--main-page-border-color)!important;
  }
 
  .newtab-sponsored,.newtab-title {
    font-size: 12px !important;
    font-family: var(--main-font-family) !important;
    color:var(--main-page-text-color) !important; 
    transition-property: color;
    transition-duration: 150ms;
  }

  .newtab-sponsored{
    color:var(--main-page-text-color-two) !important; 
  }

  .newtab-site:hover .newtab-title {
    background-color: var(--main-page-link-color) !important;
  }

  /* THUMBNAILS */
  .newtab-thumbnail {
    border-radius: 0px !important;
    filter: grayscale(1) opacity(.9);
    border: none;
  }
  
  .newtab-site:hover .newtab-thumbnail {
    border-radius: 0px;
    transition: opacity 100ms ease-out;
    /*background-color: var(--main-page-bg-color) !important;
    background-blend-mode: overlay !important;*/
    filter: grayscale(0) opacity(1);
    transition-property: filter;
    transition-duration: 50ms;
  }

  /* CELLS */
  .newtab-cell {
    background-color: var(--main-page-cell-bg-color);
    border-radius: 0px;
  }

  .newtab-cell:hover {
    background-color: var(--main-page-cell-bg-color);
    border-radius: 0px;
  }

  .newtab-cell:empty {
    outline: 1px dashed var(--main-theme-border-color) ;
    -moz-outline-radius: 0px;
  }

  /* CELLS */
  .newtab-cell,
  .newtab-intro-cell,
  .newtab-intro-cell-hover {
    background-color: rgba(255,255,255,.2);
    border-radius: 0px;
    border: 0px;
  }

  .newtab-cell:empty {
    outline: none;
    -moz-outline-radius: 0px;
    border: 0px solid white;
    border-radius: 0px;
  }

  /* SITES */
  .newtab-site {
    border: 0px solid white;
    border-radius: 0px;
    box-shadow: none;
    text-decoration: none;
    transition-property: top, left, opacity, box-shadow, background-color;
  }

  .newtab-cell:not([ignorehover]) .newtab-control:hover ~ .newtab-link,
  .newtab-cell:not([ignorehover]) .newtab-link:hover,
  .newtab-site[dragged],
  .newtab-intro-cell-hover .newtab-link {
    border: 0px solid white;
    border-radius: 0px;
    box-shadow: none;
    margin: 0px;
  }
  .newtab-cell ,.newtab-control ,.newtab-link,
  .newtab-cell ,.newtab-link,
  .newtab-intro-cell-hover, .newtab-link {
    border: 0px solid white;
    border-radius: 0px;
    box-shadow: none;

  }
  
  /* CONTROLS */
  .newtab-control-block {
    opacity: 0;
    transition-property: opacity;
    transition-duration: 150ms;
  }

  .newtab-control-pin,
  .newtab-site[pinned] .newtab-control-pin:hover:active {
    opacity: 0;
    transition-property: opacity;
    transition-duration: 150ms;
  }

  /* UNDO */
  #newtab-undo-container {
    background: var(--main-page-text-color-two) !important;
    border-radius: 0px;
    border-color: transparent;
  }

  /* CUSTOMIZE */
  #newtab-intro-what {
    margin-top: -4px;
    font-size: 12px !important;
    font-family: var(--main-font-family) !important;
    color: var(--main-page-link-color);
    text-decoration: none; 
    /*transition-property: color;
    transition-duration: 150ms;*/
  }
  
  #newtab-intro-what:hover {
    color: var(--main-page-link-color);
  }

  #newtab-customize-button,
  .newtab-customize {
	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAA7DAAAOwwHHb6hkAAADcUlEQVR4nJWVa0hUQRTHdfeurru6yIruFhJZQRFRivShEvSTBBVYJpH0wcLA6ksEQib4yoqEigh6YRn4oRApEhIrEoweULBlRCmVUb4yd43VFdf11W/0XpnWu7YODOecOTP/c/5n5tyrzMzMROiN8fHxlKioqINTU1NPFEV5Eezv7++3OByO46iD+Gunp6d1gRRddAbg9YhtRqPxxOjo6Cqr1fpb9judzgpEsdAnJia6ES1LCiDOqdIaExNzGEb3COYU5GDlJoFCbSNVGAsFEjIAh25FRkZmCR1ZDWC15iOQvPULvueUKPwAlZWVhrKysk2hggeN2EAgsAX5KqwAjY2NRsAbUPcEuXqZXUwrcz3TrK4vg1ErZduPfLAgALVdCcVK9G4yqc3NzS0KAn/G4RJeylttYXBwMDYhISGf0lVhOpjRBoOhfnJyMhO5mvU8SuxCP6cAfoYN+eIg+klEpAR+gayKg59gYmKiD3FzbGys2Ww2P0VfJ5ix9w3SIPYQZC+vq1khUgeGdla+vcd64PLgdfXAOsdkMrULFhq4RtTv9/co0DhNCdqRx1jM1rzQLVkMXBuw7iTJ26hH1KUh7Muwux4XF+eZvWQybYLOd+r8Qd3URVbv/geuDRK5T4JagE70Khpz1ph/RSw6pTPfwgUXA7ZfYaKZy2XffABoBaT16KUE4A6jJNOvG4B7+Cl16Ia2tjYlMzNzMpwAlDZdMnv+8blcLlNqamoRFI9K6/aMjIwcZGOYDAokM4tqNJHweQK/VNLS0kQfFAcf4k5qhoeHW20229Bi4FzwPgJkS0uiDLuoxnaaeK0okU1yeiPmGk2spfDMWnhuObz3vhDgeYDXSUvis52sYhjF3SgjIyOnAPoFrV6Px3PXbreLdm+KmGuazXTqZ3xXoNxE44inHMMTTmfPIQB2SuCfvF7vVovFksSe3Zz5KHpEUUtQIbqZT4DY+IjMCrFvoJtUNqVQLtXets7ooKN3xMfHe9Uq1GgO3c812dWRcR9S9y8VNN6TeZYKvmCE/OHAIFky3cwBZhJznClYb1R9K7inCQLo4iwW4ICmU8+zsLmk2eoPqRN1DdPOz1/cRcOSAjA8qhzy+Xx3uKt5R3l5Odc0fZEkrgobfYAElsbA7XYX8FN5yEfwNeB/gv0AXuOefsDOKxoqFM5futlcjM7bFg8AAAAASUVORK5CYII=) center no-repeat!important;
  }

}