﻿.site-header .header-top-navbar ul { color: white }
.header-kodimg { background: #343a40; }

a{-webkit-transition: all .2s ease; -moz-transition: all .2s ease; -ms-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease;text-decoration:none;   }
hr.new1 { border: 10px solid blueviolet; border-radius: 5px;}
hr.new2  { background: url('/images/bg-alt-badget01.png') repeat-x center; width:100%;height:35px; margin:15px 0; border:none; outline:none }
hr.new3 { border: 20px solid #dcd8c9; border-radius: 5px; border-left: 20px solid rgb(128, 128, 128); }
.h3-1 { background-color: #f8fff0; width: 100%; padding: 35px 0 }
#1 a, #2 a, #3 a, #4 a, #5 a, #6 a, #7 a, #8 a, #9 a, #10 a { width: 10px; height: 10px; border-radius: 20px; background-color: #dddddd; display: block; }
.bg-red{background-color:#ffe5e5} 
 .collapse{ clear:both; display:block;}


h1, h2, h3, h4, h5, h6 { font-family: 'Roboto', sans-serif; font-weight: 400; }
h1 { font-size: 26px; margin-bottom: 1.5rem; }
h2 { font-size: 23px; margin: 2rem 0 1rem 0; }
h3 { font-size: 18px; border-left: 20px solid #768693; padding: 0.5rem 0.8rem 0.5rem 0.8rem; background-color: #dddddd; margin: 2rem 0 1.5rem 0; }
p { font-size: 16px; line-height: 1.9rem; text-align: justify; word-wrap: break-word; }


   
  
     
.controls input[type=text]{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:.375rem .75rem;margin-bottom:0;font-size:1rem;font-weight:400;line-height:1.5;color:#495057;text-align:center;white-space:nowrap;background-color:#e9ecef;border:1px solid #ced4da;border-radius:.25rem}
.controls input[type=checkbox],.controls input[type=radio]{margin-top:0}
     .controls input[type=submit] {display:inline-block;font-weight:400;color:#212529;text-align:center;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;background-color:transparent;border:1px solid transparent;padding:.375rem .75rem;font-size:1rem;line-height:1.5;border-radius:.25rem;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out }
    .controls input[type=submit] {color:#fff;background-color:#E30A17;border-color:#E30A17}
    .controls input[type=submit]:hover{color:#fff;background-color:#0069d9;border-color:#0062cc}
    .controls input[type=submit].focus, .controls input[type=submit]:focus{box-shadow:0 0 0 .2rem rgba(38,143,255,.5)}
    .controls input[type=submit].disabled,.controls input[type=submit]:disabled{color:#fff;background-color:#E30A17;border-color:#E30A17}
    .controls input[type=submit]:not(:disabled):not(.disabled).active, .controls input[type=submit]:not(:disabled):not(.disabled):active,.show> .controls input[type=submit].dropdown-toggle{color:#fff;background-color:#0062cc;border-color:#005cbf}










/*body{ border-top:2px solid #f0f0f0}*/
.quick { text-align: center; }
.code-asp-net, .code-asp-net-mvc, .code-c-sharp, .code-tsql-icon, .code-net-core, .code-ajax-icon, .code-angular,
.code-jq-icon, .code-json-icon, .code-mvc-core, .code-linq { display: inline-block; background: url('/images/cat/code-mini-icons.png') no-repeat; overflow: hidden; text-indent: -9999px; text-align: left; margin-right: 5px; width: 25px; height: 25px; }
.code-c-sharp { background-position: -20px -41px; width: 20px; height: 23px; }
.code-asp-net { background-position: -0px -22px; width: 20px; height: 20px; }
.code-asp-net-mvc { background-position: -20px -64px; width: 20px; height: 20px; }
.code-tsql-icon { background-position: -0px -0px; width: 20px; height: 22px; }
.code-jq-icon { background-position: -0px -42px; width: 20px; height: 20px; }
.code-json-icon { background-position: -0px -62px; width: 20px; height: 20px; }
.code-angular { background-position: -20px -20px; width: 20px; height: 21px; }
.code-linq { background-position: -20px -83px; width: 20px; height: 21px; }
.code-asp-net-core { background-position: -0px -84px; width: 20px; height: 21px; }
.quick img { display: inline-block; height: 20px; width: 20px; max-width: 20px; margin-right: 5px; }
.quick a { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; border-radius: 6px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #313131; padding: .5rem; margin: .2rem 0; font-size: 1rem; border: 1px solid #dcdcdc; transition: all .2s ease; }
    .quick a:active,
    .quick a:focus,
    .quick a:hover { -webkit-transform: translate3D(0, -1px, 0); transform: translate3D(0, -1px, 0); text-decoration: none; background: #fff; border: 1px solid #d1d1d1; color: #222; }

.quick.quick-header a { font-weight: 400; border: 1px solid #3d4251; background: #53596e; color: #bec2cf; }

    .quick.quick-header a:active,
    .quick.quick-header a:focus,
    .quick.quick-header a:hover { border: 1px solid #848ba3; background: #69718b; color: #f9f9fa; }
.DpView { }
.invisible { visibility: hidden; }
.fume_pg .button, .fume_pg [type=button], .fume_pg [type=submit], .fume_pg a.button, .fume_pg button { background: #3a4253; padding: 10px; display: inline-block; padding: 0.7em 1.4em; margin: 0 0.3em 0.3em 0; border-radius: 0.15em; box-sizing: border-box; text-decoration: none; color: #FFFFFF; box-shadow: inset 0 -0.6em 0 -0.35em rgba(0,0,0,0.17); text-align: center; position: relative; }
    .fume_pg.button:focus, .fume_pg .button:hover, .fume_pg .buttons-hover, .fume_pg [type=button]:focus, .fume_pg [type=button]:hover, .fume_pg [type=reset]:focus, .fume_pg [type=reset]:hover, .fume_pg [type=submit]:focus, .fume_pg [type=submit]:hover, .fume_pg a.button:focus, .fume_pg a.button:hover, .fume_pg button:focus, .fume_pg button:hover { background: black }

.blue_pg .button, .blue_pg [type=button], .blue_pg [type=submit], .blue_pg a.button, .blue_pg button { background: #2A91E1; padding: 10px; display: inline-block; padding: 0.7em 1.4em; margin: 0 0.3em 0.3em 0; border-radius: 0.15em; box-sizing: border-box; text-decoration: none; color: #FFFFFF; box-shadow: inset 0 -0.6em 0 -0.35em rgba(0,0,0,0.17); text-align: center; position: relative; }

    .blue_pg.button:focus, .blue_pg .button:hover, .blue_pg .buttons-hover, .blue_pg [type=button]:focus, .blue_pg [type=button]:hover, .blue_pg [type=reset]:focus, .blue_pg [type=reset]:hover, .blue_pg [type=submit]:focus, .blue_pg [type=submit]:hover, .blue_pg a.button:focus, .blue_pg a.button:hover, .blue_pg button:focus, .blue_pg button:hover { background: #2494d3; }

/*linear-gradient(to right, #3a4253 0%, #282a36 61%, #111 100%);*/
.green_pg .button, .green_pg [type=button], .green_pg [type=submit], .green_pg a.button, .green_pg button { background: #16b262; padding: 10px; display: inline-block; padding: 0.7em 1.4em; margin: 0 0.3em 0.3em 0; border-radius: 0.15em; box-sizing: border-box; text-decoration: none; color: #FFFFFF; box-shadow: inset 0 -0.6em 0 -0.35em rgba(0,0,0,0.17); text-align: center; position: relative; }

    .green_pg.button:focus, .green_pg .button:hover, .green_pg .buttons-hover, .green_pg [type=button]:focus, .green_pg [type=button]:hover, .green_pg [type=reset]:focus, .green_pg [type=reset]:hover, .green_pg [type=submit]:focus, .green_pg [type=submit]:hover, .green_pg a.button:focus, .green_pg a.button:hover, .green_pg button:focus, .green_pg button:hover { background: #0e8749; }




.orange_pg .button, .orange_pg [type=button], .orange_pg [type=submit], .orange_pg a.button, .orange_pg button { background: #f49147; padding: 10px; display: inline-block; padding: 0.7em 1.4em; margin: 0 0.3em 0.3em 0; border-radius: 0.15em; box-sizing: border-box; text-decoration: none; color: #FFFFFF; box-shadow: inset 0 -0.6em 0 -0.35em rgba(0,0,0,0.17); text-align: center; position: relative; }

    .orange_pg.button:focus, .orange_pg .button:hover, .orange_pg .buttons-hover, .orange_pg [type=button]:focus, .orange_pg [type=button]:hover, .orange_pg [type=reset]:focus, .orange_pg [type=reset]:hover, .orange_pg [type=submit]:focus, .orange_pg [type=submit]:hover, .orange_pg a.button:focus, .orange_pg a.button:hover, .orange_pg button:focus, .orange_pg button:hover { background: #e47826; }


.red_pg .button, .red_pg [type=button], .red_pg [type=submit], .red_pg a.button, .red_pg button { background: #db2240; padding: 10px; display: inline-block; padding: 0.7em 1.4em; margin: 0 0.3em 0.3em 0; border-radius: 0.15em; box-sizing: border-box; text-decoration: none; color: #FFFFFF; box-shadow: inset 0 -0.6em 0 -0.35em rgba(0,0,0,0.17); text-align: center; position: relative; }

    .red_pg.button:focus, .red_pg .button:hover, .red_pg .buttons-hover, .red_pg [type=button]:focus, .red_pg [type=button]:hover, .red_pg [type=reset]:focus, .red_pg [type=reset]:hover, .red_pg [type=submit]:focus, .red_pg [type=submit]:hover, .red_pg a.button:focus, .red_pg a.button:hover, .red_pg button:focus, .red_pg button:hover { background: #aa152c; }



.purple_pg .button, .purple_pg [type=button], .purple_pg [type=submit], .purple_pg a.button, .purple_pg button { background: #7022e2; padding: 10px; display: inline-block; padding: 0.7em 1.4em; margin: 0 0.3em 0.3em 0; border-radius: 0.15em; box-sizing: border-box; text-decoration: none; color: #FFFFFF; box-shadow: inset 0 -0.6em 0 -0.35em rgba(0,0,0,0.17); text-align: center; position: relative; }

    .purple_pg.button:focus, .purple_pg .button:hover, .purple_pg .buttons-hover, .purple_pg [type=button]:focus, .purple_pg [type=button]:hover, .purple_pg [type=reset]:focus, .purple_pg [type=reset]:hover, .purple_pg [type=submit]:focus, .purple_pg [type=submit]:hover, .purple_pg a.button:focus, .purple_pg a.button:hover, .purple_pg button:focus, .purple_pg button:hover { background: #4e14a4; }


.button,
.buttons,
a.button { display: inline-block; padding: .75rem 1.25rem; text-align: center; font-size: 1.05rem; text-decoration: none !important; /*background: #089df0;*/ border: 0; border-radius: 6px; cursor: pointer; font-weight: 600; margin: 0; /*font-family: Nunito Sans, sans-serif;*/ color: #fff; text-shadow: none; -webkit-appearance: none; }

    .button:focus,
    .button:hover,
    .buttons-hover,
    [type=reset]:focus,
    [type=reset]:hover,
    [type=submit]:focus,
    [type=submit]:hover,
    a.button:focus,
    a.button:hover { text-decoration: none; outline: 0; color: #fff; }



    .button:active,
    [type=reset]:active,
    [type=submit]:active,
    a.button:active { outline: 0; color: #fff; -webkit-transform: scale(.95); transform: scale(.95); border-bottom: 0 !important; }



.large-container,
.small-container,
.tiny-container { margin-left: auto; margin-right: auto; padding: 0 1rem; }

.tiny-container { max-width: 400px; }

.small-container { max-width: 800px; }


.large-container { max-width: 1120px; }



.pret { background: #f7f7f7; }


.com { color: #93a1a1; }

.lit { color: #195f91; }

.pun, .opn, .clo { color: #93a1a1; }

.fun { color: #dc322f; }

.str, .atv { color: #a31515; }

.kwd, .prettyprint .tag { color: #001cff; }

.typ, .atn, .dec, .var { color: #4f91af; }

.pln { color: #48484c; }

.pun { color: #48484c; }

ol.linenums { margin: 0 0 0 40px; }

    ol.linenums li { padding-left: 12px; color: #bebec5; line-height: 20px; text-shadow: 0 1px 0 #fff; }
     
.no-border{    outline:none; border: none !important; }
.sell a.none,.sell  a.none:hover{  background:none; color:#fff; font-size:15px; display:inline; line-height: 16px; padding:2px;}


 
.p_re{  margin-bottom:5px;  }
.dvgap{  float:left; display:inline; height:5px; width:100%; color:#b10000   } 
.sell h4{color:white; padding:5px 2px 5px 10px; margin:5px 0; font-size:15px;}
.sell h5{ color:white;padding:3px 2px 3px 10px; margin:3px 0; font-size:14px;}.sell h4 i,.sell h5 i{  display:inline; color:white; font-style:normal; font-size:11px}
 



#chain { width: 27px; height: 180px; position: absolute; top: 0px; right: 60px; background: url(/images/bgchainpurple.png) bottom center no-repeat;  }
#chain .chain_handle { height: 115px; width: 115px; background: url('/images/bg-discoball-purple.gif') no-repeat 0 0; position: absolute; top: 165px; left: -37px; cursor: pointer; text-indent: -9999px; color: #eee; }
#chain .chain_handle.active { background: url('/images/bg-discoball-off1.gif') no-repeat 0 0; position: absolute; top: 115px;z-index: 9999; }
.slide-text { color: white; display: block; background: url("/images/bg-bd_middle02.gif") repeat; height: 40px; line-height: 40px; font-size: 20px; text-align:center;}
@media (max-width:556px) {
  #chain .chain_handle {   background: url('/images/bg-small-discoball-purple.gif') no-repeat 0 0; position: absolute; top: 156px; left: -9px; cursor: pointer; text-indent: -9999px; z-index:9999   }
    /*.collapse .navbar-nav{    background:#3a3a40; display:block; margin:0 auto; clear:both;border-radius: 4px; -webkit-transition: 0s; -o-transition: 0s; transition: 0s  }*/
    .prettyprint { font-size:11px !important;  }
} 
@media (max-width:480px) {
    input[type="text"]#q:focus { max-width: 240px; }

} 
 
   
#black { display: none; height: 100%; left: 0px; position: fixed; top: 0; width: 100%; z-index: 1200; background: url(/images/bg-discolights.gif) bottom repeat-x,black repeat; }
#preventivo { display: none; position: absolute; top: 0; right: 15px; z-index: 1201; }
#preventivo .form { display: block; }
.p_re { vertical-align: top; text-align: justify;  font-size: 15px; margin: 0; padding: 0; color: #333; display: inline-block; line-height: 17px; }
.p_re a { color: #960000; background: url(/images/bg-circle.png); width: 15px; height: 16px; display: inline-table; text-align: center; text-decoration: none; letter-spacing: -0.5px; font-size: 12px; margin: -1px; padding: 0; line-height: 17px; }
.p_re .dvadapter { color: #d50000; background: url(/images/bg-circleblue.png); width: 13px; height: 16px; display: inline-table; text-align: center; font-style: normal; }
.p_re .dvinner { color: #d50000; background: url(/images/bg-circleorange.png); width: 13px; height: 16px; display: inline-table; text-align: center; font-style: normal; }
.p_re a:hover, .p_re a i:hover { color: #b200ff; background: url(/images/bg-circle_hover.png); width: 15px; height: 16px; display: inline-table; text-align: center; text-decoration: none; }
.p_re pre { color: #d50000; display: inline; font-size: 8px; width: 13px; height: 18px; text-align: center; vertical-align: text-top; }
 
pre { white-space: pre-wrap; }
q { quotes: "“" "”" "‘" "’"; }
pre, blockquote { border: none; page-break-inside: avoid; } 
code { padding: 2px 4px; font-size: 90%; color: #c7254e; white-space: nowrap; background-color: #f9f2f4; border-radius: 4px; }
pre { display: block; font-size: 15px; line-height: 1.428571429; color: #333; word-break: break-all; word-wrap: break-word; background-color: #fcfcfc; }
pre code { padding: 0; font-size: inherit; color: inherit; white-space: pre-wrap; background-color: transparent; border: 0; }
.pnl { color: #333; font-size: 16px; padding: 0 10px 5px 10px; border: 2px dotted #fafafa; border-top: none; }
.pnl .top-note { margin: 0; padding: 0; display: inline; }
.top-note a, .top-note p { font-size: 14px; display: inline; }
.sell { transition: all .2s ease; margin: 2px; padding: 2px; border: 0; border-radius: 6px; position: relative; box-shadow: 0 1px 2px rgba(0, 0, 0, .1); -webkit-box-flex: 1; -ms-flex: auto; flex: auto; }
.sell:hover { background: rgba(255, 255, 255, 0.1); box-shadow: 0 15px 35px rgba(0, 0, 0, .3); }
.sell .flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
 

   .button,
.buttons,
a.button { display: inline-block; padding: .75rem 1.25rem; text-align: center; font-size: 1.05rem; text-decoration: none !important;   border: 0; border-radius: 6px; cursor: pointer; font-weight: 600; margin: 0;   color: #fff; text-shadow: none; -webkit-appearance: none; }
 

.pnltop1 { width: 100%; height: 80px; z-index: -1; display: block;   position: absolute; border: 5px solid #343a40; border-top:none; border-left: none; border-right: none; box-shadow: 0 5px 15px rgba(0, 0, 0, .3); }

.cl-wrapper { width: 100%; margin: 0; padding: 0; }

    .cl-wrapper .prettyprint { margin: 0; padding: 0; }

    .cl-wrapper h1, .cl-wrapper h2, .dvSubject { color: #fcfcfc; text-align: center; font-size: 27px; font-weight: bold; margin-bottom: 50px; }

    .cl-wrapper h3 { color: blueviolet; text-align: left; font-size: 24px; font-weight: bold; margin: 15px 0 0 0; }

    .cl-wrapper h6 { background: #f1f1f1; padding: 10px; border: 1px solid #9b9b9b; font-size: 16px; color: #333; padding: 0; margin: 0; font-weight: normal; }

@media (min-width: 576px) {
    .cl-wrapper { max-width: 540px; margin: 0 auto; }
}

@media (min-width: 768px) {
    .cl-wrapper { max-width: 720px; margin: 0 auto; }
}

@media (min-width: 992px) {
    .cl-wrapper { max-width: 960px; margin: 0 auto; }
}

@media (min-width: 1200px) {
    .cl-wrapper { max-width: 1140px; margin: 0 auto; }
}
/*@media (min-width: 1400px) {
  .cl-wrapper {    max-width: 1340px; margin:0 auto;  }
}*/
.cl-wrapper img { margin: 10px 10px 10px 0; }

.p_re pre { color: #d50000; display: inline; font-size: 8px; width: 13px; height: 18px; text-align: center; vertical-align: text-top; }

.p_sub { width: 100%; height: 610px; overflow-y: scroll; display: inline-block; border-top: 1px solid #e6e6e6; padding: 0; margin: 0; background-color: #e2cce8; }

    .p_sub h4 { color: #ff0000; padding: 0; margin: 0; display: block; }


pre { white-space: pre-wrap; }

q { quotes: "“" "”" "‘" "’"; }

pre, blockquote { border: none; page-break-inside: avoid; }
/*code, kbd, pre, samp  { font-family: Monaco,Menlo,Consolas,"Courier New",monospace; }*/
code { padding: 2px 4px; font-size: 90%; color: #c7254e; white-space: nowrap; background-color: #f9f2f4; border-radius: 4px; }

pre { display: block; font-size: 15px; line-height: 1.428571429; color: #333; word-break: break-all; word-wrap: break-word; background-color: #fcfcfc; }

    pre code { padding: 0; font-size: inherit; color: inherit; white-space: pre-wrap; background-color: transparent; border: 0; }



.disco-big { font-size: 17px; clear: both; background: #888; color: white; width: 100%; display: block; }

.pnl { color: #333; font-size: 16px; padding: 0 10px 5px 10px; border: 2px dotted #fafafa; border-top: none; }

    .pnl .top-note { margin: 0; padding: 0; display: inline; }

.top-note a, .top-note p { font-size: 14px; display: inline; }


.sell { transition: all .2s ease; margin: 2px; padding: 2px; border: 0; border-radius: 6px; position: relative; box-shadow: 0 1px 2px rgba(0, 0, 0, .1); -webkit-box-flex: 1; -ms-flex: auto; flex: auto; }

    .sell:hover { background: rgba(255, 255, 255, 0.1); box-shadow: 0 15px 35px rgba(0, 0, 0, .3); }

    .sell .flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }




.logo-code { width: 100%; border-top: 2px solid #f1f1f1; }

.tag-list li { border-radius: 4px; padding: 3px 4px; margin: 0 3px 3px 0; display: inline-block; text-align: center; }

.tag-list { list-style-type: none; padding-left: 0; margin-top: 20px; }

li.tag, li.tag a { color: #fcfcfc; font-size: 12px; padding-left: 3px; }

    li.tag a:hover { text-decoration: none; color: #fff; }

.date { font-size: 13px; }

.tag-list li.tag-item { background-color: #4f4f4f; }

.tag-list li.create { background-color: #14b763; }

.tag-list li.read { background-color: #089df0; }

.tag-list li.update { background-color: #ff6a00; }

.tag-list li.delete { background-color: #a31515; }

.tag-list li.general { background-color: #40004d; }

.dv-inline span abbr { display: inline; font-size: 12px; }

.dv-inline span a { display: inline; font-size: 15px; color: inherit; text-decoration: underline; }

.bigfont a:hover { text-decoration: none; border: none; }

.main-post p, .main-post, .main-post img { vertical-align: top; }

    .main-post img { display: inline; float: left; }

    .main-post a { color: #0f7df3; }

        .main-post a:hover { color: #203c8f; }

    .main-post br { display: block; clear: both; }

@media(min-width:600px) {
    
    .large-container,
    .small-container,
    .tiny-container { padding: 0 2rem; }
    .bigfont a { font-size: 18px; }
}

@media(min-width:200px) {
    .logo-code img { padding-left: 35px; margin-top: 10px; }

    .bigfont a { font-size: 17px; }

    .h-title { font-size: 22px; padding-top: 15px; display: block; color: white; }
}

.general a { color: #8A4AE7; display: inline-block; }

.blue a { color: #089df0; display: inline-block; }

.green a { color: #5eeda3; }

.red a { color: #d50000; }

.orange a { color: #fdb54b; }

.h-title { color: white; }
 

@media(min-width:900px) {
 
    .logo-code img { padding-left: 100px; margin-top: 10px; }

    .bigfont a { font-size: 21px; font-weight: bold; margin-top: 10px; }

    .h-title { font-size: 25px; padding-top: 35px; display: block; color: white; font-weight: bold; text-align: center; }
}


.dvread a:hover { text-decoration: none; border: none; }

.main-nav-outer { position: relative; z-index: 1; top: 0px; width: 100%; left: 0; height: 80px; background: #272a34; box-shadow: 0 2px 10px rgba(0, 0, 0, .1); clear: both; display: block; }

.nav-container { max-width: 1120px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }

 .fl-container { padding:0}







.navbar-dark{border-bottom: 1px solid rgba(0, 0, 0, .15); box-shadow: 0 2px 10px rgba(0, 0, 0, .1);}
.main-navigation { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-align: center; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap;      } 
.main-navigation .navbar-nav{ height:74px;  }
.navbar-nav li { border-radius: 20%; padding: 0 5px }
 .main-navigation .navbar-nav li:hover{ color: white !important; background: #20232b !important;  }
 .main-navigation li.nav-item :hover { color: white !important;   }
.drawer-icon { margin: 0 auto; text-align: center; cursor: pointer }





@media(min-width:600px) {
.main-navigation { } 
.main-navigation .fa {   }
}

@media(min-width:900px) {
.main-nav-outer { height: 76px; }
.nav-container { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }
}






.home.current .fa,
.home:hover .fa { color: #f0f0f0; }

.create.current .fa,
.create:hover .fa { color: #5eeda3; }

.read.current .fa,
.read:hover .fa { color: #4cbbf9; }

.update.current .fa,
.update:hover .fa { color: #fdb54b; }

.delete.current .fa,
.delete:hover .fa { color: #fc5d76; }

.general.current .fa,
.general:hover .fa { color: #bd96f6; }

a.current { color: #fff; }

.secondary-navigation { z-index: 2; position: fixed; width: 100%; top: 0; left: 0; height: 40px; background: #181818; text-align: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

.secondary-navigation,
.secondary-title { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

.secondary-title { color: #fff; font-weight: 700; font-size: .9rem; margin: 0 0 0 .5rem; }

    .secondary-title a { color: #fff; white-space: nowrap; font-size: .9rem; padding-right: .5rem; }

        .secondary-title a:hover { text-decoration: none; }

    .secondary-title .divider { display: none; color: #444; padding: 0 .5rem; }

    .secondary-title .secondary-subtitle { display: none; color: hsla(0, 0%, 100%, .8); font-weight: 700; font-size: .9rem; }








@media(min-width:900px) {
    .secondary-title { margin: 0 0 0 1rem; }

        .secondary-title a { color: #fff; white-space: nowrap; padding-right: 0; font-size: 1rem; }

            .secondary-title a:active,
            .secondary-title a:focus,
            .secondary-title a:hover { color: #fdb54b; text-decoration: none; }

        .secondary-title .divider,
        .secondary-title .secondary-subtitle { display: block; font-size: 1rem; }
}

.nav-search { display: -webkit-box; display: -ms-flexbox; display: flex; height: 50px; border-radius: 6px; margin-left: 2rem; margin-top:10px; }

.nav-search-submit { border-radius: 0; background: 0 0; border: 0; padding: 0; text-align: center; font-size: 1.1rem; height: 40px; width: 50px; color: #fff; font-weight: 700; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;   }

    .nav-search-submit:active,
    .nav-search-submit:focus,
    .nav-search-submit:hover { color: #5eeda3; background: 0 0; }

    .nav-search-submit .fa { margin: auto; display: block; }

.nav-search-input { border-radius: 0; border: 0; padding: 1rem; font-size: 1rem; width: 160px;  background: #3d4251; color: #fff; height: 40px; }

    .nav-search-input:hover { background: #414657; border: 0; }

    .nav-search-input:active,
    .nav-search-input:focus { background: #484d60; border: 0; outline: 0; }

    .nav-search-input::-webkit-input-placeholder { color: hsla(0, 0%, 100%, .8); }

    .nav-search-input:-ms-input-placeholder,
    .nav-search-input::-ms-input-placeholder { color: hsla(0, 0%, 100%, .8); }

    .nav-search-input::placeholder { color: hsla(0, 0%, 100%, .8); }

@media(min-width:900px) {
    .search-div { display: block; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-bottom: 1px solid rgba(0, 0, 0, .15);margin-top:10px; }

    .nav-search-submit { width:40px; }

    .secondary-navigation { height: 80px; }

    .nav-search,
    .nav-search-input,
    .nav-search-submit { height: 50px; border-radius: 6px; }
}

.header { text-align: center; padding: 2rem 0; font-size: 1.1rem; }

    .header h1 { margin: 0 0 .5rem; font-weight: 700; line-height: 1.2; font-size: 2.25rem; }

        .header h1 span { color: #fc5d76; }

    .header h3 { margin: 0 0 .5rem; font-size: 1.3rem; font-weight: 700; }

    .header a { font-weight: 700; color: #222; }

    .header p { font-size: 1.3rem; }

.article-email,
.header-email { text-align: center; background: linear-gradient(62deg, #fbab7e, #f7ce68); box-shadow: 0 15px 35px rgba(0, 0, 0, .1); color: #6f1c26; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; border-radius: 6px; padding: 2rem; margin: 2rem 0 0; }

.article-email { text-align: left; }

    .article-email h3 { margin-top: 0; }

.header-email { display: none; }

@media(min-width:600px) {
    .header { text-align: left; padding: 4rem 0; }

        .header .header-main { max-width: 650px; text-align: center; }

        .header p { font-size: 26px; line-height: 33px; text-align: center; text-shadow: 2px 8px 6px rgba(0,0,0,0.2), 0px -5px 35px rgba(255,255,255,0.3); }

        .header h1 { font-size: 3rem; text-align: center; text-shadow: 0 1px 0 #CCCCCC, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15); }
}

@media(min-width:900px) {
    .header { padding: 5rem 0; }

        .header .header-main h1 { font-size: 4rem; }

        .header .large-container { text-align: left; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-pack: distribute; justify-content: space-around; }

            .header .large-container input { min-width: 180px; }

        .header h1 { font-size: 2.25rem; }

    .article-email,
    .header-email { display: block; padding: 2.5rem; }

        .article-email h3,
        .header-email h3 { color: #222; font-size: 1.5rem; }

    .header-email { margin: 2rem; }
}

@media(min-width:1120px) {
    .header { padding: 6rem 0; }

        .header h1 { font-size: 2.75rem; }
}

.gradient { background: linear-gradient(62deg, #3c4556, #282a36); color: #a1a7b9; }

    .gradient h1 { color: #fff; }

    .gradient a { color: #fdb54b; font-weight: 700; }

    .gradient.mb { margin-bottom: 3rem; }

.top { padding: 1rem 0; background: #f4f5f6; }

    .top h2 { font-size: 1.2rem; margin: .5rem .5rem 1rem; }

.top-title { margin-top: .5rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-shadow: 2px 8px 6px rgba(0,0,0,0.2), 0px -5px 35px rgba(255,255,255,0.3); }

@media(min-width:600px) {
    .top-title { margin-top: 2rem; }

    .top h2 { padding: 0; font-size: 1.4rem; }
}

/*****************middleContent*****************************/
.page-header { text-align: center; padding:30px  }
.page-header h1 { margin:  0; font-weight: 700; font-size: 25px; } 

@media(min-width:600px) {
.page-header {  }
.page-header h1 { font-size:30px; }
.page-header p { font-size: 1.3rem; }
}

@media(min-width:900px) {
.page-header { }
.page-header h1 { font-size:30px; }
}

@media(min-width:1120px) {
.page-header {   }
.page-header h1 { font-size:35px; }
}
.bg-orange{ background: linear-gradient(62deg, #4cbbf9, #3a3a40); color: white;}
.bg-brown{ background: linear-gradient(62deg, #005fe2, #3a3a40); color: white;}
.bg-green{ background: linear-gradient(62deg, #09229a, #3a3a40); color: white;}
.bg-purple{ background: linear-gradient(62deg,  #341297, #3a3a40); color: white;}
.bg-red{ background: linear-gradient(62deg,  #620175, #3a3a40); color: white;}
.color-blue,.color-blue a{color:#2A91E1}
.color-fume, .color-fume a{color:#3a3a40; font-weight:bold}
.btn-detay,.btn-detay:hover{color:#3a3a40; border-bottom:1px solid rgba(0,0,0,0.17); text-decoration:none}

.bright-header { background: linear-gradient(62deg, #4cbbf9, #066da6); color: hsla(0, 0%, 100%, .8); }

    .bright-header h1 { margin-top: 0; color: #fff; }

    .bright-header.read-header { background: linear-gradient(62deg, #4cbbf9, #089df0); }

    .bright-header.create-header { background: linear-gradient(62deg, #5eeda3, #12a057); }

    .bright-header.delete-header { background: linear-gradient(62deg, #fc5d76, #bd0321); }

    .bright-header.update-header { background: linear-gradient(62deg, #fbab7e, #f7ce68); color: #6f1c26; }

        .bright-header.update-header h1 { color: #222; }

    .bright-header.general-header { background: linear-gradient(62deg, #bd96f6, #6613e0); }

    .bright-header p { font-size: 1.2rem; margin-bottom: 0; }

.single-header { text-align: center; padding: 1.5rem 0; margin-bottom: 1.5rem; border-bottom: 1px solid #f0f0f0; }

    .single-header h1 { margin: .5rem 0 1rem; }

    .single-header img { margin: 0 0 1rem; max-width: 75px; width: 75px; max-height: 75px; }

.single-social .fa { font-size: 1.2rem; }

.single-social a.secondary-button { font-size: 1rem; padding: .5rem 1rem; margin: 1rem 0; background: #fff; transition: all .2s ease; }

    .single-social a.secondary-button:hover { -webkit-transform: translate3D(0, -1px, 0); transform: translate3D(0, -1px, 0); box-shadow: 0 5px 10px rgba(0, 0, 0, .05); }

@media(min-width:600px) {
    .single-social { margin-top: 1rem; }

        .single-social .fa { font-size: 1.5rem; }

        .single-social a.secondary-button { font-size: 1.1rem; margin: 0 0 .5rem; }
}

.excerpt { color: #5a5a5a; font-size: 1.2rem; }

@media(min-width:600px) {
    .excerpt { font-family: Nunito, sans-serif; color: #5a5a5a; font-size: 1.4rem; }

    .single-header { padding: 3rem 0; margin-bottom: 2rem; }

        .single-header img { max-width: 125px; width: 125px; max-height: 125px; }

    .bright-header p { font-size: 1.3rem; }
}

@media(min-width:1120px) {
    .single-header { padding: 3.5rem; }

        .single-header h1 { margin: 1rem 0; }

    .bright-header p { font-size: 1.5rem; }
}

.single-body { margin-bottom: 4rem; }

.grid { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; }


.table-condensed tr th { border: 0px solid #6e7bd9; color: white; background-color: #666; }

.table-condensed, .table-condensed tr td { border: 0px solid #000; }

tr:nth-child(even) { background: #f8f7ff }

tr:nth-child(odd) { background: #fff; }

.main-post h3, .main-post h3 a, .main-post h3 a:hover { text-align: center; color: #666; margin-top: 10px; }



.cell, .cell td { transition: all .2s ease; background: #fefefe; margin: .5rem; border: 0; border-radius: 6px; position: relative; padding: 1.25rem; box-shadow: 0 1px 2px rgba(0, 0, 0, .1); -webkit-box-flex: 1; -ms-flex: auto; flex: auto; }

    .cell:hover { -webkit-transform: translate3D(0, -1px, 0); transform: translate3D(0, -1px, 0); box-shadow: 0 15px 35px rgba(0, 0, 0, .1); }

    .cell .flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

    .cell p { color: #6d6e70; font-size: 1.05rem; margin-bottom: 0; }

    .cell h1 { text-align: center; margin-top: 0; width: 100%; font-size: 1.1rem; line-height: 1.3; font-weight: 700; }

        .cell h1 a { display: block; color: #222; }

    .cell .response { left: 1.5rem; }

    .cell .cell-share,
    .cell .response { display: none; font-size: .9rem; position: absolute; bottom: 1.5rem; }

    .cell .cell-share { right: 1.5rem; }

        .cell .cell-share a { line-height: 0; }

.image-thumbnail { display: block; margin: 0 auto 1rem; }

    .image-thumbnail img { display: block; margin: 0 auto; height: 50px; width: 50px; min-width: 50px; }

@media(min-width:600px) {
    .image-thumbnail img { margin: 0 auto 2rem; height: 100px; width: 100px; min-width: 100px; }

    .cell { padding: 2rem; }
}

@media(min-width:900px) {
    .cell, .cell td { display: block; padding: 2rem 2rem 5rem; margin: .75rem; -webkit-box-flex: 1; -ms-flex: 1 1 calc(33% - 1.5rem); flex: 1 1 calc(33% - 1.5rem); max-width: calc(33% - 1.5rem); }

        .cell .flex { margin-bottom: 1.5rem; }

        .cell h1 { font-size: 1.25rem; margin: 1.5rem 0 1rem; }

        .cell p { display: block; font-size: 1.1rem; }

        .cell .response { font-size: .85rem; left: 2rem; }

        .cell .cell-share,
        .cell .response { display: block; position: absolute; bottom: 2rem; }

        .cell .cell-share { font-size: .9rem; right: 2rem; }

            .cell .cell-share a { display: block; }

            .cell .cell-share .fa-twitter { color: #dedede; font-size: 1.5rem; }

                .cell .cell-share .fa-twitter:hover { color: #55acee; }
}


@media(min-width:600px) {
    .quick.quick-header { text-align: left; }
}

.create-page h2 { margin: 0 .5rem; padding: 3rem 0 1rem; font-weight: 700; font-size: 1.4rem; }

.topics { background: #f4f5f6; padding: 1rem 0; }

@media(min-width:600px) {
    .topics { padding: 1.5rem 0; }
}

.the-time { color: #8d8d8d; display: block; font-size: .9rem; font-weight: 400; margin-bottom: .5rem; min-width: 120px; }

@media(min-width:600px) {
    .the-time { font-size: .9rem; }
}

.avatar-delete { height: 50px; width: 50px; max-width: 50px; border-radius: 50%; vertical-align: middle; margin-right: .5rem; }

.quote-container { border-top: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0; }

blockquote { color: #8d8d8d; border-left: 8px solid #f4f5f6; font-weight: 400; margin: 2rem 0; padding-left: 1.5rem; font-size: 1.1rem; line-height: 1.4; }

    blockquote p { padding: 0; }

        blockquote p:last-of-type { margin-bottom: 0; }

    blockquote cite { display: block; margin-top: 1rem; font-size: 1rem; text-align: right; }

    blockquote.testimonial { padding-left: 0; border-left: 0; }

    blockquote.alert,
    blockquote.details,
    blockquote.info,
    blockquote.note,
    blockquote.success { font-size: 1.1rem; color: #222; padding: 1rem; border-radius: 6px; }

    blockquote.alert { background: #ffe9ed; border: 1px solid #fc5d76; }

    blockquote.info { background: #fff6d5; border: 1px solid #f0d461; }

    blockquote.success { background: #e8fcf2; border: 1px solid #5eeda3; }

    blockquote.note { background: #f4f5f6; border: 1px solid #f0f0f0; }

    blockquote.details { background: #e8f5fd; border: 1px solid #4cbbf9; }

@media(min-width:600px) {
    blockquote { font-size: 1.4rem; line-height: 1.5; }
}

.screen-reader-text { clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0); clip-path: polygon(0 0, 0 0, 0 0, 0 0); position: absolute !important; white-space: nowrap; height: 1px; width: 1px; overflow: hidden; }



@media(min-width:600px) {
    .contain-table { width: 100%; }
}

.lead { text-align: left; }

    .lead p { font-size: 1.4rem; line-height: 1.3; color: #6d6e70; }

@media(min-width:600px) {
    .lead p { font-size: 1.6rem; line-height: 1.4; }
}

.text-center { text-align: center; }

.text-right { text-align: right; }

.text-left { text-align: left; }


.search-results { padding: 1.5rem 0; border-bottom: 1px solid #f0f0f0; display: -webkit-box; display: -ms-flexbox; display: flex; }

    .search-results:first-of-type { padding-top: 0; }

    .search-results:last-of-type { border-bottom: 0; }

    .search-results h1 { margin-top: 0; margin-bottom: .75rem; font-size: 1.2rem; }

        .search-results h1 a { color: #222; }

    .search-results img { width: 50px; height: 50px; max-width: 50px; min-width: 50px; margin-right: 2rem; }

    .search-results p { margin-bottom: 0; color: #6d6e70; }

    .search-results .search-image { margin-top: 1.75rem; }

@media(min-width:600px) {
    .search-results { padding: 2.5rem 0; }

        .search-results img { width: 100px; height: 100px; max-width: 100px; min-width: 100px; margin-right: 3rem; }

}


.primary { color: #4cbbf9 !important; }

.secondary { color: #5eeda3 !important; }

::-moz-selection { background: rgba(255, 245, 20, .8); color: #111; }

::selection { background: rgba(255, 245, 20, .8); color: #111; }

.terminal,
code { font-size: 14px; }

.terminal { position: relative; padding: 1rem; border: 1px solid #d8d9da; box-shadow: 0 5px 15px rgba(0, 0, 0, .16); border-radius: 6px; padding-top: 45px; margin: 2rem 0; }

    .terminal:before { content: "\2022 \2022 \2022"; position: absolute; top: 0; left: 0; height: 25px; background: #e1e1e1; color: #c2c3c4; width: 100%; font-size: 2.5rem; margin: 0; line-height: 0; padding: 15px 0; text-indent: 4px; letter-spacing: -3px; }

pre .terminal { overflow: hidden; }



 


.bttn { flex: 1 1 auto; padding: 10px 20px; text-align: center; transition: 0.5s; background-size: 200% auto; color: white; /* text-shadow: 0px 0px 10px rgba(0,0,0,0.2); box-shadow: 0 0 20px #eee;*/ border-radius: 10px; font-weight: bold; }

    .bttn:hover { background-position: right center; cursor: pointer; }

.btn-1 { background-image: linear-gradient(to right, #f6d365 0%, #fda085 51%, #f6d365 100%); }

.btn-2 { background-image: linear-gradient(to right, #fbc2eb 0%, #a6c1ee 51%, #fbc2eb 100%); }
/*pembe-mor*/
.btn-3 { background-image: linear-gradient(to right, #84fab0 0%, #8fd3f4 51%, #84fab0 100%); }
/*yeşil-mavi*/
.btn-4 { background-image: linear-gradient(to right, #a1c4fd 0%, #c2e9fb 51%, #a1c4fd 100%); }
/*mavi-aqua*/
.btn-5 { background-image: linear-gradient(to right, #ffecd2 0%, #fcb69f 51%, #ffecd2 100%); }
/*krem-turuncu*/
.btn-6 { background-image: linear-gradient(to right, #84fab0 0%, #ffc7bd 51%, #84fab0 100%); }
/*yeşil-krem*/
.btn-7 { background-image: linear-gradient(to right, #3df4ae 0%, #ffb4b9 51%, #3df4ae 100%); }
/*yeşil-krem*/
.btn-8 { background-image: linear-gradient(to right, #7cee86 0%, #e2d985 51%, #7cee86 100%); }
/*fıstıkyeşil-krem*/


.buttie { display: inline-block; box-sizing: border-box; font-weight: 400; color: #FFFFFF; background-color: #5eeda3; box-shadow: inset 0 -0.6em 0 -0.35em rgba(0,0,0,0.17); position: relative; margin: 0px; padding: 5px; text-decoration: none !important; border: 0; border-radius: 16px; cursor: pointer; font-weight: 600; margin: 0; color: #fff; text-shadow: none; -webkit-appearance: none; }



    .buttie:hover { display: inline-block; background: #38d182; }



img { vertical-align: middle }

.img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img { display: inline-block; max-width: 100%; border: 1px solid #ddd; height: auto }

.img-rounded { border-radius: 20px }

.img-thumbnail { display: inline-block; max-width: 100%; height: auto; background-color: #fff; border: 1px solid #ddd; border-radius: 4px; -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out }




@keyframes blink-white {
    0% { color: #999; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    2% { color: white; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px white,0 0 1px white,0 0 6px white,0 0 2px white; }
    4% { color: #999; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    14% { color: #999; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    15% { color: white; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px white,0 0 1px white,0 0 6px white,0 0 2px white; }
    100% { color: white; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px white,0 0 1px white,0 0 6px white,0 0 2px white; }
}



@keyframes blink-green {
    0% { color: #e4e4e4; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    2% { color: #f4f4f4; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px #2BE79A,0 0 1px #2BE79A,0 0 6px #2BE79A,0 0 2px #2BE79A; }
    4% { color: #e4e4e4; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    14% { color: #e4e4e4; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    15% { color: #f4f4f4; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px #2BE79A,0 0 1px #2BE79A,0 0 6px #2BE79A,0 0 2px #2BE79A; }
    100% { color: #f4f4f4; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px #2BE79A,0 0 1px #2BE79A,0 0 6px #2BE79A,0 0 2px #2BE79A; }
}

@keyframes blink-ocean {
    0% { color: #2BE2A0; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    2% { color: #00ff90; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px #00ff90,0 0 1px #00ff90,0 0 6px #00ff90,0 0 2px #00ff90; }
    4% { color: #2BE2A0; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    14% { color: #2BE2A0; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    15% { color: #00ff90; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px #00ff90,0 0 1px #00ff90,0 0 6px #00ff90,0 0 2px #00ff90; }
    100% { color: #00ff90; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px #00ff90,0 0 1px #00ff90,0 0 6px #00ff90,0 0 2px #00ff90; }
}

@keyframes blink-purple {
    0% { color: #1AE4B2; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    2% { color: #BFA4CA; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px #BFA4CA,0 0 1px #BFA4CA,0 0 6px #BFA4CA,0 0 2px #BFA4CA; }
    4% { color: #1AE4B2; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    14% { color: #1AE4B2; text-shadow: 1px 1px 0 rgba(0,0,0,.2); }
    15% { color: #BFA4CA; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px #BFA4CA,0 0 1px #BFA4CA,0 0 6px #BFA4CA,0 0 2px #BFA4CA; }
    100% { color: #BFA4CA; text-shadow: 1px 1px 0 rgba(0,0,0,.2),0 0 1px #BFA4CA,0 0 1px #BFA4CA,0 0 6px #BFA4CA,0 0 2px #BFA4CA; }
}

@keyframes blink-blue {
    0% { color: #111; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    2% { color: #00ffea; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px #00ffea,0 0 32px #00ffea,0 0 64px #00ffea,0 0 128px #00ffea; }
    4% { color: #111; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    14% { color: #111; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    15% { color: #00ffea; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px #00ffea,0 0 32px #00ffea,0 0 64px #00ffea,0 0 128px #00ffea; }
    100% { color: #00ffea; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px #00ffea,0 0 32px #00ffea,0 0 64px #00ffea,0 0 128px #00ffea; }
}

@keyframes blink-red {
    0% { color: #111; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    2% { color: red; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px red,0 0 32px red,0 0 64px red,0 0 128px red; }
    4% { color: #111; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    14% { color: #111; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    15% { color: red; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px red,0 0 32px red,0 0 64px red,0 0 128px red; }
    100% { color: red; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px red,0 0 32px red,0 0 64px red,0 0 128px red; }
}

@keyframes blink-pink {
    0% { color: #111; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    2% { color: #ff35a1; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px red,0 0 32px #ff35a1,0 0 64px #ff35a1,0 0 128px #ff35a1; }
    4% { color: #111; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    14% { color: #111; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    15% { color: #ff35a1; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px red,0 0 32px #ff35a1,0 0 64px #ff35a1,0 0 128px #ff35a1; }
    100% { color: #ff35a1; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px red,0 0 32px #ff35a1,0 0 64px #ff35a1,0 0 128px #ff35a1; }
}

@keyframes blink-yellow {
    0% { color: #f4f4f4; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    2% { color: #ffd800; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px yellow,0 0 32px #ffd800,0 0 64px #ffd800,0 0 128px #ffd800; }
    4% { color: #f4f4f4; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    14% { color: #f4f4f4; text-shadow: 3px 3px 0 rgba(0,0,0,.2); }
    15% { color: #ffd800; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px yellow,0 0 32px #ffd800,0 0 64px #ffd800,0 0 128px #ffd800; }
    100% { color: #ffd800; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px yellow,0 0 32px #ffd800,0 0 64px #ffd800,0 0 128px #ffd800; }
}

.cyber-banner { color: #fff; padding: 4px 0; text-align: center; margin: 0 0 12px 0; display: inline-block; }
.cyber-banner__headline { margin: 0 0 4px 0; }

.cyber-banner.green { background-size: cover; font-weight: bold; font-size: 30px; }
    .cyber-banner.green .cyber-banner__headline { color: #2BE79A; }
        .cyber-banner.green .cyber-banner__headline em { font-style: normal; }
            .cyber-banner.green .cyber-banner__headline em:first-of-type { animation: blink-green 8s infinite; }
            .cyber-banner.green .cyber-banner__headline em:last-of-type { animation: blink-green 3s infinite; animation-delay: 2s; animation-direction: reverse; }
        .cyber-banner.green .cyber-banner__headline span { display: block; margin: 4px 0; }

.cyber-banner.ocean { background-size: cover; font-weight: bold; font-size: 30px; }
    .cyber-banner.ocean .cyber-banner__headline { color: #00ff90; }
        .cyber-banner.ocean .cyber-banner__headline em { font-style: normal; }
            .cyber-banner.ocean .cyber-banner__headline em:first-of-type { animation: blink-ocean 5s infinite; }
            .cyber-banner.ocean .cyber-banner__headline em:last-of-type { animation: blink-ocean 2s infinite; animation-delay: 2s; animation-direction: reverse; }
        .cyber-banner.ocean .cyber-banner__headline span { display: block; margin: 4px 0; }

.cyber-banner.purple { background-size: cover; font-weight: bold; font-size: 30px; }
    .cyber-banner.purple .cyber-banner__headline { color: #BFA4CA; }
        .cyber-banner.purple .cyber-banner__headline em { font-style: normal; }
            .cyber-banner.purple .cyber-banner__headline em:first-of-type { animation: blink-purple 8s infinite; }
            .cyber-banner.purple .cyber-banner__headline em:last-of-type { animation: blink-purple 3s infinite; animation-delay: 2s; animation-direction: reverse; }
        .cyber-banner.purple .cyber-banner__headline span { display: block; margin: 4px 0; }


.cyber-banner.red { background-size: cover; font-weight: bold; font-size: 30px; }
    .cyber-banner.red .cyber-banner__headline { color: #e2030b; }
        .cyber-banner.red .cyber-banner__headline em { font-style: normal; }
            .cyber-banner.red .cyber-banner__headline em:first-of-type { animation: blink-red 8s infinite; }
            .cyber-banner.red .cyber-banner__headline em:last-of-type { animation: blink-red 3s infinite; animation-delay: 2s; animation-direction: reverse; }
        .cyber-banner.red .cyber-banner__headline span { display: block; margin: 4px 0; }

.cyber-banner.pink { background-size: cover; font-weight: bold; font-size: 30px; }
    .cyber-banner.pink .cyber-banner__headline { color: #ff35a1; }
        .cyber-banner.pink .cyber-banner__headline em { font-style: normal; }
            .cyber-banner.pink .cyber-banner__headline em:first-of-type { animation: blink-pink 8s infinite; }
            .cyber-banner.pink .cyber-banner__headline em:last-of-type { animation: blink-pink 3s infinite; animation-delay: 2s; animation-direction: reverse; }
        .cyber-banner.pink .cyber-banner__headline span { display: block; margin: 4px 0; }

.cyber-banner.yellow { background-size: cover; font-weight: bold; font-size: 30px; }
    .cyber-banner.yellow .cyber-banner__headline { color: yellow; }
        .cyber-banner.yellow .cyber-banner__headline em { font-style: normal; }
            .cyber-banner.yellow .cyber-banner__headline em:first-of-type { animation: blink-yellow 5s infinite; }
            .cyber-banner.yellow .cyber-banner__headline em:last-of-type { animation: blink-yellow 2s infinite; animation-delay: 2s; animation-direction: reverse; }
        .cyber-banner.yellow .cyber-banner__headline span { display: block; margin: 4px 0; }

.cyber-banner.blue { background: url(https://image.spreadshirtmedia.com/content/f_auto,q_70/cms/header/promo/cyber_bg_blue) center center no-repeat #000; background-size: cover; }
    .cyber-banner.blue .cyber-banner__headline { font-family: "Open Sans Condensed Light",sans-serif; font-size: calc(64px + (106 - 64) * ((100vw - 480px)/ (1920 - 480))); line-height: 1; color: #00ffea; text-shadow: 3px 3px 0 rgba(0,0,0,.2),0 0 2px #00ffea,0 0 32px #00ffea,0 0 64px #00ffea,0 0 128px #00ffea; text-transform: uppercase; }
        .cyber-banner.blue .cyber-banner__headline em { font-style: normal; }
            .cyber-banner.blue .cyber-banner__headline em:first-of-type { animation: blink-blue 8s infinite; }
            .cyber-banner.blue .cyber-banner__headline em:last-of-type { animation: blink-blue 3s infinite; animation-delay: 2s; animation-direction: reverse; }
        .cyber-banner.blue .cyber-banner__headline span { font-size: .5em; display: block; margin: 4px 0; }

.cyber-banner--list .cyber-banner__headline { margin: 0 0 16px 0; }