@font-face {
  src:url('/fonts/MyriadPro-Regular.ttf');
  font-family:MyriadPro;
}

* {margin:0; padding:0;}
body, html {height:100%; min-width:320px; font-family: 'MyriadPro', sans-serif; font-size:17px; color:#000; text-align:center;}

td, input, textarea, button {font-family: 'MyriadPro', sans-serif; font-size:17px; color:#000;}
:focus {outline:none; text-decoration:none;}

a {color:#e4161c; text-decoration:underline;}
a:hover, a:focus {text-decoration:none;}

p {margin:15px 0 0 0;}
ul {margin:15px 0;}
li {margin:0 20px; list-style:inside;}
img {width:auto; height:auto; max-width:100%; border:none;}

table {border-collapse:collapse; margin:10px auto;}
td {border:1px solid silver; padding:2px;}

.clr {clear:both;}

#advantWrapp .innerWidth, #menu, #servicesWrapp, #docsWrapp, .projWrapp, .pager, #dopImgWrapp, #catsWrapp, #catsWrapp2, #pdfWrapp {font-size:0;}
#menu li a:hover, #menu li a, #mosaicWrapp a:hover,#mosaicWrapp a:before, .projWrapp a, .projWrapp a:hover, .dopImg a:hover, .dopImg a, .artName a, .artName a:hover, #floatForm input, #floatForm input:focus, .cIcon span:hover, .cIcon span {-webkit-transition: all 400ms linear; -moz-transition: all 400ms linear; -ms-transition: all 400ms linear; -o-transition: all 400ms linear; transition: all 400ms linear;}

@media screen and (min-width:320px), screen and (max-width:320px) {

  .innerWidth {width:100%; min-width:320px;}
  #headPhones {color:#000; font-size:13px; border-bottom:1px solid #e6e6e6;}
  #headPhones a {color:#000; display:inline-block; background:url('/images/icon-phone.svg') no-repeat 0 40%; padding:10px 10px 10px 20px; text-decoration:none;}

/*  menu  */
  #menuWrapp {height:100px; -webkit-box-shadow: 0 5px 5px 0 rgba(0,0,0,0.25); box-shadow: 0 5px 5px 0 rgba(0,0,0,0.25);}
  #menuWrapp .innerWidth {position:relative; height:100%;}
  .floatMenu {position:fixed; width:100%; background:#fff; top:0; left:0; z-index:100;}
  #moButton, #moButton2 {height:43px; line-height:43px; background:#e4161c; color:#fff; padding:0 15px !important; cursor:pointer; -webkit-border-radius:5px; border-radius:5px; display:none !important; text-transform:uppercase;}
  #logo {width:136px; height:100%; background:url('/images/logo.svg') no-repeat center; position:absolute; top:0; left:40px;}
  #menuOpen {display:inline-block; position:absolute; right:0; top:0; width:130px; height:100px; background:url('/images/icon-menu.svg') no-repeat center; cursor:pointer;}
  #menu {position:absolute; top:100px; left:0; z-index:100; width:100%; margin:0; height:auto; padding:0; background:#d9d9d9; display:none;}
  #menu li {list-style:none; margin:0; padding:0; text-align:left; text-transform:uppercase; font-size:18px;}
  #menu li a {display:block; color:#000; padding:6px 10px; text-decoration:none;}
  #menu li a:hover, .menuSubActive {color:#e4161c !important; text-decoration:underline !important;}
  .menuActive {color:#e4161c !important;}
  #menu li ul {display:none;}
  #menu li ul li {text-transform:none; display:block;}
  #menu li ul li a {background:url('/images/icon-marker1.svg') no-repeat 20px 50%; padding:6px 10px 6px 40px;}

  #indexBG {height:460px; background:url('/images/top-bg.jpg') no-repeat center #5f666a; background-size:cover; background-attachment:fixed;}
  #indexBG .innerWidth {position:relative; height:100%;}
  #hdrtxt {width:90%; position:absolute; top:50%; left:50%; -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); color:#fff;}
  .ht1 {font-size:40px; font-weight:bold; margin:0;}
  .ht2 {font-size:22px; margin:0;}
  #hdrtxt button, #form1Wrapp button, #frm3 button, .galMore a, #adressBlock button {font-size:17px; background:#da251c; border:none; height:60px; line-height:60px; padding:0 50px; color:#fff; text-transform:uppercase; cursor:pointer; margin:15px 0 0 0; -webkit-border-radius:5px; border-radius:5px;}

  .blName {font-size:50px; font-weight:bold;}
  .advItem {font-size:17px; margin:10px;}
  .advName {font-size:20px; font-weight:bold; margin:0 0 10px 0;}
  .advTxt {color:#666;}
  .advName span {display:block; width:125px; height:125px; border-radius:50%; -webkit-border-radius:50%; margin:0 auto 20px auto;}
  #adv1 {background:url('/images/icon-adv1.svg') center no-repeat #da251c;}
  #adv2 {background:url('/images/icon-adv2.svg') center no-repeat #da251c;}
  #adv3 {background:url('/images/icon-adv3.svg') center no-repeat #da251c;}

  #form1Wrapp {font-size:19px; overflow:hidden;}
  #form1Wrapp p {margin:0;}
  .blName2 {font-size:40px; font-weight:bold; margin:20px 0 10px 0 !important;}
  .blText2 {text-shadow:1px 1px 2px #1a1a1a;}
  #form1Wrapp button {margin-bottom:20px;}

  #servicesWrapp {text-align:left;}
  .servWrapp, .servItem {overflow:hidden;} .servWrapp {position:relative;}
  #servicesWrapp .blName {padding:0 10px; margin:20px 0 10px 0; font-size:30px; text-align:center;}
  .servItem {width:100%; height:0; padding-bottom:56.3333333333%; background-repeat:no-repeat; background-size:cover; text-align:center;}
  .servItem a {display:block; width:100%; height:100%; position:absolute; top:0; left:0; z-index:3;}
  .servItem div {position:absolute; width:100%; background:rgba(0,0,0,0.7); bottom:0; left:0; min-height:43px !important;}
  .servItem div h3 {color:#fff; margin:0; padding:10px; font-size:18px; font-weight:normal; width:calc(100% - 20px);}
  .servItemHover h3 {position:absolute; left:50%; top:50%; -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%);}
  #frm3 {text-align:center; margin:10px auto 20px auto;}

  #docsWrapp {background:#f2f2f2; overflow:hidden; margin:20px 0;}
  .docs {text-align:center; margin:20px 0;}
  .docs a {display:block; margin:10px auto;}
  .stretch {width:100%; height:0; display:inline-block;}

/* mosaic gallery  */
  #galleryWrapp {margin:20px 0;}
  #galleryWrapp .innerWidth {overflow:hidden;}
  #galleryWrapp .blName {font-size:40px;}
  #mosaicWrapp {}
  #mosaicWrapp a {display:block; width:100%; height:0; padding-bottom:70%; margin:10px 0; background-repeat:no-repeat; background-size:cover; background-position:center; position:relative;}
  #mosaicWrapp a:before {display:block; content:""; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(0,0,0,0.2); opacity:0;}
  #mosaicWrapp a:hover:before {opacity:1;}
  .galMore {margin:10px 0;}
  .galMore a {display:inline-block; text-decoration:none;}

  .txt {text-align:justify; margin:10px; color:#666;}
  .pgName {font-size:40px; color:#000; margin:20px 0; padding:0; text-align:center;}
  .navLine {margin:-10px 0 10px 0; color:#666; font-size:15px;}
  .navLine a {color:#000; background:url('/images/icon-nav.svg') no-repeat 100% 45%; display:inline-block; padding:0 10px 0 0;}

  #mapWrapp {height:600px; position:relative;}
  #mapWrapp .innerWidth {position:absolute; height:100%; left:50%; top:0; -moz-transform: translateX(-50%); -webkit-transform: translateX(-50%); -o-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%);}
  #adressBlockWrapp {width:280px; background:#fff; -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.4); box-shadow: 0 0 10px 0 rgba(0,0,0,0.4); margin:30px auto 10px auto;}
  #adressBlock {padding:10px;}
  #adressBlock p {margin:0 0 10px 0;}
  .adrName {color:#e4161c; font-size:30px;}

  #footerWrapp .innerWidth {position:relative; height:100%; overflow:hidden;}
  #counters {display:none;}
  #copy {position:absolute; top:50%; left:50%; width:calc(100% - 20px); -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%);}

/* gallery */
  .projWrapp {position:relative; margin:20px 0; text-align:center; padding:10px 0; overflow:hidden;}
  .pInfo {color:#666; font-size:16px;}
  .projWrapp a {display:block; position:absolute; top:0; left:0; width:100%; height:100%;}
  .projWrapp a:hover {background:rgba(0,0,0,0.1);}
  .pInfo span {display:block; margin:0 10px;}
  .pName {font-size:24px; color:#e4161c;}
  .pImage {max-width:590px; margin:5px auto;}
  .pImage span {display:block; width:100%; height:0; padding-bottom:49.1525423729%; background-repeat:no-repeat; background-position:center; background-size:cover;}

  #dopImgWrapp {margin:20px 0; text-align:justify; text-justify:inter-word;}
  .dopImg {display:inline-block; vertical-align:top; width:290px; height:290px; margin:5px 0; overflow:hidden;}
  .dopImg a {display:block; width:100%; height:100%; background-repeat:no-repeat; background-position:center; background-size:cover;}
  .dopImg a:hover {-moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); -ms-transform: scale(1.5); transform: scale(1.5);}

  .artName {font-size:24px;}

/* form */
  #floatFormWrapp {max-width:280px; width:calc(90% - 40px);}
  #frName {font-size:30px;}

  #catsWrapp2 {text-align:center;}

}

@media screen and (min-width:768px) {

  .innerWidth {width:768px; margin:0 auto;}
  #headPhones {font-size:15px;}

/* menu */
  #menu {-webkit-box-shadow: 2px 2px 3px 1px rgba(0,0,0,0.4); box-shadow: 2px 2px 3px 1px rgba(0,0,0,0.4);}
  #menu li {width:40%;}
  #menu li ul {position:absolute; width:60%; top:0; right:0; margin:0;}
  #menu li ul li {width:100%;}
  #menu li ul li a {background:url('/images/icon-marker1.svg') no-repeat 0 50%; padding:6px 10px 6px 20px;}
  #moButton2 {position:absolute; top:50%; left:55%; display:block; -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%);}
  #moButton2 {display:block !important;}

  .ht1 {font-size:60px;}
  .ht2 {font-size:33px;}
  #hdrtxt {}
  #hdrtxt button {font-size:20px;}

  .pgName {font-size:50px;}

  .advItem {width:330px; display:inline-block; margin:20px;}

  #form1Wrapp {font-size:27px;}
  .blName2 {font-size:50px;}

  #servicesWrapp .blName {padding:0 40px; font-size:50px;}
  .servWrapp {width:50%; display:inline-block; vertical-align:top;}
  .servItem div {min-height:47px !important;}
  .servItem div h3 {font-size:22px;}

  .docs {text-align:justify; text-justify: inter-word;}
  .docs a {display:inline-block; vertical-align:top;}

/* mosaic gallery  */
  #galleryWrapp .blName {font-size:50px;}
  #mosaicWrapp a {float:left; padding:0; margin:3px;}
  .mosType1 {width:186px !important; height:381px !important;}
  .mosType2 {width:186px !important; height:187px !important;}
  .mosType3 {width:378px !important; height:187px !important;}
  .mlast {margin-top:-190px !important;}
  .mlast2 {margin-left:387px !important;}

  #adressBlockWrapp {position:absolute; margin:0; left:0; top:50%; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}

  #mapWrapp {height:450px;}

  #counters {display:block; text-align:left; margin:10px 0 0 0;}
  #copy {position:static; -moz-transform: translateX(0) translateY(0); -webkit-transform: translateX(0) translateY(0); -o-transform: translateX(0) translateY(0); -ms-transform: translateX(0) translateY(0); transform: translateX(0) translateY(0); text-align:left; margin:20px 0 0 0;}

/* gallery */
  .pInfo {font-size:19px;}
  .pName {font-size:30px;}

  .artName {font-size:26px;}

/* form */
  #floatFormWrapp {max-width:400px; width:auto;}
  #frName {font-size:40px;}
  #floatForm {font-size:18px;}

  #catsWrapp2 {text-align:justify;}

}

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

  .innerWidth {width:1180px;}

  #logo {left:0;}
/* menu */
  #menuOpen {display:none;}
  #menu {width:auto; background:none; top:0; left:auto; right:0; -webkit-box-shadow:none; box-shadow:none; display:block !important;}
  #menu li {display:inline-block; width:auto; position:relative;}
  #menu li a {height:100px; line-height:100px; padding:0 10px;}
  #menu li ul {width:auto; right:auto; left:0; top:100px; background:#d9d9d9; -webkit-box-shadow: 2px 2px 3px 1px rgba(0,0,0,0.4); box-shadow: 2px 2px 3px 1px rgba(0,0,0,0.4); padding:10px 0;}
  #menu li ul li {display:block; white-space:nowrap;}
  #menu li ul li a {height:auto; line-height:normal; background:url('/images/icon-marker1.svg') no-repeat 20px 50%; padding:4px 20px 4px 40px;}
  #moButton {position:static;}
  #moButton2 {display:none !important;}
  .floatMenu #moButton {display:inline-block !important;}
  .floatMenu #logo {display:none !important;}
  .floatMenu #menu {width:100%;}

  #indexBG {height:710px;}
  .ht2 {font-size:38px;}

  .servItem div {min-height:52px !important;}
  .servItem div h3 {font-size:27px;}

/* mosaic gallery  */
  .mosType1 {width:287px !important; height:580px !important;}
  .mosType2 {width:287px !important; height:287px !important;}
  .mosType3 {width:580px !important; height:287px !important;}
  .mlast {margin-top:-290px !important;}
  .mlast2 {margin-left:589px !important;}

  .txt {margin:10px 0;}

  #counters, #copy {-moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}
  #counters {position:absolute; top:50%; right:0; width:39%; margin:0; text-align:right;}
  #copy {position:absolute; left:0; top:50%; width:59%; margin:0 2% 0 0;}

/* gallery */
  .pInfo, .pImage {display:inline-block; vertical-align:middle; width:48%;}
  .pImage {margin-left:2%;}

  .artName {font-size:30px;}

  #catsWrapp2 {text-align:left;}

}

#mainWrapp {min-height:100%; height:auto !important; height:100%;}
#footerPush {height:100px;}
#footerWrapp {height:100px; margin-top:-100px; background:#000; color:#f2f2f2; font-size:14px;}

#form1Wrapp {background:url('/images/form-bg1.jpg') no-repeat center #939393; background-size:cover; background-attachment:fixed; color:#fff;}

.pager {margin:20px 0; text-align:center;}
.pager a {display:inline-block; background:#666; color:#fff; height:33px; line-height:33px; padding:0 12px; text-decoration:none; -webkit-border-radius:5px; border-radius:5px; font-size:17px; margin:0 2px; vertical-align:middle;}
.page-active {background:#da251c !important;}
.pgrRight, .pgrLeft {font-size:22px !important;}

.artWrap {margin:20px 0;}
.artName {margin:0; text-align:left; font-weight:bold;}
.artName a {text-decoration:none;}
.artName a:hover {color:#000;}

/* order form */
#formBackground {position:fixed; top:0; left:0; z-index:1000; width:100%; height:100%; background:rgba(0,0,0,0.4);}
#floatFormWrapp {position:absolute; top:50%; left:50%; -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); background:#fff; padding:20px;}
#floatFormClose {position:absolute; top:0; right:0; width:40px; height:40px; background:url('/images/icon-close.svg') no-repeat center; cursor:pointer;}
#frName {margin:20px 0 0 0; color:#da251c; font-weight:bold;}
.fieldError {background:rgba(255,0,0,0.1) !important;}
#floatForm span {display:block; color:#666;}
#floatForm input {display:block; border:1px solid #999; height:40px; line-height:40px; width:calc(100% - 20px); padding:0 10px;}
#floatForm input:focus {border-color:#000;}
#floatForm button {color:#fff; background:#da251c; height:40px; line-height:40px; padding:0 20px; background:#da251c; border:none; display:block; margin:10px auto; cursor:pointer;}
#loading {padding:20px 10px 0 10px; color:#666;}
.info {margin:20px 0 0 0;}

#catsWrapp {text-align:justify; text-justify:inter-word;}
.cat1Block, .cat2Block {display:inline-block; vertical-align:top; width:290px; text-align:center; margin:10px 0;}
.cat1Block a {color:#000;}
.cat1Block a:hover {color:#da251c;}
.cIcon span:hover {-moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); -ms-transform: scale(1.5); transform: scale(1.5);}
.cName {font-size:20px; display:block; margin:5px;}
.cIcon {display:block; width:290px; height:290px; overflow:hidden;}
.cIcon span {display:block; width:100%; height:100%; background-repeat:no-repeat; background-position:center; background-color:silver; background-size:cover;}

#catsWrapp2 {}
.cat2Block {margin:10px 5px 0 0;}
.cat2Block a {color:#da251c;}
.cat2Block a:hover {color:#000;}
.cat2Pre {text-align:justify; color:#666; margin:7px 5px 0 5px; font-size:17px;}
.pdfH1 {color:#000; font-size:30px; font-weight:bold; text-align:left;}

#pdfWrapp {text-align:left;}
.pdfItem {display:inline-block; vertical-align:top; width:120px; text-align:center; margin:7px 7px 0 0;}
.pdfName {font-size:14px; display:block; margin:4px 0 0 0;}
.pdfIcon {display:block; width:120px; height:80px; background-repeat:no-repeat; background-position:center; background-size:contain;}