@font-face {
 font-family: Gilroy; /* Гарнитура шрифта */
 src: url(../../Gilroy.ttf); /* Путь к файлу со шрифтом */
}
@font-face {
 font-family: fontelo; /* Гарнитура шрифта */
 src: url(../../fontello.ttf); /* Путь к файлу со шрифтом */
}
*
{
  padding: 0;
  margin: 0;
  outline: none;
  text-decoration: none;
  font-family: 'Gilroy';
}
a {
  color: black;

}
img {
  max-width: 90%;
}
body {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  min-width: 0;
  overflow: hidden;
}
main {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 10%;
  min-width: 0;
}
.loading {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: white;
  z-index: 9999999999999999;

  display: flex;
  justify-content: center;
  align-items: center;
}

.loadingTxt {
  text-align: center;
  font-size: 1.5em;
}
.loadingImg {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px;
}
.loadingImg i {
  font-size: 3em;
}
.galHead {
  display: flex;
  justify-content: center;
  font-size: 2.5em;
  font-weight: 400;
  margin-top: calc(5vh + (10vh -1.5em) / 2);
  width: 100%;
  text-align: center;
}
.galDisc {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  font-size: 1.2em;
  margin: 1.5vh 20% 5vh;
  text-align: justify;
  width: 100%;
}

.slider {
  min-width: 0;
}
.textSlider {
  min-width: 0;
  width: 100%;
}

.paintWrap {
  display: flex;
  position: relative;
  justify-content: center;
  flex-wrap: wrap;
}
.slider .paintWrap img {
  cursor: zoom-in;
}
.imgDisc {
  width: 100%;
  margin-top: 1.5vh !important;
}
.paintZoom {
    background-position: 50% 50%;
    background-size: 100%;
    position: absolute;
    width: 150%;
    height: 100%;
    cursor: zoom-out;
}
.paintZoomHide {
  background-image: none !important;
  cursor: zoom-in !important;
}
.paintName {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5em;
    font-weight: 600;
    margin-bottom: 1vh;
}
.paintDisc {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1vh;

    color: #777777;
}
.paintPrice {
    display: flex;
    justify-content: center;
    align-items: center;
}

.paintIsBuy .paintPrice{
  display: none;
}
#fullScreenSliderWrapper {
  display: flex;
  visibility: hidden;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: white;
  z-index: 9999999999;
}
.fullScreenSlider {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 80%;
  min-width: 0;
}
#close {
  position: absolute;
  right: 20px;
  top: 20px;
  cursor: pointer;
}

#bye {
  font-size: 1.3em;
  transition: .3s;
  padding: 1.5vh 2vw;
  margin: 2vh 0 5vh;
  cursor: pointer;
}
.byeActive {
  border: 2px solid black;
}
.byeActive:hover {
  background-color: rgb(30, 30, 30);
  color: white;
  border: 2px solid rgb(30, 30, 30);
}
.byeInactive {
  color: white !important;
  background-color: #CCCCCC !important;
  border: 2px solid #AAAAAA !important;
}
.byeInactive:hover {
    color: white !important;
    background-color: #CCCCCC !important;
    border: 2px solid #AAAAAA !important;
    cursor: not-allowed;
}

#ilikeBlock {
  display: flex;
  visibility: hidden;
  justify-content: center;
  align-items: center;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: rgba(30, 30, 30, 0.5);
  z-index: 9999999999;
}
#ilikeWindow {
  display: flex;
  position: relative;
  width: 80vw;
  height: 80vh;
  padding: 5vh 0;
  background-color: white;
  overflow-y: auto;
}
#ilikeBtn {
  font-size: 1.3em;
  transition: background-color .3s;
  padding: 1.5vh 2vw;
  margin-top: 2vh;
  cursor: pointer;
  border: 2px solid black;
}
#ilikeBtn:hover {
  background-color: rgb(30, 30, 30);
  color: white;
  border: 2px solid rgb(30, 30, 30);
}
#ilikeBlock .header1 {
  margin: 0 !important;
}
#contBlock {
  display: none;
  overflow: hidden;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0 30%;
}
#contFormWrap {
  display: flex;
  flex-wrap: wrap;
}
#contFormHeader {
  display: flex;
  justify-content: center;
  font-size: 2em;
  width: 100%;
  margin: 3vh 0;
}
.contForm {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
}
.contForm input, .contForm textarea {
  width: 100%;
  font-size: 1.3em;
  margin: 1vh 0;
  padding: 10px;
}
.contForm textarea {
  resize: none;
}
#contChoosePaint {
  width: 100%;
  font-size: 1.3em;
  margin: 1vh 0;
  padding: 10px;
  border: 1px solid gray;
}
#contChoosePaint label {
  width: 100%;
}
#contChoosePaint select {
  font-size: 1em;
  width: 100%;
  padding: 10px 0;
  border: 0;
}
#inpMsg {
  min-height: 20vh;
}

#inpSubmit {
  background-color: white;
  font-size: 1.3em;
  border: 2px solid black;
  padding: 1.5vh 3.75vw;
  margin: 2vh 0;
  transition: .3s;
  cursor: pointer;
}
#inpSubmit:hover {
  background-color: rgb(30, 30, 30);
  color: white;
}
#buyBlock {
  width: 100%;
  height: 100%;
  margin: 0 5vw;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
#buyWrap {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;

  width: 100%;
}
#buyWrap>div {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: nowrap;

  width: 50%;
  margin-top: 2vh;
}

.buyVar {
  text-align: center;
  max-width: 33%;
}
.buyVar img {
  max-height: 10vw;
}
.buyName {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2em;
  margin-bottom: 1vh;
}
.buyDisc {
  text-align: center;
  font-size: .9em;
  color: #888888;
  margin: 0 10%;
}

@media screen and (max-width: 600px) {
  .galDisc {
    margin: 1.5vh 0 5vh;
  }
}
@media screen and (max-width: 1300px) {
  #buyWrap>div {
    width: 100%;
  }
}