html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input,button{margin:0;padding:0;}

li {list-style-type:none;}

body{ background-color: #480342; color: #ababab; font-family: 'PT Sans', sans-serif; font-size: 0; }
input, button { font-family: 'PT Sans', sans-serif; }

img { background-color:#ababab; border:0 none; }

a { color:rgb(255,255,255); text-decoration:none; }
a:hover{ color:#f4b5ef; }

h1 { color: rgb(238,238,238); font-size: 24px; line-height: 26px; margin: 2px 1px 0 1px; font-weight: normal; text-transform: uppercase; }
h2 { color: rgb(238,238,238); font-size: 26px; line-height: 28px; border-top: 1px solid #ababab; padding-top: 20px; margin: 30px 0 20px 0; font-weight: normal; text-transform: uppercase;  display: block; width: 100%; }
h3 { color: rgb(238,238,238); font-size: 16px; line-height: 28px; border-top: 1px solid #ababab; padding-top: 10px; margin: 30px 0 20px 0; font-weight: normal; display: block; width: 100%; }

.wrap { width: 100%; margin: 0 auto; text-align: center; }

.grid { width: 100%; padding-top: 20px; }

.grid-sizer, .grid-item { display: inline-block; vertical-align: top; width: 100%; }

.header { background-color: #42023d; width: 100%; }
.head { padding: 0 0 10px 0; overflow: hidden; text-align: center; margin: 0 auto; }

.logo a { color: rgb(255,255,255); display: inline-block; font-size: 26px; text-transform: uppercase; vertical-align: top; margin: 10px 5px 0 5px; height: 30px; line-height: 30px; }
.logo a span { color: #f4b5ef; }

.menu li { height: 20px; line-height: 20px; display: inline-block; vertical-align: top; margin: 10px 5px 0 5px; font-size: 14px; }
.menu li a { display: block; text-transform: uppercase; }
.menu li.active a, .menu li a:hover { color: #f4b5ef; }

.search { margin: 10px auto 0 auto; width: 94%; max-width: 500px; }
.search form { width: 100%; position: relative; }
.search input { font-size: 14px; background: none; border: 1px solid rgb(132,142,151); color: rgb(232,232,232);; height: 30px; line-height: 30px; width: 96%; padding: 0 2%; text-align: left; text-transform: uppercase; }
.search input:focus { border-color: #f4b5ef; outline: none; color: rgb(242,242,242); }
.search button { background: rgb(22,32,41); color: rgb(255,255,255); height: 24px; line-height: 24px; font-size: 12px; position: absolute; top: 3px; right: 1px; border-radius: 12px; width: 24px; border: 0 none; text-align: center; cursor: pointer; }
.search button:hover { background-color:#f4b5ef; color: rgb(255,255,255); }

.top-block { overflow: hidden; margin-top: 20px; }
.sort { overflow: hidden; margin: 0 1px; }
.sort li { display: inline-block; vertical-align: top; margin: 10px 5px 0 5px; font-size: 14px; }
.sort li span { display: none; } 
.sort li.active a { color: #f4b5ef; }

.thumb { background-color: #42023d; border: 1px solid #ababab; padding-bottom: 10px; overflow: hidden; margin: 2px 1px 0 1px; text-align: left; position: relative;  }
.thumb:hover { border-color: #f4b5ef; }
.thumb img { width: 100%; height: auto; }
.thumb .title { display: block; font-size: 14px; padding: 10px 10px 0 10px; text-transform: uppercase; }
.thumb .tags { padding: 10px 10px 0 10px; overflow: hidden; font-size: 13px; }
.thumb .tags a, .thumb .tags span { display: inline-block; vertical-align: top; }
.thumb .tags a i { color: #f4b5ef; font-size: 11px; }
.thumb .tags a:hover { text-decoration: underline; }
.thumb .total, .thumb .date { position: absolute; top: 0; background-color: rgba(22,32,41,0.8); height: 20px; line-height: 20px; font-size: 12px; color: rgb(232,232,232); padding: 0 5px; }
.thumb .total {left: 0; }
.thumb .date {right: 0; }

.thumb-cat { padding-bottom: 5px; }
.thumb-cat .title { padding-top: 5px; }

.thumb-gal { padding-bottom: 0; }
.thumb-gal a::after { display: none; content: ''; position: absolute; width: 100%; height: 100%; background-color: rgba(0,0,0,0.2); top: 0; left: 0; }
.thumb-gal a:hover::after { display: block; }
.thumb-gal .zoom { display: none; position: absolute; z-index: 1100; width: 30px; height: 30px; font-size: 30px; color: rgb(250,250,250); top: 50%; left: 50%; margin: -15px 0 0 -15px; }
.thumb-gal .zoom i { display: block; width: 30px; height: 30px; line-height: 30px; }
.thumb-gal a:hover .zoom { display: block; }

.spot-item { display: none; }
.spot { background-color: #000000; margin: 2px 1px 0 1px; border: 1px solid #000000; }
.spot-bn { width: 300px; height: 250px; }

.pages-block { margin: 30px 1px 0 1px; }
.next-page a { overflow: hidden; font-size: 30px; text-transform: uppercase; }

.pages { margin: 30px 1px 0 1px; border-top: 1px solid #ababab; padding-top: 10px; }
.pages li { display: inline-block; vertical-align: top; margin: 10px 5px 0 5px; }
.pages li a, .pages li span { border: 1px solid transparent; font-size: 14px; display: block; height: 30px; line-height: 30px; min-width: 10px; padding: 0 10px; border-radius: 15px; }
.pages li span { color: #f4b5ef; }
.pages li.active a, .pages li a:hover { background-color: rgb(33,42,51); color: rgb(255,255,255); border-color: #ababab; }

.thumb-t-wr { display: inline-block; vertical-align: top; width: 50%; }
.thumb-t { margin: 2px 1px 0 1px; position: relative; }
.thumb-t img { width: 100%; height: auto; }
.thumb-t span { background-color: rgba(0,0,0,0.7); display: block; position: absolute; height: 20px; line-height: 20px; overflow: hidden; text-align: center; width: 100%; left:0; bottom: 0; font-size: 12px; color: rgb(255,255,255); }
.thumb-t:hover span { background-color: rgba(0,0,0,0.9); }
.thumb-t:hover img { opacity: 0.9; }

.gallery-info { overflow: hidden; margin: 0 1px; }
.gallery-info li { font-size: 14px; display: inline-block; vertical-align: top; margin: 10px 5px 0 5px; }
.gallery-info span { color: rgb(255,255,255); }

.gallery-info .tags { font-size: 14px; margin: 10px 1px 0 1px;}
.gallery-info .tags a, .gallery-info .tags span { display: inline-block; vertical-align: top; }
.gallery-info .tags a i { color: #f4b5ef; font-size: 13px; }
.gallery-info .tags a:hover { text-decoration: underline; }


.line-spots { padding-top: 28px; }
.line-spot { background-color:#000000; border: 1px solid #000000; display: inline-block; vertical-align: top; width: 300px; height: 250px; margin: 2px 1px 0 1px; }
.line-spot-2, .line-spot-3, .line-spot-4, .line-spot-5 { display: none; }

.list { padding-top: 2px; }
.list ul { display: inline-block; vertical-align: top; width: 50%; }
.list li { height: 25px; line-height: 25px; padding: 0 1px; overflow: hidden; font-size: 14px; }
.list li a { border-bottom: 1px solid transparent; }
.list li a:hover { border-bottom-color: #ababab; }

.footer-wrap { margin-top: 30px; border-top: 1px solid #ababab; }
.footer { margin: 0 auto; padding: 10px 0 15px 0; text-align: center; }
.footer p { margin: 5px 1px 0 1px; font-size: 14px; }
.footer span { color: rgb(255,255,255); text-transform: uppercase; }
.footer a { text-decoration: underline; margin: 5px 5px 0 5px; }
.footer a:hover { text-decoration: none; }



@media all and (min-width:400px) {
    .sort li span { display: inline; } 
    .grid-sizer, .grid-item { width: 50%; }
}

@media all and (min-width:600px) {
    .grid-sizer, .grid-item, .thumb-t-wr { width: 33.3333%; }
}

@media all and (min-width:620px) {
    .line-spot-2 { display: inline-block; }
}

@media all and (min-width:800px) {
.thumb-t-wr { width: 25%; }
}

@media all and (min-width:932px) {
    h1, h2 { text-align: left; }
    h1 { font-size: 30px; }
    .head, .wrap, .footer { width: 912px; }
    .sort li { display: block; float: left; margin: 10px 10px 0 0; }
    .grid-sizer, .grid-item { width: 304px; }
    .head { padding: 10px 0; }
    .logo { display: block; float: left; margin: 0 0 0 1px; }
    .logo a { display: block; margin: 0; font-size: 28px; }
    .menu { float: left; overflow: hidden; margin: 0 0 0 40px; }
    .menu li { display: block; float: left; margin: 0 20px 0 0; line-height: 30px; height: 30px; font-size: 14px; }
    .search { float: right; width: 300px; margin: 0 2px 0 0; }
    .thumb .title { font-size: 16px; }
    .spot-item { display: block; }
    .pages li a, .pages li span {  font-size: 16px; height: 40px; line-height: 40px; min-width: 20px; border-radius: 20px; }
    .line-spot-3 { display: inline-block; }
    .gallery-info ul { overflow: hidden; float: left; }
    .gallery-info li { border-right: 1px solid #ababab; display: block; float: left; margin: 10px 10px 0 0; padding: 0 10px 0 0; }
    .gallery-info .tags { float: left; }
    .thumb-t-wr { width: 16.6666%; }
    .thumb-cat .title { font-size: 20px; }
}

@media all and (min-width:1236px) {
    .head, .wrap, .footer { width: 1216px; }
    .menu li { font-size: 18px; }
    .line-spot-4 { display: inline-block; }
    .thumb-t-wr { width: 12.5%; }
}

@media all and (min-width:1540px) {
    .head, .wrap, .footer { width: 1520px; }
    .menu li { margin: 0 30px 0 0; }
    .search { width: 400px; }
    .line-spot-5 { display: inline-block; }
}

@media all and (min-width:1844px) {
    .head, .wrap, .footer { width: 1824px; }
}



@media all and (min-width: 980px) {

.list ul { width: 16.6666%; }
.list li { padding: 0 10px 0 10px; font-size: 12px; }
.list ul:first-child li { padding: 0 10px 0 1px; }
.list ul:last-child li  { border-right: 0; padding: 0 1px 0 10px; }

}


@media all and (min-width: 1200px) {

.list li { font-size: 14px; }
.list li { padding: 0 20px 0 20px; }
.list ul:first-child li { padding: 0 20px 0 1px; }
.list ul:last-child li  { border-right: 0; padding: 0 1px 0 20px; }

}


@media all and (min-width: 1500px) {
.list li { padding: 0 40px 0 40px; }
.list ul:first-child li { padding: 0 40px 0 1px; }
.list ul:last-child li { padding: 0 1px 0 40px; }
}