/*!
 * Start Bootstrap - Resume v4.0.0-beta.2 (https://startbootstrap.com/template-overviews/resume)
 * Copyright 2013-2017 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-resume/blob/master/LICENSE)
 */
:root {
  --gold1: #BD5D38; 
  --gold: #bc6544; 
  --dark: #45505b;
  --gray: #868e96;
  --cgray: #ccc;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Consolas',Cambria, "Times New Roman", serif; background: #0a0f1e; color: #eaf2ff; letter-spacing: 4px; }
html, body { height: 100%;}


h1,
h2,
h3,
h4,
h5,
h6 { font-weight: 700; text-transform: uppercase; color: rgb(100,200,255); font-family: Cambria, "Times New Roman", serif } 
h1 { font-size: 3rem; line-height: 5.5rem; } 
h2 { font-size: 3.2rem; } 

ul li a, ol li a { color: #e6f9ff; font-size: 18px; }
h1 { text-align: left; border-bottom: 1px dotted #406585;  }
h2 { text-align: center; border-bottom: 1px dotted #406585 }

header h1 {  opacity: .8; }
header p { color: rgb(100,200,255); font-size: 24px; font-style: italic; }
header p:hover { color: white }

a:hover { color: #95cced; text-decoration: none; }
div.zadachi { background: #072b43de; padding: 30px 15px; width: 60%; }
div.zadachi ul { margin-bottom: 40px;}
div.zadachi p { color:#e6f9ff; }
div.zadachi a { color: #95cced; font-weight: bold; }
div.zadachi a:hover { color: #e6f9ff; }

#result { font-size: 16px;}
#result span { font-size: 24px;}
#result.green { color:yellowgreen; }
#result.red { color:#d77a7a; }
#result.yellow { color: #e3c06c; }
.btn { padding:2px 12px; vertical-align: top; border-radius: 0.2rem ;  }

/* ХЕДЪРЪТ: контейнерът е position:relative, за да легне канвасът вътре в него */
.nn-header {
  position: relative;
  height: 340px;
  overflow: hidden;
  background: radial-gradient(circle at 50% 40%, #12213f 0%, #0a0f1e 70%);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.nn-header canvas { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.nn-header .nadpis { position: relative; z-index: 2; pointer-events: none; }
.nn-header h1 { font-size: 40px; letter-spacing: 1px; text-shadow: 0 2px 20px rgba(0,0,0,.6); letter-spacing: 20px; }
.nn-header p  { margin-top: 8px; opacity: .95; font-size: 22px; }
.nn-header p span { color: rgb(170, 225, 255); }

.note { 
  margin: 0 auto; 
  padding: 15px 100px; line-height: 1.6; opacity: .85;
  background: radial-gradient(circle at 50% 40%, #12213f 0%, #0a0f1e 70%);
}

.note h3, .note h4 { font-size: 24px; letter-spacing: 8px; border-bottom: 2px solid rgba(100,200,255,.5); border-top: 1px solid rgba(100,200,255,.25); padding: 10px 0; margin: 20px 0; }
.note h4 { font-size: 18px; border-bottom: 1px solid rgba(100,200,255,.5); }
.note li { padding: 0 0 5px 0; }
.note li a { font-size: 18px; text-decoration: none; transition: all, 0.75s; letter-spacing: 2px; }
.note li a:hover { color: rgb(100,200,255); text-decoration: underline; }
.note li a span { color: rgb(138, 214, 255); }
.space20 { height: 20px; }
.space30 { height: 30px; }
.space40 { height: 40px; }
.space50 { height: 50px; }