// main: ../main.scss
// -----------------------------------------------------------------------------
// This file contains styles that are specific to the home page.
// -----------------------------------------------------------------------------

 .dm-code-snippet.light {
   background: $default-bg;
   padding: 40px 35px 45px 35px;
   margin-top: 30px;
   margin-bottom: 30px;

   &.no-background {
     padding: 0;
     background: transparent!important;

     .control-language {
       box-shadow: none;
     }
   }

   .control-language {
    box-shadow: 0px 8px 40px $shadow-color;
    border: none;
    background: $light-theme;
    padding: 1em;
    margin: .5em 0 0 0;
    border-radius: 0.3em;

     pre {
      border: none;
      background: transparent;
      padding: 0 0 0 1em;
      margin: 0;

      code {
        // overflow: hidden;
        // display: block;
      }

       .wrap {
        white-space: pre-wrap;
       }

       .no-wrap {
        white-space: pre;
       }

     }
   }



   code[class*="language-"],
   pre[class*="language-"] {
   	color: black;
   	background: none;
   	text-shadow: 0 1px white;
   	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
   	text-align: left;
   	white-space: pre;
   	word-spacing: normal;
   	word-break: normal;
   	word-wrap: normal;
   	line-height: 1.5;

   	-moz-tab-size: 4;
   	-o-tab-size: 4;
   	tab-size: 4;

   	-webkit-hyphens: none;
   	-moz-hyphens: none;
   	-ms-hyphens: none;
   	hyphens: none;
   }

   pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
   code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
   	text-shadow: none;
   	background: #b3d4fc;
   }

   pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
   code[class*="language-"]::selection, code[class*="language-"] ::selection {
   	text-shadow: none;
   	background: #b3d4fc;
   }

   @media print {
   	code[class*="language-"],
   	pre[class*="language-"] {
   		text-shadow: none;
   	}
   }


   pre[class*="language-"] {
   	padding: 0;
   	margin: 0;
   	overflow: auto;
   }

   :not(pre) > code[class*="language-"],
   pre[class*="language-"] {
   	background: #f5f2f0;
   }


   :not(pre) > code[class*="language-"] {
   	padding: .1em;
   	border-radius: .3em;
   	white-space: normal;
   }

   .token.comment,
   .token.prolog,
   .token.doctype,
   .token.cdata {
   	color: slategray;
    padding-left: 0;
   }

   .token.punctuation {
   	color: #999;
   }

   .namespace {
   	opacity: .7;
   }

   .token.property,
   .token.tag,
   .token.boolean,
   .token.number,
   .token.constant,
   .token.symbol,
   .token.deleted {
   	color: #905;
   }

   .token.selector,
   .token.attr-name,
   .token.string,
   .token.char,
   .token.builtin,
   .token.inserted {
   	color: #690;
   }

   .token.operator,
   .token.entity,
   .token.url,
   .language-css .token.string,
   .style .token.string {
   	color: #9a6e3a;
   	background: hsla(0, 0%, 100%, .5);
   }

   .token.atrule,
   .token.attr-value,
   .token.keyword {
   	color: #07a;
   }

   .token.function,
   .token.class-name {
   	color: #DD4A68;
   }

   .token.regex,
   .token.important,
   .token.variable {
   	color: #e90;
   }

   .token.important,
   .token.bold {
   	font-weight: bold;
   }
   .token.italic {
   	font-style: italic;
   }

   .token.entity {
   	cursor: help;
   }


 }