@import url('https://fonts.googleapis.com/css?family=Open+Sans:200,300,400,500,600,700,800');
@import url('https://fonts.googleapis.com/css?family=Amatic+SC:400,700&subset=cyrillic');
* {font-family: 'Amatic SC', cursive; box-sizing: border-box; }
html, body { width: 100%; min-height: 100vh; background-color: #FFF; margin: 0; padding: 0; color:#333;}
a {text-decoration: none; color:#333;}
#mainWrap { width: 100%; min-height: 100vh; margin: 0; padding: 0; overflow: hidden;}
h1 { margin: 0; text-align: center; font-size: 333%; font-weight: 300; color: #333; }
.mainPageTitle {font-size: 333%; margin-bottom: 21px;}
.subPageTitle {font-size: 170%; font-weight: 700;}
.titleImg { display: block; width: 40%; min-width: 270px; margin: 0 auto; text-align: center; box-shadow: 4px 4px 10px 0 #333; border: solid 5px #CCCC99; }
#Social {width: auto; height: 51px; margin: 5px; padding: 0; opacity: 0.7; }
.socIcon { float: left; width: 35px; height: 35px; margin-right: 7px; border: solid 1px #FFF; border-radius: 7px; background-image: url(/tpl/img/social.png); }
#socVK { background-position: -148px -142px; }
#socTWIT { background-position: -81px -144px; }
#socINST { background-position: -148px -75px; }
#socFB { background-position: -80px -8px; }

#Header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 7px 14px 3px;
}
.subPages {
/*    background-color: rgba(21, 21, 21, 0.3); */
    background-color: #FFF;
}

.top-menu {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    max-width: 21%;
    margin: 0 auto;
    font-size: 21px;
    color: #333;
    text-align: center;
}
.top-menu a {
    display: inline;
    margin: 0 14px;
    font-size: 21px;
    color: #333;
    text-decoration: none;
    vertical-align: text-bottom;
}
.top-menu a:hover {
    text-decoration: underline;
}
.subTitle {
    font-size: 56%;
}
.clearBoth {
    clear: both;
}
#galleryWrap {
    width: 77%;
    margin: 21px auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

a.imageInList {
    display: block;
    margin: 7px;
    padding: 7px;
    background-color: rgba(255, 255, 255, 0.3);
}
a.imageInList:hover {
    background-color: rgba(255, 255, 255, 0.7);
}
.picInSinglePage {
    display: block;
    width: 700px;
    height: 600px;
}

.fullPageView {
    text-align: center;
}

@media screen and (max-width: 430px) {
#Header {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.top-menu {max-width: 100%; margin: 35px auto 7px;}
#Social {order: 1; margin: auto;}
.mainPageTitle, .subPageTitle { order: 2; font-size: 170%}
.top-menu {order: 3; margin: auto;}

#single-images {
  display: block;
}

#single-images {
    height: auto!important; 
}

}/* @media screen and (max-width: 1024px) END */

#single-images {
  display: flex;
  flex-flow: column wrap;
  align-content: center;
  padding: 0;
  width: 77%;
  margin: 40px auto;
  counter-reset: items;
}

a.galleryItem {
  display: block;
  position: relative;
  text-align: center;
  border-radius: 3px;
  background-color: rgba(10, 0, 0, .77);
  box-shadow: 3px 7px 7px rgba(0,0,0,0.75),

  border: 1px solid rgba(135, 135, 135, .56);
  color: #fff;
  margin: 7px;
  padding: 0;
  box-sizing: border-box;
  background-repeat: no-repeat;
}

a.galleryItem img {
    margin: 0 auto;
}


/* Re-order items into 3 rows */
a.galleryItem:nth-of-type(4n+1) { order: 1; }
a.galleryItem:nth-of-type(4n+2) { order: 2; }
a.galleryItem:nth-of-type(4n+3) { order: 3; }
a.galleryItem:nth-of-type(4n)   { order: 4; }

/* Force new columns */
.break {
  flex-basis: 1%;
  width: 0;
  margin: 0;
  content: "";
  padding: 0;
  background: none;

}