@import url(menuabout.css);
@import url(menucertificate.css);
@import url(menuprocess.css);
@import url(menuproduct.css);
@import url(menusourcing.css);
@import url(menutraceablity.css);
.modal-content,
.pop {
    position: absolute;
    right: 0;
    bottom: 0;
    top: 0;
    left: 0;
    
}
.pop,
body,
html {
    overflow: hidden
}
.menu .btn,
.menu .btn.trigger {
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d5eefa', GradientType=1);
    cursor: pointer
}
@media(max-width:768px) {
    .ftr-img {
        width: 30%!important
    }
}
.rotater_traceablity:before {
    width: 30px;
    height: 100px;
    background-image: url(../images/arrow-curve.png)
}
.btn-default,
.modal-header .close {
    width: auto!important
}
.modal-header .close {
    margin-top: -2px
}
.modal-content {
    background: rgba(255, 255, 255, .9)!important
}
.ys-btn {
    background: #1074bf!important;
    color: rgb(000,084,166)!important;
    font-size: .8em;
    font-weight: 200;
    text-transform: uppercase;
    letter-spacing: .5px
}
.home,
.pop {
    color: rgb(000,084,166);
}
.pop {
    padding: 20px 40px;
    max-height: 300px;
    width: 300px;
    height: 300px!important;
    background-color: rgba(244,121,032)!important;
    font-size: 1.2em;
   /* border: 2.5px solid #fff;*/
    z-index: 99999;
    margin: auto;
    border-radius: 100%;
    -webkit-box-shadow: 0 0 5px .5px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 5px .5px rgba(0, 0, 0, .2);
    box-shadow: 0 0 5px .5px rgba(0, 0, 0, .2)
}.logo{
    display: block;
}
.back_icon,
.contact_icon,
.home,
.home_icon,
.return_icon {
    position: fixed
}
.contact_icon {
    width: 2%;
    top: 10% ;
    right: 5% ;
}
.home_icon {
    width: 2% ;
    top: 9.5% ;
    right: 7.5% ;
}
.back_icon {
    width: 2%;
    top: 13px;
    z-index: 99999;
    right: 10.5%
}
.return_icon {
    width: 2%;
    top: 9.5%;
    right: 10%
}
body,
h1,
h2,
p {
    font-family: Ubuntu, sans-serif!important;
    font-weight: lighter
}
.home {
    top: 1em;
    right: 3em
}
a {
    text-decoration: none;
    color: inherit
}
.yas>img {
    max-width: 58%;
    margin: 20%;
    -webkit-transition: -webkit-transform .3s;
    transition: transform .3s
}
/*.yas svg {
    fill: rgb(205, 96, 23);
  }*/
  
.trigger {
    margin-top: -10px;
    margin-left: -10px
}
*,
:after,
:before {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0
}
body,
html {
    height: 100%
}
body {
    background-image: url(../bg/poster.png);
    background-position: top center;
    background-size:cover;
}
.absolute-center,
.menu,
.menu .btn .fa,
.menu .btn.trigger .yas {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%)
}
.menu {
    width: 12em;
    height: 12em
}
.menu .btn {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 1);
    background: -moz-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0, rgba(228, 235, 240, 1) 49%, rgba(25, 141, 204, 1) 51%, rgba(213, 238, 250, 1) 100%);
    background: -webkit-gradient(radial, center center, 0, center center, 100%, color-stop(0, rgba(255, 255, 255, 1)), color-stop(49%, rgba(228, 235, 240, 1)), color-stop(51%, rgba(25, 141, 204, 1)), color-stop(100%, rgba(213, 238, 250, 1)));
    background: -webkit-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0, rgba(228, 235, 240, 1) 49%, rgba(25, 141, 204, 1) 51%, rgba(213, 238, 250, 1) 100%);
    background: -o-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0, rgba(228, 235, 240, 1) 49%, rgba(25, 141, 204, 1) 51%, rgba(213, 238, 250, 1) 100%);
    background: -ms-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0, rgba(228, 235, 240, 1) 49%, rgba(25, 141, 204, 1) 51%, rgba(213, 238, 250, 1) 100%);
    background: radial-gradient(ellipse at center,  rgba(255, 255, 255, 1) 0, rgba(228, 235, 240, 1) 49%, rgb(244,121,032) 55%, rgba(228, 235, 240, 1)100%);
    opacity: 0.5;
    background-size: 12em 12em;
    z-index: -10;
    border-radius:100%;
    -webkit-transition: opacity 1s, z-index .3s, -webkit-transform 1s;
    transition: opacity 1s, z-index .3s, transform 1s;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0)
}

.menu .btn.trigger {
    opacity: 1;
    height: 14em;
    margin-top: -10px;
    margin-left: -15px;
    width: 14em;
    background: rgba(255, 255, 255, 1);
    background: -moz-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0, rgba(228, 235, 240, 1) 49%, rgba(25, 141, 204, 1) 51%, rgba(213, 238, 250, 1) 100%);
    background: -webkit-gradient(radial, center center, 0, center center, 100%, color-stop(0, rgba(255, 255, 255, 1)), color-stop(49%, rgba(228, 235, 240, 1)), color-stop(51%, rgba(25, 141, 204, 1)), color-stop(100%, rgba(213, 238, 250, 1)));
    background: -webkit-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0, rgba(228, 235, 240, 1) 49%, rgba(25, 141, 204, 1) 51%, rgba(213, 238, 250, 1) 100%);
    background: -o-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0, rgba(228, 235, 240, 1) 49%, rgba(25, 141, 204, 1) 51%, rgba(213, 238, 250, 1) 100%);
    background: -ms-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0, rgba(228, 235, 240, 1) 49%, rgba(25, 141, 204, 1) 51%, rgba(213, 238, 250, 1) 100%);
    background: radial-gradient(ellipse at center, rgba(255, 255, 255, 1) 0, rgba(228, 235, 240, 1) 49%, rgb(244,121,032) 55%,  rgba(228, 235, 240, 1) 100%);
    z-index: 100;
    -webkit-transition: -webkit-transform .3s;
    transition: transform .3s;
    -webkit-backface-visibility: hidden
}
.menu .btn.trigger:hover {
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1.1, 1.1)
}
.menu .btn.trigger .yas {
    border-radius: 6px;
    -webkit-transition: background-color .3s, height .3s, top .3s;
    transition: background-color .3s, height .3s, top .3s
}
.menu .btn.trigger .yas:after,
.menu .btn.trigger .yas:before {
    display: block;
    position: absolute;
    left: 0;
    width: 100%;
    height: 6px;
    background: #000;
    border-radius: 6px;
    -webkit-transition: background-color .3s, -webkit-transform .3s;
    transition: background-color .3s, transform .3s
}
.menu .btn.trigger .yas:before {
    top: -12px;
    -webkit-transform-origin: 15% 100%;
    -ms-transform-origin: 15% 100%;
    transform-origin: 15% 100%
}
.menu .btn.trigger .yas:after {
    top: 12px;
    -webkit-transform-origin: 25% 30%;
    -ms-transform-origin: 25% 30%;
    transform-origin: 25% 30%
}
.menu .rotater {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}
.menu.active .btn-icon {
    opacity: 1;
    z-index: 50
}
.menu.active .trigger .yas {
    height: 0;
    top: 8%
}
.menu.active .trigger .yas:before {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 100%
}
.menu.active .trigger .yas:after {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    width: 100%
}
.rotater:nth-child(1) {
    -webkit-transform: rotate(-22.5deg);
    -ms-transform: rotate(-22.5deg);
    transform: rotate(-22.5deg)
}
.menu.active .rotater:nth-child(1) .btn-icon {
    -webkit-transform: translateX(-20em) rotate(22.5deg);
    -ms-transform: translateX(-20em) rotate(22.5deg);
    transform: translateX(-20em) rotate(22.5deg)
}
.rotater:nth-child(2) {
    -webkit-transform: rotate(22.5deg);
    -ms-transform: rotate(22.5deg);
    transform: rotate(22.5deg);
    z-index: 99
}
.menu.active .rotater:nth-child(2) .btn-icon {
    -webkit-transform: translateX(-20em) rotate(-22.5deg);
    -ms-transform: translateX(-20em) rotate(-22.5deg);
    transform: translateX(-20em) rotate(-22.5deg)
}
.rotater:nth-child(3) {
    -webkit-transform: rotate(67.5deg);
    -ms-transform: rotate(67.5deg);
    transform: rotate(67.5deg)
}
.menu.active .rotater:nth-child(3) .btn-icon {
    -webkit-transform: translateX(-20em) rotate(-67.5deg);
    -ms-transform: translateX(-20em) rotate(-67.5deg);
    transform: translateX(-20em) rotate(-67.5deg)
}
.rotater:nth-child(4) {
    -webkit-transform: rotate(112.5deg);
    -ms-transform: rotate(112.5deg);
    transform: rotate(112.5deg)
}
.menu.active .rotater:nth-child(4) .btn-icon {
    -webkit-transform: translateX(-20em) rotate(-112.5deg);
    -ms-transform: translateX(-20em) rotate(-112.5deg);
    transform: translateX(-20em) rotate(-112.5deg)
}
.rotater:nth-child(5) {
    -webkit-transform: rotate(157.5deg);
    -ms-transform: rotate(157.5deg);
    transform: rotate(157.5deg)
}
.menu.active .rotater:nth-child(5) .btn-icon {
    -webkit-transform: translateX(-20em) rotate(-157.5deg);
    -ms-transform: translateX(-20em) rotate(-157.5deg);
    transform: translateX(-20em) rotate(-157.5deg)
}
.rotater:nth-child(6) {
    -webkit-transform: rotate(202.5deg);
    -ms-transform: rotate(202.5deg);
    transform: rotate(202.5deg)
}
.menu.active .rotater:nth-child(6) .btn-icon {
    -webkit-transform: translateX(-20em) rotate(-202.5deg);
    -ms-transform: translateX(-20em) rotate(-202.5deg);
    transform: translateX(-20em) rotate(-202.5deg)
}
.rotater:nth-child(7) {
    -webkit-transform: rotate(247.5deg);
    -ms-transform: rotate(247.5deg);
    transform: rotate(247.5deg)
}
.menu.active .rotater:nth-child(7) .btn-icon {
    -webkit-transform: translateX(-20em) rotate(-247.5deg);
    -ms-transform: translateX(-20em) rotate(-247.5deg);
    transform: translateX(-20em) rotate(-247.5deg)
}
.rotater:nth-child(8) {
    -webkit-transform: rotate(292.5deg);
    -ms-transform: rotate(292.5deg);
    transform: rotate(292.5deg)
}
.menu.active .rotater:nth-child(8) .btn-icon {
    -webkit-transform: translateX(-20em) rotate(-292.5deg);
    -ms-transform: translateX(-20em) rotate(-292.5deg);
    transform: translateX(-20em) rotate(-292.5deg)
}
.rotater:nth-child(9) {
    -webkit-transform: rotate(337.5deg);
    -ms-transform: rotate(337.5deg);
    transform: rotate(337.5deg)
}
.menu.active .rotater:nth-child(9) .btn-icon {
    -webkit-transform: translateX(-20em) rotate(-337.5deg);
    -ms-transform: translateX(-20em) rotate(-337.5deg);
    transform: translateX(-20em) rotate(-337.5deg)
}
.identity {
    display: none;
}
.jumbotron {
    background-color: transparent !important;
    padding: 0px !important;
    margin: 0px !important;
}