@font-face {
font-family: "NoeDisplayBold";
src: url("/fonts/NoeDisplay-Bold.eot");
src: url("/fonts/NoeDisplay-Bold.woff") format("woff"),
url("/fonts/NoeDisplay-Bold.woff2") format("woff2"),
url("/fonts/NoeDisplay-Bold.otf") format("opentype"),
url("/fonts/NoeDisplay-Bold.svg#filename") format("svg");
}


/* Start Modal 1 */

#modal .modal {  max-height:calc(100vh - 250px); margin-top:-30px; z-index:3000; }
#modal .modal-body { padding-top:200px; text-align:center; }
#modal h1, #modal h2 { font-family:"NoeDisplayBold", cursive; }
#modal h1 { color:#fff !important; font-size:124px; line-height:90px; }
#modal h2 { color:#00a97a !important; font-size:28px; margin-bottom:5px; }
#modal h4 { color:#2bbb8f !important; margin:0 auto; }
#modal div.diplombg { background:#2abb8e; padding:60px 0 30px 0; margin-top:-60px; }
#modal p.diplom1 { color:#fff; font-size:28px; font-weight:bold; letter-spacing:.1rem; margin:20px 0 0 0; }
#modal p.diplom2 { color:#fff; font-size:16px; text-align:left; margin-left:7%; margin-bottom:20px; }
#modal p.diplom3 { color:#fff; font-size:36px; letter-spacing:.1rem; margin-top:20px; }
#modal p.diplomruta { width:100%; background:#fff; padding:10px; max-width:90%; margin:0 auto; }
#modal p.diplomrutanere { text-align:left; margin:0 auto; max-width:600px; }
#modal p.diplomlogo { margin-top:50px; }
#modal p.diplomsidfot { width:100%; display:block; }
#modal span.diplomrutadatum { color:#000; font-size:26px; text-align:left; display:block; position:absolute; line-height:45px; margin-left:10px; }
#modal span.diplomrutanamn { color:#000; font-size:32px; font-weight:bold; }
#modal span.diplomrutakurs { color:#2bbb8f; font-size:26px; font-weight:normal; }
#modal span.diplomrutakurser { color:#333; font-size:16px; text-align:left; }


@media all and (max-width:767px) {
  /* #modal #mkdir.modal { width:100% !important; margin:0 auto !important; min-width:800px !important; left:50%; transform:translateX(-50%); } */
  #modal #mkdir.modal { width:90% !important; margin:0 auto !important; left:50%; transform:translateX(-50%); }
  #modal .modal-body { padding-top:150px; }
  #modal h1 { font-size:82px; }
  #modal p.diplom1 { font-size:30px; margin-bottom:10px; }
  #modal p.diplom2 { text-align:center; font-size:14px; margin:0 auto; }
  #modal span.diplomrutadatum { position:relative; text-align:center; font-size:18px; line-height:18px; margin-bottom:10px; }
}

/* End Modal 1 */


/* Start Modal 2 */

#modal2 .modal {  max-height:calc(100vh - 300px); margin-top:-30px; z-index:3000; }
#modal2 .modal-body { background:url('/img/nt-diplom-bg.jpg') top center local #fff; border:10px solid #8386bd; text-align:center; padding:0; }
#modal2 h1, #modal h2 { font-family:"NoeDisplayBold", cursive; margin:0; padding:0; }
#modal2 h1 { color:#8386bd !important; font-size:124px; line-height:90px; }
#modal2 h2 { color:#8386bd !important; font-size:28px; margin-bottom:5px; }
#modal2 h4 { color:#8386bd !important; margin:0 auto; }
#modal2 div.diplombg { background:linear-gradient(#e6e7f2 85%, transparent 15%) no-repeat; }
#modal2 div.diplombg2 { padding-top:50px; }
#modal2 div.diplombg2 img { margin-bottom:50px; }
#modal2 p.diplom1 { color:#000; font-size:18px; font-weight:bold; margin:20px 0; }
#modal2 p.diplom2 { color:#000; font-size:16px; text-align:left; margin-left:7%; margin-bottom:20px; }
#modal2 p.diplom3 { color:#000; font-size:42px; font-weight:bold; margin:20px 0; font-family:serif; }
#modal2 p.diplomruta { width:100%; padding:10px; max-width:90%; margin:0 auto; }
#modal2 p.diplomrutanere1 { color:#000; text-align:left; margin-bottom:30px; }
#modal2 p.diplomrutanere2 { color:#000; text-align:left; display:table-cell; max-width:250px; }
#modal2 p.diplomrutanere3 { color:#000; text-align:left; display:table-cell; max-width:350px; padding-left:40px; }
#modal2 p.diplomrutanere4 { color:#000; font-weight:bold; text-align:center; margin:30px 0 50px 0; }
#modal2 p.diplomlogo { margin-top:50px; }
#modal2 p.diplomsidfot { width:100%; display:block; }
#modal2 div.diplomrutanerealla { margin:0 auto; display:block; max-width:600px; }
#modal2 span.diplomrutadatum { color:#000; font-size:18px; margin:0 auto; text-align:center; }
#modal2 span.diplomrutanamn { color:#000; font-weight:bold; font-size:62px; font-family:serif; }
#modal2 span.diplomrutapersnr { color:#000; font-weight:bold; font-size:16px; font-family:serif; }
#modal2 span.diplomrutakurs { color:#000; font-weight:bold; font-size:42px; font-family:serif; }
#modal2 span.diplomrutakurser { color:#000; font-size:18px; text-align:left; margin-top:10px; display:block; }
#modal2 span.diplomrutamoment { color:#000; font-size:18px; }
#modal2 span.diplomrutastruktur { color:#000; font-size:18px; }


@media all and (max-width:767px) {
  /* #modal #mkdir.modal { width:100% !important; margin:0 auto !important; min-width:800px !important; left:50%; transform:translateX(-50%); } */
  #modal2 #mkdir2.modal { width:90% !important; margin:0 auto !important; left:50%; transform:translateX(-50%); }
  #modal2 h1 { font-size:82px; }
  #modal2 p.diplom1 { font-size:30px; margin-bottom:10px; }
  #modal2 p.diplom2 { text-align:center; font-size:14px; margin:0 auto; }
  #modal2 p.diplomrutanere1, #modal2 p.diplomrutanere2, #modal2 p.diplomrutanere3, #modal2 p.diplomrutanere4 { padding:0 10px 30px 0; width:100%; display:block; text-align:center; margin:0 auto; }
  #modal2 span.diplomrutakurser { text-align:center; }
}

/* End Modal 2 */