/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */

@media only screen and (max-width: 766px)  {

    .wrapper { font-size:14px; line-height:21px; }
        .container { width:320px; }
    .row.padding {  padding: 45px 0 25px; overflow: hidden; }	
        body.subpage .row.padding {  padding: 25px 0 35px; }	
    
    .show-mobile {
        display: block !important;
    }
    
    a.cta-more {
        margin: 30px auto 0;
    }
    .hide-mobile {
        display: none !important;
    }   
    
    .hide-desktop {
        display: block !important;
    }   

    .menu-bar .topContactWrapper {
        display: flex;
        float: right;
        margin: 7px 20px 0 0;
    }
    
    .topContactInfo {
        color: #fff;
        font-size: 28px;
        margin: 5px 16px;
        line-height: 25px;
    }
    
    .topContactInfo .fa-envelope {
        font-size: 26px;
    }
    
    .topContactMail {
        margin-top: 3px;
    }
    
    .wide { padding-left: 0; padding-right: 0; overflow: visible; }
    h1 {font-size:23px;  line-height:25px; }
    h2 { font-size:24px }

    .titleBox p.introTxt {
        font-size: 15px;
        margin-bottom:10px;
        line-height: 25px;
    }

    .titleBox h3 {
        font-size: 27px;
        line-height: 31px;
        margin-bottom: 20px;
    }

    header {
        height: 92px;
    }
    header .top {
        height: 65px;
    }
    #title {
        padding: 135px 0 0;
    }
    #contact-data, .edicraSlider ul.navigator {
        display: none;
    }
    header.smaller {
        height: 80px;
    }
    header.smaller .top {
        height: 45px;
    }
    header.smaller .btn-navbar-navtoggle {
        top: 4px;
    }

    header .top #mainLink {
        margin-top: 15px;
        width: 160px;
        height: 48px;
    }
    header.smaller .top #mainLink {
        margin-top: 10px;
        width: 113px;
        height: 26px;
    }
    .menu-bar {
        height: 50px
    }
    #search-btn {
        padding: 12px;
    }
    .centered {
        width: 90%;
    }
    .langBox {
        margin: 12px 15px 0 0;
    }
    .contactWrapper {
        display: none;
    }
    a.more { font-size:16px; }

    #sliderWrapper {
        top: 85px;
        height:330px;
        background-size:cover
    }

    .titleBox div.introTxt p {
        font-size: 16px !important ;
        margin-bottom: 30px !important;
        line-height: 24px !important;
    }

    #first-row {
        background-position: bottom left;
        padding: 35px 0 45px;
    }
    
    #first-row .titleBox h3 {
        margin-bottom: 45px;
    }

    #products {
        padding-bottom:55px !important;
    }

    .karuzela .owl-controls { display:none !important }  

    .newsPic img {
        width: 100%;
    }

    .newsDesc {
        font-size: 13px;
        line-height: 20px;
        margin: 5px 0 0 0;
    }

    #footer .col:last-child {
        width:100%;
        margin-top:15px;
    }

    #copyright {
        font-size: 11px;
    }
    
    #footerLogo img { 
        max-height: 70px; 
        width: auto 
    }
    
    #footer .footerMenu li a {
        font-size: 15px;
    }
    
    #footer #footer-info {
        margin-top: 20px;
        font-size: 14px;
        margin-bottom: 20px;
        line-height: 21px;
    }
    #footer #contact-footer {
        font-size: 17px;
    }
    #footer #contacts, #footer .footerMenu {
        padding: 0;
        border: 0;
    }
    #bottom {
        padding: 10px 0 20px;
        text-align: center;
        font-size: 14px;
    }
    #bottom .bottom-container {
        margin: 7px auto;
        float: left;
        line-height: 1.6;
        font-size: 13px;
        padding: 0;
        width: 100%;
    }
    #description { background-image: none !important }

    #productTitle {
        height: 380px;
    }

    #productTitle h1 {
        font-size: 16px;
        line-height: 24px;
        bottom: auto;
        top:85px;
        width:90%;
        max-width: 100%;
        padding: 12px 5%;
        left: 0;
    }

    #productTitle .productPic {
        bottom: 0;
        right: 0;
        width:100%;
        text-align: center
    }

    #productTitle .productPic img {
        max-width:250px;
        height: auto;
        max-height: 320px
    }  

    #description h3, #parameters h3 {
        font-size: 25px;
        margin-bottom: 20px;
    }   
    #description p {
        font-size: 16px;
        line-height: 23px;
    }       
    .gallerySection {
        height:400px;
        background-size: cover;
    }
    .gallerySection .galleryInfo {
        width: 300px;
        min-width: 300px;
        left:0;
        bottom:0;
        padding:20px 20px
    } 
    .gallerySection.left.top .galleryInfo { top:0; bottom:auto;}
    .gallerySection.right .galleryInfo {
        right:0;
    }
    .gallerySection.right.top .galleryInfo { left:auto; right:0; top:0; bottom:auto; }
    
    .gallerySection .galleryInfo h4 {
        font-size: 18px;
        margin: 0 0 10px;
    }
    #video {
        padding:60px 0 60px
    }
    #video iframe {
        width: 300px;
        height: 170px;
    } 
    #video h3 {
        font-size: 20px;
        margin-bottom: 30px;
    }

    .edicraSlider > .container.fade > div, 
    #sliderWrapper,
    .edicraSlider {
        height:190px !important;
    }
    .edicraSlider .htmlWrapper .htmlContainer .descritpion {
        display: none;
    }
    .edicraSlider .htmlWrapper {
        width: 100% !important;
        top: 70px;
    }
    .edicraSlider .htmlWrapper .htmlContainer .sliderPic {
        left: -100px !important;
    }
    .edicraSlider .htmlWrapper .htmlContainer .sliderPic img {
        width:170px;
        height: auto
    }
    .edicraSlider .htmlWrapper .htmlContainer h3 {
        font-size: 20px !important;
        margin-bottom: 0 !important;
        line-height: 24px !important;
    }
    .edicraSlider .htmlWrapper .htmlContainer h4 {
        font-size: 20px !important;
        margin-bottom: 0 !important;
        line-height: 25px !important;
    }
    .edicraSlider .htmlWrapper .htmlContainer .more  { display:none }
    .edicraSlider .htmlWrapper.left {
        left: auto !important
    }
    .edicraSlider .htmlWrapper .htmlContainer {
        max-width: 85% !important;
        padding-top: 0 !important;
        width: auto !important;
        bottom: 0 !important;
        position: absolute !important;
        right:0 !important;
    }
    .edicraSlider .htmlWrapper.left .htmlContainer .sliderPic {
        right: -295px !important;
    }
    .edicraSlider > .container.fade > div {
       background-size:cover
    }
    .techTitle {
        font-size: 22px;
        line-height: 27px;
    }
    #technology { 
        padding-bottom:25px;
    }
    .mainBox .mainPic {
        width: 100%;
    }
    .mainBox .mainPic img {
        width: 100%;
        height: auto;
        margin-bottom: 10px;
    }
    .mainBox .newsDesc {
        font-size: 14px;
        line-height: 22px;
        margin: 5px 0 0 0;
    }
    .karuzela .owl-wrapper-outer {
        padding: 10px 0 15px 0;
    } 
    .carouselBox a .introContainer .introTitle { 
        margin-top:0; 
    }   
    #formLeft, #formRight {
         width:100%
    } 
    .midSliderWrapper .edicraSlider .htmlContainer h3 {
        font-size: 22px!important;
        line-height: 28px!important;
        margin-bottom:20px !important;
        padding: 10px 15px 10px!important;
    }
    .midSliderWrapper .edicraSlider .htmlContainer h3 span {
        font-size: 24px!important;
        line-height: 28px!important;
    }
    .separator {
        height: 20px !important;
    }
    .midSliderWrapper .edicraSlider .htmlContainer .sliderDesc {
        width: 90% !important;
        font-size: 15px !important;
        background: url(../img/blackBg.png);
        color:#fff !important;
        padding:10px;
        line-height: 21px !important;
    }
    div.center {
        margin-top: 25px !important;
    }
    
    .linkBox {
        height: 155px;
        margin: 0 0 30px;
    }
    .linkBox .linkTitle {
        font-size: 17px;
        padding: 7px 0;
    }
    #blog { padding-bottom:55px }
    
    #blog div.center { margin-top: 20px; }
    
    #formRight textarea { 
        float:left;
    }
    .techIco {
        width: 180px;
        height: 180px;
    }
    .contentForm {
        padding: 15px 10px;
    }
    #contact #contactData p {
        font-size:17px;
        line-height: 27px;
    }
    
    #seriesSearchSidebarContainer { margin-bottom: 30px }
    
    #content .expertSliderContainer { width:100%; position: relative !important; float:left; left:auto !important; height:80px }
    #content .expertSliderContainer #slider  { width:100%; position: relative !important; float:left; left:auto !important; right:auto !important }
    #content .expertContentItem { display:block !important; overflow: hidden }
    #content .expertContentItem > div:first-child { max-width: 100% !important; width:100% !important; text-align: center }
    #content .expertContentItem > div:first-child a { height:260px !important }
    #content .expertContentItem div.propertiesContainer { display:block !important }
    #content .expertContentItem > div:first-child img { margin-top:15px !important; }
    #content .expertContentItem div.propertiesContainer h3 { text-align: center }
    #content .expertContentItem div.propertiesContainer > div { display:block !important; margin:15px !important; }
    
    .seriesDescriptionContainer p.big {
        font-size: 16px;
        line-height: 24px;
    }
    
    .seriesDescriptionContainer {
        padding-top: 10px;
    }
    .extraInfo {
        margin-top: 30px;
    }
    .producerBlock {
        margin-top: 25px;
    }
    .techData .dataWrapper {
        padding: 25px 15px;
    }
    #breadcrumbs {
        font-size: 13px !important;
        padding: 20px 0 0 0 !important;
    }
    #details h3 {
        font-size: 23px;
        border-bottom: 1px solid #e4e4e4;
        padding-bottom: 6px;
        margin-bottom: 35px;
    }
    #details h4 {
        font-size: 22px;
    }
    #details .techData .dataWrapper {
        padding: 20px 10px;
        margin: 30px 0;
    }
    #parameters dl dt {
        width: 110px;
    }
    #parameters dl {
        font-size: 13px;
    }
    #parameters dl dd {
        padding: 0 0 0 120px;
    }
    #socialBox { margin: 10px 0 0 0; text-align: center }
    
    #aboutus {
        background: #ecefef url(../../css/../img/homeBg.jpg) no-repeat 45% 50%;
        background-attachment: fixed;
        padding: 40px 0 120px;
        background-size: cover;
    }
    #aboutus .span_6_of_12 {
        width: 100%
    }
    #aboutus h3 {
        font-size: 20px;
        font-weight: 300;
        line-height: 27px;
        margin-bottom: 20px;
    }
    #aboutus h3 span {
        font-size: 24px;
    }
    #aboutus p {
        font-size: 15px;
        line-height: 23px;
    }
    #service #service-info {
        padding: 25px 20px 25px;
        overflow: hidden;
    }
    #service #service-pic {
        display: none;
    }
    #service #service-txt {
        padding-left: 0;
        padding-top: 0;
        line-height: 1.36;
        font-size: 22px;
    }
    #service #service-txt span {
        font-size: 22px;
    }
    
    #service .service-more {
        margin: 15px 0 0 0;
        float: left;
        font-size: 15px;
        padding: 12px 20px;
    }
    div.sticky {
        position: relative;
        top: auto;
    }
    .seriesDescriptionWrapper {
        margin-top: 25px;
    }
    
    a.link {
        margin: 10px 0 5px 0;
        width: 96%;
        float:left;
        padding: 10px 2%;
        font-size: 17px;
    }
    
    .the-nav ul.nav-flyout .dropdown .subnav.is-subnav-visible { 
        height: auto !important;
    }
    
    #footerLogo {
        width:100%;
    }
    
    .partners {
        display: block;
        margin-bottom: 65px;
    }
    
    .content-wrapper {
        margin-top: 40px;
    }
    
    #content .content-wrapper iframe {
        width: 100%;
          aspect-ratio: 16 / 9;
          border: none;
          display: block;
    }
    
    #mobile-flex-wrapper {
        display: flex;
        flex-direction: column;
    }
    
    #mobile-flex-wrapper .span_3_of_12 {
        order: 2;
    }
    #mobile-flex-wrapper .span_9_of_12 {
        order: 1;
    }
    
}