@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700');
body {
    font-family: Roboto;
    font-weight: 400;
    float: left;
    width: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
}
/*body{
    font-family: Roboto;
    font-weight: 400;
}*/
*{
    box-sizing: border-box;
}
ul, li{
    padding:0;
    margin:0;
    list-style: none;
}
header {
    float: left;
    width: 100%;
    /* height: 111px; */
    position: fixed;
    z-index: 9;
    background-color: #fff;
}
.site-width-full-da {
  display: table;
  margin: auto;
  width: 1200px;
  padding: 0 20px;
}
.header-elements {
    border-bottom: 4px solid #007bc0;
    float: left;
    padding-bottom: 15px;
    padding-top: 15px;
    width: 100%;
}
.header-elements a:first-child {
    background-image: url("../images_full_da/audison_fulldahd_logo.png");
    background-repeat: no-repeat;
    background-size: 80%;
    float: left;
    height: 52px;
    width: 162px;
}
.header-elements a.audison-class {
    background-image: url("../images_full_da/ic_audison.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
    float: right;
    height: 30px; 
    margin-top: 13px;
    width: 135px;
}
footer {
  background-color: #000000;
  float: left;
  width: 100%;
}
footer .copyright {
    font-family: "Source Sans Pro", sans-serif;
    font-size: 14px;
    color: #ffffff;
    line-height: 1;
    font-weight: normal;
    float: left;
}
.social-icons {
  float: right;
}
.social-icons a{
  background-repeat: no-repeat;
  background-size: 100% auto;
  float: left;
  padding: 0 10px;
}
.social-icons a:last-child {
  padding: 0 0 0 10px;
}
.section-2{
  float: left;
  padding: 75px 0 90px;
  width: 100%;
}
.title-section-2 {
    padding-bottom: 53px;
    font-family: Roboto, sans-serif;
    font-size: 50px;
    color: #007bc0;
    line-height: 1.3;
    font-weight: 300;
    text-shadow: 1px 1px 2px #C2C2C2;
    text-align: center;
    margin: auto;
    display: table;

}
#content-section-2 {
    float: left;
    width: 100%;
}
.title-section-3 {
  color: #000000;
  display: table;
  font-family: "Roboto",sans-serif;
  font-size: 18px;
  font-weight: normal;
  line-height: 1.5;
  margin: auto;
  text-align: center;
  padding-bottom: 75px;
}
.content-section-3 {
  float: left;
  text-align: center;
  width: 100%;
}
.each-box-section-3 {
  background-color: #119bed;
  background-position: center center;
  background-repeat: no-repeat;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  height: 240px;
  margin: 0 12.5px;
  text-align: center;
  width: 240px;
  position: relative;
}
.each-box-section-3:first-child {
    background-image: url("../images_full_da/ic_da.png");
    background-position: center top 35px;
}
.each-box-section-3:nth-child(2) {
  background-image: url("../images_full_da/ic_high_res.png");
  background-position: center top 50px;
}
.each-box-section-3:nth-child(3) {
  background-image: url("../images_full_da/ic_connection_points.png");
  background-position: center top 80px;
}
.each-box-section-3:last-child {
  background-image: url("../images_full_da/ic_noise_signal.png");
  background-position: center top 63px;
}
.social-icons a i {
  color: #fff;
  font-size: 25px;
}
.big-box-section-1 {
  float: left;
  width: 100%;
  position: relative;
}
.big-box-section-1 .site-width-full-da {
  height: 100%;
  position: relative;
}
.box-section-1 {
    bottom: 0;
    position: absolute;
    right: 20px;
    width: 60%;
}
.title-section-1 {
  color: #007bc0;
  float: right;
  font-family: Roboto,sans-serif;
  font-size: 63px;
  font-weight: 300;
  line-height: 0.9;
  text-align: right;
  margin-bottom: 37px;
}
.content-section-1 {
  color: #000000;
  float: right;
  font-family: Roboto;
  font-size: 24px;
  font-weight: 300;
  line-height: 1.2;
  text-align: right;
}
.content-section-1 span{
    color:#007bc0;
}
.section-1{
    float: left;
    width: 100%;
    padding-top:86px;
}
.box-scroll-down{
    float: left;
    width: 100%;
    padding-top:65px;
}
.button-scroll-down {
  background-image: url("../images_full_da/ic_scroll_down.png");
  cursor: pointer;
  display: table;
  height: 58px;
  margin: auto;
  width: 29px;
}
.section-3{
  float: left;
  padding: 0 0 145px 0;
  width: 100%;
}
.each-box-section-3 > span {
  bottom: 28px;
  color: #ffffff;
  font-family: "Roboto",sans-serif;
  font-size: 18px;
  font-weight: bold;
  left: 50%;
  line-height: 22px;
  position: absolute;
  transform: translate(-50%);
  width: 100%;
}
.title-section-4 {
    color: #007bc0;
    font-family: Roboto,sans-serif;
    font-size: 50px;
    font-weight: 300;
    line-height: 1.1;
    margin: auto;
    padding-bottom: 128px;
    text-align: center;
    text-shadow: 1px 1px 2px #c2c2c2;
    float: left;
    width: 100%;
}
.content-section-4 {
  background-color: #f1f1f1;
  float: left;
  padding: 28px 0 65px;
  width: 100%;
}
.left-section-4 {
    float: left;
    height: 637px;
    margin-right: 65px;
    width: 456px;
    position: relative;
}
.title-right-section-4, .title-left-section-5, .title-right-section-6, .title-left-section-7 {
  float: left;
  padding-bottom: 30px;
  padding-top: 100px;
  width: 100%;
  font-family: Roboto, sans-serif;
font-size: 40px;
color: #007bc0;
line-height: 0.9;
font-weight: bold;
text-shadow: 1px 1px 2px #C2C2C2;
}
.title-left-section-7{
    padding-bottom: 40px;
    padding-top:150px;
}
.title-right-section-6 {
    padding-bottom: 35px;
    padding-top:0;
}
.right-section-4 {
  float: left;
  width: 34%;
}
.paragraph-right-section-4, .paragraph-left-section-5, .paragraph-right-section-6, .paragraph-left-section-7 {
  float: left;
  padding-bottom: 55px;
  width: 100%;
  font-family: "Roboto", sans-serif;
font-size: 15px;
color: #000000;
line-height: 1.4;
font-weight: 300;
}
.paragraph-right-section-6 {
    padding: 0;
    margin-bottom: 30px;
}
.title-left-section-5, .paragraph-left-section-5, .title-left-section-7, .paragraph-left-section-7   {
    color:#fff;
}
.title-left-section-5{
    padding-top: 40px;
}
.paragraph-left-section-5{
    padding-bottom: 40px;
}
.paragraph-left-section-7{
    padding-bottom: 95px;
}

.button-right-section-4, .button-left-section-5, .button-right-section-6, .button-left-section-7 {
  background-color: #fff;
  border-radius: 17px;
  box-shadow: 0 3px 2px 0 #02a1ff;
  color: #02a1ff;
  cursor: pointer;
  float: left;
  font-family: "Roboto",sans-serif;
  font-size: 12px;
  font-weight: normal;
  line-height: 1.4;
  padding: 24px 18px;
}
.button-right-section-4:hover, .button-left-section-5:hover, .button-right-section-6:hover, .button-left-section-7:hover{
   color: #02a1ff;
   text-decoration: none;
}
.section-5 {
  background-color: #0076b7;
  float: left;
  padding: 95px 0 140px;
  width: 100%;
}
.left-section-5, .left-section-7{
  float: left;
  padding-right: 80px;
  width: 50%;
}
.right-section-5 {
  background-image: url("../images_full_da/ic_section_5.png");
  float: left;
  height: 347px;
  width: 50%;
}
.section-6 {
  background-color: #f1f1f1;
  float: left;
  padding: 85px 0 40px;
  width: 100%;
}
.right-first-section-6 {
  float: right;
  padding-bottom: 70px;
  width: 50%;
}
.noise-section-6 {
  float: left;
  height: 246px;
  width: 100%;
  position: relative;
}
.noise-section-6 > img {
  left: 50%;
  position: absolute;
  transform: translate(-50%);
  -ms-transform: translate(-50%);
    -webkit-transform: translate(-50%);
}
.noise-section-6 .on{
    display:none;
}
.right-two-section-6{
    float: right;
    width: 50%;
    padding-top: 60px;
}
.section-7 {
  background-color: #0076b7;
  float: left;
  padding: 70px 0 65px 0;
  width: 100%;
}
.right-section-7 {
    background-repeat: no-repeat;
    float: left;
    height: 635px;
    width: 341px;
    position: relative;
}
.section-8 {
  float: left;
  padding: 105px 0;
  width: 100%;
}
.first-section-8 {
  float: left;
  padding-bottom: 55px;
  text-align: center;
  width: 100%;
}
.title-section-8 {
  color: #007bc0;
  font-family: Roboto,sans-serif;
  font-size: 50px;
  font-weight: 300;
  line-height: 0.9;
  padding-bottom: 45px;
  text-shadow: 1px 1px 2px #c2c2c2;
}
.description-section-8{
    font-family: "Roboto", sans-serif;
    font-size: 24px;
    color: #000000;
    line-height: 1.4;
    font-weight: normal;
}
.description-section-8 {
  color: #000000;
  display: table;
  font-family: "Roboto",sans-serif;
  font-size: 24px;
  font-weight: 300;
  line-height: 1.4;
  margin: auto;
  width: 55%;
}
.second-youtube-section-8 {
    background-repeat: no-repeat;
    background-size: 100%;
    width: 100%;
    position: relative;
    cursor: pointer;
    background-image: url("../images_full_da/ic_section_8.jpg");
    float: left;
    height: 800px;
    background-repeat: no-repeat;
    margin-bottom: 30px;
}
.share-box-buttons {
    float: none;
    margin: auto;
    display: table;
}
.share-buttons {
    float: left;
}
.share-box-buttons label {
    float: left;
    margin-top: 6px;
    margin-right: 10px;
}
.switch-lang {
    float: right;
    top: 23px;
    position: relative;
    right: 0;
    margin-left: 15px;
    cursor: pointer;
    background-image: url("../images_full_da/nav-arrow-down.png");
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 15px;
}
.switch-lang a {
    position: absolute;
    padding: 0 5px;
    background-color: #fff;
    border: 1px solid #dc4637;
    width: 40px;
    text-align: center;
    left: 2px;
    display: none;
}
.switch-lang a:hover{
    text-decoration: none;
}
.second-youtube-section-8 img {
  left: 50%;
  position: absolute;
  top: 50%;
  -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
.section-9{
    float:left;
    width: 100%;
    padding-bottom: 155px;
}
.left-section-9 {
  float: left;
  padding-right: 40px;
  width: 34%;
}
.director_name {
  float: right;
  padding-bottom: 10px;
  text-align: right;
  width: 100%;
  font-family: Roboto, sans-serif;
font-size: 26px;
color: #007bc0;
line-height: 1.4;
font-weight: bold;
}
.director_function{
    float: right;
    padding-bottom: 10px;
    text-align: right;
    width: 100%;
    font-family: Roboto, sans-serif;
    color:#666666;
    font-size: 12px;
}
.right-section-9 {
  color: #000000;
  float: left;
  font-family: "Roboto",sans-serif;
  font-size: 15px;
  font-style: italic;
  font-weight: 400;
  line-height: 24px;
  width: 50%;
}
.section-10 {
  float: left;
  padding-bottom: 0;
  width: 100%;
}
.logo-section-10 {
    background-image: url("../images_full_da/audison_fulldahd_logo_2.png");
    display: table;
    height: 103px;
    margin: auto auto 55px;
    width: 22%;
    background-size: 100%;
}
.title-section-10 {
  display: table;
  margin: auto;
  padding-bottom: 80px;
  font-family: Roboto, sans-serif;
font-size: 50px;
color: #007bc0;
line-height: 0.9;
font-weight: normal;
text-shadow: 1px 1px 2px #C2C2C2;
}
.first-line-product-10 {
  float: left;
  padding-bottom: 45px;
  text-align: center;
  width: 100%;
}
.each-box-product {
  background-color: #f1f1f1;
  background-position: center top;
  background-repeat: no-repeat;
  border: 1px solid #d8d8d8;
  display: inline-table;
  height: 355px;
  position: relative;
  width: 355px;
}
.each-box-product:first-child{
    margin-right: 15px;
}
.each-box-product:last-child{
    margin-left: 15px;
}
.each-box-product > img {
  display: table;
  margin: auto;
  width: 85%;
}
.each-box-product > a {
  bottom: 40px;
  color: #007bc0;
  font-family: Roboto,sans-serif;
  font-size: 30px;
  font-weight: 300;
  left: 50%;
  line-height: 1.2;
  position: absolute;
  text-align: center;
  text-decoration: underline;
  transform: translate(-50%);
  width: 100%;
}
.first-line-product-10 .each-box-product:first-child{
    background-image: url("../images_full_da/product_bitplayHD.png");
    background-position: top 20px center;
}
.first-line-product-10 .each-box-product:last-child{
    background-image: url("../images_full_da/product_bitOneHD.png");
    background-position: top 20px center;
}
.two-line-product-10 .each-box-product:first-child{
    background-image: url("../images_full_da/product_AV1.5KHD.png");
   
    background-position: top 20px center;
    
}
.two-line-product-10 .each-box-product:nth-child(2){
     background-image: url("../images_full_da/product_AV1.5K.png");
    background-position: top 20px center;
}
.two-line-product-10 .each-box-product:last-child{
    background-image: url("../images_full_da/product_Thesis.png");
    background-position: top 20px center;
}
#waves {
  float: none;
  height: 100%!important;
  margin: auto;
  width: 100%!important;
  z-index: -1;
  display: table;
}
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
  float: left;
}

.switch input {display:none;}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider span {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
  border-radius: 50%;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider span {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}
.left-section-4 img, .right-section-7 img {
    z-index: 2;
    position: absolute;
}
.left-section-4 marquee {
    position: absolute;
    height: 400px;
    left: 50%;
    top: 75px;
    z-index: 1;
}
.right-section-7 marquee {
    position: absolute;
    height: 400px;
    left: 49%;
    top: 75px;
    z-index: 1;
}
.button-right-section-4:hover, .button-left-section-5:hover, .button-right-section-6:hover, .button-left-section-7:hover{
    background-color: #46baff;
    color:#fff;
}
.showonscroll{
  
}
.showonscrollRight{
   -ms-transform: translateX(+100px); /* IE 9 */
    -webkit-transform: translateX(+100px); /* Chrome, Safari, Opera */
    transform: translateX(+100px); /* Standard syntax */
    opacity: 0;
}
.showonscrollLeft{
   -ms-transform: translateX(-100px); /* IE 9 */
    -webkit-transform: translateX(-100px); /* Chrome, Safari, Opera */
    transform: translateX(-100px); /* Standard syntax */
    opacity: 0;
}

@-moz-keyframes activateFade {
    from { -moz-transform: translateX(+100px); opacity: 0; }
    to { -moz-transform: translateX(0); opacity: 1;}
}
@-webkit-keyframes activateFade {
    from { -webkit-transform: translateX(+100px); opacity: 0;}
    to { -webkit-transform: translateX(0); opacity: 1;}
}
@keyframes activateFade {
    from {transform: translateX(+100px); opacity: 0;}
    to {transform: translateX(0); opacity: 1;}
}



@-moz-keyframes activateFadeLeft {
    from { -moz-transform: translateX(-100px); opacity: 0; }
    to { -moz-transform: translateX(0); opacity: 1;}
}
@-webkit-keyframes activateFadeLeft {
    from { -webkit-transform: translateX(-100px); opacity: 0;}
    to { -webkit-transform: translateX(0); opacity: 1;}
}
@keyframes activateFadeLeft {
    from {transform: translateX(-100px); opacity: 0;}
    to {transform: translateX(0); opacity: 1;}
}
.page-template-tpl-philosophy .showonscrollRight.activateFade {
  margin-top:0px;
}
.showonscrollRight.activateFade{
    animation-name: activateFade;
    animation-duration: 1000ms;
    animation-iteration-count: 1;
    animation-timing-function: linear;
    -webkit-animation-name: activateFade;
    -webkit-animation-duration: 1000ms;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: activateFade;
    -moz-animation-duration: 1000ms;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -ms-animation-name: activateFade;
    -ms-animation-duration: 1000ms;
    -ms-transform: translateX(0); /* IE 9 */
    -webkit-transform: translateX(0); /* Chrome, Safari, Opera */
    transform: translateX(0); /* Standard syntax */
    opacity: 1;
}
.showonscrollLeft.activateFade{
    animation-name: activateFadeLeft;
    animation-duration: 1000ms;
    animation-iteration-count: 1;
    animation-timing-function: linear;
    -webkit-animation-name: activateFadeLeft;
    -webkit-animation-duration: 1000ms;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: activateFadeLeft;
    -moz-animation-duration: 1000ms;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -ms-animation-name: activateFadeLeft;
    -ms-animation-duration: 1000ms;
    -ms-transform: translateX(0); /* IE 9 */
    -webkit-transform: translateX(0); /* Chrome, Safari, Opera */
    transform: translateX(0); /* Standard syntax */
    opacity: 1;
}


/*Eom */

.showonscrollTop{
   -ms-transform: translateY(+100px); /* IE 9 */
    -webkit-transform: translateY(+100px); /* Chrome, Safari, Opera */
    transform: translateY(+100px); /* Standard syntax */
    opacity: 0;
}

@-moz-keyframes activateFadeY {
    from { -moz-transform: translateY(+100px); opacity: 0; }
    to { -moz-transform: translateY(0); opacity: 1;}
}
@-webkit-keyframes activateFadeY {
    from { -webkit-transform: translateY(+100px); opacity: 0;}
    to { -webkit-transform: translateY(0); opacity: 1;}
}
@keyframes activateFadeY {
    from {transform: translateY(+100px); opacity: 0;}
    to {transform: translateY(0); opacity: 1;}
}

.showonscrollTop.activateFade{
    animation-name: activateFadeY;
    animation-duration: 1000ms;
    animation-iteration-count: 1;
    animation-timing-function: linear;
    -webkit-animation-name: activateFadeY;
    -webkit-animation-duration: 1000ms;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: activateFadeY;
    -moz-animation-duration: 1000ms;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -ms-animation-name: activateFadeY;
    -ms-animation-duration: 1000ms;
    -ms-transform: translateY(0); /* IE 9 */
    -webkit-transform: translateY(0); /* Chrome, Safari, Opera */
    transform: translateY(0); /* Standard syntax */
    opacity: 1;
}

/*Eom */
.showonscrollZoom{
    opacity: 0;
}
@-moz-keyframes activateFadeZoomY {
    from{-moz-transform:scale(0)} 
    to{-moz-transform:scale(1)}
}
@-webkit-keyframes activateFadeZoomY {
    from{-webkit-transform:scale(0)} 
    to{-webkit-transform:scale(1)}
}
@keyframes activateFadeZoomY {
    from{transform:scale(0)} 
    to{transform:scale(1)}
}

.showonscrollZoom.activateFade{
    animation-name: activateFadeZoomY;
    animation-duration: 700ms;
    animation-iteration-count: 1;
    animation-timing-function: linear;
    -webkit-animation-name: activateFadeZoomY;
    -webkit-animation-duration: 700ms;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: activateFadeZoomY;
    -moz-animation-duration: 700ms;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: linear;
    -ms-animation-name: activateFadeZoomY;
    -ms-animation-duration: 700ms;
    -ms-transform: translateY(0); /* IE 9 */
    -webkit-transform: translateY(0); /* Chrome, Safari, Opera */
    transform: translateY(0); /* Standard syntax */
    opacity: 1;
}

@-webkit-keyframes scroll {
  0% {
    -webkit-transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(10px);
  }
  100% {
    -webkit-transform: translateY(0);
  }
}
@-moz-keyframes scroll {
  0% {
    -moz-transform: translateY(0);
  }
  50% {
    -moz-transform: translateY(10px);
  }
  100% {
    -moz-transform: translateY(0);
  }
}
@keyframes scroll {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
  50% {
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    -ms-transform: translateY(10px);
    -o-transform: translateY(10px);
    transform: translateY(10px);
  }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}
.box-scroll-down .site-width-full-da{
    position: relative;
}
.center-it {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}

.caption {
    margin-top: 10px;
    font-family: Roboto;
    display: table;
    font-size: 12px;
    color: #BEBCBC;
}

.mouse {
  display: inline-block;
  height: 44px;
  width: 28px;
  border-radius: 12px;
  border: 2px solid #BEBCBC;
  text-align: center;
}
.mouse:after {
  display: inline-block;
  height: 8px;
  width: 8px;
  background-color: #BEBCBC;
  border-radius: 50%;
  content: "";
  -webkit-animation: scroll 1.3s ease-out infinite forwards;
  -moz-animation: scroll 1.3s ease-out infinite forwards;
  animation: scroll 1.3s ease-out infinite forwards;
}
.center-it:hover{
    text-decoration: none;
}
.see-noise-free {
    float: left;
    width: 100%;
}
.text-see-noise-free {
    float: left;
    color: #007bc0;
    padding-left: 10px;
    padding-top: 6px;
    cursor: pointer;
}
.big-image-section-1 {
    float: left;
    width: 100%;
}
.right-section-5 {
    background-image: none;
    background-color: #1C8AC7;
    float: left;
    height: 347px;
    width: 50%;
    /* opacity: 0.7; */
}

.img_signal{
    position: absolute;
    z-index: 2;
}
.element_img {
    float: none;
    width: 435px;
    height: 193px;
    position: relative;
    margin: auto;
    margin-top: 75px;
}
.first_semnal {
    height: 216px;
    width: 250px;
    background: url("../images_full_da/signal_cd.png");
    position: absolute;
    overflow: hidden;
    background-repeat: no-repeat;
    top: -19px;
    left: -37px;
}
.last_semnal {
    height: 272px;
    width: 235px;
    background: url("../images_full_da/signal_hires.png");
    position: absolute;
    overflow: hidden;
    background-repeat: no-repeat;
    top: -27px;
    left: 212px;
}
.mask {
    content: "";
    position: absolute;
    height: 188%;
    width: 150%;
    bottom: 0%;
    left: 0%;
    background: #1C8AC7;
    opacity: 1;
    transform: rotate(70deg);
  }
  .mask2 {
    content: "";
    position: absolute;
    height: 188%;
    width: 150%;
    top: -3%;
    left: 12%;
    background: #1C8AC7;
    opacity: 1;
    transform: rotate(-70deg);
}
.two_images_section {
    float: left;
    width: 100%;
    padding: 0 20px;
    position: relative;
}
.two_images_section img {
    float: left;
    width: 50%;
    padding: 0 20px;
    display:none;
}
.two_images_section img:last-child {
    margin-top: 10px;
}
.on_mobile, .on-mobile-image{
    display: none;
}
.stop_audio {
    float: left;
    width: 100%;
}
.stop_audio .fa {
    font-size: 30px;
    color: #007bc0;
    float: left;
    cursor: pointer;
}
.stop_audio .fa-volume-off{
    display: none;
}
.each-box-product .ic_hires {
    width: 52px;
    height: 52px;
    float: left;
    margin-top: 10px;
    margin-left: 10px;
}
.section-4{
    float: left;
    width: 100%;
}
@media screen and (max-width: 1199px) {
    .site-width-full-da {
        display: table;
        margin: auto;
        width: 1024px;
        padding: 0 20px;
    }
    .each-box-section-3 {
        height: 220px;
        margin: 0 5.5px;
        width: 220px;
    }
    .right-section-4 {
        float: left;
        width: 45%;
    }
    .each-box-product {
        height: 300px;
        width: 300px;
        background-size: 90%;
    }
    .description-section-8 {
        width: 90%;
    }
}
@media screen and (max-width: 1023px) {
    .site-width-full-da {
        width: 980px;
    }  
    .box-section-1 {
        bottom: 0;
        position: initial;
        right: 0;
        width: 100%;
        margin-top: 30px;
        float: left;
    }
    .title-section-1 {
        float: none;
        text-align: center;
        width: 100%;
    }
    .content-section-1 {
        float: left;
        text-align: justify;
        width: 100%;
    }
    .content-section-1 br {
        display: none;
    }
    /*.content-section-4 .site-width-full-da{
        display: -webkit-box;
        display: -moz-box;
        display: box;

        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        box-orient: vertical;
    }*/
    .content-section-4{
        display:none;
    }
    .content-section-4.on_mobile{
        display: block;
    }
    /*.left-section-4{
        -webkit-box-ordinal-group: 2;
        -moz-box-ordinal-group: 2;
        box-ordinal-group: 2;
    }*/
    .right-section-4 {
        float: left;
        width: 100%;
        margin-bottom: 40px;
    }
    .title-right-section-4{
        padding-top: 30px;
    }
    .paragraph-right-section-4{
        padding-bottom: 25px;
    }
    .left-section-4 {
        float: none;
        margin-right: 0;
        margin: auto;
        display: table;
    }
    .content-section-4{
        padding:0;
    }
    .title-right-section-4 {
        text-align: center;
    }
    .left-section-5{
        float: left;
        padding-right: 0;
        width: 100%;
        margin-bottom: 40px;
    }
    .section-5 {
        padding: 0 0 40px 0;
    }
    .button-right-section-4, .button-left-section-5, .button-right-section-6, .button-left-section-7 {
        float: none;
        margin: auto;
        display: table;
    }
    .director_name, .director_function{
        float: none;
        margin: auto;
        display: table;
        text-align: center;
    }
    .right-section-5 {
        width: 100%;
    }
    .right-first-section-6, .right-two-section-6 {
        float: left;
        width: 100%;
    }
    .title-right-section-6, .title-left-section-7, .title-left-section-5 {
        text-align: center;
    }
    .left-section-7 {
        float: left;
        padding-right: 0;
        width: 100%;
        padding-bottom: 40px;
    }
    .title-left-section-7 {
        padding-bottom: 30px;
        padding-top: 0;
    }
    .section-7 {
        padding: 40px 0 40px 0;
    }
    .paragraph-left-section-7 {
        padding-bottom: 25px;
    }
    .right-section-7 {
        background-repeat: no-repeat;
        float: none;
        height: 635px;
        width: 341px;
        position: relative;
        margin: auto;
        display: table;
    }
    .section-10 {
        padding-bottom: 60px;
    }
    .left-section-9 {
        float: left;
        padding-right: 0;
        width: 100%;
        margin-bottom: 30px;
    }
    .right-section-9 {
        float: none;
        width: 90%;
        text-align: center;
        display: table;
        margin: auto;
    }
    .section-9 {
        padding-bottom: 40px;
    }
    .logo-section-10 {
        background-repeat: no-repeat;
    }
}
@media screen and (max-width: 979px) {
    .each-box-product {
        margin-bottom: 30px;
    }
    .site-width-full-da {
        width: 768px;
    }  
    .title-section-2 br{
        display: none;
    }
    .each-box-section-3 {
        margin-bottom: 11px;
    }
    .right-section-5 {
        background-repeat: no-repeat;
        background-position: center;
    }
    .title-section-10 {
        text-align: center;
    }
    .two-line-product-10 {
        float: left;
        width: 100%;
        text-align: center;
    }
    .two-line-product-10 .each-box-product:nth-child(2){
        margin-left: 15px;
    }
    .two-line-product-10 .each-box-product:last-child{
        margin-left: 0;
    }
    .first-line-product-10{
        padding:0;
    }
    .section-3 {
        padding: 0 0 40px 0;
    }
    .second-youtube-section-8 {
        width: 760px;
        float: none;
        margin: auto;
        height: 402px;
    }
    .second-youtube-section-8 img {
        width: 100px;
    }
    .second-youtube-section-8 iframe{
        height: 402px;
    }
    .section-8 {
        padding: 40px 0;
    }
}
@media screen and (max-width: 767px) {
    .site-width-full-da {
        width: 600px;
    }  
    .title-section-1, .title-section-2, .title-section-4, .title-section-8, .title-section-10{
        font-size: 40px;
        padding-bottom: 30px;
        margin-bottom: 0;
    }
    .title-section-1 br, .title-section-2 br, .title-section-4 br, .title-section-8 br, .title-section-10 br{
        display: none;
    }
    .logo-section-10{
        margin-bottom:0;
    }
    .each-box-product:first-child, .two-line-product-10 .each-box-product:nth-child(2), .each-box-product:last-child{
        margin-left: 0;
        margin-right: 0;
    }
    .content-section-1 {
        float: left;
        text-align: center;
        width: 100%;
        font-size: 20px;
    }
    .section-2 {
        padding-bottom: 40px;
    }
    .title-section-3{
        padding-bottom: 30px;
        margin-bottom: 0;
    }
    .title-section-3 br{
        display: none;
    }
    .paragraph-right-section-4, .paragraph-left-section-5, .paragraph-right-section-6, .paragraph-left-section-7{
        text-align: center;
    }
    .description-section-8 {
        width: 100%;
        font-size: 18px;
    }
    .description-section-8 br{
        display: none;
    }
    .right-section-9 {
        width: 100%;
    }
    .logo-section-10 {
        height: 105px;
        width: 210px;
    }
    .second-youtube-section-8 {
        width: 100%;
        float: none;
        margin: auto;
        height: 305px;
    }
    
    .second-youtube-section-8 iframe{
        height: 305px;
    }
}
@media screen and (max-width: 599px) {
    #section2 .site-width-full-da {
        padding: 0;
    }
    .site-width-full-da {
        width: 480px;
    } 
    footer .copyright {
        width: 100%;
        text-align: center;
        margin-bottom: 30px;
    }
    .social-icons {
        float: left;
        width: 100%;
        text-align: center;
    }
    .social-icons a {
        float: none;
        display: inline-block;
    }
    .twentytwenty-handle {
        width: 250px !important;
        margin-left: -126px !important;
        background-repeat: no-repeat !important;
        height: 58px;
    }
    .second-youtube-section-8 {
        width: 100%;
        float: none;
        margin: auto;
        height: 245px;
    }
    
    .second-youtube-section-8 iframe{
        height: 245px;
    }
    .img-cd .img-hires{
        display: none;
    }
    .element_img, .two_images_section{
        display: none;
    }
    .right-section-5{
        height:auto;
    }
    .on-mobile-image{
        display: block;
        width:100%;
        float:left;
    }
}
@media screen and (max-width: 479px) {
    .site-width-full-da {
        width: 320px;
    } 
    .title-section-1, .title-section-2, .title-section-4, .title-section-8, .title-section-10 {
        font-size: 30px;
    }
    .content-section-1 {
        font-size: 18px;
    }
    .header-elements a:first-child {
        height: 44px;
        width: 140px;
        margin-top: 8px;
    }
    .left-section-4 img, .right-section-7 img {
        width: 280px;
    }
    .left-section-4 marquee {
        position: absolute;
        height: 242px;
        left: 50%;
        top: 43px;
        z-index: 1;
    }
    .left-section-4 {
        height: 385px;
        width:280px;
    }
    .right-section-5 {
        height: 175px;
        background-size: 100%;
    }
    .switch {
        float: none;
        margin: auto;
        display: table;
    }
    .text-see-noise-free {
        width: 100%;
        padding: 0;
        text-align: center;
        margin-top: 10px;
    }
    .right-section-7 {
        height: 500px;
        width: 280px;
    }
    .right-section-7 marquee {
        position: absolute;
        height: 400px;
        left: 52%;
        top: 58px;
        z-index: 1;
    }
    .logo-section-10 {
        height: 105px;
        width: 210px;
    }
    .each-box-product {
        height: 280px;
        width: 280px;
        background-size: 85%;
    }
    .second-youtube-section-8 {
        width: 100%;
        float: none;
        height: 721px;
        margin: auto;
        height: 258px;
    }
    
    .second-youtube-section-8 iframe {
        height: 258px;
    }
    .header-elements a.audison-class {
        background-image: url("../images_full_da/ic_audison.png");
        background-repeat: no-repeat;
        background-size: 100% 100%;
        float: right;
        height: 30px;
        margin-top: 13px;
        width: 135px;
    }
    .switch-lang {
        float: right;
        top: 48px;
        position: relative;
        right: 0;
        margin-left: 15px;
        cursor: pointer;
        background-image: url("../images_full_da/nav-arrow-down.png");
        background-repeat: no-repeat;
        background-position: left center;
        padding-left: 15px;
    }
    .share-box-buttons label {
        float: none;
        margin-top: 6px;
        margin-right: 10px;
        margin-bottom: 12px;
    }
    .share-buttons {
        float: none;
    }
    .share-box-buttons {
        text-align: center;
    }
}