/*
 * http://galeriq.z7z.eu
 */

@font-face { font-family: "Asstb";
             src: url("../../view/fonts/Asstb/ASSTB.eot"); /* IE9 Compat Modes */
             src: url("../../view/fonts/Asstb/ASSTB.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
                 url("../../view/fonts/Asstb/ASSTB.otf") format("opentype"), /* Open Type Font */
                 url("../../view/fonts/Asstb/ASSTB.svg") format("svg"), /* Legacy iOS */
                 url("../../view/fonts/Asstb/ASSTB.ttf") format("truetype"), /* Safari, Android, iOS */
                 url("../../view/fonts/Asstb/ASSTB.woff") format("woff"), /* Modern Browsers */
                 url("../../view/fonts/Asstb/ASSTB.woff2") format("woff2"); /* Modern Browsers */
             font-style: normal;
}

@font-face { font-family: "Cambria";
             src: url("../../view/fonts/Cambria/cambria.eot"); /* IE9 Compat Modes */
             src: url("../../view/fonts/Cambria/cambria.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
                 url("../../view/fonts/Cambria/cambria.otf") format("opentype"), /* Open Type Font */
                 url("../../view/fonts/Cambria/cambria.svg") format("svg"), /* Legacy iOS */
                 url("../../view/fonts/Cambria/cambria.ttf") format("truetype"), /* Safari, Android, iOS */
                 url("../../view/fonts/Cambria/cambria.woff") format("woff"), /* Modern Browsers */
                 url("../../view/fonts/Cambria/cambria.woff2") format("woff2"); /* Modern Browsers */
             font-style: normal;
}

@font-face {  font-family: 'Wooden';
              src: url('../../view/fonts/Wooden/Wooden.eot');
              src: url('../../view/fonts/Wooden/Wooden.eot') format('embedded-opentype'),
                  url('../../view/fonts/Wooden/Wooden.woff2') format('woff2'),
                  url('../../view/fonts/Wooden/Wooden.woff') format('woff'),
                  url('../../view/fonts/Wooden/Wooden.ttf') format('truetype'),
                  url('../../view/fonts/Wooden/Wooden.svg#Wooden') format('svg');
}

@font-face { font-family: 'Adventure';
             src: url('../../view/fonts/Adventure/Adventure.eot');
             src: url('../../view/fonts/Adventure/Adventure.eot?#iefix') format('embedded-opentype'),
                 url('../../view/fonts/Adventure/Adventure.woff2') format('woff2'),
                 url('../../view/fonts/Adventure/Adventure.woff') format('woff'),
                 url('../../view/fonts/Adventure/Adventure.ttf') format('truetype'),
                 url('../../view/fonts/Adventure/Adventure.svg#Adventure') format('svg');
             font-weight: normal;
             font-style: normal;
}


body { color: #000;
       font-family: Cambria;
       font-size: 18px;
       background-image: url(../pic/galeriq_bg.jpg);
       background-size: cover;
       background-position: top left;
       background-attachment: fixed;
       background-repeat: no-repeat;
       background-color: #cecece; }

a { text-decoration: none;
    color: #000;
    font-weight: bold; }

hr { background-image: url(../pic/lenta_.png);
     background-repeat: repeat-x;
     background-position: top center;
     background-size: contain;
     height: 20px;
     border: none; }

input, textarea{ background-color: #eaccae;
                 border: solid 1px #000; }

header { position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         background-image: url(../pic/top_left.png), url(../pic/top_right.png), url(../pic/bottom_right.png), url(../pic/bottom_left.png), url(../pic/mramor.jpg);
         background-position: top left, top right, bottom right, bottom left, top left;
         background-size: auto, auto, auto, auto, cover;
         background-repeat: no-repeat;
         border-bottom: #000 solid 1px;
         box-shadow: 5px 5px 11px #000;
         z-index: 5; }

#header_ { position: relative;
           width: 1024px;
           background-image: url(../pic/foto.png), url(../pic/foto_.png);
           background-attachment: scroll, scroll;
           background-position: 0 -11px, 715px 0;
           background-size: 150px, auto 131px;
           background-repeat: no-repeat, no-repeat;
           margin: 0 auto;
           text-align: center;
           height: 146px; }

#header_ a { color: #000;
             font-weight: bold;
             cursor: pointer;
             font-size: 22px; }

#title { color: #704848;
         font-family: Asstb;
         font-size: 45px; }

#small_menu { position: relative;
              width: 1024px;
              margin: 0 auto;
              height: 30px;
              font-size: 18px;
              font-weight: bold; }

#small_menu a { font-size: 18px;
                font-weight: bold; }

#small_menu a:hover, #dolu a:hover { text-decoration: underline; }

.titla { font-family: Wooden;
         color: #fff;
         text-shadow: 6px 6px 8px #000, -6px -6px 8px #000;
         font-size: 50px;;
         font-weight: bolder; }

#content { position: relative;
           width: 1024px;
           margin: 140px auto 0 auto; }

#content:after { content: '';
                 display: block;
                 clear: both; }

/* Лява част */
#left { position: relative;
        width: 823px;
        margin-left: -10px;
        padding: 10px 0 0 10px;
        ; }

#plakat { position: relative;
          background-color: rgba(226, 186, 146, 0.91);
          border: solid 1px #000;
          box-shadow: 5px 5px 11px #000;
          padding: 5px;
          width: 823px; }

#plakat:after { content: '';
                display: block;
                clear: both; }

.tema { font-size: 18px;
        font-weight: bold;
        color: #7c0000; }

.zagl { font-size: 16px;
        font-weight: bold;
        color: #7c0000;  }

.kontejner_za_snimki { text-align: center; }

.ramka b { position: relative;
           display: inline-block;
           width: 226px;
           background-color: #fff;
           text-align: center;
           padding: 8px;
           margin: 8px;
           font-family: Adventure;
           color: #0066cc;
           cursor: pointer; }

.ramka b:after { content: attr(data-title); }

.ramka img { display: block;
             margin-bottom: 12px;
             max-width: 100%;
             height: auto;
             /*filter: sepia(50%);*/
             ; }

.ramka b:before:after { box-sizing: border-box; }

.ramka b { transform: rotate(-2deg); }

.ramka:nth-child(even) b { transform: rotate(2deg); }

.ramka:nth-child(4n) b { transform: none; }

.ramka:nth-child(5n) b { transform: rotate(5deg);
                         position: relative;
                         top: -15px;
                         right: 15px; }

.ramka:nth-child(8n) b { position: relative;
                         top: 18px;
                         right: 15px; }

.ramka:nth-child(4n) b { position: relative;
                         top: 13px;
                         right: -15px; }

.ramka b:hover { transform: scale(1.25);
                 position: relative;
                 z-index: 10; }

.ramka b { transition: all .15s linear;
           box-shadow: 0 3px 6px #000; }

.close { cursor: pointer;
         float: right;
         background-color: #ff0000;
         color: #fff;
         border: #fff solid 1px;
         padding: 0 3px 3px 3px;
         margin-bottom: 2px;
         font-size: 15px; }

.close:hover { background-color: #fff;
               color: #ff0000;
               border: #ff0000 solid 1px; }

.close:active {  background-color: #ff0000;
                 color: #fff;
                 border: #fff solid 1px; }

.big_pic { width: 100%;
           height: 100%;
           cursor: zoom-in; }

#nadpis { position: relative;
          text-align: center;
          font-family: Asstb;
          font-size: 40px;
          color: #7c0000;
          text-shadow: 2px 2px 4px #fff, -2px -2px 4px #fff; }

/*******************ГАЛЕРИЯ*********************/
.galerii { position: relative;
           display: inline-block;
           width: 270px;
           height: 270px;
           background-image: url(../pic/papka.png);
           background-position: center;
           background-size: contain;
           background-repeat: no-repeat;
           text-align: center;
           font-family: Adventure;
           font-size: 30px;
           font-weight: bolder ;
           color: #7c0000;
           cursor: pointer;
           z-index: 1; }

.galerii:before { position: absolute;
                  display: table-cell;
                  vertical-align: middle;
                  top: 0;
                  left: 0;
                  content: '';
                  background-image: url(../pic/papka_.png);
                  background-position: center;
                  background-size: contain;
                  background-repeat: no-repeat;
                  width: 270px;
                  height: 270px;
                  z-index: 1; }

.galerii:after { position: absolute;
                 top: 80px;
                 left: 10px;
                 content: attr(data-kat);
                 z-index: 1; }

.galerii img { display: block;
               border: #fff solid 8px;
               margin: 50px auto auto 23px;
               width: 210px;
               transition: .15s;
               height: auto;
               box-shadow: 1px 1px 2px #000, -1px -1px 2px #000;
               transform: rotate(-4deg);
               z-index: 0; }

.galerii:hover img { transform: none;
                     margin-top: -30px; }

/**********************ТЕМА**********************/

.temite { position: relative;
          display: inline-block;
          width: 235px;
          min-height: 180px;
          background-color: #fff;
          border: #000 solid 1px;
          text-align: center;
          padding: 32px 8px 8px 8px;
          margin: 8px;
          font-family: Adventure;
          font-size: 22px;
          color: #0066cc;
          cursor: pointer;
          box-shadow: 1px 1px 2px #000;
          z-index: 1; }

.temite:before { position: absolute;
                 content: '';
                 border: #000 solid 1px;
                 background-color: #fff;
                 top: -5px;
                 right: -5px;
                 bottom: 5px;
                 left: 5px;
                 transition: .15s;
                 box-shadow: 1px 1px 2px #000;
                 z-index: -1; }

.temite:after { position: absolute;
                content: attr(data-kat);
                border: #000 solid 1px;
                background-color: #fff;
                top: -10px;
                right: -10px;
                bottom: 10px;
                left: 10px;
                transition: .15s;
                box-shadow: 1px 1px 2px #000;
                z-index: -1; }

.temite img { display: block;
              margin: -10px -10px 10px 10px;
              max-width: 100%;
              transition: .15s;
              height: auto;
              z-index: 3; }

.temite:hover { transform: rotate(-2deg);
                z-index: 2; }

.temite:hover.temite:before { top: -10px;
                              right: -10px;
                              bottom: 10px;
                              left: 10px;
                              box-shadow: 3px 3px 6px #000;
                              transform: rotate(2deg);
                              z-index: -2 }

.temite:hover.temite:after { top: -20px;
                             right: -20px;
                             bottom: 20px;
                             left: 20px;
                             box-shadow: 3px 3px 6px #000;
                             transform: rotate(-2deg);
                             z-index: -2;  }

.temite:hover.temite img { margin: -20px -20px 20px 20px;
                           transform: rotate(-2deg);
                           z-index: 3; }
/****************************************/


/*.vreme, .komentara { color: #777; }**************************************
***************************************/

/* Дясна част */
#right { position: relative;
         float: right;
         width: 192px; }

#vhod, #logged { position: relative;
                 background-color: rgba(226, 186, 146, 0.91);
                 border: solid 1px #000;
                 box-shadow: 5px 5px 11px #000;
                 width: 170px;
                 padding: 0 10px 10px 10px;
                 margin-top: 10px; }

#logged, #rand { text-align: center; }

#logged, #nav, #vhod { transition: transform .15s linear; }

#logged:hover, #nav:hover, #vhod:hover { position: relative;
                                         transform: scale(1.11);
                                         z-index: 10; }

#logged img { width: 150px;
              margin: 10px 0; }

.e, .p { width: 161px; }

.e{ margin-top: 10px; }

.p { margin-top: 3px; }

input.c { width: 110px;
          vertical-align: top;
          margin-top: -4px; }

#refresh { height: 44px;
           cursor: pointer;
           margin-top: -4px;
           transform: rotate(0deg);
           transition: .3s; }

#refresh:hover { transform: rotate(180deg);
                 transition: .3s; }

#refresh:active {transform: rotate(90deg);
                 transition: .15s;}

.buton { border: #704848 solid 1px;
         padding: 0 10px;
         background-color: #eaccae;
         height: 20px;
         font-size: 15px;
         cursor: pointer; }

.buton:hover { color: #fff;
               background-color: #7c0000; }

.vhod { float: right;
        margin: -26px 8px 0 0; }

#nav, #rand { position: relative;
              background-color: rgba(226, 186, 146, 0.91);
              border: solid 1px #000;
              box-shadow: 5px 5px 11px #000;
              width: 190px;
              margin-top: 10px;}

#nav { padding: 0 0 10px 5px;
       width: 185px; }

#nav a:not(.gal) { display: block;
                   background-image: url(../pic/sc.png);
                   background-position: top left;
                   background-repeat: no-repeat;
                   padding-left: 20px;
                   cursor: pointer; }

.gal { display: block; }

#nav a:not(.gal):hover { background-image: url(../pic/scw.png); }

#nav a:hover { background-color: #7c0000;
               color: #fff; }


.rand_kat { position: relative;
            display: block;
            width: 175px;
            left: 0;
            padding: 5px;
            font-family: Adventure;
            color: #000;
            font-size: 22px;
            background-color: #fff;
            margin: 10px 2px;
            border: #000 solid 1px;
            box-shadow: 0 2px 4px #000;
            transition: left .2s; }

.rand_kat:hover { color: #444;
                  left: 10px; }

.rand_kat:first-child { margin-top: 2px }

.rand_kat:last-child { margin-bottom: 2px }

.rand_kat:after { content: attr(data-kat); }

.rand_kat img { display: block;
                margin-bottom: 12px;
                max-width: 100%;
                height: auto;
                filter: sepia(100%);
                transition: filter .5s; }

.rand_kat:hover img { filter: none; }


/****************************************/

/****************Панел*****************/

.important, .important_ { display: block;
                          color: #fff;
                          font-weight: bolder;
                          background-color: #f00;
                          padding: 5px;
                          margin: 5px; }

.important_ { cursor: pointer; }

.redaktirane { cursor: pointer; }

.iztrij_img, .iztrij_gal, .iztrij_tem { background-color: red;
                                        font-weight: bolder;
                                        font-size: 25px;
                                        color: #fff;
                                        cursor: pointer;
                                        text-align: center;
                                        border: #f00 solid 3px; }

.iztrij_img:hover, .iztrij_gal:hover, .iztrij_tem:hover { background: #fff;
                                                          color: red; }

/****************************************/

/***************Профил***************/



/****************************************/







#dolu { position: relative;
        background-image: url(../pic/top_left.png), url(../pic/top_right.png), url(../pic/bottom_right.png), url(../pic/bottom_left.png), url(../pic/mramor.jpg);
        background-position: bottom right, top left, top right, bottom left, center;
        background-size: auto, auto, auto, auto, cover;
        background-repeat: no-repeat;
        padding: 20px 0;
        border: #000 solid 1px;
        box-shadow: 5px 5px 11px #000;
        width: 1024px;
        text-align: center;
        margin: -1px auto; }

#back_to_top { display: none;
               position: fixed;
               bottom: 2px;
               right: 2px;
               background-color: #cecece;
               border: #444 solid 2px;
               font-size: 24px;
               font-weight: bold;
               color: #444;
               cursor: pointer;
               z-index: 10000; }

.edit { background-image: url(../pic/edit.png); }

.cut_post { cursor: pointer;
            border: #777 solid 1px;
            padding: 10px;
            margin: 5px;
            min-height: 100px; }

.cut_post:hover { border: #444 solid 1px;
                  background-color: #cecece; }

.cut_post img { float: right;
                height: 100px;
                border: #777 solid 1px; }

.komentar { padding: 10px;
            border: #444 solid 1px;
            background-color: #cecece; }

.help { position: absolute;
        display: block;
        width: 100px;
        height: 25px;
        background-color: #cecece;
        border: #444 solid 1px;
        z-index: 100000; }

#komentar input, #komentar textarea { width: 400px; }

#komentar textarea { height: 80px; }

#komentar table tr td:first-child { text-align: right;
                                    vertical-align: top; }

#komentar table tr td:last-child { color: red;
                                   text-align: left;
                                   vertical-align: top; }

#open_comment { font-weight: bold;
                cursor: pointer; }

#open_comment:hover { color: #704848; }

#comment_form { display: none; }

#comment_form button { cursor: not-allowed; }





#validator { position: fixed;
             bottom: -5px;
             left: 0;
             z-index: 100000; }

.djam { width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        opacity: 0;
        top: 0;
        cursor: pointer;
        background-color: #000;
        z-index: 1000; }

.djam, .djam1 { position: fixed; }

.djam1 { z-index: 10000; }

.djam1 { padding: 10px;
         width: auto;
         height: auto;
         border-style: solid;
         border-width: 3px;
         box-shadow: 10px 10px 10px #000;
         border-radius: 5px;
         background: #fff;
         overflow-x: no-display;
         overflow-y: auto; }

.hiks, .djam { cursor: pointer; }

.hiks { text-decoration: underline; }

.sthoverbuttons-label { display: none; }

.edit { position: relative;
        width: 30px;
        height: 30px;
        background-size: cover;
        cursor: pointer;
        float: left; }

.key { float: right;
       cursor: pointer;
       height: 30px; }

/************************************ЧАКАЩ ИНДИКАТОР***************************************/
.wait, .wait_ { position: absolute;
                z-index: 100000000; }

.wait_ { top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         background-color: #fff;
         opacity: 0.5; }

.wait { width: 130px; }
/****************************************************************************************************/
