html{overflow-y: scroll; overflow-x: hidden; background-color: #eee; color: #575757}
body{font-family: Georgia,Times,'Times New Roman',serif; font-weight: 300; text-rendering: optimizeLegibility; -webkit-font-smoothing: subpixel-antialiased;-moz-osx-font-smoothing: auto; margin: 0; padding: 0}
/* Header wrapper */
.contact-wrapper{position: relative; max-width: 980px; margin: 0 auto}
/* Telephone */
.contact-wrapper .content{position: absolute; background-color: rgba(0,0,0,0.3); padding: 5px 15px 20px; border-radius: 0 0 10px 10px; margin-left: 1em; z-index: 999}
.contact-wrapper .content div{font-size: 0.9em; color: #fff; margin: 2px}
.contact-wrapper .content div a{text-decoration: none; color: #fff}
.contact-wrapper .content div a:hover{text-decoration: underline}
/* Main photo wrapper */
.main-photo-wrapper{max-width: 100%; width: 100%; background-color: #eee}
.main-photo-wrapper .image{max-width: 980px;  margin: 0 auto}
.main-photo-wrapper .image img{width: 100%; height: auto; display: block}
/* Box Content */
.box-wrapper{width: 100%; background-color: #eee}
.box-wrapper{max-width: 980px; margin: 0 auto; background-color: #fff}
.box-wrapper .menu{background-color: #142E70; border-bottom-right-radius: 40px; position: relative; margin-bottom: 3px}
/* Navigation */
.menu nav ul{display: table; float: none; margin: 0}
.menu nav ul li{display: table-cell; float: none}
.menu nav ul li a{color: #fff; display: block; font-size: 0.8em; padding: 15px; text-transform: uppercase; text-decoration: none}
.menu nav ul li a:hover,
.menu nav ul li a:focus{background-color: #fff; color: #142E70; border-radius: 0 10px 0 0; text-decoration: none}
/* Stack Box */
.visual-menu{padding: 0 12px 0 12px; margin-bottom: 14px; float: left}
.visual-menu .block-wrapper{position: relative; background-position: center center; background-size: cover; height: 300px; width: 19.83122%; float: left; margin-right: .21097%}
.visual-menu .block-wrapper:after{background: url("/templates/osvolyn/images/plusm.png") no-repeat center center #DF4F10; bottom: 0; content: ''; display: block; height: 37px; position: absolute; right: 40px; width: 37px}
.visual-menu .block-wrapper h2{background-color: #142E70; border-bottom-right-radius: 30px; color: #fff; display: inline-block; line-height: 4; font-size: 0.65em; padding: 0 1.5em; text-transform: uppercase; background-image: url("/templates/osvolyn/images/imagearrow.png"); background-repeat: no-repeat; background-position: 5px center; padding-left: 1.6em; margin: 0}
.visual-menu .block-wrapper h2 a{color: #fff; text-decoration: none}
.visual-menu .block-wrapper:hover .content{height: 300px; background-color: #142E70; background-color: rgba(88,88,90,0.5); background-color: transparent\9; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#80142E70", endColorstr="#80142E70")}
.visual-menu .block-wrapper .content .info{background-color: #DF4F10; background-color: rgba(223,79,16,0.7); background-color: transparent\9;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#B3DF4F10", endColorstr="#B3DF4F10"); color: #fff; padding: 5px; height: 110px; line-height: 22px; font-size: 0.95em;  margin: 120px 10px 20px}
.visual-menu .block-wrapper:hover .content .info{background-color: #142E70}
.visual-menu .block-wrapper .content .link a{top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; position: absolute; text-indent: -999px}
.visual-menu .block-wrapper:hover h2{background-color: #DF4F10}
.visual-menu .block1{background-image: url("/templates/osvolyn/images/box/security_systems.jpg")}
.visual-menu .block2{background-image: url("/templates/osvolyn/images/box/cctv.jpg")}
.visual-menu .block3{background-image: url("/templates/osvolyn/images/box/intercoms.jpg")}
.visual-menu .block4{background-image: url("/templates/osvolyn/images/box/satellite_tv.jpg")}
.visual-menu .block5{background-image :url("/templates/osvolyn/images/box/automatic_gate.jpg"); float: right; margin-right: 0 }
/* Article */
.content-wrapper{line-height: 22px; padding: 0 12px 5px 12px}
.content-wrapper h1{line-height: 30px; font-size: 1.2em; color: #142E70; border-bottom: 1px solid #142E70; padding-bottom: 3px; margin: 0; text-align: justify}
.content-wrapper h2{font-size: 1.2em; text-indent: 10px; margin: 0 0 10px 0}
.content-wrapper h2 a:link,
.content-wrapper h2 a:visited,
.content-wrapper h2 a:active{text-decoration: none; color: #fff; text-shadow: 1px 1px 1px #000000}
.content-wrapper h2 a:hover{text-decoration: underline}
.content-wrapper p{line-height: 1.5em; text-indent: 20px; margin: 7px 0px 11px 0px; text-align: justify}
.content-wrapper p strong{color:#00679a}
.content-wrapper img{box-shadow: 3px 3px 4px #999; margin:0 12px 5px 0px; margin-top: 5px; border: 1px solid #142E70; border-radius: 10px 10px 10px 10px}
.content-wrapper .big_img img{display: block; margin-left: auto; margin-right: auto}
.content-wrapper a:link,
.content-wrapper a:visited,
.content-wrapper a:active{color: #000; text-decoration: none; color:#00679a}
.content-wrapper a:hover{color: #010101; text-decoration: underline}
.content-wrapper ul{padding-left: 20px; margin: 7px 0px 0px 0px; list-style-type: disc; list-style-position: outside; text-align: justify}
.content-wrapper ul li{background:url(/templates/osvolyn/images/list.gif) no-repeat 0px 8px; list-style-type:none; padding-left:15px; margin:7px 0 0 0}
.content-wrapper .clear{clear:both;}
.content-wrapper .line{border-bottom: 1px #DCDCDB solid; padding-top: 1px; margin-bottom: 1px; clear: both;}
.content-wrapper .myhr{margin: 5px 0 5px 0px; background-color: #B6B6B5; height: 1px; width: 187px; clear: both}
.content-wrapper .back{margin: 10px 10px 10px 10px; font-weight: bold; float: right}
/* Map */
.map-responsive{overflow: hidden; padding-bottom: 56.25%; position: relative; height: 0}
.map-responsive iframe{left: 0; top: 0; height: 100%; width: 100%; position: absolute}
/* Fotter */
footer{position: relative; max-width: 980px; margin: 0 auto; background-color: #fff; border-top: 1px solid #a8a8a9}
footer section{margin: 0 auto; max-width: 980px}
footer section p{font-size: 0.9em; margin: 5px 0 5px 10px; padding: 4px; text-align: center}
/* Media */
@media ( max-width: 900px ){
    .contact-wrapper .content div{font-size: 1em}
    .box-wrapper .visual-menu .block-wrapper h2{background-image: none; padding-left: 10px}
    .box-wrapper .visual-menu .block-wrapper{width: 100%; float: left; margin-bottom: 10px}
}