@font-face{font-family:'ProximaNova';font-style:normal;font-weight:normal;src:url("../fonts/proxima/ProximaNova-Regular.otf") format("opentype");}
@font-face{font-family:'ProximaNova';font-style:normal;font-weight:bold;src:url("../fonts/proxima/ProximaNova-Bold.otf") format("opentype");}
@font-face{font-family:'Antonio';font-style:normal;font-weight:bold;src:url("../fonts/antonio/Antonio-Regular.ttf") format("truetype");}

body,html{padding:0;margin:0;background-color:#e5e5e5;color:#000000;font-family:'ProximaNova';font-size:16px;font-style:normal;font-weight:normal;}

.container{padding:5px;margin:0px;}
.first-col{float:left;}
.block{float:left;background-color:#fff;width:230px;height:177px;overflow:hidden;border-bottom:solid 3px #e5e5e5;border-right:solid 3px #e5e5e5;}
.block img {width:100%;}
.block img.hover-image{display:none;}
 a.description{color:inherit;text-decoration:inherit;}
.block-text{width:100%;height:100%;background-color:#ffffff;}
.block-text td{vertical-align:middle;padding:0 0 0 5%;}
.block-text .title {font-size:200%;font-family:'Antonio';text-align: center;}
.social a {color:#867b6f;}
.contacts .block-text {background-color: #867b6f;}
.contacts a {color:#fff; text-decoration: inherit;}
.blog a {color:#333; text-decoration: inherit;}
.lang {float:right;}
.lang .block-text{background-color:#867b6f;font-size:26px;font-family:'Antonio';color:#ffffff;}
.description{background-color:#cec8c3;}
.lang .block-text td{vertical-align:middle;text-align:center;padding:0;}
.lang span {margin:4px;padding:8px;}
.lang span.active{border:solid 1px #ffffff;}
.lang a  {color:inherit;text-decoration:inherit;}
.megablock{float:left;display:none;width:100%;overflow:hidden;border-bottom:solid 3px #e5e5e5;border-right:solid 3px #e5e5e5;}
.megablock img{width:100%;}
.megablock .project-description {width:100%;height:100%;overflow:auto;padding:5%;background-color:#ffffff;} /*padding:100px 75px 20px 75px;*/
.megablock-left, .megablock-right {position:absolute;font-size: 60px;display:table-cell;vertical-align: middle;text-shadow:0px 0px 10px #fff;}
.megablock-right {text-align:right;}
.megablock-right {text-align:right;}
.megablock-left span, .megablock-right span {display:none;}
.arrow-left {position:absolute; bottom:0px; width: 26px; height: 27px; background-image:url("img/arrow-left.png");}
.arrow-right {position:absolute; bottom: 0px; right: 0px; width: 26px; height: 27px; background-image:url("img/arrow-right.png");}
.btn-close {position:absolute; top: 0px; right: 0px; width: 26px; height: 27px; background-image:url("img/btn-close.png");}
.description-box {background-image:url("img/arrow-right.png");background-repeat:no-repeat;background-position: right bottom;}

.track3 {
    width: 10px;
    background: rgba(0, 0, 0, 0);
    margin-right: 2px;
    border-radius: 10px;
    -webkit-transition: background 250ms linear;
    transition: background 250ms linear;
}

.track3:hover,
.track3.dragging {
    background: #d9d9d9; /* Browsers without rgba support */
    background: rgba(0, 0, 0, 0.15);
}

.handle3 {
    width: 7px;
    right: 0;
    background: #999;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 7px;
    -webkit-transition: width 250ms;
    transition: width 250ms;
}

.track3:hover .handle3,
.track3.dragging .handle3 {
    width: 10px;
}


@media (min-width: 320px) {
	.container {width: 750px;font-size:65%;}
	.first-col {width:740px;}
	.block{width:185px;}
	.megablock, .project-description{width:740px;height:429px;}
	.block{height:143px;}
}
@media (min-width: 992px) {
	.container {width: 970px;font-size: 65%;}
	.first-col,.block{width:160px;}
	.block{height:123px;}
	.megablock, .project-description{width:640px;height:369px;}
}
@media (min-width: 1200px) {
	.container {width: 1180px;font-size:80%;}
	.first-col,.block{width:195px;}
	.block{height:150px;}
	.megablock, .project-description{width:780px;height:450px;}
}
@media (min-width: 1600px) {
	.container {width: 1570px;font-size:100%;}
	.first-col,.block{width:260px;}
	.block{height:200px;}
	.megablock, .project-description{width:1040px;height:600px;}
}
@media (min-width: 1920px) {
	.container {width: 1900px;font-size:100%;}
	.first-col,.block{width:315px;}
	.block{height:242px;}
	.megablock, .project-description{width:1260px;height:726px;}
}